@charset "utf-8";
/* CSS Document */

body{ 
  margin:0 auto;
  font-family: Arial, Helvetica, sans-serif;
  font-size:15px;
  color:#fff;
  background-color:#009ED4;
  
 }
 
#metas{ 
  position:absolute;
  margin-top:-20000px;
  color:#FFF;
  opacity: 0.1;
  -moz-opacity: 0.1;
  -khtml-opacity: 0.1;
  -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=10)";
  filter: alpha(opacity=10);
}

#face{ 
  float:right;
  margin-top:-45px;
  width:95%;  
  z-index:99999;
  text-align:right
 }
 
 #bot_midias{ display:block; position: fixed; z-index:999999; margin: 100px 0 0 20px }
 #bot_midias_m{ display:none; }
@media screen and (max-width: 1000px) {
#bot_midias_m{ display:block;  z-index:999999; }
 #bot_midias{ display:none; }
}

/* menu */

header nav#menu_fundo {
  
  left:0px;
    width:100%;
  background-color:#0065A9;
  position:absolute;
  z-index:9;
  margin-top:0px;
  border-top-width:25px;
  border-top-color:#FF0;
  border-top-style: solid;
}

header #menu_fundo_interno {
  width:1180px;
  margin:0 auto
  
}
@media screen and (max-width: 1300px) {
header #menu_fundo_interno {
  width:930px;
}  
}

header #logo {
  position:absolute;
  z-index:10;
  margin-top:-30px;
}


header #busca {
  float:right;
  margin-top:-80px
}

header #busca input {
  float:left; 
  width:150px;
  margin:15px 20px 10px 0px;
  line-height: 25px;
  border: 1px solid #c7c7c7;
  -moz-border-radius:6px;
  -webkit-border-radius:6px;
  border-radius:6px;
  padding-left:5px
  
}
header #busca .botao{
  float:left; 
  width:70px;
  margin:15px 20px 0 0;
  line-height: 30px;
  background-color: #333;
  border: none;
  color:#FFF;
  -moz-border-radius:0px;
  -webkit-border-radius:0px;
  border-radius:0px;
  
  
}

header #busca .botao:hover{
  cursor:pointer
}



@media screen and (max-width: 1300px) {
header #busca {
    margin-top:-150px;
    margin-right:30px;
}
}


/* menu mobile*/
header .column {display:none;}
header #logo_m {display:none;}
#fundo_menu_m {display:none;}
@media screen and (max-width: 1000px) {
header .column { display:block}
header nav#menu_fundo { display:none;}

header #logo_m {
  display: table;
  z-index:10;
  margin:10px 0 0 10px;
  width:90%;
  padding:10px;
  text-align:center
  
}

#fundo_menu_m{
  display:block;
  width:100%;
  height:auto;
  margin:0 auto;
  background-color:#284480
}



header #busca {
  float: none;
  margin-top:5px
}

header #busca input {
  float:none; 
  width:70%;
  margin:5px 0 0 5px;
  margin-left:15%;
  
}
header #busca .botao{
  float:none; 
  width:30%;
  margin:5px 0 0 5px;
  margin-left:35%;
  
}

#face{ 
  float:right;
  margin-top:10px;
  width:95%;  
  z-index:99999;
  text-align:right
 }




}


.sombra_b{
  width:100%; 
  margin-top:-10px
}

/*corpo*/

#voltar { display:block; float: right; margin-top:15px; margin-right:30px; width:100%;}
#voltar_m { display:none}
a.voltar { text-decoration:none; 
  font-size:20px;
  font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
  color:#284480;
  font-weight:bold;
  background-color: #CCC;
  padding:5px;
  
  
  
  
}
a.voltar:hover{
  text-decoration:none; 
  font-size:20px;
  font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
  color:#06F
}

a.linke { text-decoration:none; 
  font-size:15px;
  font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
  color:#284480
}
a.linke:hover {
  text-decoration:none; 
  font-size:15px;
  font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
  color:#06F
}

.botaoq{
  float:right; 
  width:95px;
  margin:10px 20px 0 0;
  background-color: #FF0 ;
  background-image:url(../images/mais.jpg);
  background-repeat:no-repeat;
  background-position: center;
  border: none;
  color:#030;
  text-align:left;
  padding:5px;
  font-weight:bold;
  -webkit-transition: all 0.3s ease-in ;
     moz-transition: all 0.3s ease-in ;
     -o-transition: all 0.3s ease-in ;
     -ms-transition: all 0.3s ease-in ;
     transition: all 0.3s ease-in;
  
}

#fundo{
   background-color:#0065A9;
   margin-top:-20px;
   border-bottom-color:#333;
   border-bottom-style:solid;
   border-bottom-width:15px;
}

#fundo .bot{
  float:right; 
  width:auto;
  margin:10px 20px 0 0;
  padding:3px 10px;
  line-height: 30px;
  background-color: #333;
  border: none;
  color:#FFF;
  text-align:center;
  -webkit-transition: all 0.3s ease-in ;
     moz-transition: all 0.3s ease-in ;
     -o-transition: all 0.3s ease-in ;
     -ms-transition: all 0.3s ease-in ;
     transition: all 0.3s ease-in;
}
  


#conteudo{
  margin:0 auto;
  width: 1180px;
  height:auto;
  
}
#continter{
  width: 1170px;
  height:100%;
  padding:10px;
  margin:auto;
  display:table;  
}



figure#bananamamao{width:100%; max-height:500px; margin:0 auto; overflow:hidden}

#img_banana{width:100%; padding:0px; margin:0 auto;
-webkit-transition: all 300ms ease;
 -moz-transition: all 300ms ease;
 -ms-transition: all 300ms ease;
 -o-transition: all 300ms ease;
 transition: all 300ms ease;}



.tit_produtos{ 
width:100%; 
height:60px; 
background-image:url(../images/fundo_prod.png); 
background-repeat:repeat-x;
background-position:bottom;
text-align:center;
font-family:Verdana, Geneva, sans-serif; 
font-size:30px; 
font-weight:bold; 
color:#06C; 
padding:10px 0px 10px 0px;
 }


figure#bananamamao:hover #img_banana { width:105%}

 
@media screen and (max-width: 1300px) {
#conteudo{
  width: 1000px;
}
#continter{
  width: 980px;
}
}

@media screen and (max-width: 1000px) {
#fundo{
    margin-top:-30px;
}
.sombra_b{
  margin-top:-5px
}
#conteudo{
  width:95%;
}
#continter{
  width: 95%;
}
.tit_produtos{ 
font-size:20px; 

}
}





/* RODAPÉ*/
footer{ 
  margin:0 auto; 
  background-image:url(../images/rodape.jpg); 
  background-position:center; 
  height:250px; 
  text-align:center;
  border-top-width:20px;
  border-top-color: #030;
  border-top-style: solid;
}

footer #barra{ 
  margin:0 auto;
  width:99.5%; 
  height:30px; 
  text-align:center;
  background-color: #030;
  margin-top:220px; 
  position:absolute;
  color:#FFF;
  padding:3px;
  font-weight:normal 
}


#avisos{
  text-align:center;
  
   
  
}


#avisos .botao{
  width:70px;
  padding:8px 30px;
  line-height: 30px;
  background-color: #333;
  border: none;
  color:#FFF;
  -moz-border-radius:0px;
  -webkit-border-radius:0px;
  border-radius:0px;
  
}

footer #center{ 
  margin:0 auto;
  width:900px
}

footer #rodape_e{ 
  float:left; 
  width:37F0px;
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  font-size:15px;
  font-weight:bold;
  color: #284480;
  text-align:left;
  margin-top:40px;
  padding-right:10px;
  border-right-color:#284480;
  border-right-style:solid;
  border-right-width:2px;
   
}

footer #rodape_m{ 
  float:left; 
  width:500px;
  margin-top:10px;
}

footer li{ 
  float:left; 
  text-align:left;
  list-style:none;
  padding-left:20px;
  
}


footer li a{ 
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  font-size:20px;
  font-weight:bold;
  color: #284480;
}

footer li a:hover{ 
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  font-size:20px;
  font-weight:bold;
  color: #09C ;
}










@media screen and (max-width: 1000px) {

footer{
  margin-top:0px; 
  height:200px; 
}


footer #center{ 
  margin:0 auto;
  width:95%;
}

footer #rodape_e{ 
  float:none; 
  width:90%;
  padding-top:10px;
  border: none;
  text-align:center;
  margin-top:30px;
  
}

footer #rodape_m{
  display:none 
}

footer li{ 
  float:left; 
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  font-size:20px;
  font-weight:bold;
  color: #284480;
  text-align:left;
  list-style:none;
  padding-left:20px;
  margin-top:30px;
}

footer #barra{ 
  margin-top:85px;
  width:99%; 
  
}

}


/*TITULOS*/
h1{
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  font-size:25px;
  font-weight:bold;
  color: #FF0;
}





/*div destaque*/
#destaque{
  width:1160px;
  height:  390px;
  overflow:hidden;
  display:block;
  margin-top:17px;
  
}
.img_dest{ 
  position:absolute;
  z-index:9;
  margin:-25px 0 0 20px;
  width:135px
}

@media screen and (max-width: 1000px) {
  #destaque{
    display:none
}
}

@media screen and (max-width: 1300px) {
  #destaque{
  width:980px;
}
}

#destaque h1{
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  font-size:25px;
  font-weight:bold;
  text-align:right;
  color: #fff;
  background-color:#284480;
  padding:10px 90px 10px 10px;
  
  
}

/* CAROUSEL  */
    .clear{ 
      width:auto;
      float:left;  
    }
    #my-carousel{
      float:left;
      position:relative;
    }
    #my-carousel ul{
      margin:0px;
      position:absolute;
        overflow:hidden;
        padding:0;
        list-style:none;
      overflow:hidden;
    }
    #my-carousel .mask {
      width:1160px /*tamanho carrocel*/;
      height:300px;
      display:block;
      margin:0px;
    }
    @media screen and (max-width: 1300px) {
    #my-carousel .mask {
      width:980px /*tamanho carrocel*/;
    }
    }
    
    #my-carousel.carousel .mask {
      position:relative;
        overflow:hidden;
    }
    #my-carousel ul li  {
      float:left;
/*      background:#f4ffd2; */
      position:relative;      
      width:282px; /*largura*/
      height:300px; /*Altuea */
      margin:0px;
      overflow:hidden;
      border:none /* solid 1px #000000*/;
      margin-right:8px;
    }
    #my-carousel ul li figure  {
      position:relative;
      width:100%; /*largura*/
      margin:0 auto;
      -webkit-transition: all 0.3s ease-in ;
      -moz-transition: all 0.3s ease-in ;
      -o-transition: all 0.3s ease-in ;
      -ms-transition: all 0.3s ease-in ;
      transition: all 0.3s ease-in;
    }
    
    #my-carousel ul li figure:hover  {
      opacity: 0.7;
      -moz-opacity: 0.7;
      -khtml-opacity: 0.7;
      -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
      filter: alpha(opacity=70);    
        
    }
    
    #my-carousel ul li figure figcaption  {
      position:absolute;
      width:95%; /*largura*/
      height:90px;
      margin:0 auto;
      padding:10px;
      background-image:url(../menu/images/fundo.png);
      margin-top:-90px;
      color:#fff;
      font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
      font-size:20px;
      text-align:center;
      
      
    }
    
    #my-carousel .menor  {
      display:none;
    }
    
    @media screen and (max-width: 1300px) {
    #my-carousel .menor  {
      display: block;
    }
    #my-carousel .maior  {
      display:none;
    }
    
    #my-carousel ul li  {
      width:240px; /*largura*/
      height:300px; /*Altuea */
    }
    }
     #my-carousel .prev {
          width: 30px;
          height: 40px/*14px*/;
          position: absolute;
          z-index: 999;
      top:-65px;
      right:35px;
          display: table;
          cursor: pointer;
      background-image: url(../carousel-exemplo/left_arrow.png);
          background-repeat: no-repeat;
          background-position: left;
         }
        #my-carousel .next {
          width: 30px;
          height: 40px/*14px*/;
          position: absolute;
          z-index: 999;
      top:-65px;
      right:20px;
      display: table;
          cursor: pointer;
      background-image: url(../carousel-exemplo/right_arrow.png);
          background-repeat: no-repeat;
          background-position: right;
       } 
  
  
     
  /* GALERIA :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::   */ 
  
  article.galeria {
    width:98%;
    padding:1%;
    margin-top:3%;
    background-image:url(../images/fundo_produto.png);
    position:relative;
    display:table;
    border: 1px solid #eaeaea;
    color: #030;
    box-shadow: 0 2px 2px rgba(0, 0, 0, 0.1);
    max-width: 99.9%;
    
     
  }
  
  article.galeria a.botao{
  float:right; 
  width:95px;
  margin:10px 20px 0 0;
  background-color: #FF0 ;
  background-image:url(../images/mais.jpg);
  background-repeat:no-repeat;
  background-position: center;
  border: none;
  color:#030;
  text-align:left;
  padding:5px;
  font-weight:bold;
  -webkit-transition: all 0.3s ease-in ;
     moz-transition: all 0.3s ease-in ;
     -o-transition: all 0.3s ease-in ;
     -ms-transition: all 0.3s ease-in ;
     transition: all 0.3s ease-in;
  }
  article.galeria a.botao2{
  float: left; 
  }
  
  article.galeria a.botao:hover{
  -webkit-transform:scale(1.02); /* prefixo para browsers webkit */
  -moz-transform:scale(1.02); /* prefixo para browsers gecko */
  -o-transform:scale(1.02); /* prefixo para opera */
  transform:scale(1.02);  
  }
  
  article.galeria h1 {
    float:left;
    position: relative;
    width:100%;
    margin:10px;
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    font-size:25px;
    font-weight:bold;
    text-align: left;
    color: #284480;
    padding:5px;
    border-bottom: 1px solid #eaeaea;
    
  }
  
  article figure {
    margin:0
    
  }
  
  article.galeria figure #im {
    width:20%;
    float:left;
    overflow:hidden;
    position:relative;
    -webkit-transition: all 0.3s ease-in ;
    -moz-transition: all 0.3s ease-in ;
    -o-transition: all 0.3s ease-in ;
    -ms-transition: all 0.3s ease-in ;
    transition: all 0.3s ease-in;
  }
  
  article.galeria figure img {
    -webkit-transition: all 0.3s ease-in ;
    -moz-transition: all 0.3s ease-in ;
    -o-transition: all 0.3s ease-in ;
    -ms-transition: all 0.3s ease-in ;
    transition: all 0.3s ease-in;
  }
    
  article.galeria figure img:hover  {
    opacity: 0.7;
    -moz-opacity: 0.7;
    -khtml-opacity: 0.7;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
    filter: alpha(opacity=70);
    -webkit-transform:scale(1.02); /* prefixo para browsers webkit */
    -moz-transform:scale(1.02); /* prefixo para browsers gecko */
    -o-transform:scale(1.02); /* prefixo para opera */
    transform:scale(1.02);      
      
  }
  
  
  article.galeria figure figcaption {
    width:75%;
    float:left;
    padding:2%;
  }
  
  @media screen and (max-width: 1000px) {
  
  article.galeria a.botao{
    float:none;
    padding-right:30px;
    background-position:right 5px
    
  }
  
  article.galeria {
    text-align:center;
    padding:10px;
  }
  
  article.galeria figure #im {
    width:95%;
    float: none;
    overflow:hidden;
    position:relative;
    -webkit-transition: all 0.3s ease-in ;
    -moz-transition: all 0.3s ease-in ;
    -o-transition: all 0.3s ease-in ;
    -ms-transition: all 0.3s ease-in ;
    transition: all 0.3s ease-in;
  }
  
  article.galeria figure img {
    -webkit-transition: all 0.3s ease-in ;
    -moz-transition: all 0.3s ease-in ;
    -o-transition: all 0.3s ease-in ;
    -ms-transition: all 0.3s ease-in ;
    transition: all 0.3s ease-in;
  }
    
  article.galeria figure img:hover  {
    opacity: 0.7;
    -moz-opacity: 0.7;
    -khtml-opacity: 0.7;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
    filter: alpha(opacity=70);
    -webkit-transform:scale(1.02); /* prefixo para browsers webkit */
    -moz-transform:scale(1.02); /* prefixo para browsers gecko */
    -o-transform:scale(1.02); /* prefixo para opera */
    transform:scale(1.02);      
      
  }
  
  
  article.galeria figure figcaption {
    width:98%;
    float: none;
    padding:2%;
    margin-top:30px
  }
  
  article.galeria h1 {
    float: none;
    width:90%;
    text-align: center;
    margin:0 auto
  }
  }
  
  /* contato*/
  
  #cont{
    width:100%;
  }
  #cont div{
    width:100%;
    display:table
  }
  
  #cont span{
  float:left;
  margin:10px 0px 20px 20px;
  color: #333;
  font-weight:bold;
  width:10%
  }
  
  #cont #cap{
    width:250px;
    display:table;
    text-align:center;
    margin:0 auto;
    margin-top:20px
  }
  

  #cont .input{
    float:left; 
    width:80%;
    margin:5px 20px 10px 10px;
    line-height: 25px;
    border: 1px solid #c7c7c7;
    -moz-border-radius:6px;
    -webkit-border-radius:6px;
    border-radius:6px;
    padding-left:5px
    
  }
  #cont .botao{
     
    width:70px;
    margin:15px 20px 0 0;
    line-height: 30px;
    background-color: #333;
    border: none;
    color:#FFF
    
  }

  
  
  
  
  
       
     

