/*
    bottom-banner.css
    eastwestmoto.com | 14/01/2018
    Copyright 2018 web-communication.eu
*/

.bottom-banner {
    position: 				relative;
	margin: 				0 auto;
    width: 					100%;
	background: 			#000000;
	overflow:				hidden;
	height: 				600px;
}


.bottom-banner img {
	max-width:				1920px;
	width:					100%;
	display:				block;
	margin-top: 			-200px;
}



.bottom-banner .fading {
	position:						absolute;
	bottom:							0;
	left:							0;
	width:							100%;
	height:							250px;
	
	/* webkit example */
	background-image: -webkit-gradient(
	linear, left top, left bottom, from(rgba(0,0,0,0)), to(rgba(0,0,0,0.8))
	);

	/* mozilla example - FF3.6+ */
	background-image: -moz-linear-gradient(
	  rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.8) 95%
	);

}



.bottom-banner .content-top {
	position:						absolute;
	bottom: 						60px;
	left:							2%;
	display:						block; 
}


.bottom-banner .content-bottom {
	position:						absolute;
	bottom: 						30px;
	left:							2%;
	display:						block; 
}





.bottom-banner .style {
	font-family: 					'Michroma', sans-serif;
	font-weight: 					normal;
	font-size: 						34px;
	color:							#FFFFFF;
	/*z-index: 9999999;*/
}	

.bottom-banner .style-1 {
	font-weight: 					normal;
	font-size: 						24px;
	color:							#ccc;
}	

.bottom-banner .style-2 {
	font-weight: 					normal;
	font-size: 						20px;
	color:							#000;
}	







/* responsive */		

@media only screen and (max-width: 1135px) {
	
	.bottom-banner img {
		/*max-width:				1135px;*/
		margin-top: 			-120px;
	}
	
	.bottom-banner {
	    width: 						1135px;
		height:						400px;
	}	
	
	.bottom-banner .content-top {
		bottom: 						40px;
	}


	.bottom-banner .content-bottom {
		bottom: 						18px;
	}
	
	.bottom-banner .style {
		font-size: 						26px;
		
	}	

	.bottom-banner .style-1 {
		font-size: 						18px;
	}
	
	.bottom-banner .fading {
		height:							150px;
	}
	
}



@media only screen and (min-width: 1136px) and (max-width: 1335px) {
	
	.bottom-banner {
		height: 				450px;
	}
	
	.bottom-banner img {
		/*max-width:				1280px;*/
		margin-top: 			-100px;
	}
	
	.bottom-banner .content-top {
		bottom: 						45px;
	}


	.bottom-banner .content-bottom {
		bottom: 						20px;
	}
	
	.bottom-banner .style {
		font-size: 						28px;
		
	}	

	.bottom-banner .style-1 {
		font-size: 						20px;
	}
	
	.bottom-banner .fading {
		height:							200px;
	}
	
}	

@media only screen and (min-width: 1336px) and (max-width: 1440px) {
	
	.bottom-banner {
		height: 				480px;
	}
	
	.bottom-banner img {
		margin-top: 			-100px;
	}
	
	.bottom-banner .content-top {
		bottom: 						45px;
	}


	.bottom-banner .content-bottom {
		bottom: 						20px;
	}
	
	.bottom-banner .style {
		font-size: 						28px;
		
	}	

	.bottom-banner .style-1 {
		font-size: 						20px;
	}
	
	.bottom-banner .fading {
		height:							200px;
	}
}

@media only screen and (min-width: 1441px) and (max-width: 1680px) {
	
	.bottom-banner {
		height: 				500px;
	}
	
	.bottom-banner img {
		margin-top: 			-170px;
	}
	
	.bottom-banner .content-top {
		bottom: 						45px;
	}


	.bottom-banner .content-bottom {
		bottom: 						20px;
	}
	
	.bottom-banner .style {
		font-size: 						28px;
		
	}	

	.bottom-banner .style-1 {
		font-size: 						20px;
	}
	
	.bottom-banner .fading {
		height:							200px;
	}
}
@media only screen and (min-width: 1921px) {
	
	.bottom-banner {
	    width: 						1920px;
	}
	
}

@media only screen and (min-width: 1441px) {
	
}