*{
    font-family: 'Tahoma', sans-serif;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

a, i{
    transition: .5s;
    text-decoration: none;
}

.bg-color1{
    background-color: #252525;
}

.bg-color2{
    background-color: #ffffff;
}

.bg-color3{
    background-color: #939393;
}

.color-1{
    color: #252525;
}

.color-2{
    color: #ffffff;
}

.color-3{
    color: #939393;
}

#page-container {
    position: relative;
    min-height: 100vh;
}
  
#content-wrap {
    padding-bottom: 2.5rem;
}

/* whatsapp */
.icon-whatsapp{
    transition: .4s;
    position: fixed;
    bottom: 40px;
    right: 30px;
    font-size: 30px;
    background-color: #01e675;
    color: #ffffff;
    border-radius: 50%;
    padding: 2px;
    width: 50px;
    height: 50px;
    text-align: center;
    text-decoration: none;
    z-index: 100;
    box-shadow: 2px 2px 2px #c0bdbd;
}

.icon-whatsapp:hover{
    transition: .4s;
    background-color: #fff;
    color: #029e3b;
    padding: 0;
    font-weight: 900;
    box-shadow: 2px 2px 20px #5fe690;
}

/* navbar */
.navbar{
    border-bottom: 5px solid #939393;
}

.navbar-brand{
    margin-left: .3em;
}

#logo-navbar{
    height: 70px;
    width: 100px;
    cursor: pointer;
}

#navbar-items a{
    color: #939393;
}

#navbar-items a:hover{
    color: #252525;
}

.navbar-text:hover,
.navbar-brand:hover{
    cursor: default;
    user-select: none;
}

.offcanvas-header{
    border-bottom: 1px solid #252525;
}

#navbar-social i{
    font-size: 30px;
}

.navbar-toggler{
    border: none;
}

@media (max-width: 768px) {
    #nav-download{
        display: none;
    }
}

@media (max-width: 992px) {
    #logo-navbar{
        height: 70px;
        width: 80px;
    }

    #navbar-social #facebook{
        margin-left: .32em;
    }

    #navbar-social #instagram{
        margin-left: .3em;
    }
    
    #navbar-social #linkedin{
        margin-left: .3em;
    }

    .navbar-text{
        display: none;
    }
}

@media (min-width: 992px) {
    .navbar{
        opacity: .9;
    }

    .navbar-nav li{
        margin-top: .3em;
        font-size: 22px;
    }


    #navbar-social i{
        font-size: 30px;
        margin: .2em;
    }
}

/* banner */
#banner{
    padding-left: 0;
    padding-right: 0;
    cursor: pointer;
    transition: .5s;
}

/* serviços e produtos */
#servicos-container h1,
#servicos-container i{
    padding: 20px 5px 12px 5px;
    font-size: 30px;
    font-weight: 400;
}

#servicos-container{
    margin-bottom: 2.1em;
}

#banner-servicos{
    cursor: pointer;
    transition: .5s;
}

#list-servicos{
    font-size: 18px;
    font-weight: 400;
}

#list-servicos p{
    text-align: center;
    font-size: 19px;
    font-weight: 500;
    color: #252525;
}

#list-servicos i{
    text-align: center;
    font-size: 18px;
    font-weight: lighter;
    color: #939393;
    padding: 0;
}

#title-list,
#title-list i{
    text-align: start;
    font-size: 19px;
    color: #252525;
    padding-top: 0;
}

@media (max-width: 768px) {
    #servicos-container h1,
    #servicos-container i{
        font-size: 25px;
    }

    #banner-servicos{
        margin-bottom: 1em;
    }

    #title-list,
    #title-list i{
        font-size: 16px;
    }

    #list-servicos {
        text-align: start;
        font-size: 15px;
    }

    #list-servicos i{
        font-size: 14px;
    }
}

@media (max-width: 1200px) {
    #servicos-container h1,
    #servicos-container i{
        text-align: center;
    }

    #list-servicos {
        margin-top: .4em;
    }

    #title-list {
        margin-top: .4em;
    }
}

/* informações */
#informacoes-container h1,
#informacoes-container i{
    padding: 30px 5px 10px 5px;
    font-size: 30px;
    font-weight: 400;
}

#informacoes-container h2{
    font-size: 25px;
}

#informacoes-container p{
    font-size: 16px;
}

#informacoes-container h1,
#informacoes-container .col-md-6,
#informacoes-container .col-12{
    margin-bottom: 50px;
}

.small-image-container{
    margin-bottom: 20px;
}

#informacoes-container{
    margin-top: .1em;
    margin-bottom: 1em;
}

@media (max-width: 768px) {
    #informacoes-container h1,
    #informacoes-container i{
        padding: 20px 5px 0px 5px;
        font-size: 25px;
        font-weight: 400;
    }

    #informacoes-container h2{
        font-size: 20px;
    }
    
    #informacoes-container p{
        font-size: 16px;
    }

    #informacoes-container{
        margin-bottom: .5em;
    }
}

/* footer */
#footer{
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 2.5rem;   
}

#footer-links-container{
    border-top: 1px solid #939393;
    border-bottom: 1px solid #939393;
}

#footer .footer-column{
    padding: 2em;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}

#footer-links-container h3,
#footer-center h3{
    margin-bottom: 25px;
    text-transform: uppercase;
    color: #939393;
}

#footer-links-container li{
    font-size: .9em;
    text-align: center;
}

#footer-links-container a:hover{
    color: #939393;
}

#footer-center{
    border-left: 1px solid #939393;
    border-right: 1px solid #939393;
}

#footer-center li{
    font-size: .9em;
    color: #ffffff;
}

#footer-center i{
    color: #ffffff;
    font-weight: bold;
}

.localizacao{
    font-size: .9em;
}

@media (min-width: 768px) {
    #footer .footer-column{
        padding: 1.5em 1.5em;
    }
}

@media (max-width: 768px) {
    #footer-center{
        border-left: 0;
        border-right: 0;
    } 

    #footer-links-container{
        padding-top: 1em;
        border-top: 1px solid #ffffff;
    }
}

@media (max-width: 922px) {
    #footer .footer-column{
        padding: 1em 1em;
    }
}

/* redes sociais */
#redes-sociais i{
    font-size: 1.5em;
    margin: 10px;
    cursor: pointer;
    justify-content: space-between;
}

#facebook{
    color: #3b5998;
}

#facebook:hover{
    color: #284075;
}

#instagram{
    color: #E1306C;   
}

#instagram:hover{
    color: #ba124a;
}

#linkedin{
    color: #0e76a8;  
}

#linkedin:hover{
    color: #055a81;
}

#youtube{
    color: #c4302b;
}

#youtube:hover{
    color: #8f1a16;  
}

/* copyright */
#copy-container{
    text-align: center;
    padding: 15px;
    background-color: #252525;
}

#copy-container p{
    margin-top: .6em;
    color: #939393;
    cursor: default;
    user-select: none;
    font-weight: 400;
}

/* sobre nós */
#sobre-nos{
    margin-bottom: 5em;
}

#sobre-nos h1,
#sobre-nos i{
    padding: 15px 5px 10px 5px;
    font-size: 30px;
    font-weight: 400;
    text-align: center;
}

#frase-sobre{
    font-weight: 400;
    font-size: 13px;
    color: #939393;
    margin-top: 2.6em;
    cursor: default;
    user-select: none;
}

#text-sobre{
    font-size: 18px;
}

#text-sobre p{
    text-align: center;
}

#container-sobre{
    background-color: #252525;
    height: 180px;
    margin-top: 1.5em;
    border-radius: 0;
}

#container-sobre .card-body{
    padding-bottom: 5em;
}

#container-sobre p{
    font-size: 16px;
    color: #ffffff;
    text-align: start;
    font-weight: 500;
    padding: 0;
}

#img-sobre{
    border: 2px solid #939393;
}

@media only screen 
    and (width: 414px) 
    and (height: 896px) 
    and (-webkit-device-pixel-ratio: 2) 
    { 
        #img-sobre{
            margin-top: .5em;
        }
    }

@media (max-width: 768px){
    #sobre-nos h1,
    #sobre-nos i{
        padding: 35px 5px 10px 5px;
    }
}

@media (min-width: 768px) {
    #sobre-nos{
        margin-top: 1em;
        margin-bottom: 5em;
    }

    #text-sobre{
        font-size: 18px;
    }
}

@media (min-width: 1200px) {
    #sobre-nos h1,
    #sobre-nos i,
    #text-sobre p{
        text-align: start;
    }
}

@media (max-width: 1200px){
    #frase-sobre{
        margin-top: .1em;
    }
}

/* tecnologias */
#tecnologias-title h1,
#tecnologias-title i{
    padding: 30px 5px 15px 5px;
    font-size: 30px;
    font-weight: 400;
    text-align: center;
}

#tecnologias-desc{
    text-align: start;
    margin-bottom: 5em;
}

#accordion-tecnologias{
    margin-bottom: 2em;
    font-size: 18px;
}

#accordion-tecnologias a{
    color: #939393;
}

#accordion-tecnologias a:hover{
    margin-left: .2em;
    color: #0dcaf0;
    transition: .4s;
}

@media (min-width: 576px) {
    #quebra-linha-sql{
        display: none;
    }
}

@media (max-width: 992px) {
    #tecnologias-title{
        margin-top: .5em;
    }
}
    
@media(min-width: 1400px){
    #tecnologias-title h1,
    #tecnologias-title i{
        text-align: start;
    }
}

/* downloads */
#download{
    margin-top: .2em;
}

#download h1,
#download i{
    padding: 30px 5px 0px 5px;
    font-size: 30px;
    font-weight: 400;
}

#download a{
    font-size: 25px;
    text-decoration: none;
    color: #939393;
    transition: .3s;
}

#download a:hover{
    margin-left: .3em;
    margin-right: .3em;
    text-decoration: solid;
    color: #0dcaf0;
}

/* contato */
#contato-title h1,
#contato-title i{
    padding: 30px 5px 10px 5px;
    font-size: 30px;
    font-weight: 400;
    text-align: center;
}

#contato-desc {
    text-align: center;
    padding: 10px;
}

#text-contato i,
#text-contato li{
    font-size: 18px;
    font-weight: 400;
}

#text-contato li{
    border: 1px solid #939393;
}

@media (max-width: 992px) {
    #contato-title{
        margin-top: .5em;
    }

    #text-contato{
        border-right: 0;
        padding-bottom: 2.3em;
    }    

    #text-contato i,
    #text-contato li{
        font-size: 18px;
    }
}

@media(min-width: 1200px){
    #text-contato{
        padding-top: 2.5em;
    }
}

@media (min-width: 1400px) {
    #contato-title h1,
    #contato-title i{
        text-align: start;
    }

    #text-contato{
        padding-top: 3.1em;
    }
}