/* CSS Document */

#modelSide.predator{
	margin-top: 45px;
}
#modelSide nav{
	margin: 45px 0 30px;
	background: url(../images/bg-ctas.jpg) repeat;
	padding: 15px;
	border-radius: 6px;
}
#modelSide nav h2{
	font-size: 28px;
	color: #FFF;
	margin-bottom: 15px !important;
}
#modelSide nav .link a{
	display: block;
	padding: 6px 12px;
	border-bottom: 1px solid rgba(187,187,187,.6);
	font-family: 'Kenyan-Coffee';
	font-size: 24px;
	color: #FFF;
	letter-spacing: 1px;
}
#modelSide nav .link a:hover{
	background-color: #BBB;
	color: #E12024;
}
#modelSide nav .link:nth-child(2) a{
	border-top: 1px solid rgba(187,187,187,.6);
}
#modelSide #sideButtons{
	margin-top: 0;
}
#modelContent .content{
	margin-top: 30px;
}
#modelContent .content.none{
	margin-top: 0;
}
#modelContent .content .desc{
	margin-bottom: 30px;
	background-color: #BBB;
	padding: 15px;
	font-size: 14px;
}
#modelContent .content .table-responsive{
	margin-bottom: 30px !important;
}
#modelContent .content .table{
	margin-bottom: 0 !important;
}
#modelContent .content .table th{
	font-family: 'Kenyan-Coffee' !important;
	font-size: 22px !important;
	color: #E12024;
	font-weight: inherit !important;
	text-align: center;
}
#modelContent .content .table tr td{
	text-align: center;
	vertical-align: middle;
}
#modelContent .content .table tr td:first-child{
	text-align: left;
	font-family: 'Montserrat-Bold' !important;
	font-size: 14px;
}
#modelContent .content .table i{
	color: #189742;
}
#modelContent .content .specs .float{
	margin-bottom: 30px;
}
#modelContent .content .specs .float.none, #modelContent .content .specs .float:last-child{
	margin-bottom: 0;
}
#modelContent .content .heading{
	background-color: #E12024;
	border-radius: 6px;
	padding: 6px 12px 4px;
	margin-bottom: 10px;
	font-family: 'Kenyan-Coffee';
	font-size: 24px;
	color: #FFF;
	letter-spacing: 1px;
	line-height: 1.1;
	text-transform: uppercase;
}
#modelContent .content .item .list{
	padding-left: 6px;
	font-family: 'Montserrat-Bold';
	font-size: 14px;
	line-height: 1.6;
}
#modelContent .content .item .list i{
	color: #777;
	margin-right: 5px;
}
#modelContent .content .item .colors .color{
	float: left;
	width: 33.333333%;
}
#modelContent .content .item .colors .color > div{
	height: 90px;
	width: 100%;
	display: table;
}
#modelContent .content .item .colors .color > div > div{
	display: table-cell;
	vertical-align: middle;
}
#modelContent .content .item .colors .color > div > div > div{
	margin: 0 auto;
	display: table;
	height: 80px;
	width: 80px;
	border-radius: 6px;
	border: 1px solid #BBB;
	padding: 0 5px;
	font-family: 'Open-Sans-Bold';
	font-size: 10px;
	color: #000;
	line-height: 1.1;
	text-align: center;
}
#modelContent .content .item .colors .color > div > div > div > div{
	display: table-cell;
	vertical-align: middle;
}
#modelContent .content .item .colors .color.gunMetal > div > div > div{
	background-color: #616362;
}
#modelContent .content .item .colors .color.silver > div > div > div{
	background-color: #B7B7B9;
}
#modelContent .content .item .colors .color.navyBlue > div > div > div{
	background-color: #100040;
	color: #777;
}
#modelContent .content .item .colors .color.emeraldGreen > div > div > div{
	background-color: #0A8A71;
}
#modelContent .content .item .colors .color.royalBlue > div > div > div{
	background-color: #2266E3;
}
#modelContent .content .item .colors .color.black > div > div > div{
	background-color: #000;
	color: #777;
}
#modelContent .content .item .colors .color.white > div > div > div{
	background-color: #FFF;
}
#modelContent .content .item .colors .color.red > div > div > div{
	background-color: #D90000;
}
#modelContent .content .item .colors .color.lightGray > div > div > div{
	background-color: #616362;
}
#modelContent .content .item .colors .color.shawneeGreen > div > div > div{
	background-color: #0A8A71;
}
#modelContent .content .item .colors .color.oliveGreen > div > div > div{
	background-color: #455346;
}
#modelContent .content .item .colors .color.beige > div > div > div{
	background-color: #F6F0D8;
}
#modelContent .content .item .colors .color.oliveDrab > div > div > div{
	background-color: #888B80;
}
#modelContent .content .item .colors .color.gray > div > div > div{
	background-color: #616362;
}

/********************************************************** MEDIA QUERRIES ******************************************************************/

/* Tablet (portrait) */
@media(min-width:768px){
	#modelSide, #modelContent{
		float: left;
	}
	#modelSide{
		width: 30%;
	}
	#modelSide nav{
		margin: 0 0 15px;
		padding: 10px;
	}
	#modelSide nav h2{
		font-size: 22px;
		margin-bottom: 10px !important;
	}
	#modelSide nav .link a{
		padding: 4px 10px;
		font-size: 18px;
	}
	#modelContent{
		width: 70%;
		padding-left: 30px;
	}
	#intRotator.model, #intRotator.model .slide, #intRotator.model .prev, #intRotator.model .next{
		height:270px;	
	}
	#modelContent .content, #modelContent .content.none{
		margin-top: 15px;
	}
	#modelContent .content .desc{
		margin-bottom: 15px;
		padding: 12px;
		font-size: 12px;
	}
	#modelContent .content .table-responsive{
		margin-bottom: 15px !important;
	}
	#modelContent .content .specs .float{
		float: left;
		width: 30%;
		margin-right: 5%;
		margin-bottom: 0;
	}
	#modelContent .content .specs .float:nth-child(3n+3){		
		margin-right: 0;
	}
	#modelContent .content .heading{
		padding: 3px 8px 2px;
		margin-bottom: 5px;
		font-size: 18px;
	}
	#modelContent .content .item .list{
		padding-left: 0;
		font-size: 10px;
		line-height: 1.6;
	}
	#modelContent .content .item .list i{
		margin-right: 0;
	}
	#modelContent .content .item .colors .color > div{
		height: 50px;
	}
	#modelContent .content .item .colors .color > div > div > div{
		height: 45px;
		width: 45px;
		padding: 0 3px;
		font-size: 8px;
	}
	#modelContent .content .table th{
		font-size: 18px !important;
	}
	#modelContent .content .table tr td:first-child{
		font-size: 12px;
	}
	
}

/* Tablet (landscape) */
@media(min-width:992px){
	#modelSide{
		width: 25%;
	}
	#modelSide nav{
		margin: 0 0 25px;
		padding: 15px;
	}
	#modelSide nav h2{
		font-size: 26px;
		margin-bottom: 12px !important;
	}
	#modelSide nav .link a{
		padding: 6px 12px;
		font-size: 22px;
	}
	#modelContent{
		width: 75%;
	}
	#intRotator.model, #intRotator.model .slide, #intRotator.model .prev, #intRotator.model .next{
		height:380px;	
	}
	#modelContent .content, #modelContent .content.none{
		margin-top: 25px;
	}
	#modelContent .content .desc{
		margin-bottom: 25px;
		padding: 15px;
		font-size: 14px;
	}
	#modelContent .content .table-responsive{
		margin-bottom: 25px !important;
	}
	#modelContent .content .heading{
		padding: 5px 12px 4px;
		margin-bottom: 10px;
		font-size: 26px;
	}
	#modelContent .content .item .list{
		font-size: 12px;
	}
	#modelContent .content .item .list i{
		margin-right: 2px;
	}
	#modelContent .content .item .colors .color > div{
		height: 70px;
	}
	#modelContent .content .item .colors .color > div > div > div{
		height: 65px;
		width: 65px;
		font-size: 10px;
	}
	#modelContent .content .table th{
		font-size: 20px !important;
	}
	#modelContent .content .table tr td:first-child{
		font-size: 14px;
	}
	
}

/* Desktop */
@media(min-width:1200px){
	#modelSide nav{
		margin: 0 0 30px;
		padding: 20px;
	}
	#modelSide nav h2{
		font-size: 36px;
		margin-bottom: 15px !important;
	}
	#modelSide nav .link a{
		padding: 6px 15px;
		font-size: 28px;
	}
	#modelContent{
		padding-left: 45px;
	}
	#intRotator.model, #intRotator.model .slide, #intRotator.model .prev, #intRotator.model .next{
		height:450px;	
	}
	#intRotator.model .slide .viewMore{
		padding-top:210px;
	}
	#modelContent .content, #modelContent .content.none{
		margin-top: 25px;
	}
	#modelContent .content .desc{
		margin-bottom: 30px;
		padding: 20px;
		font-size: 16px;
	}
	#modelContent .content .table-responsive{
		margin-bottom: 30px !important;
	}
	#modelContent .content .heading{
		padding: 5px 15px 4px;
		margin-bottom: 12px;
		font-size: 32px;
	}
	#modelContent .content .item .list{
		font-size: 14px;
		line-height: 1.8;
	}
	#modelContent .content .item .list i{
		top: 0;
	}
	#modelContent .content .item .colors .color > div{
		height: 85px;
	}
	#modelContent .content .item .colors .color > div > div > div{
		height: 80px;
		width: 80px;
		padding: 0 5px;
		font-size: 12px;
	}
	#modelContent .content .table th{
		font-size: 26px !important;
	}
	#modelContent .content .table tr td:first-child{
		font-size: 16px;
	}
	
}