/* margin */
.mt-0{margin-top: 0px !important;}
.mt-1{margin-top: 10px !important;}
.mt-2{margin-top: 20px !important;}
.mt-3{margin-top: 30px !important;}
.mt-4{margin-top: 40px !important;}
.mt-5{margin-top: 50px !important;}
.mt-6{margin-top: 60px !important;}
.mt-7{margin-top: 70px !important;}
.mt-8{margin-top: 80px !important;}
.mt-9{margin-top: 90px !important;}
.mt-10{margin-top: 100px !important;}

.mr-0{margin-right: 0px !important;}
.mr-1{margin-right: 10px !important;}
.mr-2{margin-right: 20px !important;}
.mr-3{margin-right: 30px !important;}
.mr-4{margin-right: 40px !important;}
.mr-5{margin-right: 50px !important;}
.mr-6{margin-right: 60px !important;}
.mr-7{margin-right: 70px !important;}
.mr-8{margin-right: 80px !important;}
.mr-9{margin-right: 90px !important;}
.mr-10{margin-right: 100px !important;}

.mb-0{margin-bottom: 0px !important;}
.mb-1{margin-bottom: 10px !important;}
.mb-2{margin-bottom: 20px !important;}
.mb-3{margin-bottom: 30px !important;}
.mb-4{margin-bottom: 40px !important;}
.mb-5{margin-bottom: 50px !important;}
.mb-6{margin-bottom: 60px !important;}
.mb-7{margin-bottom: 70px !important;}
.mb-8{margin-bottom: 80px !important;}
.mb-9{margin-bottom: 90px !important;}
.mb-10{margin-bottom: 100px !important;}

.ml-0{margin-left: 0px !important;}
.ml-1{margin-left: 10px !important;}
.ml-2{margin-left: 20px !important;}
.ml-3{margin-left: 30px !important;}
.ml-4{margin-left: 40px !important;}
.ml-5{margin-left: 50px !important;}
.ml-6{margin-left: 60px !important;}
.ml-7{margin-left: 70px !important;}
.ml-8{margin-left: 80px !important;}
.ml-9{margin-left: 90px !important;}
.ml-10{margin-left: 100px !important;}

.my-0{margin-top: 0px !important; margin-bottom: 0px !important;}
.my-1{margin-top: 10px !important; margin-bottom: 10px !important;}
.my-2{margin-top: 20px !important; margin-bottom: 20px !important;}
.my-3{margin-top: 30px !important; margin-bottom: 30px !important;}
.my-4{margin-top: 40px !important; margin-bottom: 40px !important;}
.my-5{margin-top: 50px !important; margin-bottom: 50px !important;}
.my-6{margin-top: 60px !important; margin-bottom: 60px !important;}
.my-7{margin-top: 70px !important; margin-bottom: 70px !important;}
.my-8{margin-top: 80px !important; margin-bottom: 80px !important;}
.my-9{margin-top: 90px !important; margin-bottom: 90px !important;}
.my-10{margin-top: 100px !important; margin-bottom: 100px !important;}

.mx-0{margin-left: 0px !important; margin-right: 0px !important;}
.mx-1{margin-left: 10px !important; margin-right: 10px !important;}
.mx-2{margin-left: 20px !important; margin-right: 20px !important;}
.mx-3{margin-left: 30px !important; margin-right: 30px !important;}
.mx-4{margin-left: 40px !important; margin-right: 40px !important;}
.mx-5{margin-left: 50px !important; margin-right: 50px !important;}
.mx-6{margin-left: 60px !important; margin-right: 60px !important;}
.mx-7{margin-left: 70px !important; margin-right: 70px !important;}
.mx-8{margin-left: 80px !important; margin-right: 80px !important;}
.mx-9{margin-left: 90px !important; margin-right: 90px !important;}
.mx-10{margin-left: 100px !important; margin-right: 100px !important;}

/* padding */
.pt-0{padding-top: 0px !important;}
.pt-1{padding-top: 10px !important;}
.pt-2{padding-top: 20px !important;}
.pt-3{padding-top: 30px !important;}
.pt-4{padding-top: 40px !important;}
.pt-5{padding-top: 50px !important;}
.pt-6{padding-top: 60px !important;}
.pt-7{padding-top: 70px !important;}
.pt-8{padding-top: 80px !important;}
.pt-9{padding-top: 90px !important;}
.pt-10{padding-top: 100px !important;}

.pr-0{padding-right: 0px !important;}
.pr-1{padding-right: 10px !important;}
.pr-2{padding-right: 20px !important;}
.pr-3{padding-right: 30px !important;}
.pr-4{padding-right: 40px !important;}
.pr-5{padding-right: 50px !important;}
.pr-6{padding-right: 60px !important;}
.pr-7{padding-right: 70px !important;}
.pr-8{padding-right: 80px !important;}
.pr-9{padding-right: 90px !important;}
.pr-10{padding-right: 100px !important;}

.pb-0{padding-bottom: 0px !important;}
.pb-1{padding-bottom: 10px !important;}
.pb-2{padding-bottom: 20px !important;}
.pb-3{padding-bottom: 30px !important;}
.pb-4{padding-bottom: 40px !important;}
.pb-5{padding-bottom: 50px !important;}
.pb-6{padding-bottom: 60px !important;}
.pb-7{padding-bottom: 70px !important;}
.pb-8{padding-bottom: 80px !important;}
.pb-9{padding-bottom: 90px !important;}
.pb-10{padding-bottom: 100px !important;}

.pl-0{padding-left: 0px !important;}
.pl-1{padding-left: 10px !important;}
.pl-2{padding-left: 20px !important;}
.pl-3{padding-left: 30px !important;}
.pl-4{padding-left: 40px !important;}
.pl-5{padding-left: 50px !important;}
.pl-6{padding-left: 60px !important;}
.pl-7{padding-left: 70px !important;}
.pl-8{padding-left: 80px !important;}
.pl-9{padding-left: 90px !important;}
.pl-10{padding-left: 100px !important;}

.py-0{padding-top: 0px !important; padding-bottom: 0px !important;}
.py-1{padding-top: 10px !important; padding-bottom: 10px !important;}
.py-2{padding-top: 20px !important; padding-bottom: 20px !important;}
.py-3{padding-top: 30px !important; padding-bottom: 30px !important;}
.py-4{padding-top: 40px !important; padding-bottom: 40px !important;}
.py-5{padding-top: 50px !important; padding-bottom: 50px !important;}
.py-6{padding-top: 60px !important; padding-bottom: 60px !important;}
.py-7{padding-top: 70px !important; padding-bottom: 70px !important;}
.py-8{padding-top: 80px !important; padding-bottom: 80px !important;}
.py-9{padding-top: 90px !important; padding-bottom: 90px !important;}
.py-10{padding-top: 100px !important; padding-bottom: 100px !important;}

.px-0{padding-left: 0px !important; padding-right: 0px !important;}
.px-1{padding-left: 10px !important; padding-right: 10px !important;}
.px-2{padding-left: 20px !important; padding-right: 20px !important;}
.px-3{padding-left: 30px !important; padding-right: 30px !important;}
.px-4{padding-left: 40px !important; padding-right: 40px !important;}
.px-5{padding-left: 50px !important; padding-right: 50px !important;}
.px-6{padding-left: 60px !important; padding-right: 60px !important;}
.px-7{padding-left: 70px !important; padding-right: 70px !important;}
.px-8{padding-left: 80px !important; padding-right: 80px !important;}
.px-9{padding-left: 90px !important; padding-right: 90px !important;}
.px-10{padding-left: 100px !important; padding-right: 100px !important;}

.centralizar{
    margin: 0 auto;
}

/* Celular XS */
@media (max-width: 767px) { 
    .center-mobile{
        text-align: center !important;
        margin: 0 auto !important;
    }

    .somente-mobile{display: block !important;}
    .somente-desktop{display: none !important;}

    .portfolio-1{background-image: url(../image/1_original.png);}
    .portfolio-2{background-image: url(../image/2_original.png);}
    .portfolio-3{background-image: url(../image/3_original.png);}
    .portfolio-4{background-image: url(../image/4_original.png);}
    .portfolio-5{background-image: url(../image/5_original.png);}
    .portfolio-6{background-image: url(../image/6_original.png);}

    #desde{
        margin-top: 0px;
        margin-bottom: 30px;
    }

    #estrutura{
        margin-top: -50px;
    }

    #certificacao{
        margin-top: -40px;
    }

    .img-data{
        max-width: 80px;
    }

    .txt-ajuste-1{
        padding-top: 0px !important;
    }

    #carousel-example-generic {
        position: relative;
    }

    .txt-parallax{
        padding-top: 60px !important;
    }

    .primeiro-distribuicao{
        margin-top: -50px !important;
    }

    #distribuicao{
        margin-top: -50px !important;
    }

    .logo_footer{
        margin: 0 auto;
    }


}

/* Tablet SM */
@media (min-width: 768px) and (max-width: 991px) { 
    .center-mobile{
        text-align: center !important;
        margin: 0 auto !important;
    }

    .somente-mobile{display: block !important;}
    .somente-desktop{display: none !important;}

    .portfolio-1{background-image: url(../image/1_original.png);}
    .portfolio-2{background-image: url(../image/2_original.png);}
    .portfolio-3{background-image: url(../image/3_original.png);}
    .portfolio-4{background-image: url(../image/4_original.png);}
    .portfolio-5{background-image: url(../image/5_original.png);}
    .portfolio-6{background-image: url(../image/6_original.png);}

    #desde{
        margin-top: 0px;
    }

    .img-data{
        max-width: 80px;
    }

    .txt-ajuste-1{
        padding-top: 0px !important;
    }

    #carousel-example-generic {
        position: relative;
    }

    .primeiro-distribuicao{
        margin-top: -50px !important;
    }

    .txt-parallax{
        padding-top: 130px !important;
    }
    .logo_footer{
        margin: 0 auto;
    }

}

/* Desktop medio MD */
@media (min-width: 992px) and (max-width: 1199px) { 
    .col-8{
        width: 12.5% !important;
        float: left;
    }

    .somente-mobile{display: none !important;}
    .somente-desktop{display: block !important;}

    .portfolio-1{background-image: url(../image/1_laranja.png); transition: background-image 1s;}
    .portfolio-2{background-image: url(../image/2_laranja.png); transition: background-image 1s;}
    .portfolio-3{background-image: url(../image/3_laranja.png); transition: background-image 1s;}
    .portfolio-4{background-image: url(../image/4_laranja.png); transition: background-image 1s;}
    .portfolio-5{background-image: url(../image/5_laranja.png); transition: background-image 1s;}
    .portfolio-6{background-image: url(../image/6_laranja.png); transition: background-image 1s;}

    .portfolio-1:hover{background-image: url(../image/1_original.png); transition: background-image 1s;}
    .portfolio-2:hover{background-image: url(../image/2_original.png); transition: background-image 1s;}
    .portfolio-3:hover{background-image: url(../image/3_original.png); transition: background-image 1s;}
    .portfolio-4:hover{background-image: url(../image/4_original.png); transition: background-image 1s;}
    .portfolio-5:hover{background-image: url(../image/5_original.png); transition: background-image 1s;}
    .portfolio-6:hover{background-image: url(../image/6_original.png); transition: background-image 1s;}

    #desde{
        margin-top: 30%;
    }

    #carousel-example-generic {
        position: absolute;
    }

    .txt-parallax{
        padding-top: 130px !important;
    }

    .logo_footer{
        float: right;
    }

}

/* Desktop grande LG */
@media (min-width: 1200px) { 
    .col-8{
        width: 12.5% !important;
        float: left;
    }

    .somente-mobile{display: none !important;}
    .somente-desktop{display: block !important;}


    .portfolio-1{background-image: url(../image/1_laranja.png); transition: background-image 1s;}
    .portfolio-2{background-image: url(../image/2_laranja.png); transition: background-image 1s;}
    .portfolio-3{background-image: url(../image/3_laranja.png); transition: background-image 1s;}
    .portfolio-4{background-image: url(../image/4_laranja.png); transition: background-image 1s;}
    .portfolio-5{background-image: url(../image/5_laranja.png); transition: background-image 1s;}
    .portfolio-6{background-image: url(../image/6_laranja.png); transition: background-image 1s;}

    .portfolio-1:hover{background-image: url(../image/1_original.png); transition: background-image 1s;}
    .portfolio-2:hover{background-image: url(../image/2_original.png); transition: background-image 1s;}
    .portfolio-3:hover{background-image: url(../image/3_original.png); transition: background-image 1s;}
    .portfolio-4:hover{background-image: url(../image/4_original.png); transition: background-image 1s;}
    .portfolio-5:hover{background-image: url(../image/5_original.png); transition: background-image 1s;}
    .portfolio-6:hover{background-image: url(../image/6_original.png); transition: background-image 1s;}


    #carousel-example-generic {
        position: absolute;
    }

    #desde{
        margin-top: 30%;
    }

    .txt-parallax{
        padding-top: 130px !important;
    }

    .logo_footer{
        float: right;
    }
}

.carousel-control.left, .carousel-control.right{
    background: none !important;
}
.carousel-control {
    width: 50%;
}


/* cores */

.laranja{color: #f08c3e;}
.bg-laranja{background: #f08c3e;}
.branco{color: #fff;}
.cinza{color: #606060;}
.cinza-claro{color: #c5c5c5;}

/* Fontes */

body, p, span, h1, h2, h3, h4, h5, h6{
    font-family: 'Open Sans', sans-serif !important;
}

.fs-17{
    font-size: 17px;
    font-weight: 100;
}

/* banner */
.topo_bandeira{
    border-top: 10px solid #f08c3e;
}
.logo_bandeira{
    width: 26%;
    margin-left: 37%;
    margin-top: -10px;
}

.logo_bandeira_2{
    width: 250px;
    margin: 0 auto;

}

#carousel-example-generic{
    /* position: absolute; */
    top: 10px;
    z-index: 1;
}
#bandeira_logo{
    z-index: 2;
    position: relative;
}


/* Parallax */

#parallaxBar{
    height:550px;
    background-color:#004c82;
    background: url(../image/parallax.jpg) 50% 0 fixed;
    position: relative; 
    border-top: 5px solid #f08c3e;	
    border-bottom: 5px solid #c5c5c5;
}
.separador{
    width: 200px;
    height: 3px;
    background: #fff;
    margin: 0 auto;
}

/* Mapa */

.mapa_1{
    background: url(../image/mapa_bg_a.jpg);
    background-size: 100%;
    border-top: 5px solid #f08c3e;	
}

.mapa_2{
    background: url(../image/mapa_bg_b.jpg);
    background-size: 100%;
    border: none;
}
/*.mapa_2 img{
    position: relative;
    -webkit-animation-name: example;
    -webkit-animation-duration: 4s; 
    animation-name: example;
    animation-duration: 1s;
    animation-iteration-count:infinite; 
}*/


/* Safari 4.0 - 8.0 */
@-webkit-keyframes example {
    0%   {left:0px; top:0px;}
    50%  {left:0px; top:5px;}
    100% {left:0px; top:0px;}
}

/* Standard syntax */
@keyframes example {
    0%   {left:0px; top:0px;}  
    50%  {left:0px; top:5px;}
    100% {left:0px; top:0px;}
}


.mapa_3{
    background: url(../image/mapa_bg_c.jpg);
    background-size: 100%;
    border-bottom: 5px solid #c5c5c5;
}

/* Portfolio */

.item-portfolio{
    background-repeat: no-repeat !important;
    background-size: 100% !important;
    border:5px solid #fff;
}

.btn-1{
    color: #fff;
    border: 1px solid #fff;
    border-radius: 20px;
    width: 140px;
    transition: 0.5s;
}
.btn-1:hover{
    color: #f08c3e;
    border: 1px solid #fff;
    background-color: #fff;
    transition: 0.5s;
}

/* Certificação  */
.certificacao .col-8{
    height: 100px;
}

/* Formulario */
.btn-2{
    color: #fff;
    border: 1px solid #fff;
    border-radius: 0px;
    width: 120px;
    background-color: transparent;
}
.btn-2:hover{
    color: #fff;
}

.tabela thead{
    background-color: #f08c3e;
    color: #fff;
    font-weight: bold;
}

.modal-content {
    border:5px solid #f08c3e !important;
    border-radius: 6px;
}

#uti-das-ideias {
    width: 150px;
    height: 25px;
    color: transparent;
    text-indent: -9999px;
    border-radius: 8px 8px 0 0;
    background-image: url(../image/uti-icon.png);
    background-repeat: no-repeat;
    background-position: 109px 3px;
    background-color: #292929;
    font-size: 1px;
    font-weight: 400;
    font-family: Arial, Helvetica, sans-serif;
    display: block;
    position: relative;
    left: 50%;
    bottom: 0;
    margin-left: -85px
}

#uti-das-ideias:before {
    content: 'desenvolvido por';
    position: absolute;
    font-size: 10px;
    color: #dbdada;
    text-indent: 0;
    top: 7px;
    right: 49px
}

#uti-das-ideias:hover:before {
    content: 'UTI das Ideias';
    right: 49px
}

.linguagens{
    position: absolute;
    top: 35px;
    display: inline-flex;
    right: 0px;
    z-index: 3;
}

.linguagens a{
    padding: 4px;
    width: 40%;
    height: 100%;
}

.linguagens a img{
    max-width: 80%;
}

.linguagens-mobile{
    display: flex;
    margin: 0 auto;
    width: 80px;
}

.linguagens-mobile a{
    margin: 0 5px;
}