@import url('https://fonts.googleapis.com/css?family=Poppins:200,300,400,500,600,700,800,900&display=swap');

*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: "Poppins", sans-serif;
}


::-webkit-scrollbar {
    width: 14px;
    height: 14px;
}
::-webkit-scrollbar-button {
    width: 0px;
    height: 0px;
}
::-webkit-scrollbar-thumb {
    background: #dda800;
    border: 0px none #000;
    border-radius: 50px;
}
::-webkit-scrollbar-thumb:hover {
    background: #dda800;
}
::-webkit-scrollbar-thumb:active {
    background: #dda800;
}
::-webkit-scrollbar-track {
    background: #333;
    border: 0px none #ffffff;
}
::-webkit-scrollbar-corner {
    background: transparent;
}

html{
    scroll-behavior: smooth;
}
body{
    min-height: 1000px;
    width: 100%;
    background: #fff;
}

.boxTop{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 30px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 5px 30px;
    z-index: 1000;
    transition: 0.6s;
    border-bottom: 1px solid rgba(0,0,0,0.1);
    z-index: 1001; 
    background: #333;   
}
.boxTop .bxLeft{    
    text-align: left;
    width: 50%;
}
.boxTop .bxRight{    
    text-align: right;
    width: 50%;
}
.boxTop a{
    color: #fff;
    padding-right: 10px;
    text-decoration: none;
    text-align: center;
}
.boxTop h2{
    color: #fff;
    padding-right: 10px;
    padding-top: 3px;
    text-decoration: none;    
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    float: left;
}
.boxTop span{
    color: #fff;
    padding-right: 10px;
    text-decoration: none;
    text-align: center;
    font-size: 12px;
}
.boxTop i{
     font-size: 18px;
}
.boxTop .sci{
    display: grid;
    grid-template-columns: repeat(4, 30px);
    grid-gap: 10px;
    float: right;
}
.boxTop .sci li{
    list-style: none;
}
.boxTop .sci li a{
    display: inline-block;
    width: 58px;
    height: 58px;
    display: grid;
    align-content: center;
    justify-content: center;
    text-decoration: none;
    color: #fff;
}
.boxTop .sci li a:hover{
    color: #ddd;
}
.boxTop .sci li i {
    font-size: 20px;
}

header{
    position: fixed;
    top: 0;
    left: 0;
    margin-top: 30px;
    width: 100%;   
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0px 50px;
    z-index: 1000;
    transition: 0.6s;
    background: #000;
}
header .logo{
    position: relative;
    transition: 0.6s;
}
header .logo img{
    width: 200px;
}
header ul{
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
}
header ul li{
    position: relative;
    list-style: none;
    margin: 0 12px;
    text-align: center;
}
header ul li a{
    position: relative;
    text-decoration: none;
    color: #fff;
    font-size: 0.8em;
    letter-spacing: 2px;
    font-weight: 500;
    text-align: center;
    transition: 0.6s;
}

.banner{
    position: relative;
    width: 100%;
    min-height: 100vh;
    background: url('../images/banner.jpg');
    background-size: cover;
    display: flex;    
    align-items: flex-end;
}
.banner .content{
    position: relative;
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-left: 30px;
    margin-bottom: 90px;
}
.banner .content .textBox{
    position: relative;
    max-width: 600px;
}
.banner .content .textBox h2{
    color: #fff;
    font-size: 3em;
    line-height: 1em;
    font-weight: 700;
    text-transform: uppercase;
    text-shadow: 3px 3px 2px #000;
}
.banner .content .textBox h3{
    color: #aaa;
    font-size: 2em;
    line-height: 1em;
    font-weight: 700;
    text-transform: uppercase;
}
.banner .content .textBox p{
    color: #fff;
    font-size: 1.2em;
}

.banner .btn{
    position: absolute;
    width: 100%;
    height: 50px;
}
.banner .btn a{
    position: absolute;
    top: -20px;
    left: 20px;
    width: 210px;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background: rgba(255,255,255,0.5);
    box-shadow: 0 15px 35px rgba(0,0,0,0.2);
    border-top: 1px solid rgba(255,255,255,0.1);
    border-bottom: 1px solid rgba(255,255,255,0.1);
    border-radius:  30px;
    color: #fff;
    z-index: 1;
    font-weight: 400;
    letter-spacing: 1px;
    text-decoration: none;
    overflow: hidden;
    transition: 0.5s;
    backdrop-filter: blur(15px);
}
.banner .btn a::before{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 50%;
    height: 100%;
    background: linear-gradient(to left, rgba(255,255,255,0.15), transparent);
    transform: skewX(45deg) translateX(0);
    transition: 0.5s;
}
.banner .btn:hover a::before{
    transform: skewX(45deg) translateX(100px);
}
.banner .btn a i{
    font-size: 40px;
    padding: 10px;
}

.about{
    position: relative;
    justify-content: center;
    display: flex;
    align-items: center;
    min-height: 140vh;
    background: #f9ff4c;
    padding-top: 20px;
}
.about::before{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 50%;
    height: 100%;
    background: #f9ff4c;
}
.about .container{
    position: relative;
    min-width: 90%;
    height: 500px;
    display: flex;
}
.about .container .photoinfo{
    position: absolute;
    top: 30px;
    z-index: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    
}
.about .container .photoinfo img{
    width: 350px;
    margin-bottom: 20px;
    box-shadow: 0 20px 20px rgba(0, 0, 0, 0.2);
}
.about .container .aboutForm{
    position: absolute;
    padding: 70px 50px;
    background: #fff;
    margin-left: 150px;
    padding-left: 250px;
    width: calc(100% - 150px);
    box-shadow: 0 50px 50px rgba(0, 0, 0, 0.5);   
    height: 500px;
}
.about .container .aboutBox{
    height: 440px;
    overflow: auto;
    margin-top: -40px;
}
.about .container .aboutForm h2{
    color: #dda800;
    font-size: 2em;
    font-weight: 800;
    text-transform: uppercase;
}
.about .container .aboutForm h3{
    color: #000;
    
    font-size: 24px;
    text-transform: uppercase;
    font-family: "Verdana", sans-serif;
}
.about .container .aboutForm span{
    color: #000;
    font-size: 14px;
    text-transform: uppercase;
    font-family: "Verdana", sans-serif;
}



.galeria_fotos{
    background: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
}
.galeria_fotos .content{
    position: relative;
    text-align: center;
    width: 100%;
    margin-top: 10px;
}
.galeria_fotos .portfolioBx{
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
}
.galeria_fotos .portfolioBx .card{
    position: relative;
    width: 30%;
    height: 300px;
    margin: 10px;
    overflow: hidden;
    box-shadow: 0 5px 15px rgba(0,0,0,0.2);
    border: 15px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.galeria_fotos .portfolioBx .card img{
    height: 300px;   
}





.videos_institucional{
    background: #333;
    padding: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.videos_institucional .content{
    position: relative;
    text-align: center;
    width: 100%;
}
.videos_institucional .content .box{
    max-width: 800px;
    margin: 0 auto;
}
.videos_institucional .content .box h3{
    font-size: 40px;
    font-weight: 200;
    margin-bottom: 10px;
    color:#fff;
}
.videos_institucional .titleBox{
    max-width: 800px;
    margin: 0 auto;
}
.videos_institucional .videoBox{
    position: relative;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    grid-gap: 30px;
    max-width: 100%;
    margin-top: 40px;
}
.videos_institucional .videoBox .box{
    margin: 0 auto;
    box-shadow: 0 15px 30px rgba(0,0,0,0.05);
}
.videos_institucional .videoBox .box video{
    width: 100%;
}


.services{
    background: #fff;
    padding: 100px;
    min-height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
}
.services .content{
    position: relative;
    text-align: center;
    width: 100%;
    margin-top: 60px;
}
.services .content .box{
    max-width: 800px;
    margin: 0 auto;
}
.services .content .box h3{
    font-size: 40px;
    font-weight: 200;
    margin-bottom: 10px;
}
.services .content .box p{
    position: relative;
    font-size: 18px;
    font-weight: 300;
    margin-bottom: 20px;
    letter-spacing: 1px;
}
.services .boxServices{
    position: relative;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    grid-gap: 30px;
    max-width: 100%;
    margin-top: 40px;
}
.services .boxServices .bx{
    width: 200px;
    margin: 0 auto;
    background: #fff;
    padding: 10px;
    box-shadow: 0 15px 30px rgba(0,0,0,0.05);
}
.services .boxServices .bx:hover{
    background: #fff999;
    margin-top: -20px;
    transition: 0.5s;
}
.services .boxServices .bx .iconBx{
    margin-top: 10px;
}
.services .boxServices .bx .iconBx img{
   width: 180px;
}
.services .boxServices .bx .iconBx i{
    font-size: 80px;
 }
.services .boxServices .bx h2{
    font-size: 16px;
    margin-bottom: 10px;
    text-transform: uppercase;
    font-weight: 700;
}
.services .boxServices .bx a{
    text-decoration: none;
    color: #000;
}


.portfolio{
    background: #333;
    padding: 100px;
    min-height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
}
.portfolio .content{
    position: relative;
    text-align: center;
    width: 100%;
    margin-top: 60px;
}
.portfolio .content .box{
    max-width: 800px;
    margin: 0 auto;
}
.portfolio .content .box h3{
    font-size: 40px;
    font-weight: 200;
    margin-bottom: 10px;
    color: #fff;    
}
.portfolio .content .box p{
    position: relative;
    font-size: 18px;
    font-weight: 300;
    margin-bottom: 20px;
    letter-spacing: 1px;
    color: #fff;    
}
.portfolio .portfolioBx{
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    margin: 40px 0;
}
.portfolio .portfolioBx .card{
    position: relative;
    width: 300px;
    height: 400px;
    margin: 20px;
    overflow: hidden;
    box-shadow: 0 5px 15px rgba(0,0,0,0.2);
    border: 15px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.portfolio .portfolioBx .card .content{
    position: absolute;
    bottom: 0px;
    width: 100%;
    height: 160px;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 10;
    flex-direction: column;
    backdrop-filter: blur(15px);
    box-shadow: 0 -10px 10px rgba(0,0,0,0.1);
    border: 1px solid rgba(255,255,255,0.2);
}
.portfolio .portfolioBx .card .content .contentBx h3{
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-weight: 500;
    font-size: 18px;
    text-align: center;
    margin: 0 0 20px;
    line-height: 1.1em;    
}
.portfolio .portfolioBx .card .content .contentBx span{
    font-size: 12px;
    color: #fff;
}
.portfolio .portfolioBx .card .content .sci{
    position: relative;
    bottom: 10px;
    display: flex;
}
.portfolio .portfolioBx .card .content .sci a{
    list-style: none;
    margin: 0 10px;
    color: #fff;
    font-size: 14px;
    list-style: none;
    text-decoration: none;
    transform: translateY(40px);
    transition: 0.5s;
    opacity: 0;
    transition-delay: calc(0.2s * var(--i));
}
.portfolio .portfolioBx .card:hover .content .sci a{
    transform: translateY(0px);
    opacity: 1;
}

.conteudo{
    position: relative;
    justify-content: center;
    display: flex;
    align-items: center;
    min-height: 140vh;
    background: #dda800;
    padding-top: 20px;
}
.conteudo::before{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 50%;
    height: 100%;
    background: #dda800;
}
.conteudo .container{
    position: relative;
    min-width: 90%;
    height: 500px;
    display: flex;
}
.conteudo .container .photoinfo{
    position: absolute;
    top: 30px;
    z-index: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    background: #fff;
}
.conteudo .container .photoinfo img{
    width: 350px;
    margin-bottom: 20px;
    box-shadow: 0 20px 20px rgba(0, 0, 0, 0.2);
}
.conteudo .container .photoinfo i{
    font-size: 200px;
    color: #000;
    padding: 20px;
}
.conteudo .container .aboutForm{
    position: absolute;
    padding: 70px 50px;
    background: #fff;
    margin-left: 150px;
    padding-left: 250px;
    width: calc(100% - 150px);
    box-shadow: 0 50px 50px rgba(0, 0, 0, 0.5);   
    height: 500px;
}
.conteudo .container .aboutBox{
    height: 440px;
    overflow: auto;
    margin-top: -40px;
}
.conteudo .container .aboutForm h2{
    color: #dda800;
    font-size: 2em;
    font-weight: 800;
    text-transform: uppercase;
}
.conteudo .container .aboutForm h3{
    color: #000;
    
    font-size: 24px;
    text-transform: uppercase;
    font-family: "Verdana", sans-serif;
}
.conteudo .container .aboutForm span{
    color: #000;
    font-size: 14px;
    text-transform: uppercase;
    font-family: "Verdana", sans-serif;
}


.team{
    background: #fff;
    padding: 100px;
    min-height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
}
.team .content{
    position: relative;
    text-align: center;
    width: 100%;
    margin-top: 60px;
}
.team .content .box{
    max-width: 800px;
    margin: 0 auto;
}
.team .content .box h3{
    font-size: 40px;
    font-weight: 200;
    margin-bottom: 10px;
}
.team .content .box p{
    position: relative;
    font-size: 18px;
    font-weight: 300;
    margin-bottom: 20px;
    letter-spacing: 1px;
}
.team .teamBx{
   position: relative;
   display: grid;
   grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
   grid-gap: 30px;
   max-width: 100%;
   margin-top: 40px; 
}
.team .teamBx .member{
    position: relative;
    min-height: 300px;
    width: 300px;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    align-items: center;
}
.team .teamBx .member .imgBx{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    box-shadow: 0 50px 50px rgba(0, 0, 0, 0.5);  
    -webkit-border-radius: 10px 10px 10px 10px;
    border-radius: 10px 10px 10px 10px;
}
.team .teamBx .member .imgBx img{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    -webkit-border-radius: 10px 10px 10px 10px;
    border-radius: 10px 10px 10px 10px;
}
.team .teamBx .member .details{
    position: absolute;
    width: 80%;
    height: 100px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #333;
    margin-top: 320px;
    -webkit-border-radius: 10px 10px 10px 10px;
    border-radius: 10px 10px 10px 10px;
}
.team .teamBx .member .details h2{
    color: #fff;
    text-transform: uppercase;
    font-size: 16px;
    letter-spacing: 1px;
    font-weight: 800;
    padding: 10px;
    padding-left: 15px;
    padding-right: 15px;
}
.team .teamBx .member .details h2 span{
    display: block;
    font-size: 10px;
    font-weight: 500;
    padding-left: 15px;
    padding-right: 15px;
}


.clientes{
    background: #000;
    padding: 160px;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.clientes .content{
    position: relative;
    text-align: center;
}
.clientes .content .box{
    width: 100%;
    margin: 0 auto;
}
.clientes .content .box h3{
    font-size: 40px;
    font-weight: 200;
    margin-bottom: 10px;
    color: #fff;
}
.clientes .content .box p{
    position: relative;
    font-size: 18px;
    font-weight: 300;
    color: #fff;
}
.clientesBx{
   position: relative;  
   width: 100%;
   margin-bottom: 60px;
   margin-top: -100px;
}


.parceiros{
    background: #fff;
    padding: 100px;
    min-height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
}
.parceiros .content{
    position: relative;
    text-align: center;
    width: 100%;
    margin-top: 60px;
}
.parceiros .content .box{
    max-width: 800px;
    margin: 0 auto;
}
.parceiros .content .box h3{
    font-size: 40px;
    font-weight: 200;
    margin-bottom: 10px;
}
.parceiros .content .box p{
    position: relative;
    font-size: 18px;
    font-weight: 300;
    margin-bottom: 20px;
    letter-spacing: 1px;
}
.parceiros .boxParceiros{
    position: relative;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    grid-gap: 30px;
    max-width: 100%;
    margin-top: 80px;
}
.parceiros .boxParceiros .bx{
    width: 200px;
    margin: 0 auto;
    background: #fff;    
}
.parceiros .boxParceiros .bx:hover{
    margin-top: -20px;
    transition: 0.5s;
}
.parceiros .boxParceiros .bx .iconBx{
    margin-top: 25px;
    margin-bottom: 25px;
}
.parceiros .boxParceiros .bx img{
    max-width: 200px;
    box-shadow: 0 15px 30px rgba(0,0,0,0.05);
}
.parceiros .boxParceiros .bx h2{
    font-size: 16px;
    margin-bottom: 10px;
    text-transform: uppercase;
    font-weight: 700;
}



.video{
    background: #fff;
    padding: 100px;
    min-height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
}
.video .content{
    position: relative;
    text-align: center;
    width: 100%;
    margin-top: 60px;
}
.video .content .box{
    max-width: 800px;
    margin: 0 auto;
}
.video .content .box h3{
    font-size: 40px;
    font-weight: 200;
    margin-bottom: 10px;
}
.video .content .box p{
    position: relative;
    font-size: 18px;
    font-weight: 300;
    margin-bottom: 20px;
    letter-spacing: 1px;
}
.video .titleBox{
    max-width: 800px;
    margin: 0 auto;
}
.video .videoBox{
    position: relative;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    grid-gap: 30px;
    max-width: 100%;
    margin-top: 40px;
}
.video .videoBox .box{
    margin: 0 auto;
    box-shadow: 0 15px 30px rgba(0,0,0,0.05);
}
.video .videoBox iframe {    
    width: 100%;
    height: 300px;
}


.testimonial{
    background: #000;
    padding-top: 100px;
    padding-right: 20px;
    padding-left: 20px;
    padding-bottom: 100px;
    min-height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
}
.testimonial .content{
    position: relative;
    text-align: center;
    width: 100%;
    margin-top: 60px;
}
.testimonial .content .box{
    width: 100%;
    margin: 0 auto;
}
.testimonial .content .box h3{
    font-size: 40px;
    font-weight: 200;
    margin-bottom: 10px;
    color: #fff;
}
.testimonial .content .box p{
    position: relative;
    font-size: 18px;
    font-weight: 300;
    margin-bottom: 20px;
    letter-spacing: 1px;
    color: #fff;
}
.testimonial .boxTestimonial{
    position: relative;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(500px, 1fr));
    grid-gap: 30px;
    width: 100%;
    margin-top: 40px;
}
.testimonial .boxTestimonial .bx{
    width: 500px;
    margin: 0 auto;   
    padding: 20px;
    box-shadow: 0 15px 30px rgba(0,0,0,0.05);
    background-image: url('../images/depoimento.jpg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;  
}
.testimonial .boxTestimonial .bx p{
    color: #fff;
    font-style: italic;
    font-size: 16px;
    font-weight: 300;
}
.testimonial .boxTestimonial .bx h3{
    text-align: end;
    color: #fff;
    font-style: italic;
    font-size: 16px;
    line-height: 1em;
    margin-top: 10px;
}



footer{
    position: relative;
    width: 100%;
    height: auto;
    padding: 50px 100px;
    background: #777;
}
footer .container{
    width: 100%;
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr;
    grid-gap: 20px
}
footer .container .sec h2{
    position: relative;
    color: #fff;
    font-weight: 500;
    margin-bottom: 15px;
}
footer .container .sec h2::before{
    content: '';
    position: absolute;
    bottom: -5px;
    left: 0;
    width: 50px;
    height: 2px;
    background: #333;
}
footer .container .sec p{
    color: #fff;
    font-size: 15px;
}
footer .container .sci{
    margin-top: 20px;
    display: grid;
    grid-template-columns: repeat(4, 95px);
    grid-gap: 10px;
}
footer .container .sci li{
    list-style: none;
}
footer .container .sci li a{
    display: inline-block;
    width: 90px;
    height: 90px;
    background: #333;
    display: grid;
    align-content: center;
    justify-content: center;
    border-radius: 4px;
    text-decoration: none;
}
footer .container .sci li a:hover{
    background: #888;    
}
footer .container .sci li a img{
    width: 80px;
}
footer .container .sci li a .fa{
    color: #fff;
    font-size: 40px;
}
footer .container .quicklinks{
    position: relative;
}
footer .container .quicklinks li{
    list-style: none;
}
footer .container .quicklinks li a{
    color: #f7f7f7;
    text-decoration: none;
    margin-bottom: 10px;
    display: inline-block;
}
footer .container .quicklinks li a:hover{
    color: #333;
}
footer .container .info{
    position: relative;
}
footer .container .info li{
    display: grid;
    grid-template-columns: 50px 1fr;
    margin-bottom: 16px;
    font-size: 16px;
}
footer .container .info li span:nth-child(1){
    color: #fff;
    font-size: 30px;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
}
footer .container .info li span{
    color: #fff;
    font-size: 15px;
}
footer .container .info li a{
    color: #f7f7f7;
    text-decoration: none;
}
footer .container .info li a:hover{
    color: #333;
}

.contact{
    background: #000;
    padding: 50px;
    min-height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
}
.contact .content{
    position: relative;
    text-align: center;
    width: 100%;
    margin-top: 100px;
}
.contact .content .box{
    max-width: 800px;
    margin: 0 auto;
}
.contact .content .box h3{
    font-size: 40px;
    font-weight: 200;
    margin-bottom: 10px;
    color: #fff;
}
.contact .content .box p{
    position: relative;
    font-size: 18px;
    font-weight: 300;
    margin-bottom: 20px;
    letter-spacing: 1px;
    color: #fff;
}
.contact .contactBox{
    position: relative;
    max-width: 800px;
    margin: 0 auto;
    display: flex;
}
.contact .contactBox form{
    width: 100%;
}
.contact .contactBox .row100{
    display: flex;
    width: 100%;
}
.contact .contactBox .row100 .inputBx50{
    width: 50%;
    margin: 0 20px;
}
.contact .contactBox .row100 .inputBx100{
    width: 100%;
    margin: 0 20px;
}
.contact .contactBox .row100 input,
.contact .contactBox .row100 textarea{
    position: relative;
    border: none;
    border-bottom: 1px solid #fff;
    color: #fff;
    background: transparent;
    width: 100%;
    padding: 10px 0;
    outline: none;
    font-size: 18px;
    font-weight: 300;
    margin: 20px 0; 
    resize: none;  
}
.contact .contactBox .row100 textarea{
    height: 100px;
}
.contact .contactBox .row100 input::placeholder,
.contact .contactBox .row100 textarea::placeholder{
    color:rgba(255,255,255,0.5);
}
.contact .contactBox .row100 input[type='submit']{
    background: #fff;
    color: #000;
    max-width: 200px;
    text-transform: uppercase;
    letter-spacing: 1px;
    cursor: pointer;
    font-weight: 500;
    border-radius: 20px;
    -webkit-box-shadow: 2px 1px 1px 1px #333;
    box-shadow: 2px 1px 1px 1px #333;
}
.g-recaptcha{
    position: relative;
    display: flex;    
    justify-content: center;
    align-items: center;
}
.contact .networks{
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 30px 0;
}
.contact .networks ul{
    display: flex;
}
.contact .networks ul li{
    list-style: none;
}
.contact .networks ul li a{
    text-decoration: none;
    display: inline-block;
    margin: 0 5px;
}
.contact .networks ul li a img{
    width: 150px;
}
.contact .networks ul li a i{
    color: #fff;
    font-size: 60px;
}
.contact .networks ul li a:hover i{
    opacity: 0.5;
}

.credit{
    background: #fff;
    width: 100%;
    height: 80px;
    padding-top: 10px;
}
.credit .box{
    width: 50%;
    float: left;
    background: #fff;
    height: 80px;
}
.credit .box .cadeado{
    padding-left: 30px;
    margin-top: 10px;
}
.credit .box .copyright{
    color: #000;
    text-align: left;
    padding-left: 30px;
    font-size: 16px;
}
.credit .box .copyright a{
    color: #333;
}
.credit .box .credit{
    color: #000;
    text-align: right;
    padding-right: 30px;
    font-size: 16px;
}
.credit .box .credit a{
    color: #333;
}


    @media (max-width: 992px){
        .toggle{
            display: block;
            position: relative;
            width: 30px;
            height: 30px;
            cursor: pointer;
        }
        .toggle::before{
            content: '';
            position: absolute;
            top: 4px;
            width: 100%;
            height: 2px;
            background: #fff;
            z-index: 1;
            box-shadow: 0 10px 0 #fff;
            transition: 0.5s;
        }
        .toggle::after{
            content: '';
            position: absolute;
            bottom: 4px;
            width: 100%;
            height: 2px;
            background: #fff;
            z-index: 1;
            transition: 0.5s;
        }

        .boxTop span{            
            font-size: 0px;
        }
        .boxTop h2{            
            font-size: 0px;
        }
        .boxTop i{
             font-size: 0px;
        }

        header{
            padding: 5px 50px;
            background: #000;
        }
        header ul{
            position: absolute;
            top: 110px;
            left: 0;
            width: 100%;
            height: 100vh;
            text-align: center;
            overflow: auto;
            background: #fff;
            visibility: hidden;
            opacity: 0;
            transition: 1s;
        }
        header.active ul{
            visibility: visible;
            opacity: 1;
            display: block;
            padding-top: 10px;
        }
        header.active ul li a{
            display: inline-block;
            margin: 10px 0;
            font-size: 15px;
        }
        
        header .logo,
        header ul li a{
            color: #000;
        }
        header .logo img{
            width: 150px;
        }

        .banner{
            background-position: center;
            min-height: 80vh;
        } 
        .banner .content{
            margin-bottom: 180px;
        }
        .banner .content .textBox h2{            
            font-size: 1.5em;            
        }
        .banner .content .textBox h3{            
            font-size: 1em;            
        }
        .banner .content .textBox p{
            font-size: 1em;
        }
        .banner .btn{
            margin-bottom: 40px;
        }

        .about{
            position: relative;
            justify-content: center;
            display: flex;
            align-items: center;
            min-height: 110vh;
        }
        .about::before{
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 50%;
            height: 100%;
        }
        .about .container{
            position: relative;
            min-width: 90%;
            height: 300px;
            display: flex;
        }
        
        .about .container .photoinfo img{
            width: 0px;
        }
        .about .container .aboutForm{
            position: absolute;
            padding: 50px 30px;
            background: #fff;             
            height: 500px;
            margin-top: -90px;
            margin-left: -1px;
            width: 100%;
        }  
        
       
        .galeria_fotos .portfolioBx .card{            
            width: 100%;            
        }


        .services{
            padding: 100px 50px 50px 50px;
        }
        .services .boxServices{ 
            width: 100%;            
        }  

        .portfolio{
            padding: 100px 50px 50px 50px;
        }


        .conteudo{
            position: relative;
            justify-content: center;
            display: flex;
            align-items: center;
        }
        .conteudo::before{
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 50%;
            height: 100%;
        }
        .conteudo .container{
            position: relative;
            min-width: 90%;
            height: 1100px;
            display: flex;
        }
        .conteudo .container .photoinfo{
            position: absolute;
            z-index: 1;
            width: 230px;
            margin: 0 auto;
        }
        .conteudo .container .photoinfo img{
            max-width: 180px;
            margin-top: 80px;
        }

        .conteudo .container .aboutForm{
            position: absolute;
            padding: 50px 30px;
            background: #fff;             
            height: 650px;
            margin-top: 400px;
            margin-left: -1px;
            width: 100%;
        }   
        .conteudo .container .aboutBox{
            height: 620px;            
        }   
        .conteudo .container .aboutForm h2{            
            font-size: 1.2em;            
        }



        .team{
            padding: 100px 50px 50px 50px;
        }

        .team .teamBx .member{
            margin-bottom: 100px;
        }

        .video .videoBox iframe {    
            width: 300px;
            height: 250px;
            margin-left: -150px;
        }

        .testimonial .boxTestimonial{            
            grid-template-columns: repeat(auto-fit, minmax(100%, 1fr));           
        }
        .testimonial .boxTestimonial .bx{
            width: 100%;          
        }        

        footer{
            padding: 40px;
        }
        footer .container{
            grid-template-columns: repeat(2, 1fr);
        }
        footer .container .info li{            
            font-size: 14px;
        }
        footer .container .sec p{            
            width: 80%;
        }
        

        .contact{
            padding: 100px 50px 50px 50px;
        }
        .contact .row100{
            flex-direction: column;
        }
        .contact .contactBox .row100 .inputBx50,
        .contact .contactBox .row100 .inputBx100{
            width: 100%;
            margin: 0;
        }
        .contact .networks ul li a img{
            width: 100px;
        }

        .credit .box .copyright{            
            font-size: 12px;
        }
        .credit .box .credit{            
            font-size: 12px;
        }
    }

    @media (max-width: 768px){
        footer .container{
            grid-template-columns: repeat(1, 1fr);
        }
    }

    

/* Scroll Top */
.whatsapp{
    position: fixed;
    bottom: 800px;
    right: 0px;
    width: 110px;
    height: 110px;
    background: url("../images/redes_sociais/whatapp.png");
    background-size: 100px;
    background-position: center;
    background-repeat: no-repeat;
    cursor: pointer;
    z-index: 100000;
    visibility: hidden;
    opacity: 1;
    transition: 1s;
} 
.whatsapp.active{
    bottom: 10px;
    visibility: visible;
    opacity: 1;
}

    @media (max-width: 992px){
        .whatsapp{            
            right: 50px; 
            width: 100px;
            height: 100px;       
        } 
    }