.featuredAreaContainer{
	position:relative;
}

#featuredArea{
	height: 60vh;
}

#featuredArea .slideBG{
	background-size: cover;
	width:100%;
	background-position: center center;
	height: 60vh;

} 


#featuredArea a{
	text-decoration:none;
}

#jFeaturedAreaButtonsContainer{
	position: absolute;
	bottom: 15px;
	width:100%;
}
#jFeaturedAreaButtonsContainer .jFeaturedAreaButtonsInnerContainer{
	width:100%;
	margin:0 auto;
	position:relative;
}
#jFeaturedAreaButtonsContainer .jFeaturedAreaButtons{
	display:table;
	margin:0 auto;
}
#jFeaturedAreaButtonsContainer .jFeaturedAreaButton{
	display: inline-block;
	width:80px;
	height:20px;
	line-height:0;
	padding:0;
	border:1px solid #FFF;
	border-radius: 10px;
	margin-left:5px;
}

#jFeaturedAreaButtonsContainer .jFeaturedAreaButton:hover{
	border:1px solid #FFF;
	background-color:#FFF;
}
#jFeaturedAreaButtonsContainer .jFeaturedAreaButton.current{
	border:1px solid #FFF;
	background-color:#FFF;
}

.fixedContainer{
	position: relative;
	height:60vh;
}
.featuredContent{
	width:100%;
	position: absolute;
	bottom: 0%;
	right: 0;
}

.featuredContent .floatingMessage{
	background: rgba(0,0,0,0.7);
	padding:30px;
}

.featuredContent .title{
	text-align: right;
	font-size:32px;
	line-height:65px;
	color:<?php echo($brand3)?>;
	font-weight:bold;
}

.featuredContent .featuredBtn{
	text-align: left;
}
/*small height featured area*/
#featuredAreaSmall{
	height: 40vh;
	z-index:0;
	overflow:hidden;
}


#featuredAreaSmall{
	height: 40vh;
}

#featuredAreaSmall .slideBG{
	background-size: cover;
	width:100%;
	background-position: center center;
	height: 40vh;
}

#jFeaturedAreaButtonsContainer{
	position: absolute;
	bottom: 15px;
	right: 0;
	width:100%;
}
#jFeaturedAreaButtonsContainer .jFeaturedAreaButtonsInnerContainer{
	display: table;
	margin:0 auto;
	position:relative;

}
#jFeaturedAreaButtonsContainer .jFeaturedAreaButtons{
}
#jFeaturedAreaButtonsContainer .jFeaturedAreaButton{
	display: inline-block;
	width:15px;
	height:15px;
	border-radius:8px;
	line-height:0;
	padding:0;
	background-color:rgba(204,204,204,0.5);
	margin-left:10px;
}

#jFeaturedAreaButtonsContainer .jFeaturedAreaButton:hover,
#jFeaturedAreaButtonsContainer .jFeaturedAreaButton.current{
	background-color:<?php echo($brand1)?>;
}





/* Small 576-767 / 540px Container Width with 15px margins LARGE MOBILE */
@media (min-width:576px) {
	
	.featuredContent1 .title{}
	#jFeaturedAreaButtonsContainer{bottom: 20px;}
	
	.featuredContent3 .title {font-size: 28px;line-height: 32px;width:60%;}
	#featuredAreaSmall .title {right:30px;font-size: 44px;line-height: 40px;}
	
}


/* Medium 768-991 / 720px Container Width with 15px margins TABLET */ 
@media (min-width:768px) {
	
	.featuredContent1 .title{}
	.featuredContent2 .title {width:70%;}
	#jFeaturedAreaButtonsContainer{bottom: 30px;}
	
	#featuredArea .featuredContent3 .title {font-size: 40px;line-height: 44px;width:55%;}

	#featuredAreaSmall .title {font-size: 68px;line-height: 60px;width:95%;}
	
}


/* Large 992-1200 / 960px Container Width with 15px margins LAPTOP */
@media (min-width:992px) {
	
	.featuredContent1 .title{}
	#jFeaturedAreaButtonsContainer{bottom: 40px;}
	
	#featuredAreaSmall .title {font-size: 80px;line-height: 80px;width:95%;}
	
}


/* Extra Large 1201+ / 1140px Container Width with 30px margins DESKTOP */
@media (min-width:1200px) {
	
	.featuredContent1 .title{}
	
	#featuredAreaSmall .title {font-size: 96px;line-height: 90px;width:95%;}

	
}


/* XXL 1400+ / 1320px Container Width with 30px margins */
@media (min-width:1400px) {
	
	.featuredContent1 .title{}
	#jFeaturedAreaButtonsContainer{bottom: 80px;}

	#featuredAreaSmall .title {font-size: 96px;line-height: 90px;width:95%;}
	
}
