/*Small devices (landscape phones, 576px and up)*/
 @media (max-width: 576px) {

     h1 {
         font-size: 3.5em;
     }
     
     h1 span {
        font-size: 18px;
        line-height: 24px;
    }

     h2 {
         font-size: 2.8em;
     }

     h2::after {
         width: 90%;
     }

     .banner h1 {
         margin-top: 150px;
         font-size: 2.3em;
     }

     #desktop {
         display: none;
     }

     #mobile {
         display: block;
     }

     section,
     footer {
         padding-top: 50px;
         padding-bottom: 50px;
     }

     .espaco {
         display: block;
         margin-top: 50px;
     }

     .social #desktop {
         display: none;
     }

     .social #mobile {
         display: inline-block;
     }


     .botao {
         width: 200px;
         margin: 20px auto;
         padding: 10px 15px;
         font-weight: 500;
         font-size: .8em;
     }

     .social {
         display: block;
         position: absolute;
         top: -140px;
         left: 10px;
     }


     .social li a span {
         font-size: 1.2em;
     }

     .social li a span:before {
         margin-right: 5px;
     }

     /* MENU */

     .navbar-toggler {
         position: absolute;
         top: -38px;
         right: 10px;
         color: #F2CECE;
         border: 2px solid #F2CECE;
         border-radius: 22px;
         padding: 8px;
     }

     .navbar-toggler span:before {
         margin-right: 0px;
     }

     .navbar-collapse {
         background: url(../img/site/fundo-dropdown.png)center bottom repeat-x;
         position: absolute;
         padding-bottom: 21px;
         width: 100%;
         top: 10px;
         left: 0px;
     }

     .navbar-nav {
         background: #07619b;
     }

     .navbar-nav .nav-link {
         padding: 10px 20px;
         margin: 0px auto;
         color: #fff;

     }

     .collapse [.show] .social li a span {
         position: absolute;
         top: -250px;
     }

     .dropdown-menu {
         font-size: .8em;
         width: auto;
         padding: 5px 0;
         margin: 15px auto;
         color: #fff;
         background: none;
     }

     .menu-fixo img {
         width: 50%;
         margin: 0px 0px;
         padding: 0px;
         text-align: left !important;
     }


     .grid {
         padding: 10px;
         max-width: 100%;
     }

     .grid figure {
         display: inline-block;
         float: none;
         margin: 10px auto;
         width: 100%;
     }

     figure.effect-zoe figcaption,
     figure.effect-zoe h2,
     figure.effect-zoe h4,
     figure.effect-zoe p.icon-links a {
         transform: translate3d(0, 0%, 0);
     }

     /***************BANNER PRINCIPAL**************/

     .slider-principal {
         background: url(../img/slide/slide-principal-mobile.jpg) top left no-repeat;
         height: 600px;
     }
     
     .banner-conquista{
        background: url(../img/slide/banner-conquistas-mobile.jpg) top center no-repeat;
        height: 500px;
        position: relative;
    }

     .titulo-principal {
         margin: 175px 0px 10px auto;
     }
     
     /***************COMISSÃO TÉCNICA**************/
     
     .tabs .social {
        padding-left: 0px;
        margin-top: 10px;
        margin-bottom: 30px;
        position: relative;
        top: 0px;
    }
     
     .apoio .social {
        margin-top: 0px;
        margin-bottom: 20px;
        position: relative;
        top: 0;
         left: 0;
    }
     
     .apoio p::before {
        width: auto;
        margin: 0px;
    }


/***************COMPETIÇÃO**************/
     
   
     
     .table tbody tr {
        height: 125px;
    }
     
       .table-hover tbody tr:hover {
    background: url(../img/site/fundo-onda-azul-mobile.png) center center repeat-x;
}

     .table tbody td .botao {
         margin: 0px auto;
         width: 100px;
     }
     
/***************ACTION**************/
     
     .bg-action {
        background: url(../img/site/bg-action-mobile.jpg) top center no-repeat;
        height: 530px;
    }
     
     .action {
        padding: 30px 0px;
    }

     /*PATROCINADORES*/

     .patroc li {
         display: block;
         margin: 0px auto;
     }

     .apoio li {
         display: inline-block;
         padding: 10px;
         width: 100%;
     }

     .apoio.patroc li {
         width: 100%;
         padding: 10px;
     }
     
     /***************Multimidia**************/
     
     .modal-header .close {
        margin-right: 30px;
        padding-top: 0px;
    }

     .multimidia .videos a img {
         padding: 20px;
     }

     .multimidia .materias a img {
         padding: 20px;
     }
     
     /***************CONQUISTAS**************/

     .premio img {
        text-align: center;
        margin: 0px auto;
        display: block;
        
    }
     
     .premio img#ouro{
         width: 70%;
     }
     
     .premio h4 {
        text-transform: uppercase;
        font-weight: 900;
        color: #da4167;
        margin-top: 30px;
        margin-bottom: 5px;
        font-size: 1.2em;
    }
     
     /***************CONTATO**************/

     .contato .social {
         position: relative;
         top: 0px;
         left: 0px;
     }
     
     .contato .social li a span {
        font-size: 2.2em;
        margin-bottom: 50px;
    }

     footer img {
         display: block;
         margin: auto;
     }



     footer .social {
         position: relative;
         top: 0px;
         left: 0px;
         float: none;
         text-align: center;
         margin-top: 20px;
     }

     footer .social li {
         margin: 0px auto;
     }

     footer .contato .social li a span {
    margin: 40px 0px auto auto;
    font-size: 2.5em;
}

     footer .contato p {
         text-align: center;
     }
     
     footer .contato p span{
         font-size: 1.4em;
     }
     
     footer .contato p a{
        display: block;
        margin: 10px auto;
     }

     footer .botao {
         margin-left: auto;
     }

     .barra-rodape p {
         text-align: center;
         font-size: .8em;
     }

     .barra-rodape a {
         margin: 10px auto;
         text-align: center;
         text-decoration: none;
     }

     /*MODAL*/

     .caixa {
         width: 80%;
         height: 100%;
         padding: .5em;
     }

     .caixa h1 {
         font-size: 2em;
     }

     .caixa h5 {
         font-size: 1em;
     }

     .caixa a {
         margin: .5em;
     }

     .caixa h3 {
         line-height: 1.2em;
     }

     .caixa .social {
         display: block;
         position: relative;
         top: 0px;
         left: auto;
     }

     .caixa a#link-home {
         font-size: 2.5em;
    top: -10px;
    right: 0px;

     }

 }

 /*Medium devices (tablets, 768px and up)*/
 @media (max-width: 768px) {
     ...
 }

 /* Large devices (desktops, 992px and up)*/
 @media (max-width: 992px) {
     ...
 }

 /*Extra large devices (large desktops, 1200px and up)*/
 @media (max-width: 1200px) {
     ...
 }