/*!
Theme Name: Sparkle
Theme URI: http://Yeahthemes.com/themes/sparkle
Author: Yeahthemes
Author URI: http://Yeahthemes.com/
Description: A Brand new Magazine theme
Version: 1.0.5.1
License: GNU General Public License v2.0
License URI: license.txt
Tags: light, gray, white, one-column, two-columns, right-sidebar, fluid-layout, responsive-layout, custom-background, custom-header, custom-menu, editor-style, featured-images, flexible-header, full-width-template, microformats, post-formats, rtl-language-support, sticky-post, theme-options, translation-ready
Text Domain: yeahthemes
 
This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

***********************************************************************************************************
  *                                                                                                     *
    *    __   _______    _    _   _ _____ _   _ _____ __  __ _____ ____         ____ ___  __  __      *
  *      \ \ / / ____|  / \  | | | |_   _| | | | ____|  \/  | ____/ ___|       / ___/ _ \|  \/  |       *
*         \ V /|  _|   / _ \ | |_| | | | | |_| |  _| | |\/| |  _| \___ \      | |  | | | | |\/| |         *
    *      | | | |___ / ___ \|  _  | | | |  _  | |___| |  | | |___ ___) |  _  | |__| |_| | |  | |       *      
  *        |_| |_____/_/   \_\_| |_| |_| |_| |_|_____|_|  |_|_____|____/  (_)  \____\___/|_|  |_|     *
*                                                                                                       *
  *                 Premium WordPress Themes by YeahThemes.com - http://Yeahthemes.com                    *
    *                                   Copyright (c) YeahThemes                                        *
  *                                 http://themeforest.net/user/Yhthms                                *    
*                                                                                                         *
  *                            -------------------------------------------                              *
    *                                     DO NOT EDIT THIS FILE                                       *
  *                                                                                                     *
***********************************************************************************************************

*/

@import "framework/css/mixins.less";  
@import "css/theme-mixins.less";
@import "css/theme-vars.less";   
 
@import "css/base.less";
[placeholder]{
	&::-webkit-input-placeholder{
		.opacity(.75); 
	}
	&:focus::-webkit-input-placeholder{
		.transition(opacity 0.5s 0.5s ease);
		opacity: 0;
	}
	
	:-moz-placeholder{
		.opacity(.75); 
	}
	&:focus:-moz-placeholder{
		.transition(opacity 0.5s 0.5s ease);
		opacity: 0;
	}
	
	::-moz-placeholder{
		.opacity(.75); 
	}
	&:focus::-moz-placeholder{
		.transition(opacity 0.5s 0.5s ease);
		opacity: 0;
	}
	
	:-ms-input-placeholder{
		.opacity(.75); 
	}
	&:focus:-ms-input-placeholder{
		.transition(opacity 0.5s 0.5s ease);
		opacity: 0;
	}
}
/**
 * Extra base columns
 */ 
.fullwidth, .full-width, .widefat{   
	width:100%; 
	clear:both;
}       
     
.yt-make-columns-common-style( ~".yt-col-1-1",~"yt-col-", 1, 6   );

[class^="yt-col-"], [class*=" yt-col-"] {
	width: 100%;
}

@media (min-width: 992px){

//Generate column
 /* Two columns*/
.yt-make-columns( ~"yt-col-", 1, 2 );
/* Three columns*/
.yt-make-columns( ~"yt-col-", 1, 3 );
/* Four columns*/
.yt-make-columns( ~"yt-col-", 1, 4 );
/* Five columns*/
.yt-make-columns( ~"yt-col-", 1, 5 );
/* Six columns*/
.yt-make-columns( ~"yt-col-", 1, 6 );
/* Six columns*/
}
/**
 * Clear helper
 */	
@media (max-width: 767px) {
	.clear-left-xs {
		clear: left !important;
	}
	.clear-right-xs {
		clear: right !important;
	}
	.clear-xs {
		clear: both !important;
	}
	.pull-right-xs {
	  float: right !important;
	}
	.pull-left-xs {
	  float: left !important;
	}
	.text-left-xs {
		text-align: left;
	}
	.text-right-xs {
		text-align: right;
	}
	.text-center-xs {
		text-align: center;
	}
	.text-justify-xs{
		text-align: justify;
	}
}
@media (min-width: 768px) and (max-width: 991px) {
	.clear-left-sm {
		clear: left !important;
	}
	.clear-right-sm {
		clear: right !important;
	}
	.clear-sm {
		clear: both !important;
	}
	.pull-right-sm {
	  float: right !important;
	}
	.pull-left-sm {
	  float: left !important;
	}
	.text-left-sm {
		text-align: left;
	}
	.text-right-sm {
		text-align: right;
	}
	.text-center-sm {
		text-align: center;
	}
	.text-justify-sm{
		text-align: justify;
	}
}
@media (min-width: 992px) and (max-width: 1199px) {
	.clear-left-md {
		clear: left !important;
	}
	.clear-right-md {
		clear: right !important;
	}
	.clear-md {
		clear: both !important;
	}
	.pull-right-md {
	  float: right !important;
	}
	.pull-left-md {
	  float: left !important;
	}
	.text-left-md {
		text-align: left;
	}
	.text-right-md {
		text-align: right;
	}
	.text-center-md {
		text-align: center;
	}
	.text-justify-md{
		text-align: justify;
	}
}
@media (min-width: 1200px) {
 	.clear-left-lg {
		clear: left !important;
	}
	.clear-right-lg {
		clear: right !important;
	}
	.clear-lg {
		clear: both !important;
	}
	.pull-right-lg {
	  float: right !important;
	}
	.pull-left-lg {
	  float: left !important;
	}
	.text-left-lg {
		text-align: left;
	}
	.text-right-lg {
		text-align: right;
	}
	.text-center-lg {
		text-align: center;
	}
	.text-justify-lg{
		text-align: justify;
	}
}
/**
 * Blur
 */									   
.blur{
	-webkit-filter: blur(5px);
	-moz-filter: blur(5px);
	filter: blur(5px);
}
/**
 * Site modal box
 */
.site-modal{
	padding: 30px 15px;
	overflow: hidden;
	overflow-y: auto;
	position: fixed;
    z-index: 9;
    right: 0;
    left: 0;
    top: 0;
    bottom: 0;
    &.active{
    	z-index: 999999;
    }
    //background: rgba(255, 255, 255, 0.8);
    .site-modal-backdrop{
    	position: fixed;
    	left: 0;
    	right: 0;
    	top: 0;
    	bottom: 0;
    	.opacity(.5);
    	background: #FFF;
    	z-index: 1;
    }
    //background-color2rgba(): 
    
}
.site-modal-inner{
    display: table;
    width: 100%;
    position: relative;
    z-index: 2;                                
    /* position: absolute; */
    right: 0;
    left: 0;
    top: 0;
    bottom: 0;
	height: 100%;
	max-width: 800px;
	margin: 0 auto;

}
.site-modal-content-wrapper{
	display: table-cell;
	vertical-align: middle;

} 
.site-modal-heading{
	margin-top: 0;
	line-height: 1.3;
}
.site-modal-content{
	max-width: 800px;
	margin: auto;

    padding: 30px;
    background: #FFF;
    .box-shadow(0 0 30px rgba(0, 0, 0, 0.21));
    position: relative;
}
span.site-modal-close{
	width: 32px;
	height: 32px;
	display: block;
	line-height: 32px;
	font-size: 18px;
	font-weight: auto;
	.border-radius(32px);
	text-align: center;
	padding: 0;
	right: -16px;
	left: auto;
	top: -16px;
	position: absolute;
	color: #FFF;
	background-color: #333;
	font-weight: bold;
	cursor: pointer;

}
/**
 * Helpers
 */
.margin-top-30{
	margin-top:30px;
}
.margin-bottom-30{
	margin-bottom:30px;
}
.margin-top-15{
	margin-top:15px;
}
.margin-right-15{
	margin-right:15px;
}
.margin-bottom-15{
	margin-bottom:15px;
}
.margin-left-15{
	margin-left:15px;
}
.no-margin{
	margin: 0 !important;
}
.no-margin-bottom{
	margin-bottom: 0 !important;
}
.no-margin-top{
	margin-top: 0 !important;
}
.padding-top-30{
	padding-top:30px;
}
.padding-bottom-30{
	padding-bottom:30px;
}
.padding-top-15{
	padding-top:15px;
}
.padding-bottom-15{
	padding-bottom:15px;
}
.no-padding{
	padding: 0 !important;
}
.no-padding-bottom{
	padding-bottom: 0 !important;
}
.no-padding-top{
	padding-top: 0 !important;
}
.display-inline-block{
	display: inline-block;
}
.display-block{
	display: block;
}
.visibility-hidden{
	visibility:hidden;
}
.visibility-visible{
	visibility:visible;
}
.hidden, display-none{
	display:none;
}
.overflow-hidden{
	overflow: hidden;
}
.border-top, .border-right, .border-bottom, .border-left{
	border-style: solid;
	border-color: #EEE
}
.border-top{	border-width: 1px 0 0 0; }
.border-right{	border-width: 0 1px 0 0; }
.border-bottom{	border-width: 0 0 1px 0; }
.border-left{	border-width: 0 0 0 1px; }
/**
 * Divider
 */	   
.divider{
	display:block;
	clear:both;
	/*float:left;*/
	width:100%;
	.clearfix();
	min-height:0;
	max-height:0;
	height:1px;
	margin-top:15px;
	margin-bottom:15px;
	border-width:0 0 1px 0;
	border-style:solid;
	border-color: #eee;
}
/**
 * List with seperator
 *
 */

.list-with-separator{
	li{
		padding-top:5px;
		padding-bottom:5px;
		border-width:1px 0 0;
		border-style:solid;
		&:first-child{
			border-width:0;
		}
		ul{
			margin-top:5px;
		}
		li:first-child{
			border-width:1px 0 0;
		}
	}
}/**
 * Bootstrap
 */

/**
 * Nav
 */
ul.nav.nav-tabs{
	margin-left: 0;

	+ .tab-content{
		overflow:hidden;
	}
}
.tabs-left, .tabs-right {
	border-bottom: none;
	padding-top: 2px;
	position: relative;
	z-index: 1;
	>li {
		float: none;
		margin-bottom: 2px;
	}
}
.tabs-left {
	border-right: 1px solid #ddd;
	margin-right: 20px;
	float: left;
	>li {
		margin-right: -1px;
		>a {
			border-radius: 4px 0 0 4px;
			margin-right: 0;
			display:block;
		}
		&.active>a,
		&.active>a:hover,
		&.active>a:focus{
			border-bottom-color: #ddd;
			border-right-color: transparent;
		}
	}
}
.tabs-right {
	border-left: 1px solid #ddd;
	margin-left: 20px;
	float: right;
	>li {
		margin-left: -1px;
		>a {
			border-radius: 0 4px 4px 0;
			margin-right: 0;
		}
		&.active>a,
		&.active>a:hover,
		&.active>a:focus{
			border-bottom: 1px solid #ddd;
			border-left-color: transparent;
		}
	}
}

/**
 * Visual composer
 */
.yt-vc-column{
	margin-bottom: 30px;
}
.yt-vc-element{
	margin-bottom: 30px;
	&:last-child, p:last-child{
		margin-bottom: 0;
	}
}
.yt-vc-element-heading{
	margin-top: 0;
	clear: both;
	float: none !important;
}
*{
	-webkit-font-smoothing: subpixel-antialiased;
}

//Fix Disappear issue of admin menu from using css transform
#wpadminbar{
	-webkit-backface-visibility: hidden;
	*{
		
	    -webkit-transform: translate3d(0,0,0);
	}
}
.fa {
	font-size: 16px;
	vertical-align: middle;
	margin-right: 5px;
}
/** 
 *
 * COMMON STUFF       
 */
html, body, #page, .inner-wrapper{
	min-height: 100%;
}
p {
	margin: 0 0 15px;
}
pre{
	.border-radius(@borderRadius);
	font-size:12px;
	border-width:0;
	padding:15px;
}
.yt-loading{
	background-image:url(images/preloader32@2x.GIF) !important;
	background-color: #fff !important;
	background-position:center;
	background-repeat:no-repeat;
	background-size:32px 32px;
	min-height: 32px;
	min-width: 32px;
	position: relative;
	> *{
		.opacity(.5);
	}
	&:before{
		content:'';
		position: absolute;
		left: 0;
		right: 0;
		top: 0;
		bottom: 0;
		z-index: 1000000000;
	}
}
.yt-global-preloader{
	position: fixed;
	z-index: 1000000000;
	background: #FFF;
	.opacity(.9);
	top: 0;
	bottom: 0;
	left: 0;
	right: 0; 
}
/*COMMON STUFF*/
form[role="search"] {
	[type='submit']{
		//clear: both;
		//float: right;
		//margin-top: -34px;
		//position: relative;
		//z-index: 1;
		//.border-radius(0 @borderRadius @borderRadius 0);
	}
}
.cat-tag,
time,
span.small,
.site-hero .hero-brick .entry-meta{
	font-size:11px;
	text-transform:uppercase;
}
.cat-tag{
	line-height:1 !important;
	padding:4px 5px;
	position:relative;
	display:inline-block !important;
	overflow: hidden;
	&:before {
		position:absolute;
		right: 0;
		top: 100%;
		width: 0;
		height: 0;
		border-width: 7px 10px 0 0;
		border-style: solid;
		border-color: #000 transparent transparent;
		.opacity(.3);
	}
}
a,
strong,
.avatar,
.entry-thumbnail:before,
button,
html input[type="button"],
input[type="reset"],
input[type="submit"],
.btn{
	.transition( all .2s linear );
	text-decoration:none;
}

img.avatar{
	.border-radius(100px);
}


/**
 * Navigation
 ***************************************************************/

.post-page-navigation{
	overflow: hidden;
    position: relative;
    padding-top: 30px;
    padding-bottom: 30px;
    border-width: 1px 0;
    border-style: solid;
    margin-bottom: 30px;
    text-align: center;
	&:before{
		content:'';
		position:absolute;
		border-width:0 1px 0 0;
		border-style:solid;
		height:100%;
		width:0;
		left:50%;
		top:0;
		bottom:0;
	}
	> div{
		width: 50%;
	}
	.pager-title{
	    width: 100%;
	    overflow: hidden;
	    display: block;
	    text-overflow: ellipsis;
	    margin-top: 0;
    	margin-bottom: 0
	}
	.meta-nav{
		margin-bottom: 15px;
		display: block;
		i{
			font-size:16px;
			margin: 0;
		}
	}
	.nav-previous {
		float: left;
		padding-right: 30px;
	}
	.nav-next {
		float: right;
		padding-left: 30px;
	}
}

.pagination-nav .page-numbers{
	position: relative;
	padding: 10px 15px;
	&:before {
		content: '';
		border-width: 0 1px 0 0;
		border-style: solid;
		position: absolute;
		right: -2px;
		height: 100%;
		top: 0;
		.transform( rotateZ(15deg) );
	}
	&.next:before {
		border-width: 0;
	}
}
.page-links > *:last-child{
	.page-numbers:before{
		border-width: 0;
	}
}
/**
 *
 * BEGIN THEME STYLING
 *
 * TABLE OF CONTENT
 *	 |-- Theme Reset 
 *   |-- HEADER
 *   	|-- Branding (Logo & tag line)
 *   	|-- Main Menu Navigation
 *		|-- Main Search
 *		|-- Social Networks
 *   |-- SITE HERO BANNER
 *   |-- ARCHIVE PAGE TITLE
 *   |-- CONTENT
 *   	|-- Primary (content)
 *   	|-- Secondary ( Primary sidebar )
 *   	|-- Tertiary ( secondary sidebar)
 *   |-- HEADER
 *   |-- FOOTER
 *   	|-- Footer Widgets
 *   	|-- Footer info
 *
 * 
 *
 */

/**
 * Site wrapper
 */
#page {
    position: relative;
}
.inner-wrapper {
    position: relative;
    z-index: 2;
}
.site-top-menu {
    padding: 8px 0;
    font-size: 12px;

    .site-top-menu-left{
        >* {
            display: inline-block;
        }
        #top-lang-switcher {
            margin-right: 15px;
        }
        .site-social-networks a {
            margin: 0 0 0 10px;
            i:before {
                font-size: 14px;
            }
        }
    }
    .site-top-menu-right {
        .site-top-navigation-menu-container li{
            text-transform: uppercase;
            padding: 0 10px;
        }
    }
}

/*
 * HEADER
 ***************************************************************/
.site-header{
	position: relative;
	&.fix-site-banner {
		z-index: 2;
	}
}
.site-banner{
	position:relative;
	min-height:55px;
	z-index:5;
	// .fix-site-banner &{
	// 	position:fixed;
	// 	left:0;
	// 	right:0;
	// 	z-index:1001;
	// 	top:0;
	// }
	// .admin-bar.fix-site-banner &{
	// 	top:32px;
	// }
}

/**
 * Branding
 ***************************************************************/
.site-banner{
	.site-logo{
		margin: 0;
		line-height: 55px;
		height: 55px;
		&.image-logo{
			font-size: 0;
		}
		img{
			max-height:100%;
			height: inherit;
			//max-height: 55px;
		}
		&.plain-text-logo{
			font-size:24px;
		}
	}
	
}

/**
 * Main Menu Navigation
 ***************************************************************/
.main-navigation{
	position:static !important;
	ul {
		list-style: none;
		margin-top: 0;
		margin-bottom: 0;
		padding-left: 0;
		&.menu{
			display:block;
			/*Level 1*/
			> li {
				float: left;
				padding:0 15px;
				position: relative;
				.transition( background-color .3s linear );
				> a,
				> span{
					line-height:55px;
				}
				&.first-child{
					margin-left:-15px;
				}
				&.menu-item a{
					display: block;
					text-decoration: none;
				}
				&.menu-item-has-children{
					> a:after{
						font-family:@iconFonts;
						content:'\f0d7';
						margin-left:8px;
						float: right;
						.transition( all .5s ease);
					}
					&.active > a:after{
						.transform( rotateZ(180deg));
					}
				}
				ul.sub-menu {
					li{
						a{
							padding:8px 0;
							border-width:1px 0 0;
							border-style:solid;
							border-color:#EEE;
							display:block;
						}
						&:first-child a{
							border-width:0;
						}
					} 
				}
				&.menu-item-mobile-menu-logo{
					.transition( opacity .3s linear);
				}
				//Social Network
				&.menu-item-social-networks{
					padding:0;
					float:right;
					> * {
						display: inline-block;
						margin-left: 10px;
						color:#FFF;
						&:first-child{
							//margin-left:0;
						}
					}
				}

				//Default Dropdown
				&.default-dropdown{
					&.menu-item-gsearch{
						> ul.sub-menu{
							padding: 15px 0;
						}
						[type="submit"]{
							display: none;
						}
					}
					&:hover{
						// > ul.sub-menu {
						// 	display:block;
						// }
					}
					
					li{
						position: relative;
						// &:hover{
						// 	> ul.sub-menu {
						// 		display:block;
						// 	}
						// }
					
					}
					&.sub-menu-left > ul.sub-menu {
						left: auto;
						right:0;
					}
					ul.sub-menu {
						display:none;
						position: absolute;
						left: 0;
						top:100%;
						z-index: 99999;
						background:#FFF;
						padding:5px 0px;
						ul {
							left: 100%;
							top: 0;
						}
						/*Level 1*/
						li.menu-item{
							width:230px;
							> a {
								//width: 200px;
							}
							&.default-dropdown.sub-menu-left > ul {
								left: auto;
								right:100%;
								top: 0;
							}
						}
						> li{
							padding:0 15px;
							&.default-dropdown > a:after{
								font-family:@iconFonts;
								content:'\f0da';
								margin-left:10px;
								float: right;
							}
								
						}
					}
				}
				
				//Mega Dropdown
				&.mega-menu-dropdown{
					position:static;

					> .mega-menu-container{
						min-height: 280px;
						position: absolute;
						top: 100%;
						padding:30px 0;
						left: 0;
						right: 0;
						display:none;
						overflow: hidden;
						.background-color2rgba( #FFF,  #FFF, .98 );
						> *{
						}
					}
					&.active{
						> .mega-menu-container{
							//display: block;
						}
						> .mega-menu-container > *{
							
						}
					}

					ul.sub-menu{
						
						visibility:visible;
						opacity:1;
						position:static;
						background:none;
						.box-shadow( none );
						//margin-top:15px;
						li{
							display:list-item;
							float:none;
							padding:0;
							width:auto;
							&.current{
								font-weight: bold;
							}
						}
					}

					&.mega-menu-dropdown-default{
						ul.sub-menu{
							margin-top:15px;
							> li.menu-item-has-children{
								> a:after{
									font-family:@iconFonts;
									content:'\f0d7';
									margin-left:8px;
									float: right;
									.transition( all .5s ease);
								}
							}
							ul.sub-menu{
								margin-left: 15px;
								margin-top: 0;
								display: none;
							}
						}
					}
					// &:hover{
					// 	> .mega-menu-container{
					// 		visibility:visible;
					// 		opacity:1;
					// 		display:block;
					// 	}
					// }
				}
			}
		}
	}
}
.default-dropdown > .sub-menu,
.mega-menu-dropdown > .mega-menu-container{
	.box-shadow( 0 5px 30px rgba(0, 0, 0, 0.1) );
	.animation( fadeOut .3s ease );
}
.default-dropdown.active > .sub-menu,
.mega-menu-dropdown.active > .mega-menu-container{
	.animation( fadeIn .1s ease );

}

/**
 * Main search
 ***************************************************************/
.main-search-nav{
	input[type="search"]{
		border:none;
		margin-top:0;
		&:focus{
			.box-shadow(none);
			color:@textColor;
		}
	}
	input[type="submit"],
	label span{
		display:none;
	}
	form{
		height:inherit;
		width: 100%;
	}

}
/**
 * Social Networks
 ***************************************************************/


/*Rainbow preloader*/
.site-color-preloader{
	background-color:#FFF;
	> div{
		height:8px;
		width:100%;
		background-repeat: repeat-x;
		background-position: 0 0;
		.opacity(.5);
	}
}
.animatedPreloaderFrames () {
	from { background-position: 0 0; }
	to { background-position: 2880px  0; }
}

@-webkit-keyframes animatedPreloader {.animatedPreloaderFrames;}
@-moz-keyframes animatedPreloader {.animatedPreloaderFrames;}
@-ms-keyframes animatedPreloader {.animatedPreloaderFrames;}
@-o-keyframes animatedPreloader {.animatedPreloaderFrames;}
@keyframes animatedPreloader {.animatedPreloaderFrames;}

.site-color-preloader.preloading > div{
	background-size:80% 8px;
	.animation( animatedPreloader 15s linear infinite );
}
.site-color-preloader{
	> div{
		background: #3498db;
		background: -moz-linear-gradient(left, #3498db 0%, #3498db 12.5%, #2ecc71 12.5%, #2ecc71 25%, #87cc2e 25%, #87cc2e 37.5%, #f4cb0d 37.5%, #f4cb0d 50%, #ff5a00 50%, #ff5a00 62.5%, #e73c91 62.5%, #e73c91 75%, #9b59b6 75%, #9b59b6 87.5%, #566090 87.5%, #566090 100%);
		background: -webkit-gradient(linear, left top, right top, color-stop(0%,#3498db), color-stop(12.5%,#3498db), color-stop(12.5%,#2ecc71), color-stop(24%,#2ecc71), color-stop(24%,#87cc2e), color-stop(37.5%,#87cc2e), color-stop(37.5%,#f4cb0d), color-stop(50%,#f4cb0d), color-stop(50%,#ff5a00), color-stop(62.5%,#ff5a00), color-stop(62.5%,#e73c91), color-stop(75%,#e73c91), color-stop(75%,#9b59b6), color-stop(87.5%,#9b59b6), color-stop(87.5%,#566090), color-stop(100%,#566090));
		background: -webkit-linear-gradient(left, #3498db 0%,#3498db 12.5%,#2ecc71 12.5%,#2ecc71 25%,#87cc2e 25%,#87cc2e 37.5%,#f4cb0d 37.5%,#f4cb0d 50%,#ff5a00 50%,#ff5a00 62.5%,#e73c91 62.5%,#e73c91 75%,#9b59b6 75%,#9b59b6 87.5%,#566090 87.5%,#566090 100%);
		background: -o-linear-gradient(left, #3498db 0%,#3498db 12.5%,#2ecc71 12.5%,#2ecc71 25%,#87cc2e 25%,#87cc2e 37.5%,#f4cb0d 37.5%,#f4cb0d 50%,#ff5a00 50%,#ff5a00 62.5%,#e73c91 62.5%,#e73c91 75%,#9b59b6 75%,#9b59b6 87.5%,#566090 87.5%,#566090 100%);
		background: -ms-linear-gradient(left, #3498db 0%,#3498db 12.5%,#2ecc71 12.5%,#2ecc71 25%,#87cc2e 25%,#87cc2e 37.5%,#f4cb0d 37.5%,#f4cb0d 50%,#ff5a00 50%,#ff5a00 62.5%,#e73c91 62.5%,#e73c91 75%,#9b59b6 75%,#9b59b6 87.5%,#566090 87.5%,#566090 100%);
		background: linear-gradient(to right, #3498db 0%,#3498db 12.5%,#2ecc71 12.5%,#2ecc71 25%,#87cc2e 25%,#87cc2e 37.5%,#f4cb0d 37.5%,#f4cb0d 50%,#ff5a00 50%,#ff5a00 62.5%,#e73c91 62.5%,#e73c91 75%,#9b59b6 75%,#9b59b6 87.5%,#566090 87.5%,#566090 100%);
	}
	&.gradient>div {
	    background: #3498db;
	    background: -moz-linear-gradient(left, #3498db 0, #3498db 13%, #2ecc71 26%, #f4cb0d 39%, #f4cb0d 52%, #e73c91 65%, #9b59b6 78%, #566090 91%);
	    background: -webkit-gradient(linear, left top, right top, color-stop(0, #3498db), color-stop(13%, #3498db), color-stop(26%, #2ecc71), color-stop(39%, #f4cb0d), color-stop(52%, #f4cb0d), color-stop(65%, #e73c91), color-stop(78%, #9b59b6), color-stop(91%, #566090));
	    background: -webkit-linear-gradient(left, #3498db 0, #3498db 13%, #2ecc71 26%, #f4cb0d 39%, #f4cb0d 52%, #e73c91 65%, #9b59b6 78%, #566090 91%);
	    background: -o-linear-gradient(left, #3498db 0, #3498db 13%, #2ecc71 26%, #f4cb0d 39%, #f4cb0d 52%, #e73c91 65%, #9b59b6 78%, #566090 91%);
	    background: -ms-linear-gradient(left, #3498db 0, #3498db 13%, #2ecc71 26%, #f4cb0d 39%, #f4cb0d 52%, #e73c91 65%, #9b59b6 78%, #566090 91%);
	    background: linear-gradient(to right, #3498db 0, #3498db 13%, #2ecc71 26%, #f4cb0d 39%, #f4cb0d 52%, #e73c91 65%, #9b59b6 78%, #566090 91%)
	}
}


/**
 * BREAKING NEWS
 ***************************************************************/
.site-breaking-news{
	padding: 15px 0;
	overflow:hidden;
	h3{
		font-weight:bold;
		font-size: 18px;
		margin: 0;
	}
	.site-headlines {
		margin-top: 5px;
		.yeahslider-direction-nav i{
			font-size: 16px;
			margin: 0;
		}
	}
	ul li {
		a{
			font-weight:bold;
		}
	}
}
/**
 * SITE HERO BANNER
 ***************************************************************/
.site-hero {
	min-height: 215px;
	padding-top:15px;
	padding-bottom:15px;
	&.yt-loading{

		.hero-brick{
			visibility: hidden; 
		}
	}
	.hero-brick{
		position:relative;
		margin-top:15px;
		margin-bottom:15px;
		img{
			max-width:100%;
			min-width:100%;
			width:auto;
		}
		.entry-header,
		.entry-meta{
				
			position: absolute;
			left: 30px;
			right: 30px;
			margin-left: 15px;
			margin-right: 15px;
			margin-bottom: 0;
			z-index:2;
			
		}
		.entry-header{
			margin-bottom:30px;
			bottom: 30px;
			.entry-category{
				margin-left:-40px;
				.cat-tag:before{
					content: '';
				}
			}
			h2{
				font-size: 18px;
				margin-bottom:5px;
				margin-top:15px;
				max-height: 2.5em;
				overflow:hidden;
				text-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
				// -webkit-mask-image: -webkit-gradient(linear, left top, right top, color-stop(70%, rgba(0,0,0,1)), color-stop(90%, rgba(0,0,0,.0)), color-stop(100%, rgba(0,0,0,.0)));
			
				a{
					display:block;
				}
			}
		}
		.entry-content{
			margin:0;
		}
		.entry-meta{
			bottom: 20px;
			margin-bottom: 0;
			line-height: 1;
			pointer-events: none;
		}
		.entry-thumbnail{
			display:block;
			position:relative;
			overflow: hidden;
			img{
				transition: transform 15s ease;
				-webkit-transition: -webkit-transform 15s ease;
				-moz-transition: -moz-transform 15s ease;
			}
			&:before{
				content:'';
				display:block;
				left:0;
				right:0;
				top:0;
				bottom:0;
				position:absolute;
				z-index:1;
				#gradient > .diagonal(@start-color: rgba(0,0,0,1); @end-color: rgba(0,0,0,0); @start-percent: 0%; @end-percent: 100%; @deg: 45deg);
				.opacity(.45);
				.box-shadow(inset 0 0 20px rgba(0, 0, 0, 0.1));
				
			}
		}
		
		&.hero-brick-small{
			.entry-header{
				right:15px;
			}
		}
		
		&.hero-brick-large{
			.entry-header{
				max-width:550px;
				h2{
					-webkit-mask-image:none;
					font-size:36px;
					margin-bottom:5px;
					max-height: none !important;
				}
			}
			.entry-thumbnail{
				&:before{
					//#gradient > .diagonal(@start-color: rgba(0,0,0,1); @end-color: rgba(0,0,0,0); @start-percent: 0%; @end-percent: 65%; @deg: 45deg);
				}
			}
			
		}
		//Default: black gradient
		&:hover {
			.entry-thumbnail{
				&:before{
					.opacity(.1);	
				}
				img{
					.transform( scale(1.2));
				}
			}
			.entry-header h2{
				-webkit-mask-image:none;
			}
		}
	}
		
	//Color gradient
	&.style-color-gradient{
		.hero-brick{
			.cat-tag{
				background-color: #333333 !important;
				background-color: rgba(0, 0, 0, 0.5) !important;
			}
			
			//Default: color gradient by category
			.entry-thumbnail:before{
				.opacity(100);
			}
			&:hover .entry-thumbnail:before{
				.opacity(.8);
			}
		}
	}
	//Mixed Color gradient
	&.style-mixed-color-gradient{
		.hero-brick{
			
			//Default: color gradient by category
			.entry-thumbnail:before{
				.opacity(.8);
			}
			&:hover .entry-thumbnail:before{
				.opacity(.9);
			}
		}
	}
}
/**
 * ARCHIVE PAGE TITLE
 ***************************************************************/
.page-header{
	padding-bottom: 30px;
	padding-top: 25px;
	margin:0;
	border-width:0 0 1px;
	border-style:solid;
	.page-title{
		//text-transform:uppercase;
		font-weight:bold;
		margin-top:0;
		margin-bottom:15px;
	}
	.descendants-cats li{
		text-transform:uppercase;
	}
	.taxonomy-description{
		max-width:800px;
		margin-top:0;
		font-style:italic;
	}
}

.content-area .page-header{
	padding-top: 0;
	margin-bottom: 30px;
}
	
/**
 * CONTENT ======================================================================================================================================================
 */ 
.site-main{
	padding: 0;
	position: relative;
	z-index: 1;
}

#primary, #secondary, #tertiary{
	padding-top:30px;
	padding-bottom:30px;
}

/*CONTENT*/
.site-content article .entry-title{
	line-height:1.35em;
	margin-top:0;
	word-wrap: break-word; 
	font-size: 36px;
}
.entry-format-media{
	img{
		max-width:100%;
		width:100%;
		height:auto;
	}
}
.site-content article.hentry{
	.thumbnail-caption{
		position: absolute;
		right: 0;
		bottom: 0;
		background: #333;
		padding: 5px 10px;
		color: #FFF;
		opacity: .8;
		font-size: .8em;
		.transition( opacity .2s linear );
		p:last-child{
			margin-bottom: 0;
		} 
	}
	.entry-thumbnail{
		position: relative;
		
		&:hover{
			.thumbnail-caption{
				.opacity(0);
				visibility: hidden;
			}
		}
	}
	
	&.format-image{
		.entry-content{
			margin-top:0;
		}
		.entry-media img{
			width:100%;
		}
	}
	&.format-link,
	&.format-quote{
		
		.entry-title,
		.entry-format-meta{
			text-align:center;
		}
		
	}
	&.format-video,
	&.format-audio, 
	&.format-gallery,
	&.format-link,
	&.format-quote{
		.entry-thumbnail{
			&:before{
				font-family: @iconFonts;
				font-size:24px;
				color:#FFF;
				border:4px solid #FFF;
				position:absolute;
				width:64px;
				height:64px;
				text-align:center;
				line-height:60px;
				.border-radius(50px);
				left:50%;
				top:50%;
				margin-left:-32px;
				margin-top:-32px;
				pointer-events:none;
				background: rgba(0, 0, 0, 0.15);
				.hide-post-format-icon &{
					display: none;
				}
				
			}
			
			&:hover{
				&:before{
					.transform(scale(1.1));
					background: rgba(0, 0, 0, 0.25);
				}
			}
		}
	}
	
	&.format-link{
		.entry-thumbnail{
			&:before{
				content:'\f0c1';
				
			}
		}
	}
	&.format-quote{
		
		.entry-header{
			cite{
				display:block;
			}
		}
		.entry-title{
			text-align:center;
			&:before{
				content:'“';
			
			}
			&:after{
				content:'”';
			
			}
		}
		.entry-thumbnail{
			&:before{
				content:'\f10d';
				
			}
		}
	}
	
	&.format-audio{
		.entry-thumbnail{
			&:before{
				content:'\f001';
				
			}
		}
		.entry-format-media{
			&.with-cover{
				position:relative;
			
				.mejs-container.mejs-audio{
				
					width: auto !important;
					position: absolute;
					bottom: 15px;
					right: 15px;
					left: 15px;
					z-index: 1;
					opacity:.95
				}
			}
		}
	}
	&.format-video{
		.entry-thumbnail{
			&:before{
				content:'\f04b';
				text-indent:5px;
			}
		}
	}
	&.format-gallery{
		.entry-thumbnail{
			&:before{
				content:'\f03e';
			}
		}
		
	}
	.yeahslider .slides li{
		.slide-count{
			top: 0;
			bottom: auto;
			text-shadow: 0 0 1px rgba(0, 0, 0, 0.5);
		}
		&.gallery-item{
			margin:0 !important;
		}
	}
}

/* =Primary
----------------------------------------------- */
#primary{
}
html .boundary-column{
	padding-left: 45px;
	padding-right: 45px;
	position: relative;
	> *{
		position: relative;
		z-index: 1;
	}
	&:before{
		content:'';
		pointer-events: none;
		position: absolute;
		top: 0;
		bottom: 0;
		left: 15px;
		right: 15px;
		border-width: 0 1px;
		border-style: solid;
		z-index:-1;
	}
}

.entry-content ol,
.entry-content ul,
// .widget.widget_text ol,
// .widget.widget_text ul
{
	margin-left:45px;
	margin-bottom:15px;
	
}

.site-content[role="main"] > article{
	&.post{
		border-style: double;
		border-width: 4px 0 0;
		padding-top:50px;
		padding-bottom:50px;
		&:first-child{
			padding-top:0;
			margin-top:0;
			border-width:0;
		}
		.entry-thumbnail img{
			min-width: 100%;
		}
	}
	&.page{
		padding-bottom: 50px;
	}
}

.entry-header{
	
	.entry-meta {
		.avatar{
			width:16px;
			&:hover{
				.transform(scale(1.1));
				
			}
		}
		.in-cat, .author{
			a{
				font-weight:bold;
				text-transform:uppercase;
			}
		}
		.post-meta-info{
			text-transform:uppercase;
			font-size:11px;
			margin-right:30px;
			&.last-child{
				margin-right: 0;
			}
		}

		.yt-impressive-already-liked .yt-il-symbol,
		.yt-impressive-already-liked .yt-il-symbol i{
			color:#FFF;
		}
		
	}
	
	
}

.single.single-post .site-content article:not(.post-password-required){
	.entry-content > p:first-child:first-letter{
		font-size: 345%;
		float: left;
		margin-right: 15px;
		line-height: 1;
	}		
}
.entry-tags{
	margin-top:30px;
	.tag-heading{
		display:block;
		text-transform:uppercase;
	}
	a{
		display:inline-block;
		text-transform:capitalize;
		padding: 3px 12px;
		margin-right:10px;
		margin-top:10px;
		&:before{
			content: '#';
		}
		
	}
		
}
.entry-stuff{
	> h3:first-child{
		margin-top:0;
	}
}

.more-tag{
	font-size:14px;
	font-weight:bold;
}
.edit-link{
}

.social-share-buttons{
	i{
		margin:0;
	}
	label{
		margin: 0 0 0 10px;
		font-weight: normal;
	}
	> span{
		height: 100%;
		display: inline-block;
		padding: 0 8px;
		margin-right: 8px;
		cursor: pointer;
		text-align: center;
		.border-radius(@borderRadius);
		&:last-child{
			margin-right: 0;
		}
	}
	&.style-color{
		label, i{
			color: #FFF;
		}
		
		.twitter{ 		background-color:#00aeef; }
		.facebook{ 		background-color:#3b5998; }
		.google-plus{ 	background-color:#eb4026; }
		.linkedin{ 		background-color:#0074a1; }
		.tumblr{ 		background-color:#559fca; }
		.pinterest{ 	background-color:#ca212a; }
		.more{
			background-color: #EEE;
			i{
				color: #aaa;
			}
		}
	}
	&.style-outline{
		> span{
			border: 1px solid #ddd;
		}
	}

	&.size-large{
		> span{
			line-height: 32px;
			height: 32px;
			min-width: 32px;
		}
		i{
			font-size: 20px;
		}
	}
	&.size-small{
		> span{
			line-height: 24px;
			height: 24px;
			padding: 0 5px;
			min-width: 24px;
		}
	}
}

.by-author,
.in-cat,
.post-meta-info,
.yt-font-size-changer span{
	margin-top:5px;
	margin-bottom:5px;
	display:inline-block;
}

.yt-font-size-changer span{
	font-weight:bold;
	padding-left:8px;
	padding-right:8px;
	text-align:center;
	cursor:pointer;
	font-size: 16px;
	border-width:0 0 0 1px;
	border-style: solid;
	line-height: 16px;
	vertical-align: middle;
	float:left;
	&:first-child{
		border-width:0;
	}
	&.font-size-minus{
		font-size:14px;
	}
	&.font-size-plus{
		font-size:18px;
		margin-right:-8px;
	}
}
.meta-divider{
	margin-top:5px;
	margin-bottom:5px;
}
.yeahslider{
	overflow:hidden;
	.yeahslider-direction-nav,
	.yeahslider-pauseplay{
		span.nav-button i{
			font-size:24px;
			color:@whiteColor;
			margin:0;
		}
		span.nav-button{

			span{
				display:none;
			}
		}
		a > span.nav-button{
			position: relative;
			display: inline-block;
			line-height: 64px;
			height: 64px;
			width: 32px;
			top:-32px;
			text-align: center;
		}
	}
	.yeahslider-next span.nav-button{
		.border-radius(@borderRadius 0 0 @borderRadius);
	}
	.yeahslider-prev span.nav-button{
		.border-radius(0 @borderRadius @borderRadius 0 );
	}
	.caption{
		.border-radius(0 @borderRadius 0 0 );
	}
	.yeahslider-pauseplay a > span.nav-button{
		width:64px;
		
		.border-radius(@borderRadius);
	}
	&.news-scroller{
		z-index: 1;
		.yeahslider-next,
		.yeahslider-prev{
			.background-color2rgba( @whiteColor, @whiteColor, .5 );
			opacity: 1;
			visibility: visible;
			margin-top: -16px;
			right: 0 !important;
			.btn{

				width: 32px;
				height: 32px;
				padding: 0;
				line-height: 30px;
			}
		}
		.yeahslider-prev{
			right: 36px !important;
			left: auto !important;
		}

	}
}

.comments-area{
	border-style: double;
	border-width: 4px 0 0;
}


/* = Secondary and Tertinary (Main/Sub sidebar)
 * Theme widgets
 *
 * 
----------------------------------------------- */
.widget {
	margin: 0 0 30px;
	padding-top: 30px;
	position:relative;
	clear: both;
	&:before{
		content: '';
		border-width: 1px 0 0;
		border-style: solid;
		position: absolute;
		left: 0;
		top: 0;
		width: 80px;
	}
}
.yt-tabby-tabs-header{

	border-width:0 0 1px 0;
	border-style:solid;
	padding-bottom: 15px;
	margin-bottom: 15px;
	
}
/**
 * Ajax post list by category
 */

.yt-ajax-posts-by-cat-widget{
	.post-list-with-thumbnail li .post-thumb img{
		max-width: 60px;
	}
}


.slashes-navigation{
	&.widget-title{
		margin-bottom: 25px;
		margin-top: -10px;
	}
	ul{
		margin-left: 0;
		margin-right: 0;
	}
	li{
		display:inline-block;
		padding:10px;
		position:relative;		
		.transform(translate3d(0,0,0));
		&:before{
			content:'';
			border-width:0 0 0 1px;
			border-style:solid;
			position:absolute;
			left: -2px;
			height:100%;
			top:0;
			.rotateZ(15deg);
		}
		&:first-child{
			padding: 10px 10px 10px 0 !important;
			&:before{
				border-width:0;
			}
		}
		&:last-child{
			padding: 10px 0 10px 10px;
		}	
	}
	
}
span.yt-sliding-tabs-header-trigger{
	position:relative;
	cursor:pointer;
	display:block;
	> span,
	> span:before{
		position:absolute;
		width: 0; 
		height: 0; 
		display:block;
		border-width:12px 12px 0;
		border-style:solid solid none solid;
		border-left-color:transparent !important;
		border-right-color:transparent !important;
		left:50%;
		margin-left:-12px;
		top: -25px;
	}
	> span:before{
		content:'';
		top: -13px;
	}
}

.expanded-header{
	span.yt-sliding-tabs-header-trigger{
		> span,
		> span:before{
			border-width:0 12px 12px;
			border-style:none solid solid solid;
			top: -38px;
		}
		> span:before{
			content:'';
			top: 1px;
		}
	}
}

.yt-sliding-tabs{
	//overflow:hidden;
	
	.yt-sliding-tabs-header{
		position:relative;
		li{
			ul{
				display:none;
			}
		}
	}
	
		
	span.yt-sliding-tabs-header-trigger{
		//display:block;
//		position:relative;
//		cursor:pointer;
//		&:before{
//			content:'';
//			width:16px;
//			height:16px;
//			border-width: 0 0 1px 1px;
//			border-style:solid;
//			position:absolute;
//			left:50%;
//			margin-left:-9px;
//			bottom:17px;
//			background-color:#FFF;
//			.rotateZ(-45deg);
//			.transition(all .5s ease);
//		}
//		&:hover:before{
//			border-color:#333;
//		}
		
		
			
	}
	&.collapsed-header{
		.yt-sliding-tabs-header{
			
			overflow-x:auto;
			overflow: -moz-scrollbars-none;
		
			ul{
				white-space:nowrap;
				position:relative;
			}
		} 
	}
	&.expanded-header{
		.yt-sliding-tabs-header{
		
			ul{
				white-space:nowrap;
				position:relative;
				overflow: hidden;
				li{
					display:block;
					padding-left:0;
					padding-left:0;
					
					&:before{
						border-width: 1px 0 0 0;
						.rotateZ(0deg);
						right:0;
						height:0;
					}
					&:first-child{
						&:before{
							border-width:0;
						}
					}	
				}
			}
		} 
		
		span.yt-sliding-tabs-header-trigger:before{
			//bottom:0px;
			.transform(rotateZ(45deg) rotateX(180deg));
			//.rotateZ(135deg);
		}
		
	}
}
body.desktop .yt-sliding-tabs.collapsed-header .yt-sliding-tabs-header{
	//overflow:hidden;
} 

/*Post list with thumbnail*/
	
.post-list-with-thumbnail{
	li{
		position:relative;
		padding-bottom:15px;
		list-style:none;
		.clearfix();
		&:before{
			display:block;
			content:'';
			position:absolute;
			left:0;
			right:0;
			top:0;
		}
		// .post-thumb{
		// 	&:before{
		// 		font-family:@iconFonts;
		// 		position: absolute;
		// 		right: 10px;
		// 		bottom: 5px;
		// 		color: #FFF;
		// 		font-size: 16px;
		// 		text-shadow: 0 0 10px rgba(0,0,0,0.2);
		// 		.border-radius(50px);
		// 	}
		// }
		// .format-audio .post-thumb{
		// 	&:before{
		// 		content:'\e634';
		// 	}
		// }
		// .format-video .post-thumb{
		// 	&:before{
		// 		content:'\e607';
		// 	}
		// }
		// .format-gallery .post-thumb{
		// 	&:before{
		// 		content:'\e63a';
		// 	}
		// }
		// .format-link .post-thumb{
		// 	&:before{
		// 		content:'\e635';
		// 	}
		// }
		// .format-quote .post-thumb{
		// 	&:before{
		// 		content:'\e641';
		// 	}
		// }
		a{
			display:block;
			font-weight: bold;
			span.number{
		
				font-size: 250%;
				float: left;
				line-height: 1.1;
				margin-right: 10px;
				padding-right: 10px;
				position: relative;
				font-weight: normal;
				.transition(all .2s linear);
				&:before{
					content: '';
					border-width: 0 0 0 1px;
					border-style: solid;
					position: absolute;
					right:0;
					height: 100%;
					top: 0;
					.transform(rotateZ(15deg));
				}
			}
			span.number + *{
				overflow: hidden;
				display: block;
			}
			&:hover {
			}
		}
		.post-thumb{
			float:left;
			margin-right:15px;
			margin-top:5px;
			position:relative;
			.cat-tag{
				position:absolute;
				bottom:10px;
				left:-10px;
			}
			img{
				max-width: 100px;
			}
			
			&.large{
				margin-right: 0;
				margin-bottom: 10px;
				margin-top: 0;
				float: none;
				img{
					width: 100%;
					max-width: 100%;
				}
			}
		}
		.entry-meta{
			display:block;
			clear:both;
			margin-bottom:5px;
		}
		&.post-with-large-thumbnail{
			padding-bottom: 0;
			h2, h3, h4{
				font-size:16px;
				line-height:1.5em;
				margin-top:0;
				margin-bottom: 15px;
			}
		}
	}
	&.vertical{

		margin-left: 0;
		margin-right: 0;
		padding-left: 0 !important;
		padding-right: 0 !important;
		li{

			&.post-with-large-thumbnail{
				padding-top: 15px;
			}
		
			padding-top:10px;
			padding-bottom: 15px;
			&:first-child{
				padding-top:0;
			}
			&:before{
				border-width:1px 0 0;
				border-style:solid;
			}
			&:first-child{
				&:before{
					border-width:0;
				}
			}
		}
	}
}


.post-list-with-format-icon{
	
	.post-title:after{
		margin-left: 5px;
		content: '';
		font-family: @iconFonts;
		color:#aaa !important;
	}
	.format-video .post-title:after{
		content: '\f03d';
	}
	.format-audio .post-title:after{
		content: '\f001';
	}
	.format-gallery .post-title:after{
		content: '\f03e';
	}
	.format-link .post-title:after{
		content: '\f0c1';
	}
	.format-quote .post-title:after{
		content: '\f10d';
	}

}
 
// .yt-widget-popular-post-by-week-month .yt-tabby-tabs .yt-tabby-tabs-header{
// 	margin-bottom:15px;
// 	li{
// 		padding:0 10px;
// 		&:first-child{
// 			padding-left:0;
// 		}
// 	}
// }

/*
 * FOOTER
 */

.site-footer{
	//background-color: #fafafa;
	.footer-widgets{
		padding: 30px 0 0 0;
		border-top:1px solid #EEE;
	}
	.footer-info{
		border-top:1px solid #EEE;
		padding: 15px 0;
		background-color: @whiteColor;
	}
}











/*~320*/
@media (max-width: 479px) { 
	body{

	}
	html .site-banner .site-logo img{
		max-width: 155px;
	}
	
	#primary:before{
		display:none;
	}
	.site-hero .hero-brick.hero-brick-large .entry-header h2,
	.site-hero .hero-brick .entry-header h2{
		font-size: 24px !important;
		max-height: 3.7em !important;
		-webkit-mask-image: none;
	}
	.site-content article .entry-title{
		font-size: 24px;
	}
	.single-post-ads-top{
		margin-right: auto;
		margin-left: auto;
	}
}

/*480px~639px*/
@media (max-width: 639px) and (min-width: 480px){ 

	.site-hero{
		.hero-brick{
			.entry-header{
				margin-bottom: 15px;
				h2{
					font-size:24px !important;
				}
			}
			.entry-meta{
				bottom: 10px;
			}
			
		}
	}
}

/*640px~767px*/
@media (max-width: 767px) and (min-width: 640px) { 
	
	.site-hero{
		.hero-brick{
			.entry-header{
				margin-bottom: 15px;
				h2{
					font-size:48px !important;
					-webkit-mask-image:none;
					right:30px;
				}
			}
			
		}
	}
}
/*768px~991px*/
@media (max-width: 991px) and (min-width: 768px){ 
	#primary{
		//overflow:hidden;
	}
	.site-hero{
		.hero-brick{
			.entry-header{
				h2{
					font-size: 24px;
				}
			}
			&.last-child{
				display:none;
			}
		}
	}
	
}

/* Chrome, Safari, Opera */
@-webkit-keyframes showStickyNav {
    from {
    	-webkit-transform: translate3d(0,-60px, 0);
    	opacity: 0;
    }
    to {
    	-webkit-transform: translate3d(0,0, 0);
    	opacity: 9.8;
    }
}

/* Standard syntax */
@keyframes showStickyNav {
    from {
    	transform: translate3d(0,-60px, 0);
    	opacity: 0;
    }
    to {
    	transform: translate3d(0,0, 0);
    	opacity: 9.8;
    }
}
.sticky-header .site-banner{
	.transition(~"background-color .2s linear, width .2s linear");
	// width: 1000px;
	
	background-size: auto 40px;
	background-position: center 50%;
	background-repeat: no-repeat;
	position: fixed;
	-webkit-animation: showStickyNav .45s; /* Chrome, Safari, Opera */
	animation: showStickyNav .45s;
	bottom: auto;
	top: 0;
	left: 0;
	right: 0;
	width: 100%;
	// text-align: center;
	background-color: #FFF;
	&:before{
		content: '';
		pointer-events: none;
		display: block;position: absolute;
		left: 0;
		right: 0;
		bottom: 0;
		top: 0;
		box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1)
	}
 	.main-navigation .menu li.menu-item{
		// float:left;
	}
}

@media screen and (max-width: 600px){
	.admin-bar.sticky-header{
		.site-banner{
			top: 0 !important;
		}
	}
}
@media (max-width: 991px){
	
	#page{
		overflow:hidden;
	}
	.site-banner{
		min-height: 45px;
		.site-branding{
			position: absolute;
			text-align: center;
			left: 64px;
			right: 64px;z-index: 1;
		}
		.site-logo{
		
			line-height: 45px;
			height: 45px;
		}
		.container{
			position: relative;
		}
	}
	.main-navigation{
		min-height: 45px;
	}
	// .fix-site-banner{
	// 	//padding-top: 45px;
	// 	.site-banner {
	// 		.active-mobile-menu &{
	// 			top: 0;
	// 		}
	// 	}
	// }

	.main-menu-toggle{
		position: absolute;
		top: 50%;
		margin-top: -12px;
		// left: 0;
		display: block;
		width: 24px;
		height: 24px;
		> *{
			position: absolute;
			width: 100%;
			// left: 2px;
			left: 0px;
			height: 2px;
			display: block;
			.opacity(.5);
			background-color:#000;
			
			//.transition(all .3s ease);
			
		}
		> .bar1{ top: 5px; }
		> .bar2{ top: 11px; }
		> .bar3{ top: 17px; }
		
	}
	.mobile-navigation{
		padding: 20px 0 15px;
		z-index: 15;
		width: 250px;
		left: 0;
		top: 0;
		bottom: 0;
		position: fixed;
		overflow: auto;
		display: block;
		background-color: #222;	
		
		// display: none;
		.opacity(0);
		pointer-events: none;
		transition: transform .45s ease, opacity .2s linear;
		-webkit-transition: -webkit-transform .45s ease, opacity .2s linear;
		-moz-transition: -moz-transform .45s ease, opacity .2s linear;
		-ms-transition: -ms-transform .45s ease, opacity .2s linear;
		.transform( translate3d(-250px,0,0) );
		li.menu-item-gsearch{
			position: relative;
		}
		.main-menu-toggle{
			position: absolute;
			right: 10px;
			top: 20px;
			left: auto;
			display: block !important;
			> *{
				background-color: #FFF;
			}
		}
		> div{
			padding: 20px;
		}
		.site-social-networks{
			white-space: normal;
			a{
				margin-right: 10px;
				display: inline-block;
			} 
		}
		ul{
			padding: 0 20px;
			transform: translate3d(0,0,0);
			-webkit-transform: translate3d(0,0,0);
			text-transform: uppercase;
			&.menu{
				&:not(:first-child){
					border-top: 1px solid rgba(255, 255, 255, 0.1);
				}
				padding: 20px;
			}
			li{
				list-style: none;
				white-space: nowrap;
				display: block;
				&.menu-item-logo{
					margin-bottom: 30px;
				}
				&.menu-item-has-children > a:after {
					margin-left: 8px;
					right: 0;
					position: absolute;
				}
				&.lang-switcher{
					a{
						display: inline-block;
						vertical-align: middle;
					}
				}
				a{
					display: block;
					position: relative;
					overflow: hidden;
					text-overflow:ellipsis;
					padding: 5px 10px 5px 0 ;

					.menu-item-indicator{
						position: absolute;
						right: 0;
						top: 50%;
						margin-top: -8px;
					}
				}
				ul{
					display: none;
					border-left: 1px solid rgba(255, 255, 255, 0.1);
					padding-left: 15px;
					padding-right: 0;
					margin-left: 15px;
				}
			}
			&.menu{
				li{
					a i{
						float: right;
					}
				}
			}
		}
	}

	.inner-wrapper{
		position: relative;
		background-color: #fff;
		z-index: 10;
		// transition: transform .45s ease;
		// -webkit-transition: -webkit-transform .45s ease;
		// -moz-transition: -moz-transform .45s ease;
		// -ms-transition: -ms-transform .45s ease;
		//backface-visibility: hidden;
		//-webkit-backface-visibility: hidden;
		//-moz-backface-visibility: hidden;
		//-ms-backface-visibility: hidden;
		// .box-shadow(0 0 30px rgba(0, 0, 0, 0.3));

		&:before{
			position: absolute;
			left: 0;
			top:0;
			width: 100%;
			height: 100%;
			background-color: #000;
			.opacity(0);
			pointer-events: none;
			z-index: 11;
			content: '';
			.transition(opacity .45s linear);
		}
	}

	.active-mobile-menu{
		overflow: hidden;
		width: 100%;
		#page, .inner-wrapper{
			overflow: hidden;
		}
		.inner-wrapper{
			&:before{
				.opacity(.3);

				pointer-events: initial;
			}
		}
		.main-menu-toggle{
			display: none;
			> .bar1{
				top: 11px;
				.transform( rotate(45deg) );
				z-index: 2;
			}
			> .bar2{
				//.opacity(0);
				.transform( rotate(225deg) );
				z-index: 1;
			}
			> .bar3{
				top: 11px;
				.transform( rotate(-45deg) );
				z-index: 2;
			}
		}
		.mobile-navigation{
			.transform( translate3d(0,0,0) );
			.opacity(1);
			pointer-events: initial;
			-webkit-overflow-scrolling: touch;
			overflow-scrolling: touch;
		}
		.main-navigation{
			.menu-item-logo{
				.opacity(0);
			}
		}
	}
	
	
	

	.site-top-menu-right,
	.site-top-menu-left{
		text-align: center;
	}
	.site-top-menu-right{
		margin-top: 15px;
	}
	.main-navigation ul.menu > li{
		> a, > span{
			line-height: 45px;
		}
		i{
			font-size: 18px;
		}
	}
	
	.main-navigation ul.menu > li{
		display: none !important;
		&.menu-item-gsearch,
		&.site-mobile-menu-toggle,
		&.site-mobile-menu-logo{
			display: block !important;
			cursor: pointer;
		}
		&.site-mobile-menu-logo{
			a{
				.opacity(1);
			}
		}
		&.menu-item-gsearch{
			float: right;
		}
		
	}

	.site-mobile-navigation{
		z-index: 1;
		width: 250px;
		left: 0;
		top: 0;
		bottom: 0;
		position: fixed;
		overflow: auto;
		display: block;
		//.animation( zoomOut .5s ease );
		
		li{
			&.menu-item-mobile-menu-logo{
				margin-bottom: 30px;
			}
			&.menu-item-social-networks{
				white-space: normal;
				margin-top: 30px;
			
				a{
					display: inline-block;
					margin-right: 10px;
				}
			}
		}
		
		
	}
	

	html .boundary-column {
		padding-left: 15px;
		padding-right: 15px;
		&:before{
			display: none;
		}
	}
	.site-content[role="main"]>article.post .entry-thumbnail{
		margin-left:-15px;
		margin-right:-15px;
	}
	.site-info{
		text-align: center;
	}
	
	.single-post .site-content article h1.entry-title,
	.site-content article h2.entry-title{
		font-size: 24px;
		margin-bottom: 10px;
	}
	.entry-header .entry-meta .post-meta-info {
		margin-right: 15px;
	}
	.site-content[role="main"]>article.post{
		padding-top: 20px;
		padding-bottom: 20px;
	}
}
@media (max-width: 1170px){
	html .site-hero .hero-brick .entry-thumbnail:before{
		background: #000;
		opacity: .3 !important;
		transition: none !important;
		-webkit-transition: none !important;
	}
}
@media (min-width: 992px) {
	.layout-left-sidebar{
		#secondary{
			padding-left: 15px;
			&:before{
				border-width: 0 1px 0 0;
			}
		}
	}
	.layout-right-sidebar{
		#secondary{
			padding-right: 15px;
			&:before{
				border-width: 0 0 0 1px;
			}
		}
	}
}
/*1024px~*/
@media (max-width: 1199px) and (min-width: 992px) {
	
	.boxed-layout{
		#page, .site-banner{
			width: 1000px;
			margin: 0 auto;
		}
	}
	.site-hero{
		.hero-brick{
			.entry-header{
				bottom: 15px;
				h2{
					font-size: 18px;
				}
			}
			&.hero-brick-large{
				.entry-header{
					h2{
						font-size: 36px;
						margin-bottom: 5px;
						line-height: 1.25;
					}
				}
			}
			
			.posted-on,.entry-category{
				display:none;
			}
			
		}
	}
}

/*1200px~*/
@media (min-width: 1200px){


	.boxed-layout{
		#page, .site-banner{
			width: 1200px;
			margin: 0 auto;
		}
	}

	.site-hero{
		.hero-brick{
			.entry-header{
				h2{
					font-size: 18px;
				}
			}
			&.hero-brick-large{
				.entry-header{
					h2{
						font-size: 36px;
					}
				}
			}
			.posted-on,.entry-category{
				//display:none;
			}
			
		}
	}
}
@media (min-width: 1200px) and (max-width: 1399px){
	.hidden-xs.hidden-lg,
	tr.hidden-xs.hidden-lg,
	th.hidden-xs.hidden-lg,
	td.hidden-xs.hidden-lg {
		display: none !important;
	}
}
/*1400px~*/
/*@media (min-width: 1400px){
	.boxed-layout{
		&.large-display-layout{
			#page, .site-banner{
				width: 1400px;
			}
		}
	}
	.container {
		width: 1370px;
	}
	.site-hero{
		.hero-brick{
			.entry-header{
				h2{
					font-size: 24px;
				}
			}
			&.hero-brick-large{
				.entry-header{
					h2{
						font-size: 48px;
						line-height: 1.25;
					}
				}
			}
			
			.posted-on,.entry-category{
				display:block;
			}
		}
	}
}*/
@media print {
	a{
		color: blue;
		text-decoration: none;
		font-weight: bold;
	}
	a[href]:after { display:none; }

    #primary{
    	padding: 0 !important;
    	&:before{
    		display: none;
    	}
    }
}





/**
 * WP-Review
 */
html #page{

.bar-point .review-result-wrapper, 
.percentage-point .review-result-wrapper,
.bar-point .review-result, 
.percentage-point .review-result{
	max-height: 15px;
}
	
.review-total-only{
	padding: 2px 5px;
	//font-size: .85em;
	font-weight: bold;
	&.review-mark{
		display: block;
		clear: both;
	}
	&.review-type-star{
		padding: 0;
		background: none !important;
		margin-left: -3px;
		position: relative;
	}
	> *{
		display: inline-block;
	}
	.review-total-star{
		float: none;
		//margin-top: 5px;
		position: relative;
		right: auto;
		top: auto;
		left: auto;
	}
	
}
.entry-content{
	.review-total-only{
		&.review-mark{
			display: inline-block;
		}
	}
}
/*Review result inside post thumb*/
.post-thumb{
	.review-total-only{
		&.review-mark{
			&.review-type-percentage,
			&.review-type-point{ 
				
				position: absolute;
				top: 0;
				right: 0;
				

			}
		}
	}
}
.review-result-wrapper{
	span.review-total-box{
		padding: 0;
	}
	i{
		color: #000 !important;
		.opacity(.1);
	}
	.review-result i{
		color: #FFB800 !important;
		.opacity(1);
	}
}

}
.post-thumb.large{
	.review-type-point,
	.review-type-percentage{
		font-size: 1.35em;
	}
}



/**
 * Share buttons with counter
 */
.sparkle-sharrre-counter {
	margin-right: 15px;
	strong{
		font-size: 50px;
		line-height: 50px;
	}
	small{
		text-transform: uppercase;
	}
}
.social-share-buttons{
	&.size-large{
		margin-bottom: 5px;	
	}
	&.size-small{
		margin-bottom: 5px;	
		margin-top: 5px;
	}
}



/**
 * Modal search
 */
.site-modal-search{

	.form-group.has-feedback {
	    margin: 0
	}
	.form-control-feedback {
	    right: auto;
	    left: 0
	}
	input {
	    text-indent: 1.6em
	}
	h3.site-modal-heading {
	    text-align: center;
	    font-size: 3em
	}
}


@media (max-width: 320px){
	#site-hero .hero-brick .entry-header h2 {
		font-size: 16px !important;
	}
}


