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

/************************************************************************************
                                    RESPONSIVO
*************************************************************************************/
        @media (max-height: 775px) and (min-width: 1000px) {  
            #setor1 .swiper-container { height: 430px }
        }


        @media (max-width:1320px) {
          .row { width: 90%; margin: 0 5%; }
  
          #setor3 .last .text { width: 287px; height: 287px; }
          #setor3 .last .text p { padding: 57px 50px 0 50px; font-size: 0.9em; }
          #setor3 .last .imgab {left: 146px;}

        }
        @media (max-width:1320px) {
          header .right #menu-desktop { margin: 57px 0 0 0; }
          header .right #infos p { font-size: 1.4em; margin: 2.1em 1em 0; }
          header .right #infos .bottom { float: right; }
          header .right #infos .top .field { width: 236px; }
        }
        @media (max-width:1200px) {
          #setor3 .box { width: 20% } 
          #setor3 .last { width: 60% } 
          #setor3 .box h4 { font-size: 2.8em; }
          #setor3 .last .imgab {left: 126px;}

          footer { font-size: 90% }

          #setor2 ul li {height: 190px}

          #products .triside ul li {height: 250px}
          #products .triside .top h3 {font-size: 2.8em}

        }
        @media (max-width:1200px) {

          header .right #menu-desktop .links { font-size: 1.2em; margin: 2.5em 0.75em 0;  } 
          header .right #infos .top { margin-top: 25px; }
          header .right #infos p { font-size: 1.2em; margin: 2.1em 1em 0; }
          header .right #infos a { margin: 1.8em 0.75em; } 
          header .right #infos .top .field { width: 214px; }
          header .right #infos .top .btn { top: 32px }
          header .right #menu-desktop { margin: 52px 0 0 0; }
  
          header { height: auto; padding-bottom: 5%; }
          header .left img { width: 118px; }

          #setor2 ul li { height: 165px }
          #setor2 ul li h4 { font-size: 2em }
        
          header .right #menu-desktop .prodover { font-size: 1.2em;}
          header .right #menu-desktop ul {margin: 112px 0 0 0;}
          header .right #menu-desktop .prodover:hover > ul {height: 120px;}

          header .right #menu-desktop .aboutover { font-size: 1.2em;}
          header .right #menu-desktop .aboutover div {margin: 30px 0 0 0;}
          header .right #menu-desktop .aboutover span { bottom: 20px;}

          header .right #menu-desktop .prodover span {bottom: 20px;}




        }
        @media (max-width:1000px) {
          header { display: none }
           .header-fixo {display: block;}
           #setor1 { padding-top: 71px }

           #setor1 .swiper-container { height: 430px }
          .swiper-slide .left {width: 50% !important}

          #setor3 .box { width: 15% } 
          #setor3 .last { width: 68%; padding: 0 0 0 2%; } 
          #setor3 .box h4 { font-size: 1.8em; }
          #setor3 .box a { font-size: 1.2em }
          #setor3 .box img { margin: 0 0 4em 0; }

          footer .info div { margin: 2.5% 0 0 0; width: 50%; height: 18px;}

          #products { padding-top: 71px; margin-top: 5% }
          #products .oneside { margin: 0 }
          #products .twoside { width: 81% }
          #products .twoside .more-info li { width: 45%; height: 250px; margin: 0 5% 6% 0;}
          #products .twoside .more-info li:last-child { height: auto }
          #products .oneside div {padding: 0 0 5% 0;}
          #products .oneside ul {margin-top: 10px;}
        
          #aboutus { padding-top: 71px; margin-top: 5%; }
          #aboutus .oneside { width: 100%; float: left; font-size: 1.4em; }
          #aboutus .twoside { width: 100%; float: left; margin-top: 5%  }

          #aboutus .twoside .box { width: 50%; margin: 0 0 10% 0 }


          #contato { padding-top: 71px; margin-top: 5% }

          #terms { padding-top: 71px; margin-top: 5%; background: none }
          #terms .oneside { width: 100%; float: left; font-size: 1.4em; }
          #terms .twoside { width: 100%; float: left; margin-top: 5%  }


          #search { padding: 3px 0 5px 10px; margin-top: 0; background: none; border-left: 1px solid #CCC; border-bottom: 1px solid #CCC; }
          .header-fixo .busca input {border: 0}
          #search .oneside { width: 100%; float: left; font-size: 1.4em; }
          #search .twoside { width: 100%; float: left; margin-top: 5%  }

          .girl-all { background: none !important }

          #promotions { padding-top: 71px; margin-top: 5% }
          #promotions .oneside { width: 100%; margin: 0}

          #products .triside ul li h4 { font-size: 1.4em }
          #products .triside ul li { height: 200px }


          #about_us_real { padding-top: 71px; margin-top: 5% }
          #about_us_real .treside p {float: left;}

          #terms .oneside { min-height: auto !important; }


        }


        @media (max-width:800px) {

            .mobile { display: block !important;}
            .desktop { display: none !important;}


            #contato .logo {top: 3% !important; }
            #contato .btn-fechar {top: 5% !important;right: 3% !important; }

            #contato form { width: 100% !important;  margin: 0 0 0 0 !important; font-size: 80% !important }
            #contato .info { width: 100% !important; float: left !important; margin: 5% 0 0 0 !important; font-size: 80% !important }
            #contato .info div { margin: 0 0 2% !important;}

            #contato form ul label { width: 100% !important }
            #contato form ul .field { width: 100% !important; height: 30px !important; }
            #contato form ul textarea { width: 100% !important }
            #contato form ul .btn {    margin: 1.5em 0 !important;}


            .header-fixo #infos .bottom { display: none }
            .header-fixo .busca { margin: 15px 0 0 }


             #setor1 .swiper-container { height: 350px }
            .swiper-slide .left h2 { font-size: 3.8em !important; }


            #setor2 .top h3 {font-size: 3.8em !important;}

            #setor2 ul li { width: 31.3%; margin: 0 2% 2% 0; }

  

            #setor3 .box h4 {font-size: 1.8em; }
            #setor3 .box span { width: auto; float: left; margin: 1em 0 0 1em; }
            #setor3 .box a { margin: 0.3em 0 0; width: auto }
            #setor3 .box div { display:none;}
            #setor3 .box img { width: 50px; margin: 0 0 3em 0; }

            #setor3 .box { width: 100%; margin: 0 0 0 0; font-size: 130%; } 
            #setor3 .last .text { display: none } 
            #setor3 .last .imgab {display: none;}

            #setor3 .last {height: auto; padding-left: 0 }

  
            #products .oneside { font-size: 100% }
            #products .oneside span {    margin: 5px 5% 0 0;}
            #products .oneside .open span { margin-top: 7px;}
            #products .oneside div:hover > span { margin-top: 7px;  }



            #about_us_real .oneside ul li { height: 180px; }
            #about_us_real .twoside .left ul li:first-child { height: 230px }
            #about_us_real .twoside .left ul li:last-child { height: 120px }
            #about_us_real .twoside .right ul li:first-child { height: 120px }
            #about_us_real .twoside .right ul li:last-child { height: 230px }
            #about_us_real .treside ul li { height: 190px;  }
            #about_us_real .treside .link {margin: 9% 0 0 31%;}

            #about_us_real .top h3 { font-size: 2em !important }
            #about_us_real .last .twoside ul li div h5 { font-size: 1em }
            #about_us_real .last .twoside ul li div p { font-size: 0.8em }
      
            #contato form .g-recaptcha { margin-left: 0 !important;}
            #contato form ul .error {left: 0; }

        }
        @media (max-width:650px) {

          .header-fixo { zoom:0.8; }
          .header-fixo .busca { background-size: 23px 23px; background-position: 15px 4px; }
          .header-fixo .busca div { width: 46px;}
          .header-fixo .busca input {  margin: -11px 0 0 50px;}
          .header-fixo .busca { width: 44px;}

           #setor1 { padding-top: 57px }


          footer .info div { margin: 0 0 3.5% 18px; width: auto; clear: both;}
          footer .info div.excep { margin: 0 0 3.5% 18px;}
          footer .info .assina-site { margin: 10% 0 5%; height: auto }

          
          #products .twoside .more-info li { width: 100%; height: auto; margin: 0 0 6% 0;}

          #products { padding-top: 57px }
  

          #products .oneside { width: 100%; margin-bottom: 5%; }
          #products .twoside {width: 100% }

          #products .oneside div { width: 100%; padding:0.5em 0 0 0; border-bottom:1px solid #F1E1CB; }
          #products .oneside h3 { margin: 1px 0 7px;}
          #products .oneside ul { height: 0}
          #products .oneside .open ul { height: 0}
           
          #products .oneside span { width: 8px; height: 5px; background-position: -5px 0; margin-top: 7px;  margin: 5px 0.8em 0 0  }
          #products .oneside ul li {width: auto; margin: 0 0.5em 1em; }
          #products .oneside ul li a { margin: 0 0 0 1.2em; width: 100% }
          #products .oneside ul { margin-top: 0; width: 100%}


          #products .twoside h4 { font-size: 1.3em }
          #products .twoside .textures {font-size: 1em;}
          #products .twoside .textures li { width: 28.8%; }

          #aboutus { padding-top: 57px }
          #aboutus .twoside {    margin-top: 10%;}
          #aboutus .twoside .box { width: 100%; font-size: 80%; min-height: auto;  }

          #contato { padding-top: 57px }


          #terms { padding-top: 57px }
          #terms .twoside { margin-top: 5%;}
          #terms .twoside p { width: 100%; margin: 0;}

          #search { }
          #search .twoside { margin-top: 5%;}
          #search .twoside p { width: 100%; margin: 0;}
       

          #promotions { padding-top: 57px; font-size: 80% }

      
          #products .triside { width: 100%;}
          #products .triside .top h3 { font-size: 1.8em; }
          #products .triside .top div {display: none;}


          #about_us_real { padding-top: 57px }

          footer .info .p3k {clear: both; margin: 4em 0 0 0;}

        }
        @media (max-width:600px) {
  

        }
        @media (max-width:550px) {
            .clear {clear: both; }

            #contato .logo { margin: 0.5% 5% 0; zoom: .8;}
            #contato .btn-fechar { zoom: .8;}

            #setor2 ul li { width: 48%; }

            #products .twoside .swiper-container { height: 205px; }
            #products .twoside .swiper-slide .left {margin: 0 0 0 5%;}
            #products .twoside .swiper-slide .left h2 { font-size: 2.8em !important; }

            #products .triside ul li { width: 48%; height: 140px }
            
            
            #about_us_real .oneside { width: 100% !important }
            #about_us_real .twoside { width: 100% !important }
            #about_us_real .treside { width: 100% !important }
            #about_us_real .top h3 br { display: none !important }

            #about_us_real .treside p {float: none;}
            #about_us_real .twoside p {width: 100%}
            #about_us_real .oneside ul li { margin: 0 0 3% 0; width: 97%}
            #about_us_real .treside ul li { margin: 3% 0 0 0; width: 97%}
            #about_us_real .treside .link {margin: 9% 0 0 41%;}

            #about_us_real .last .twoside .left { width: 100% }
            #about_us_real .last .twoside .right { width: 100% }

          }
        @media (max-width:430px) {
            .header-fixo .busca { height: 40px; }

           #setor1 .swiper-container { height: 270px }
          .swiper-slide .left {width: 80% !important}
           .swiper-slide .left h2 { font-size: 2.8em !important; }
           .swiper-slide .left { bottom: 35% !important; margin: 0 0 0 5% !important }
           .swiper-container-horizontal > .swiper-pagination { left: 5% !important }
           .swiper-button-next, .swiper-container-rtl .swiper-button-prev { right: 2em !important }
           .swiper-button-prev, .swiper-container-rtl .swiper-button-next {right: 6.5em !important}

            #setor2 .top h3 {font-size: 2.8em !important;}
            #setor2 ul li { height: 140px; }

            #setor3 .box { font-size: 100%; } 

            #aboutus .twoside .box .right h5 {font-size: 1.8em;}
            #aboutus .oneside .top h3 {font-size: 2em !important;}

            #terms .oneside .top h3 {font-size: 2em !important;}

            #search .oneside .top h3 {font-size: 2em !important;}

            #products .twoside .textures li { min-height: 138px; }


          }

/************************************************************************************
                                    RESPONSIVO END
*************************************************************************************/
