/* ==========================================================================
   
   medias querys para responsive design

   DO MENOR PARA O MAIOR (DO CELULAR PARA O PC)

   ========================================================================== */

/* SMARTPHONES */
@media screen and (max-width:500px){
    .logo{ margin: 10px auto; width: 232px; height: 83px; float: none; }
    .header{ position: relative; height: 100%; text-align: center; } 
    .orcamento{ float: none; margin: 0px auto; margin-top: 20px;  }
    .columnMenu{ width: 100%; float: none; }
    #slider1_container{ margin-top: 10px; }
    .img-fiorino{ margin-top: 60px; }
    .imgSusten{ position: relative; width: 520px; height: 600px; bottom: -140px; }
    .chamada1, .chamada2{ font-size: 2.2em; }
    .lst-segmentos li{ margin: 12px; padding: 12px; width: 35%; border: 1px solid #fff; display: inline-block; }
    main .content{ padding: 0px 20px; }

    .hoverzoom{ height: auto; margin-bottom: 12px; }
    #quem-somos p{ text-align: justify; }
    .depoimentos h2{ text-align: center; }
    .footer{ text-align: center; }
    .footer h5{ text-align: center; margin-top: 30px; }
    .lst-footer{ margin-top: 20px; text-align: center; }
    .lst-footer a{ display: block; text-align: center; }
    .icon-ideas{ display: block; text-align: center; float: none; margin: 12px auto; }
    .copy{ text-align: center; }
}

/* TABLETTES */
@media (min-width:501px) and (max-width:959px){
    .logo{ margin: 10px auto; width: 232px; height: 83px; float: none; }
    .header{ position: relative; height: 100%; text-align: center; } 
    #cssmenu{ margin-top: 30px; background-color: #f8f8f8;  }
    .orcamento{ float: none; margin: 0px auto; margin-top: 50px;  }
    .sliderFixed{ margin-top: 0px; }
    .columnMenu{ margin: 0px; width: 100%; float: none; }
    #slider1_container{ margin-top: 20px; }
    .img-fiorino{ margin-top: 60px; }
    .imgSusten{ display: none; }
    .susten .column{ width: 100%; }
    .lst-segmentos li{ margin: 12px; padding: 12px; width: 20%; font-size: 0.8em; border: 1px solid #fff; display: inline-block; }
    .chamada1, .chamada2{ font-size: 2.2em; }
    #quem-somos{ background-size: 50%; }
    #quem-somos{ padding: 20px 60px 0px 40px; }
    #quem-somos .column, #proposta .column{ width: 100%; }
    #quem-somos p{ text-align: justify; }
    .imgChildren{ margin: 0px auto; width: 80%; float: none; }
    .dep .column{ width: 100%; }   
    .imgMascote{ display: none; }
    .depPeoples{ width: 89%; }
    .hoverzoom{ height: auto; }
    .groupDestaque{ top: 36px; }
    .groupDestaque p{ font-size: 0.8em; }
    .groupDestaque .txtBig{ font-size: 1.1em; }
    .status-info{ margin: 0px auto; float: none; }
    .sust{ padding: 20px 40px 20px 20px; }
}

/* TABLETTES */
@media (min-width:960px) and (max-width:1200px){
.columnMenu{ margin: 0px auto; width: 50%; float: none; }
.matricula{ background-color: turquoise; height: 300px; }
.orcamento{ margin-top: 12px; }
.columnMenu{ width: 500px; padding-top: 15px; float: left; }
.imgSusten{ bottom: -575px; }
}