/* =) */
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;600;700;800&display=swap');

*{margin:0; padding:0;}

html, body{height:100%;}

body{margin:0px; padding:0px; background-color:#FFFFFF; font-family:'Open Sans', sans-serif; font-weight:normal; font-size:18px; overflow-x:hidden; overflow-y:scroll; line-height:30px;}

	a{text-decoration:none; color:#F3F3F3; opacity:1;}

	b{font-weight:700;}

	img{border:0; float:left; position:relative;}

	div, article, section{float:left; position:relative; margin:0;}
/* FIM DEFAULT */


/* HTML5 PADRÕES */
h1{font-size:30px; font-weight:700; color:#414141;}

p{color:#414141;}

#shadow{display:none;}
.menuopen{display:none;}
#menu_mobile{display:none;}
/* HTML5 */




/* HOME ------------------------------------------------------------------------------------------------------- */
/* TOPO */
header#topo{position:relative; float:left; width:100%; height:160px; z-index:9; transition:.3s;}
#topob{float:none; width:76%; max-width:1440px; height:100%; margin:0 auto;}
.topotransparente{background:#142144;}
		
	.logo{width:360px; height:78px; background-image:url("img/logoexpresso.png"); background-repeat:no-repeat; background-position:center left; margin-top:54px; background-size:contain;}

	#menu{width:auto; float:right; height:64px; margin-top:70px;}		

		.itemmenu.dropdown{width:200px; padding:10px 0 12px 0;}
		
		.itemmenu{float:right; padding:10px 20px 12px 20px; cursor:pointer; margin-left:3px; font-size:17px; text-transform:uppercase; font-weight: 400; transition:0.2s; text-align:center;}

		.itemmenu:hover{background:#dabb09; color:#142144; font-weight:700;}

		.itemmenu p{color:#FFF; font-weight:400;}

		.itemmenu:hover p{color:#142144; font-weight:700;}

		#itemmenu{font-weight:700; color:#142144; background:#dabb09;}
        #itemmenu a p{font-weight:700; color:#142144; background:#dabb09;}

	.menuopen{position:absolute; width:250px; margin-top:12px; margin-left:0px; transition:0.3s;}

		.itemmenuint{float:left; width:190px; padding:10px 0 12px 10px; cursor:pointer; margin-top:3px; font-size:15px; text-transform:uppercase; font-weight:400; transition:0.3s; background:#dabb09; color:#414141; text-align:left; letter-spacing:-0.3px;}

	.itemmenu:hover .menuopen{display:block; transition:0.2s;}


	/* Responsivo */
	#menuresponsivo{display:none; width:40px; height:40px; right:10%; top:30px; position:fixed; background-image:url("img/menu.png"); background-repeat:no-repeat; background-position:center right; z-index:999;}
	#menuresponsivoopen{display:none; width:100%; height:100%; background:#142144; position:fixed; z-index:99; color:#FFF; padding-top:10%;}
		
		.linkmenumobile{width:90%; padding:14px 0px 16px 10%; height:30px; background:#142144; margin-bottom:2px;}


/* BANNER */
#banner_principal{position:absolute; width:100%; height:952px; top:0; z-index:1; margin:0; padding:0;}
#banner_principalb{position:relative; float:none; width:80%; max-width:1440px; height:100%; margin:0 auto;}

	.quadrosolucaobanner{margin-top:420px;}

		.quadrosolucaobanner h1{text-transform:uppercase; font-size:40px; color:#FFF; line-height:46px; padding:0;}

		.quadrosolucaobanner p{width:450px; font-size:27px; color:#FFF; line-height:36px; margin-top:20px;}

		.quadrosolucaobanner p b{font-weight:700; color:#dabb09;}


/* CONTEÚDO HOME - SOBRE */
.conteudopagina{width:100%; z-index:6;}
.conteudopaginab{width:76%; max-width:1440px; float:none; margin:0 auto;}

	.logisticahome{margin-top:650px;}

	.logisticahome h1{text-align:center; text-transform:uppercase;}
	
	.logisticahome p{text-align:center; text-transform:uppercase; font-size:20px; margin:30px 0 170px 0;}


/* CONTEÚDO HOME - LOCAIS */
.divisaoesquerda{width:50%;}

	.textostreet{width:100%; height:550px; background-image:url("img/street.jpg"); background-size:cover;}
	.textostreetb{float:right; width:76%; max-width:720px; height:500px;}
    .textostreet#trab{height:300px;}

		.textostreetb p{width:72%; margin-top:210px; color:#FFF; font-size:18px; line-height:30px;}

	.cidadesatendidas{background:none;}

		.cidadesatendidas .textostreetb h1{text-transform:uppercase; font-size:24px; margin-top:140px;}

		.cidadesatendidas .textostreetb p{width:83%; color:#414141; font-size:16px; margin-top:20px; line-height:26px;}

		.cidadesatendidas .textostreetb .download{padding:12px 70px 14px 30px; color:#414141; font-weight:700; font-size:16px; text-transform:uppercase; background-image:url("img/download.png"); background-repeat:no-repeat; background-size:30px 30px; background-position:center right 20px; border:solid 2px #2198e2; border-radius:80px; margin:30px 0 0 -3px;}

.divisaodireita{width:50%; background:#041B44; margin-top:-90px;}

	.divisaodireita .textostreet{width:90%; height:auto; background-image:none; background-size:cover;}
	.divisaodireita .textostreetb{float:left; width:80%; max-width:720px; height:auto;}

		.divisaodireita #mapalocais{height:650px; background-image:url("img/mapapontos.jpg"); background-repeat:no-repeat; background-position:bottom 40px right 20px; background-size:90%;}

		.titulotruck{width:90%; margin:10px 0 0 10%; height:80px; border-bottom:1px solid #FFF; background-image:url("img/icones/icontruk.png"); background-position:top left 60px; background-size:80px; background-repeat:no-repeat;}

		.unidade{width:90%; margin:25px 0 0 10%; background-image:url("img/icones/seta.png"); background-repeat:no-repeat; background-position:top left; padding-left:50px; background-size:37px;} .unidade:last-child{padding-bottom:70px;}

			.unidade h1{width:100%; margin:0; padding:0 0 15px 0; font-size:24px; color:#FFF; text-transform:uppercase;}
			
			.unidade p{width:98%; margin:0; padding:0 0 10px 2%; font-size:16px; line-height:30px; color:#FFF;}
			.unidade p b{font-weight:700; text-transform:uppercase;}


/* CONTEÚDO HOME - MAPA */
.divisaodireita#divisaodireitamapa{margin-top:0px;}

	#caminhaoexp{background-image:url("img/caminhaoexpressofev.jpg"); height:450px; background-position:center right;}
	#caminhaoexp2{background-image:url("img/caminhaoexpressod.jpg"); height:450px; background-position:center right;}

	.mapahome{float:left; position:relative; width:100%; height:450px; background:#041B44; margin-top:0;}


/* FOOTER -------------------------------------------------------- */
footer{float:left; position:relative; width:100%; height:240px; background:#041B44;}
#footerb{float:none; width:76%; max-width:1440px; height:100%; margin:0 auto;}

	#logocreditos{width:50%;}

		footer .logo{width:250px; height:53px; background-size:contain; margin-top:60px;}

		#creditos{width:100%; color:#FFF; font-size:11px; line-height:17px; margin-top:30px;}

	#footcontato{float:right; margin-top:70px;}

		#matrizsocial{width:140px; height:100px; margin-top:20px;}

			#matrizsocial h1{text-transform:uppercase; font-size:25px; color:#FFF;}

			.social{width:24px; height:24px; background-image:url("img/icones/face.png"); background-repeat:no-repeat; background-position:center; margin:10px 10px 0 0; background-size:20px;}

		#footinfocontato{width:320px; font-size:14px; line-height:24px; color:#FFF;}




/* EMPRESA ------------------------------------------------------------------------------------------------------- */

/* BANNER SOBRE */
#bannerempresa{background-image:url("img/empresa/bannerempresa.jpg"); background-size:cover; height:650px;}

	.blococonteudoempresa{width:40%; min-height:320px; background:#FFF; margin-top:110px; padding:80px 5% 120px 5%;}
	
	.blococonteudoempresa h1{margin-bottom:40px; text-transform:uppercase; color:#142144; font-size:24px;}

	.blococonteudoempresa p{color:#142144; font-size:14px; line-height:26px;}

/* NOSSO NEGÓCIO */
	#negocioempresa .divisaoesquerda{width:50%; z-index:9;}

		#negocioempresa .divisaoesquerda .textostreet{background-image:none;}

		.imagemnegocio{width:110%; max-width:780px; height:450px; margin-top:130px; background-image:url("img/empresa/empresacontent.jpg"); background-size:cover;}

	#negocioempresa .divisaodireita{width:50%; background:#142144; margin-top:0px; height:auto; min-height:400px; padding-bottom:120px; z-index:8;}

	.divisaodireita .textostreetb{float:left; width:90%; max-width:720px; height:auto;}

		#negocioempresa .textostreetb h1{width:80%; margin:110px 0 0 20%; text-transform:uppercase; font-size:24px; color:#FFF;}

		#negocioempresa .textostreetb p{width:80%; margin:60px 0 0 20%; color:#FFF; font-size:14px; line-height:26px;}

/* NOSSO COMPROMISSO */
.blococonteudocompromisso{width:100%; padding:80px 0 120px 0;}
	
	.blococonteudocompromisso h1{margin-bottom:60px; text-transform:uppercase; color:#142144; font-size:24px;}

	.blococonteudocompromisso p{width:45%; font-size:14px; float:left; position:relative; padding-right:5%;}

		.blococonteudocompromisso p b{font-size:16px; color:#2198e2; line-height:50px;}

/* CHAMADA CONTATO */
#chamadacontato{background-image:url("img/empresa/bannercontato.jpg"); background-size:cover; height:400px; padding:180px 0 0 0;}

.blococonteudochamacontato{width:90%; max-width:450px; margin-left:10%;}

	#chamadacontato h1{font-size:34px; color:#FFF; text-transform:uppercase; line-height:40px; font-weight:600;}

	.btn{padding:10px 60px 13px 60px; margin:60px  0 40px 0; background:#FFF; color:#414141; font-size:16px; text-transform:uppercase; font-weight:600; border-radius:50px;}

	#chamadacontato p{float:left; width:90%; color:#FFF; margin-left:7%; font-size:14px;}



/* CONTATO ------------------------------------------------------------------------------------------------------- */
#bannercontato{background-image:url("img/contato/bannercontato.jpg"); background-size:cover; height:650px;}

	#divisaoform .divisaoesquerda{width:50%; z-index:9;}

		#divisaoform .divisaoesquerda .textostreet{background-image:none;}

		#divisaoform .quadroform{background:#FFF; width:100%; margin-top:-160px;}

			.campo{width:77%; height:44px; margin:0 10% 20px 10%; border-radius:15px; padding-left:3%; border:1px solid #444;}
			
			.campop{width:20%; height:44px; margin:0 2% 20px 10%; border-radius:15px; padding-left:3%; border:1px solid #444;}
			
			.campopb{float:right; width:50%; height:44px; margin:0 10% 20px 0; border-radius:15px; padding-left:3%; border:1px solid #444;}

			.campogrande{width:77%; height:105px; margin:0 10% 20px 10%; border-radius:15px; padding:20px 0 0 3%; border:1px solid #444;}

			.btnform{float:right; height:44px; text-align:center; margin-right:10%; border-radius:15px; border:none; padding:0 30px; font-size:14px; font-weight:400; background:#2198e2; color:#142144;}

			#divisaoform .divisaoesquerda .quadroform h1{color:#414141; margin:130px 0 10px 10%; font-size:24px; padding:0;}

			#divisaoform .divisaoesquerda .quadroform p{color:#414141; font-size:14px; margin:0 0 0 10%; padding:0;}

			#divisaoform .divisaoesquerda .quadroform p b{font-size:16px; letter-spacing:-0.6px; color:#2198e2;}

			#divisaoform .imagemnegocio{width:120%; max-width:1000px; height:340px; margin-top:180px; background-image:url("img/contato/unidade.jpg"); background-size:cover;}

	#divisaoform .divisaodireita{width:50%; background:#142144; margin:0 0 450px 0; height:auto; min-height:400px; padding-bottom:80px; z-index:8;}

		#divisaoform .divisaounidades{width:43%; padding:0;}

			#divisaounidadesp{margin-left:13%;}

		#divisaoform .textostreetb h1{width:80%; margin:110px 0 30px 13%; text-transform:uppercase; font-size:24px; color:#FFF;}

		#divisaoform .divisaounidades p{width:100%; margin:0px 0 0 0; color:#FFF; font-size:14px; line-height:22px;}

		#divisaoform .divisaounidades p b{font-size:16px; letter-spacing:-0.6px; line-height:60px; color:#2198e2; text-transform:uppercase;}

#divisaoform .quadroform#trabalhe{margin-top:-280px;}


@media screen and (max-width:480px){ /* Responsive Smatphones -------------------------------------- */

h1{font-size:30px;}
	
/* HOME ------------------------------------------------------------------------------------------------------- */
/* TOPO */
header#topo{height:110px;}		
	.logo{width:220px; background-size:contain; margin-top:15px; margin-left:-4%;}
	#menu{display:none;}
	#menuresponsivo{display:block;}
	#menuresponsivoopen{display:block;}

/* BANNER */
#banner_principal{height:600px; top:0; z-index:1; margin:0; padding:0;}
	
/* CONTEÚDO HOME - SOBRE */
.logisticahome{margin-top:540px;}
.logisticahome h1{text-align:left;}
.logisticahome p{font-size:20px; margin:20px 0 80px 0; text-align:left;}
	
/* CONTEÚDO HOME - LOCAIS */
.divisaoesquerda{width:100%;}
	.textostreet{height:auto;}
	.textostreetb{float:left; width:76%; height:auto; margin-left:12%; padding-bottom:100px;}
    .textostreet#trab{height:400px;}

		.textostreetb p{width:100%; margin-top:100px;}

		.cidadesatendidas .textostreetb h1{margin-top:80px;}

		.cidadesatendidas .textostreetb p{width:100%; line-height:30px;}

.divisaodireita{width:100%; margin-top:0px;}

		.divisaodireita #mapalocais{display:none;}

		.titulotruck{width:100%; margin:10px 0; height:80px; background-position:center left; background-size:60px; margin-top:40px;}

		.unidade{width:100%; margin:30px 0 0 0; padding-left:45px; background-size:30px; background-position:left top 5px;}
		.unidade:last-child{padding-bottom:0px;}

			.unidade h1{width:100%; font-size:24px;}
			
			.unidade p{width:90%; margin:0; padding:0 0 10px 0;}
	
/* CONTEÚDO HOME - MAPA */
#caminhaoexp{height:200px;}
#caminhaoexp2{height:200px;}
.mapahome{float:left; position:relative; width:100%; height:250px; background:#041B44; margin-top:0;}

/* FOOTER -------------------------------------------------------- */
footer{height:540px;}

	#logocreditos{width:100%; text-align:center;}

		footer .logo{width:80%; margin-top:60px; margin-left:10%;}

		#creditos{width:100%;margin-top:50px;}

	#footcontato{margin-top:20px;}

		#matrizsocial{width:113px; margin-top:30px; margin-left:33%;}

			#matrizsocial h1{text-align:center;}

			.social{margin:20px 15px 0 15px;}

		#footinfocontato{width:100%; text-align:center;}
	
	
/* EMPRESA ------------------------------------------------------------------------------------------------------- */

/* BANNER SOBRE */
#bannerempresa{height:400px; background-position:center right;}

	.blococonteudoempresa{width:106%; margin-top:200px; padding:50px 8% 60px 8%; margin-left:-11%;}
	
	.blococonteudoempresa h1{margin-bottom:20px;}

/* NOSSO NEGÓCIO */
#negocioempresa .divisaoesquerda{width:100%;}

	.imagemnegocio{width:120%; height:230px; margin-top:430px; margin-left:-10%;}

#negocioempresa .divisaodireita{width:100%; padding-bottom:0px; z-index:8;}

	#negocioempresa .textostreetb h1{width:100%; margin:60px 0 0 0%;}

	#negocioempresa .textostreetb p{width:100%; margin:30px 0 0 0%;}	
	
/* NOSSO COMPROMISSO */
.blococonteudocompromisso{padding:60px 0 80px 0;}
	
	.blococonteudocompromisso h1{margin-bottom:20px;}

	.blococonteudocompromisso p{width:100%; float:left; position:relative; padding-right:0;}
	
/* CHAMADA CONTATO */
#chamadacontato{height:300px; padding:80px 0 0 0;}

.blococonteudochamacontato{width:95%; margin-left:5%;}

	#chamadacontato h1{font-size:24px; color:#FFF; text-transform:uppercase; line-height:34px;}

	.btn{padding:10px 60px 13px 60px; margin:30px 0;}

	#chamadacontato p{float:left; width:90%; color:#FFF; margin-left:10%; font-size:16px;}
	

/* CONTATO ------------------------------------------------------------------------------------------------------- */
	
#bannercontato{background-position:top; height:400px;}

	#divisaoform .divisaoesquerda{width:100%;}

		#divisaoform .quadroform{width:100%; margin-top:150px;}
	
		#divisaoform .quadroform form{width:130%; margin-left:-15%; margin-bottom:100px;}

			#divisaoform .divisaoesquerda .quadroform h1{margin:20px 0 30px 0;}

			#divisaoform .divisaoesquerda .quadroform p{margin:0;}

			#divisaoform .imagemnegocio{width:120%; height:160px; margin-top:60px; margin-left:-10%;}

	#divisaoform .divisaodireita{width:100%; margin:0 0 0px 0; padding-bottom:0px; z-index:8;}

		#divisaoform .divisaounidades{width:100%;}

			#divisaounidadesp{margin-left:0%;}

		#divisaoform .textostreetb h1{width:100%; margin:60px 0 30px 0%;}
    
    #divisaoform .quadroform#trabalhe{margin-top:0px;}

}