@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@700&display=swap');



:root {

    --main: #005472;

    --sub: #c6453a;

}

body {

    margin:0;

    font-family: 'Nunito', sans-serif;

    position: relative;

    padding-bottom: 250px;

    min-height: 90%;

}

html {

    height: 90%;

    box-sizing: border-box;

  }



  *,

  *:before,

  *:after {

    box-sizing: inherit;

  }



.navbar{

    background-color: white;
    font-size: large;

}

.add-shadow{

  box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px

}

.nav-item{

    margin: 5px;

}

.navbar .contato{

    background-color: var(--main);

    width: 100px;

    border: var(--main) 1px solid;

    transition: 0.2s;

    text-align: center;

}

.navbar .contato:hover,

.navbar .contato:focus {

  box-shadow: inset 0 -3.25em 0 0 white;

}



.navbar .contato a{

    color: white!important;

}

.navbar .contato a:hover{

    color: var(--main)!important;

}

.banner{

  background-image: url("/img/banner-home.png");

  height: 100vh;

  background-position: center;

  background-repeat: no-repeat;

  background-size: cover;

  display: flex;

  align-items: center; /* align vertical */

}

.banner h1{

    font-weight: bold;

    font-family: 'Oswald', sans-serif;

    font-size: 60px;

}



.banner button{

    margin-top: 30px;

}



.banner p {

    font-size: 18px;

    max-width: 650px;

    margin-top: 20px;

    color: gray;

}



.numbers{

    margin-top: -80px;

}



.numbers .card{

    box-shadow: 0 10px 20px rgba(0,0,0,.12), 0 4px 8px rgba(0,0,0,.06);

    padding: 20px;

}

.numbers h1{

    font-weight: bold;

    color: rgb(56, 56, 56);

}

.numbers i{

    font-size: 60px!important;

}

.banner p span{

    font-weight: bold;

    color: var(--sub);

    border-right: var(--sub) solid 3px;

}



.banner p span {

    animation: animated-cursor 600ms steps(29,end) infinite;

}



@keyframes animated-cursor{

    from{border-right-color: var(--sub);}

    to{border-right-color: transparent;}

}



.btn-secondary{

    border-radius: 0px;

    height: 45px;

    width: 100px;

}



.btn-primary{

    transition: 0.3s;

    background-color: var(--main);

    border-color: var(--main);

    border-radius: 0px;

    height: 45px;

    width: 200px;

}

.btn-primary:hover{

    background-color: white!important;

    color: var(--main);

    border-color: var(--main);

    box-shadow: inset 0 -3.25em 0 0 white;

}

.owl-stage-outer{

    height: 290px;

    padding-top: 20px;

}

.card-solucao{

    max-width: 230px;

    max-height: 240px;

    height: 240px;

    cursor: pointer;

    border-radius: 0px;

    transition: 0.2s;

    border: none;

    box-shadow: 0 10px 20px rgba(0,0,0,.05), 0 4px 8px rgba(0,0,0,.06);

}

.card-solucao:hover{

    transform: scale(1.01);

    box-shadow: 0 10px 20px rgba(0,0,0,.12), 0 4px 8px rgba(0,0,0,.06);

    color: black;

}

.card-solucao p{

    font-size: 14px;

    color: gray;

}

.card-solucao h5{

    font-weight: bold;

    color: rgb(109, 109, 109);

}

.card-solucao img{

    height: 100px;

    width: 100px!important;

    margin-left: 65px;

    margin-top: 10px;

}

a{

    text-decoration: none;

    color: rgb(12, 12, 12);

}

a:hover{

    color: var(--main);

}



.container-solucoes-home{

    margin-top: 150px;

}

.container-solucoes-home h3{

    font-weight: bold;

}

.container-versoes-home{

    margin-top: 150px;

}

.container-versoes-home h3{

    font-weight: bold;

}

.container-versoes-home .card{

    box-shadow: 0 10px 20px rgba(0,0,0,.1), 0 4px 8px rgba(0,0,0,.06);

    border: none;

    height: 100%;

    transition: 0.2s;

}

.container-versoes-home .card:hover{

    transform: scale(1.01);

    box-shadow: 0 10px 20px rgba(0,0,0,.12), 0 4px 8px rgba(0,0,0,.06);

    color: black;

}

.container-versoes-home .card-title{

    font-weight: bold;

}

.container-versoes-home .card-text{

    font-size: 13px;

    color: gray;

}

.container-versoes-home small{

    font-size: 12px;

}

.container-solicite-orcamento-home{

    margin-top: 200px;

    margin-bottom: 150px;

}

.container-solicite-orcamento-home button{

    border-color: var(--main);

    color: white;

    transition: 0.2s;

    padding: 10px;

    width: 200px;

    margin-top: 10px;

    font-size: 16px;

    border-radius: 0px;

    background-color: var(--main);

}

.container-solicite-orcamento-home button:hover{

    border-color: var(--main);

    color: var(--main);

    background-color: white;

}

.container-solicite-orcamento-home h3{

    font-weight: bold;

}

.container-solicite-orcamento-home p{

    color: gray;

}

.container-blog-home{

    margin-top: 50px;

    margin-bottom: 80px;

}

.container-blog-home h2{

    font-weight: bold;

}

.container-blog-home p{

    color: gray;

}

.container-blog-home .col-lg{

    margin-bottom: 20px;

}

.container-blog-home .card{

    width: 100%;

    height: 100%;

    overflow: hidden;

    margin: 0 auto;

    float: none;

    margin-left: 0px;

    transition: 0.4s;

}

.container-blog-home .card:hover{

    transform: scale(1.01);

    box-shadow: 0 10px 20px rgba(0,0,0,.12), 0 4px 8px rgba(0,0,0,.06);

}

.container-blog-home .card-text {

    word-wrap: break-word;

}

footer{

    border-top: rgb(212, 212, 212) solid 1px;

    background-color: white;

    padding: 30px;

    height: 200px;

    width: 100%;

    position: absolute;

    right: 0;

    bottom: 0;

    left: 0;

}



footer .col{

    padding-right: 50px;

    margin-top: 25px;

    padding-bottom: 25px;

}

footer h1{

    color: rgb(46, 46, 46);

    font-weight: bold;

    font-size: 18px;

    margin-bottom: 15px;

}

footer small{

    color: rgb(175, 175, 175);

    font-size: 14px;

}

footer p{

    margin-left: 40px;

    font-size: 14px;

    color: rgb(124, 124, 124);

}

footer a{

    margin-right: 20px;

}

footer span{

    font-size: 19px!important;

}

.fas, .fab{

    float:left;

    font-size: 25px;

    color: rgb(48, 48, 48)!important;

}

.show-solucao{

    margin-top: 150px;

    margin-bottom: 50px;

    text-align: justify;

}

.show-solucao h1{

    font-weight: bold;

}

.show-solucao button{

    margin-top: 20px;

}

.show-solucao a{

    float: left;

}

.show-solucao button{

    width: 250px;

    height: 45px;

}

.contato-page{

    margin-top: 180px;

    margin-bottom: 50px;

}

.contato-page span{

    font-size: 25px;

}

.contato-page h5{

    margin-bottom: 40px;

}

.contato-page p{

    color: gray;

    font-size: 15px;

}

.contato-page img{

    width: 100%;

}

.dropdown-item:focus, .dropdown-item:hover, .dropdown-item:active{

    background-color: rgb(231, 231, 231);

    color: black;

}

.show-solucao .col-sm{

    margin-bottom: 10px;

}

.container-categoria{

    margin-top: 110px;

}

.container .col-lg-3{

    margin-bottom: 20px;

}

.container-categoria .card{

    width: 100%;

    height: 100%;

    min-width: 100%;

    min-height: 100%;

    transition: 0.2s;

}

.container-categoria img{

    width: 90px;

    height: 90px;

    position: absolute;

    left:50%;

    transform: translate(-50%, 0);

    margin-top: 35px;

}

.card-img{

    height: 100px;

    margin-bottom: 30px;

}

.container-categoria .card:hover{

    transform: scale(1.00);

    box-shadow: 0 10px 20px rgba(0,0,0,.12), 0 4px 8px rgba(0,0,0,.06);

}

.container-categoria .card-text{

    color: gray;

}

.container-categoria h3{

    margin-left: 40px;

}

.container-categoria .row{

    margin-top: 40px;

}

.container-manuais-page{

    margin-top: 110px;

}

.container-manuais-page .card{

    margin-bottom: 20px;

}

.container-manuais-page i{

    margin-top: 45%;

    margin-left: 10px;

}

.container-manuais-page .col-1{

    width: 60px!important;

}

.container-manuais-page .card-text{

    color: rgb(90, 90, 90);

}

.container-manuais-page h1{

    margin-bottom: 20px;

}

.btn-download{

    cursor: pointer;

    font-size: 30px;

    margin-top: 32%!important;

    margin-right: 20px!important;

}

.container-faq-page{

    margin-top: 120px;

}

.container-faq-page h5{

    margin-left: 30px;

}

.question{

    margin-top: 40px;

    border: solid rgb(231, 231, 231) 1px;

    padding: 20px;

    padding-bottom: 0px;

    border-radius: 5px;

}

.container-versoes-page{

    margin-top: 120px;

}

.container-versoes-page .w-5{

        display: none;

}

.container-versoes-page  .card{

    margin-bottom: 20px;

}

.container-versoes-page select{

    margin-bottom: 30px;

}

.navigation{

    margin-top: 20px;

}

.page-link{

    color: rgb(85, 85, 85);

}

.page-item.active .page-link{

background-color: var(--main);

border-color: var(--main);

}

.container-parceiro{

    margin-top: 150px;

    margin-bottom: 150px;

}

.container-parceiro .d-md-block{

    display: flex!important;

}

.container-parceiro img{

 width: 300px;

 margin: auto;

}

.container-parceiro .col-sm{

    margin-bottom: 40px;

}

.parceiro-certifico{

    padding: 10px;

    padding-bottom: 0px;

    width: 210px;

    margin-bottom: 50px;

}

.parceiro-certifico i{

    margin-top: 3px;

}

.parceiro-certifico p{

    font-size: 16px;

    margin-top: 8px;

    margin-left: 40px;

}

.container-parceiro .btn-primary{

    margin-top: 50px!important;

}

.container-planos{

    margin-top: 140px;

    overflow-x: auto;

    white-space: nowrap;

}



.container-planos thead{

    background-color: rgb(243, 243, 243);

}

.table>:not(:first-child){

    border-top: none!important;

}

.container-planos td{

    width: 100px;

}

.container-planos table{

    margin-top: 50px;

}

.container-planos a{

    color: #009dd6;

}

.pacote{

    width: 350px!important;

}

.fa-check{

    color: rgb(130, 189, 130)!important;

}

.fa-times{

    color: rgb(160, 74, 74)!important;

}

.container-postagens{

    margin-top: 130px;

}

.container-postagens .card-img-top {

    width: 100%;

    height: 300px;

    object-fit: cover;

    object-position: top;

}

.container-postagens .card{

    transition: 0.2s;

}

.container-postagens .card:hover{

    box-shadow: 0 10px 20px rgba(0,0,0,.12), 0 4px 8px rgba(0,0,0,.06);

}

.postagem{

    margin-top: 30px;

}

.container-postagem{

    margin-top: 130px;

}

.data-postagem{

    background-color: rgb(228, 228, 228);

    width: 135px;

    padding: 8px;

    border-radius: 5px;

    margin-bottom: 10px;

    margin-top: 10px;

    margin-right: 15px;

    text-align: center;

}

.data-postagem small{

    margin-left: 10px;

    font-size: 13px;



}

.data-postagem span{

    font-size: 22px;

    margin-left: 5px;

}

.link-postagem{

    background-color: var(--main);

    width: 90px;

    padding: 8px;

    border-radius: 5px;

    margin-bottom: 50px;

    margin-top: 10px;

    transition: 0.2s;

}

.link-postagem small{

    margin-left: 10px;

    font-size: 13px;

    color: white;

}

.link-postagem span{

    font-size: 22px;

    color: white!important;

    margin-left: 5px;

}

.link-postagem:hover{

    background-color: #014158;

    color: black;

}

.texto-postagem{

    text-align: justify;

    margin-top: 30px;

    margin-bottom: 100px;

}

.container-postagem .card-img-top {

    width: 100%;

    height: 200px;

    object-fit: cover;

    object-position: top;

}

.container-postagem .card-text{

    font-size: 14px;

    color: gray;

}

.container-postagem .col-sm-2{

    max-width: 150px;

    width: 150px;

}

.container-postagem .card-title{

    font-size: 17px;

}

.container-postagem .card{

    transition: 0.2s;

}

.container-postagem .card:hover{

    box-shadow: 0 10px 20px rgba(0,0,0,.12), 0 4px 8px rgba(0,0,0,.06);

}

.container-conheca{

    margin-top: 130px;

    margin-bottom: 90px;

    text-align: justify;

}

.container-conheca i{

    font-size: 30px;

    margin-right: 10px;

}

.active{

    color: rgb(46, 46, 46)!important;

}

.email .container{

    background-color: white;

    padding: 0px;

    box-shadow: 0 10px 20px rgba(0,0,0,.05), 0 4px 8px rgba(0,0,0,.06);

    max-width: 1000px;

    text-align: justify;

}

.email h1{

    font-weight: bold;

}

.email small{

    color: rgb(97, 97, 97);

    font-size: 12px;

}

.body-email{

    padding: 30px;

}

.float{

	position: fixed;

    z-index: 100;

	width:60px;

	height:60px;

	bottom:40px;

	right:40px;

	background-color:#0C9;

	color:#FFF;

	border-radius:50px;

	text-align:center;

    box-shadow: 0 10px 20px rgba(0,0,0,.12), 0 4px 8px rgba(0,0,0,.06);

}

.float i{

    color: white!important;

    font-size: 30px;

    margin-top: 15px;

    margin-left: 17px;

}

.btn-form{

    padding: 10px !important;

}
