/******************************************
***          YT Framework: CSS          ***
*******************************************/
/****** Override *****/
a,
a:focus,
select,
select:focus,
button,
button:focus,
.btn,
.btn:focus{
	outline:none;
}
a.btn{
	padding:4px 10px;
}
h1, h2, h3, h4, h5, h6{
	font-weight:normal;
}
@media (min-width: 1200px) {
  .row {
    margin-left: -20px;
  }
  [class*="span"] {
    float: left;
    margin-left: 20px;
  }
  .container,
  .navbar-static-top .container,
  .navbar-fixed-top .container,
  .navbar-fixed-bottom .container {
    width: 1180px;
  }
  .span12 {
    width: 1180px;
  }
  .span11 {
    width: 1080px;
  }
  .span10 {
    width: 980px;
  }
  .span9 {
    width: 880px;
  }
  .span8 {
    width: 780px;
  }
  .span7 {
    width: 680px;
  }
  .span6 {
    width: 580px;
  }
  .span5 {
    width: 480px;
  }
  .span4 {
    width: 380px;
  }
  .span3 {
    width: 280px;
  }
  .span2 {
    width: 180px;
  }
  .span1 {
    width: 80px;
  }
  .offset12 {
    margin-left: 1220px;
  }
  .offset11 {
    margin-left: 1120px;
  }
  .offset10 {
    margin-left: 1020px;
  }
  .offset9 {
    margin-left: 920px;
  }
  .offset8 {
    margin-left: 820px;
  }
  .offset7 {
    margin-left: 720px;
  }
  .offset6 {
    margin-left: 620px;
  }
  .offset5 {
    margin-left: 520px;
  }
  .offset4 {
    margin-left: 420px;
  }
  .offset3 {
    margin-left: 320px;
  }
  .offset2 {
    margin-left: 220px;
  }
  .offset1 {
    margin-left: 120px;
  }
}

/****** Difine *****/
@media (min-width: 1200px) {
	.span2d4{
		width:220px;
	}
	.span4d8{
		width:460px;
	}
	.span7d2{
		width:700px;
	}
	.span9d6{
		width:940px;
	}
	.offset2d4{
		margin-left:260px;
	}
	.offset-7d2{
		margin-left:-740px;
	}
	.offset-9d6{
		margin-left:-940px;
	}
	.nogroup-right .offset-9d6,
	.offset-12{
		margin-left:-1180px;
	}
	/*.nogroup-right .offset-9d6{
		margin-left:-1180px
	}*/
	
	
	/*.content.layout-lmr.nogroup-left .span7d2,
	.content.layout-lmr.nogroup-right .span7d2,
	.span9d6{
		width:940px;
	}*/
	/*.content.layout-lmr.nogroup-right.nogroup-left .span7d2{
		width:1180px;
	}*/
	.row-fluid .span2d4 {
		width: 17.94871794871793%;  /* 2.4*8.54700854700854-2.564102564102564 */
	}
	.row-fluid .span4d8 {
		width: 38.46153846153843%;  /* 4.8*8.54700854700854-2.564102564102564 */
	}
	.row-fluid .span7d2 {
		width: 58.97435897435892%;  /* 7.2*8.54700854700854-2.564102564102564 */
	}
}
/* Normal(>980) && Tablet landscape (1024x768) */
@media (min-width: 980px) and (max-width: 1199px){
	.span2d4{
		width:172px;
	}
	.span4d8{
		width:364px;
	}
	.span7d2{
		width:556px;
	}
	.span9d6{
		width:728px;
	}
	.offset2d4{
		margin-left:232px;
	}
	.offset-7d2{
		margin-left:-728px;
	}
	.offset-9 {
		margin-left: -700px;
	}
	.offset-12 {
		margin-left: -940px;
	}
	.row-fluid .span2d4 {
		width: 17.94871794871793%;  /* 2.4*8.54700854700854-2.564102564102564 */
	}
	.row-fluid .span4d8 {
		width: 38.46153846153843%;  /* 4.8*8.54700854700854-2.564102564102564 */
	}
	.row-fluid .span7d2 {
		width: 58.97435897435892%;  /* 7.2*8.54700854700854-2.564102564102564 */
	}
	#content_right .row > div{
		width:auto;
	}
	#content_right .row  > div > div{
		width:220px;
	}
	.layout-lmr #content_right .row  > div > div,
	.layout-lrm #content_right .row  > div > div,
	.layout-mlr #content_right .row  > div > div{
		float: left;
    	margin-left: 20px;
	}
	#content_right .row > div > div:first-child {
		margin-left: 0px;
	}
}
@media (min-width: 980px) and (max-width: 1024px) {
	#yt_logoposition h1.logo a {top: 10px;}
	#yt_menuposition ul.navi{margin-top:30px;}
}


/* Tablet portrait (768x1024) && Small tablet landscape (800x600) */
@media (min-width: 768px) and (max-width: 979px) {
	.span2d4 {
		width: 122px;
	}
	.span4d8 {
		width: 268px;
	}
	.span7d2 {
		width: 412px;
	}
	.span9d6{
		width:534px;
	}
	.offset-12{
		margin-left:-724px;
	}
	.row-fluid .span2d4 {
		width: 17.79005524861876%;  /* 2.4*8.5635359116022-2.7624309392265194 */
	}
	.row-fluid .span4d8 {
		width: 38.34254143646404%;  /* 4.8*8.5635359116022-2.7624309392265194 */
	}
	.row-fluid .span7d2 {
		width: 59.09335599943328%;  /* 7.2*8.5635359116022-2.564102564102564 */
	}
	
	#content_right .row > div{
		width:auto;
	}
	#content_right .row  > div > div{
		width:220px;
	}
	.layout-lmr #content_right .row  > div > div,
	.layout-lrm #content_right .row  > div > div,
	.layout-mlr #content_right .row  > div > div{
		float: left;
    	margin-left: 20px;
	}
	#content_right .row > div > div:first-child {
		margin-left: 0px;
	}
	/*ul.navi li.level1 {
		padding: 0 5px 0 8px;
		position: relative;
	}
	ul.navi li.level1.first {
		background:none;
		padding: 0 5px;
	}*/
	#yt_logoposition h1.logo a {top: 5px;}
	#yt_menuposition ul.navi{margin-top:30px;}
	
	/*Listing Content*/
	div.blog div.items-row .span6{width:100%;}
	#yt_spotlight2 .row > div#position-11{
		background:none;
	}
	div.carousel-caption {
		top: 25px;
		width: 60%;
	}
}
/* Small tablet portrait (600x800) & Mobile landscape (480x320) */
@media (max-width: 767px){
	body {
		padding:0;
	}
	.container {
	  	margin:0 auto;
		padding:0 5px;
	}
	#cpanel_btn{
		display:none;
	}
	.hidden-max676{
		display:none !important;
	}
	#yt_logoposition,
	#position-e,
	#position-14{
		width:100%;
	}
	#yt_menuposition ul.navi,
	#meganavigator{
		display:none;
	}
	#yt-mobilemenu{
		display:block;
		border:1px solid #CCC;
		margin-left:5px;
	}
	#yt_logoposition{
		text-align:center;
	}
	#yt_logoposition h1{
		margin-top:10px;
	}
	#yt_logoposition h1.logo a {
		position:static;
	}
	
	#yt_header .container{
		position:relative;
	}
	#yt_slideshow{
		display:none;
	}
	#yt_menuposition{
		margin:30px 0 0;
	}
	#position-0{
		position:absolute;
		height:32px;
		width:40px;
		right:5px;
		bottom:7px;
	}
	#position-0 .search{
		margin:0 0;
		position:relative;
		height:32px;
		width:32px;
	}
	#position-0 .search-inner{
		background: #FFF url(../images/search-btn.png) no-repeat center center;
		border: 1px solid #CCCCCC;
    	border-radius: 5px 5px 5px 5px;
		height:28px;
		width:32px;
	}
	#position-0 form{
		margin:0 0;
	}
	#position-0 .search button{
		background-color:#FFF;
		border:1px solid #CCC;
		border-radius:5px;
		padding:4px 15px;
		display:none;
	}
	#position-0 input.search-query{
		display:none;
		width:180px;
		top:32px;
		right:0;
	}
	#position-0 .search:hover input.search-query{
		display:block;	
	}
	#yt_menuwrap{
		margin:25px 0 20px;
	}
	#yt_component .component-inner{
		padding:0 10px;
	}
	
	[class*="span"] {
		width: 50%;
		float:left;
	}
	[class*="span"] > div{
		margin: 5px;
	}
	#yt_component,
	#content_left,
	#content_right,
	#content_main{
	  	width:100%;
		margin:0 0;
	}
	#content_right > div,
	#content_right > div,
	#content_left > div,
	#content_left > div{
	 	width:auto;
	}
	
	#content_right > div > div,
	#content_right > div > div,
	#content_left > div > div,
	#content_left > div > div{
	  	float:left;
	  	width:100%;
	}
	#content_right > div > div > div,
	#content_right > div > div > div,
	#content_left > div > div > div,
	#content_left > div > div > div{
	  	width: 50%;
	  	float:left;
		margin:0 0;
	}
	#content_right > div > div > div div.module-inner,
	#content_right > div > div > div div.module-inner,
	#content_left > div > div > div div.module-inner,
	#content_left > div > div > div div.module-inner{
		margin:5px;
	}
	#yt_spotlight2 .row > div{
		background:none;
	}

}

/* Mobile portrait (320x480) */
@media (max-width: 479px){
	[class*="span"] {
		width: 100%;
	}
	#content_right > div > div > div,
	#content_right > div > div > div,
	#content_left > div > div > div,
	#content_left > div > div > div{
	  	width: 100%;
	  	float:left;
		margin:0 0;
	}
	div.blog-featured div.article-info,
	div.item-page div.article-info,
	div.blog div.article-info{position: static;overflow: hidden;margin-bottom: 10px;padding: 0;}
	div.blog-featured div.article-info:after,
	div.blog div.article-info:after,
	div.item-page div.article-info:after{border: none;}
	
	.pull-left{float: none;}
	
}