@import url("fontes.css");
body {
text-align:center;
line-height:1.2em;
margin:0;
padding:0;
font-size:20px;
font-family: 'Abel', sans-serif!important;
background: #E8E8E8;
padding-top:45px;
}
* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
/*flexbox*/
.flex{
display: -webkit-flex;
display: flex;
display: -moz-box;
display: -ms-flexbox;
flex-flow: row wrap;
align-items:stretch;/*padrao = stretch  flex-start*/
justify-content:center;
-webkit-flex-flow: row wrap;
-webkit-align-items:stretch;/*padrao = stretch  flex-start*/
-webkit-justify-content:center;/*space-around;*/
}
.cont{flex:1 1 33%;-webkit-flex:1 1 33%;}
/*ALINHAMENTO VERTICAL
para texto �NICO solto dentro do .cont usar classe .vert -> ela alinha tudo no meio, independente do self de cada div - PARA DIVS OU TEXTOS  posicionados em cima, meio e embaixo, usar as classes .fv_t, c e b.
*/
.vert{
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;  
flex-direction: column;
justify-content: center;
resize: vertical;
-webkit-flex-direction: column;
-webkit-justify-content: center;
-webkit-resize: vertical;
}
.fv_t{align-self:flex-start;-webkit-align-self:flex-start;}
.fv_c{align-self:center;-webkit-align-self:center;}
.fv_b{align-self:flex-end;-webkit-align-self:flex-end;}
/*fim flexbox*/
#header{
background:#203276;
margin:0 auto;
text-align:center;
width:100%;
height:46px;
position:fixed; left:0; top:0;
z-index:1000;
}

#menu{width:80%; float:left; padding: 6px 20px;}
#redes{width:19.5%; float:right; text-align:right; font-size:30px; padding: 6px 80px 6px 20px;}
#redes a{color:#ff4500;} #redes a:hover{color:#f90;}
#redes i{margin-left:12px;}
#pulsa{
color:#06f;
}
.pulsa {animation: pulsa 1s ease infinite alternate;}
@keyframes pulsa{
   from { color:#fff; }
   to { color:#06f;}
}
/*vis�vel apenas*/
.vp{display:none;}
.vg{display:inline-block;}
/*fim vis�vel apenas*/
/* barra flex*/
.barra_flex {
width:100%;
color:#111;
margin:0 auto!important;
text-align:center;
background:#ccc;
font-size:80%;
}
.bg_1{background: #4E6894;}
.bg_2{background:#DFC28C;}
.bg_3{background:#339;}
.bg_4{background:linear-gradient(to right, #fff, #cecece);}
.barra_flex strong, .barra_flex a{color:#111;}
.barra_flex > div{  padding:12px;}
.bf_25{flex:1 1 25%!important;-webkit-flex:1 1 25%!important; text-align:center; }
.bf_73{flex:1 1 73%!important;-webkit-flex:1 1 73%!important; text-align:left;}
/* fim barra flex*/
#info{
width:100%;
margin:0 auto;
padding:50px;
text-align:center;
background:#4d6272!important;
color:#fff;
}
#info strong, #info a, #fone, #fone a{color:#fff!important;}
#fone{width:30%; padding:12px 24px; display:inline-block; vertical-align:middle; text-align:left;}
#fone i{color:#fff; font-size:300%; margin-bottom:50px; display:block;}
#rs{width:30%; padding:12px 24px; display:inline-block; vertical-align:middle; text-align:center;}
#mp{width:30%; padding:12px 24px; display:inline-block; vertical-align:middle; text-align:center;}
#mapa{height:400px!important; width:100%; overflow:hidden;}
/*newsletter*/
.form-newsletter {
	text-align: center;	
	width: 280px;
	margin: 0 auto;
}
.input-newsletter {
	font-family: 'Abel', sans-serif;
	width: 100%;
	padding:6px;
	height: 38px;
	border: 0;
	color: #000;
	font-style: italic;
	border-radius:5px;
	margin-bottom:6px;
}
.textarea {
	font-family: 'Abel', sans-serif;
	margin-bottom:6px;
	width: 100%;
	padding:6px;
	height: auto;
	border: 0;
	color: #000;
	font-style: italic;
	border-radius:5px;
}
.botao-newsletter {
	font-family: 'Abel', sans-serif;
	width: 70px;
	height: 38px;
	float: right;
	background-color: #CEB453;
	color: #FFF;
	border: 0;
	border-radius:5px;
	cursor: pointer;
}
	.botao-newsletter:hover {
		background-color:#06f;
	}
	.input-newsletter:hover, .textarea:hover{box-shadow: 0 0 12px #333; background:#cecece;}
/*fim newsletter*/
#anima{
width:100%;
margin:0 auto; text-align:center;
margin-top:16px;
}
#tudo{
width:100%;
background:#fff url(imagens/losang.png) top repeat-x;
}
#principal{
width:100%;
margin:0 auto;
text-align:center;
text-align:left;
background:#fff;
padding:20px 10%;
}
#principal_img{width:100%; background:linear-gradient(#fff, #adc8e3); padding:20px;}
#principal_img img{max-width:100%;}
.separa, .clear{clear:both;}
.float_left{ width:auto; height:auto; float:left; margin:0 10px 10px 0;}
.float_right{width:auto; height:auto; float:right; margin: 0 0 10px 10px;}
.centralizada{ max-width:100%!important; text-align:center;}
.zapzap{display:inline-block; background: #0c0; color:#fff; padding:4px 8px; border-radius:4px; margin-left:6px; font-size:70%; border:0;}
#img_rodape{width:100%;background:url(imagens/rodape.png) top repeat-x; height:93px;}
#rodape{
width:100%;
background:#27409a;
}
#rodape_m {
margin:0 auto;
text-align:center;
width:80%;
max-width:960px;
padding-top:12px;
color:#fff;
}

.seta{position:absolute; top:10px; left:10px; width:0; height:0; border:25px solid transparent; border-left: 25px solid #555;}
#rodape strong {font-size:115%; letter-spacing:2px; color: #fff;}
#parceiros{
width:100%;
height:60px;
overflow:auto;
font-size:70%;
color:#ccc;
opacity: 0.4;
filter: alpha(opacity=40); /* For IE8 and earlier */
}

#mostrar{width:98%;padding:1%; font-size:70%;}
#mostrar, #mostrar a, #mostrar em, #mostrar strong{color:#5095cf;}	
#parceiros a{color:#5095cf;}
#parceiros a:hover{color:#5095cf;}
#parceiros em{color:#eee;}	
#footer{position:fixed; background: #000; width:100%; padding: 6px; color:#fff; bottom:0; left:0; font-size:22px;}
#footer a, #footer strong{color:#fff;}
@media screen and (max-width: 800px) {
.input-newsletter , .textarea{width:100%;}
#anima{width:100%; margin:0;}
#fone, #rs, #mp{ width:100%;}
#mp{padding:0;}
#footer{font-size:16px!important;}
#menu_h{display:block; width:100%;margin-top:45px;}
#logo{display:block; width:100%; text-align:center; margin:0 auto;}
#fone_topo{display:none;}
#logo img{ width:60%;}
#mapa{height:600px!important; overflow:hidden;}
#topo_m{width:60%;}
#principal{padding:12px 20px;}
.colunas{
	-webkit-column-count: 1; /* Chrome, Safari, Opera */
    -moz-column-count: 1; /* Firefox */
    column-count: 1;
}
.float_left, .float_right, #topo_left{ float:none; width:100%; padding:8px 20px;}
#topo_left img{ width:80%; max-width:80%;}
/*vis�vel apenas*/
.vp{display:block;}
.vg{display:none; width:0; height:0; overflow:hidden;}
/*fim vis�vel apenas*/
#menu{width:29.5%; padding:0;}
#redes{width:70%; padding-right: 60px; font-size:24px;}
#ffb{position:fixed; right:10px; bottom:10px;  top:clear; font-size:150%;}
#menu h1, #menu h2{font-size:20px; margin:4px;}
}
/*COPIAR NO ESTILO DO /SITE   */
p {text-align:justify;}

h1 {
    font-family: 'Oswald', serif;
font-size:46px;
color: #203276;
text-align:left;
margin-top:20px;
line-height:1.3em;
text-align:left;
}
h2 {
    font-family: 'Oswald', serif;
font-size:32px;
text-align:left;
color: #36c;
line-height:1.3em;
}

ul{
text-align:left;
list-style: inside;
}
em{
font-style:italic;
color: #8fa8e3;
}
strong{
color:#555763;
}
a {color: #03c;
text-decoration:none;

	}

a:hover
	{
	color: #00CC00;
	}
	

/* PARA MAPA DO GOOGLE RESPONSIVO declarar classe abrindo e fechando iframe*/
.Flexible-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
}

.Flexible-container iframe,   
.Flexible-container object,  
.Flexible-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
/*tooltip legal - pegar js*/
#tooltip
{
    text-align: center;
    color: #fff;
    background: #336051;
    position: absolute;
    z-index: 1000;
    padding: 12px;
}
 
    #tooltip:after /* triangle decoration */
    {
        width: 0;
        height: 0;
        border-left: 10px solid transparent;
        border-right: 10px solid transparent;
        border-top: 10px solid #111;
        content: '';
        position: absolute;
        left: 50%;
        bottom: -10px;
        margin-left: -10px;
    }
 
        #tooltip.top:after
        {
            border-top-color: transparent;
            border-bottom: 10px solid #111;
            top: -20px;
            bottom: auto;
        }
 
        #tooltip.left:after
        {
            left: 10px;
            margin: 0;
        }
 
        #tooltip.right:after
        {
            right: 10px;
            left: auto;
            margin: 0;
        }
/*COR TRADUTOR GOOGLE*/
.goog-te-gadget-simple .goog-te-menu-value{color:#fff!important;}
.goog-te-gadget-simple{border:0!important; color:#fff!important;}
.goog-te-gadget-simple{background:transparent!important; }

#u_0_2, #u_0_2 a{color:#fff;}
/*TABELA PRODUTOS*/
.nutrition_table_header {
color:#ffffff;
background:#3CB371;
padding:5px 5px 5px 5px;
}

.nutrition_table_odd_line {
color:#000000;
background:#ffffff;
padding:5px 5px 5px 5px;
}

.nutrition_table_even_line {
color:#000000;
background:#eee9e9;
padding:5px 5px 5px 5px;
}