/* HOME */



#main{



	width: 100%;



	overflow: hidden;



	padding-top: 140px;



}



.homeBanner{



	width: 100%;



	height: calc(100vh - 140px);



}



#homeBannerBlk1{



	width: 1200px;



	height: 400px;



	padding-top: 100px;



	margin: 0 auto;



	display: flex;



	flex-flow: column nowrap;



	justify-content: space-around;



	z-index: 10;



}



.homeKeyMsg{



	width: 100%;



	font-size: 50px;



	color: #FFF;



	text-align: center;



}



.homeMsg{



	width: 100%;



	font-size: 20px;



	color: #FFF;



	text-align: center;



}



.homeSelects{



	width: 100%;



	display: flex;



	flex-flow: row nowrap;



	justify-content: space-between;



}



.homeSelect{



	width: 32%;



	height: 50px;



	background-color: #FFF;



	border-radius: 10px;



	padding: 10px;



}



.homeSelect input{



	width: 100%;



	height: 30px;



	font-size: 22px;



	background-image: url(http://dte-systems.com.br/images/layout/select.png);



	background-repeat: no-repeat;



	background-position: right center;



}



.homeSelectList{



	width: 100%;



	overflow-y: auto;



	background-color: #FFF;



	margin-top: 10px;



	height: 0;



}



.homeSelectItem{



	padding: 5px 10px;



	float: left;



	width: 100%;



	background-color: #FFF;



	cursor: pointer;



	font-size: 18px;



	border-bottom: 1px solid #CCC;



}



.homeSelectItem:hover{



	background-color: #42a1ec;



	color: #FFF;



}



.motorSelectorText{



	float: left;



	width: 100%;



}



.motorSelectorYear{



	float: left;



	width: 100%;



	font-size: 14px;



}



#homeBannerBlk2{



	position: absolute;



	width: 1200px;



	height: 250px;



	left: 50%;



	margin-left: -600px;



	bottom: 0;



	overflow: hidden;



	display: flex;



	flex-flow: row nowrap;



	justify-content: space-between;



	z-index: -1;



}



.homeInfoBlk{



	width: 170px;



	overflow: hidden;



	text-align: center;



}



.homeInfoGarantia{



	background-image:url(http://dte-systems.com.br/images/layout/garantia.svg);



}



.homeInfoPlugnPlay{



	background-image:url(http://dte-systems.com.br/images/layout/plugnplay.svg);



}



.homeInfoEconomia{



	background-image:url(http://dte-systems.com.br/images/layout/economia.svg);



}



.homeInfoSatisfacao{



	background-image:url(http://dte-systems.com.br/images/layout/satisfacao.svg);



}



.homeInfoIcon{



	width: 100%;



	height: 68px;



	background-position: center;



	background-repeat: no-repeat;



	background-size: contain;



	margin-bottom: 10px;



}



.homeInfoTitle{



	width: 100%;



	color: #FFF;



	overflow: hidden;



	font-size: 32px;



	margin-bottom: 10px;



}



.homeInfoText{



	width: 100%;



	color: #FFF;



	overflow: hidden;



}



#homeBannerRight, #homeBannerLeft{



	width: 18px;



	height: 36px;



	position: absolute;



	top: 50%;



	margin-top: -18px;



}



#homeBannerRight{



	background-image: url(http://dte-systems.com.br/images/layout/prev.png);



	right: 5vw;



}



#homeBannerLeft{



	background-image: url(http://dte-systems.com.br/images/layout/next.png);



	left: 5vw;



}







/* MENU PRODUTOS */



.homeTitle{



	width: 1200px;



	padding: 30px 0 10px 0;



	font-family: dtebold;



	font-size: 32px;



	text-align: center;



	border-bottom: 1px solid #333;



	margin: 0 auto;



}



.homeProdutos{



	width: 1200px;



	overflow: hidden;



	min-height: 100px;



	margin: 0 auto;



	display: flex;



	flex-flow: row wrap;



	justify-content: center;



	padding-top: 30px;



}



.homeProdutoBlk{



	width: 48%;



	padding: 20px;



	float: left;



	overflow: hidden;



	margin-bottom: 20px;



	background-color: #FFF;



	border-radius: 10px;

	

	margin-left: 1%;

	

	margin-right: 1%;



}



.homeProdutoImg{



	width: 200px;



	height: 200px;



	overflow: hidden;



	float: left;



	margin-right: 20px;



	border-radius: 10px;



	text-align: center;



}



.homeProdutoImg img{



	height: 200px;



	width: auto;



}



.homeProdutoInfo{



	width: calc(100% - 220px);



	float: left;



	height: 200px;



	overflow: hidden;



	display: flex;



	flex-flow: column nowrap;



	justify-content: space-between;



}



.homeProdutoTitle{



	width: 100%;



	float: left;



	font-family: dtebold;



	font-size: 32px;



	height: 30px;



}



.homeProdutoText{



	width: 100%;



	float: left;



	margin: 10px 0;



	text-align: justify;



}



.homeProdutoBt{



	width: 100%;



	float: left;



}



.homeProdutoBt button{



	width: 200px;



	height: 40px;



	border-radius: 10px;



	background-color: #0070c9;



	color: #FFF;



}



.homeProdutoBt button:hover{



	background-color: #42a1ec;



}



.blueTooth{



	width: 20px;



	height: 30px;



	margin-right: 5px;



	background-image: url(http://dte-systems.com.br/images/layout/bluetooth.png);



	background-repeat: no-repeat;



	background-position: left;



	background-size: contain;



	display: inline-block;



}



@media(max-height: 800px) and (orientation: landscape){



	#homeBannerBlk1{



		height: 300px;



		padding-top: 100px;



		margin: 0 auto;



		display: flex;



		flex-flow: column nowrap;



		justify-content: space-around;



	}



	#homeBannerBlk2{



		height: 200px;



	}



}







/* LANDSCAPE */



@media(max-width: 1260px) and (orientation: landscape){



	#homeBannerBlk1, #homeBannerBlk2{



		width: 900px;



	}



	#homeBannerBlk2{



		margin-left: -450px;



	}



	.homeTitle, .homeProdutos{



		width: 900px;



	}



	.homeProdutoImg{



		width: 100%;



		height: 150px;



		margin: 0;



		margin-bottom: 10px;



	}



	.homeProdutoImg img{



		height: 150px;



		width: auto;



	}



	.homeProdutoBlk{



		height: 380px;



	}



	.homeProdutoInfo{



		height: 180px;



		width: 100%;



	}



	



	.homeProdutoTitle, .homeProdutoBt{



		text-align: center;



	}



}



@media(max-width: 960px) and (orientation: landscape){



	#homeBannerBlk1, #homeBannerBlk2{



		width: 800px;



	}



	#homeBannerBlk2{



		margin-left: -400px;



	}



	.homeTitle, .homeProdutos{



		width: 800px;



	}



	.homeProdutoImg{



		height: 120px;



	}



	.homeProdutoImg img{



		height: 120px;



		width: auto;



	}



	.homeProdutoBlk{



		height: 360px;



	}



	.homeProdutoInfo{



		height: 200px;



		width: 100%;



	}



}



@media(max-width: 760px) and (orientation: landscape){







}



/* PORTRAIT */



@media(max-width: 1260px) and (orientation: portrait){



	#homeBannerBlk1, #homeBannerBlk2{



		width:900px;



	}



	#homeBannerBlk2{



		margin-left: -450px;



	}



	.homeTitle, .homeProdutos{



		width: 900px;



	}



	.homeProdutos{



		flex-flow: column nowrap;



	}



	.homeProdutoBlk{



		width: 100%;



	}



}



@media(max-width: 960px) and (orientation: portrait){



	#main{



		padding-top: 110px;



	}



	#homeBannerBlk1, #homeBannerBlk2{



		width:700px;



	}



	#homeBannerBlk2{



		margin-left: -350px;



	}



	.homeBanner{



		height: calc(100vh - 110px);



	}



	.homeTitle, .homeProdutos{



		width: 700px;



	}



}



@media(max-width: 760px) and (orientation: portrait){



	#main{



		padding-top: 90px;



	}



	#homeBannerBlk1, #homeBannerBlk2{



		position: relative;



		width: calc(100% - 80px);



		height: auto;



		margin: 0 auto;



	}



	#homeBannerBlk1{



		padding-top: 50px;



		justify-content:flex-start;



		margin-bottom: 30px;



	}



	#homeBannerBlk2{



		flex-flow: column nowrap;



		justify-content: space-around;



		left: 0;



	}



	.homeBanner{



		width: 100%;



		height: auto;



		overflow: hidden;



	}



	.homeKeyMsg{



		font-size: 34px;



		margin-bottom: 20px;



	}



	.homeMsg{



		margin-bottom: 10px;



	}



	.homeSelects{



		width: 100%;



		display: flex;



		flex-flow: column nowrap;



		justify-content: space-between;



	}



	.homeSelect{



		width: 100%;



		height: 50px;



		background-color: #FFF;



		border-radius: 10px;



		margin: 10px 0;



	}



	.homeSelectList{



		position: fixed;



		top: 80px;



		bottom: 0;



		left: 0;



		right: 0;



		overflow-y: auto;



		background-color: #FFF;



		margin-top: 10px;



		height: 0;



		z-index: 100000;



	}



	.homeSelectItem{



		padding: 15px 10px;



		float: left;



		width: 100%;



		background-color: #FFF;



		cursor: pointer;



		font-size: 18px;



		border-bottom: 1px solid #CCC;



		text-align: center;



	}



	.homeInfoBlk{



		width: 100%;



		text-align: left;



		margin-bottom: 20px;



	}



	.homeInfoIcon{



		width: 68px;



		height: 68px;



		margin-bottom: 0px;



		float: left;



	}



	.homeInfoTitle{



		width: calc(100% - 88px);



		font-size: 28px;



		margin-bottom: 5px;



		float: right;



	}



	.homeInfoText{



		width: calc(100% - 88px);



		color: #FFF;



		overflow: hidden;



		float: right;



	}



	.homeTitle, .homeProdutos{



		width: calc(100% - 40px);



	}



	.homeProdutoBlk{



		width: 100%;



	}



	.homeProdutoImg{



		width: 100%;



		height: 150px;



		margin-right: 0px;



		margin-bottom: 20px;



		border-radius: 10px;



	}



	.homeProdutoImg img{



		height: 150px;



		width: auto;



	}



	.homeProdutoInfo{



		width: 100%;



		float: left;



		height: auto;



		overflow: hidden;



		display: block;



	}



	.homeProdutoTitle{



		text-align: center;



	}



	.homeProdutoBt{



		text-align: center;



	}



}