body {margin: 0; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; font-size:1em; color:#333;}



/*MENU*/
a {
	color: inherit;	
	text-decoration:inherit;
	text-transform:inherit;
}

.header {


    float: left;
	display: block;
	height:45px;
	width: 100%;
	background-color:#323232;
}
.menu_bar {
	display:block;

	float: left;
	height: 68px;
	width: 100%;
	background-color:#F9F9F9;
	
	border-bottom-width: 1px;
	border-bottom-color:#CCC;
	border-bottom-style:solid;
	z-index: 1;
}
.menu_button {
	
	display:block;
	float:left;
	padding-left:15px;
	padding-right:15px;
	height:66px;
	line-height:68px;
	text-transform: uppercase;
	font-size:14px;
	font-weight:bold;
	
	
	border-right-width: 1px;
	border-right-color:#E0E0E0;
	border-right-style:solid;
}
.usuario {
	
	display:block;
	float:right;
	padding-left:15px;
	padding-right:15px;
	height:66px;
	line-height:68px;
	text-transform: uppercase;
	font-size:14px;
	margin-right:15px;
	font-weight:bold;

}
.usuario_mobile {
	
	display:none;
	float:right;
	padding-left:15px;
	padding-right:15px;
	height:66px;
	line-height:68px;
	text-transform: uppercase;
	font-size:14px;
	font-weight:bold;

}

.menu_button:hover {
		
	border-bottom-width: 2px;
	border-bottom-color:#ED1A3B;
	border-bottom-style:solid;
	
	background-color:#F2F2F2;

}
.menu_button_mobile {
	
	display:none;
	float:left;
	padding-left:15px;
	padding-right:15px;
	height:66px;
	line-height:68px;
	text-transform: uppercase;
	font-size:14px;
	font-weight:bold;
	width:calc(100% - 30px);
	border-bottom-width: 1px;
	border-bottom-color: #CCC;
	border-bottom-style: solid;
	background-color:#FFF;
	z-index: 2;
	position:relative;
	

}

.menu_container {
	
	display:block;
	width: 100%;
	max-width: 1140px;

	margin: 0 auto;
	
}

.menu_icon {
	display:none;
	float:right;
	width: 68px;
	height: 68px;
	background-image:url(../img/menu_icon.png);
	cursor:pointer;
	z-index:3;

}
.logo {
	float:left;
	width: 220px;
	height:68px;
	background-image:url(../img/logo.png);
	background-repeat:no-repeat;
	background-position: 15px 0px;
	
	
		border-right-width: 1px;
	border-right-color:#E0E0E0;
	border-right-style:solid;

}
.hide {
	display:none;
}
/* FIM*/


.banner {display: inline-block; width: calc(100% - 100px);; height:auto; min-height: 40vh; background-color:#333; padding-top: 10vh; padding-bottom:10vh; padding-left:50px; padding-right:50px; background-position:right; background-size: cover; background-repeat:no-repeat;}
.bannerContent { text-align:center; color:#FFF; display: inline-block; width: calc(40% - 100px);  height:auto; left: 0;  right: 0; background-color: rgba(0,0,0,0.3); padding:50px;  border: 1px solid #FFF; }
.bannerImage {display: none; width: 100%; height:70vw; background-position:right; background-size:170% auto; background-repeat:no-repeat;}

#banner1 {background-image: url('../img/brindes.jpg');}
#banner2 {background-image: url('../img/bg.jpg');}


.saibamais{font-size: 20px;position: relative; cursor:pointer; left: calc(50% - 75px); width:100px; height: 70px; line-height:70px; text-align:center; margin-top:30px; margin-bottom: 10px;  padding-left:20px; padding-right:20px; border: 1px solid #FFF; text-transform:uppercase; box-shadow: 0px 4px 4px rgba(0,0,0, 0.3); background-color: rgba(238,49,71,1.0); transition: all 100ms;}
.saibamais:hover{ background-color: rgba(50,50,50,1.0); margin-top:25px; margin-bottom:5px; height:80px; line-height:80px; padding-left:25px; padding-right:25px;left: calc(50% - 80px);}

.prodButton{ color:#FFF; right: 0; margin: 25px; bottom:0px; font-size: 20px; position: absolute; cursor:pointer; width:calc(100% - 90px); height: 70px; line-height:70px; text-align:center; margin-top:30px; top: auto; bottom: 0px;  padding-left:20px; padding-right:20px;  text-transform:uppercase; box-shadow: 0px 4px 4px rgba(0,0,0, 0.3);  background-color: rgba(50,50,50,1.0); transition: all 100ms; border:1px solid #999; display: block;}
.prodButton:hover{background-color: rgba(238,49,71,1.0); }

.titulo {width: 100%; font-size:3vw; text-transform:uppercase;margin-bottom: 30px;}
.subTitulo {font-size:1.5em; text-transform:uppercase;margin-bottom: 15px;}

.container {position: relative; left:0; right:0; margin:auto; width: 100%; max-width:1100px;}
.pagina {width: calc(100% - 100px); padding:50px;}
.paginaTexto {width: 100%; margin-bottom: 30px;}

.box {position:relative; display: inline-block; width: calc(33.33% - 22px); height:auto; bottom:0;   margin-right:30px; margin-bottom: 0px; border: 1px solid #CCC; padding-bottom: 90px;  }
.boxImage {float:left; width: calc(100% - 50px); height:15vw; margin:25px;  background-color:#999; background-position:center; background-size:cover; background-repeat:no-repeat; max-height: 270px;}
.boxText { position: relative;  float:left; height:auto; width: calc(100% - 50px); padding:25px; }
.boxContainer {width: 100%; text-align: center; height:auto; display: flex; align-content: center;  margin-bottom: 50px;}
.boxDetails { color:#666;  width: 100%; float: left; margin-top:10px; padding-top: 10px;  border-top: 1px solid #CCC; }

    


    
    

@media screen and (max-width: 720px) {
.prodButton {width: calc(100% - 90px);}

.bannerImage {display: block;}
.banner{ min-height: 0; padding:0; width: 100%;}


.bannerContent { width: calc(100% - 152px); margin:50px; padding: 25px; background-color: rgba(0,0,0,0.0);} 
.titulo {font-size:6vw;}
.subTitulo {font-size:1.5em;}
#banner1 {background-image: none;}
#banner2 {background-image: none;}
.boxContainer {margin-bottom: 0;}
.box {width: 100%; margin:0; margin-bottom:50px; padding-bottom:90px; }
.boxImage { width: calc(100% - 50px);  min-height:50vw;}
.boxText {width:calc(100% - 55px); margin-bottom: 0px; padding-left:25px;}

}
@media screen and (max-width: 320px) {
	.box {width: 100%; margin:0; margin-bottom:25px;}
	.pagina {width: calc(100% - 50px); padding:25px;}
	.bannerContent { width: calc(100% - 102px); margin:25px; padding:25px; } 
	
}