html {
  scroll-behavior: smooth;
}

section {
   overflow: hidden;
   overscroll-behavior: none;
}

@font-face {
    font-family: "Regular";
    src: url('../fontes/GothamLight.otf');
}

.meio {
	margin: auto;
}

.wppvoa {
    display: flex;
    background: #25d366;
    color: #fff;
    text-decoration: none;
    text-align: center;
    width: fit-content;
    padding: 10px;
    border-radius: 5px;
    position: fixed;
    z-index: 999;
    bottom: 20px;
    left: 20px;
    animation: 1.5s ease 0s infinite normal none running pisca;
}

.wppvoa:hover {
    text-decoration: none;
    color: #fff;
}

.wppvoa:hover i {
    transform: rotate(360deg);
}

.wppvoa i {
    font-size: 25px;
    margin: 0 5px;
    transition: .5s;
}

@keyframes pisca{
    0% {
        -webkit-transform:scale(0.9);
        -ms-transform:scale(0.9);
        transform:scale(0.9);
        }
    70% {
        -webkit-transform:scale(1);
        -ms-transform:scale(1);
        transform:scale(1);
        box-shadow:0 0 0 25px #ffff0000;
        }
    100%{
        -webkit-transform:scale(0.9);
        -ms-transform:scale(0.9);
        transform:scale(0.9);
        box-shadow:0 0 0 0 #ffff0000;
    }
}

.header {
    padding: 15px 0;
    font-family: 'Open Sans';
    border-top: 12px solid #58CD8B;
}

.header .logo a img {
    width: 100%;
}

.header nav {
    display: flex;
    justify-content: space-between;
}

.header nav a {
    text-decoration: none;
    color: #000;
}

.header a.whats {
    background: #24B23B;
    padding: 10px 0;
    color: #fff;
    text-decoration: none;
    border-radius: 5px;
    display: block;
    text-align: center;
}

.header .links {
    align-self: center;
}

.header span {
    display: block;
    color: #033A42;
    text-align: center;
}

.header a {
    display: block;
    text-decoration: none;
    color: #033A42;
    margin: auto;
    text-align: center;
}

.header a:hover {
    text-decoration: none;
}

.dropbtn {
  font-size: 16px;
  border: none;
}

.dropdown {
  position: relative;
  display: flex;
}

.dropdown-content {
    font-family: 'Open Sans';
    display: none;
    position: absolute;
    background-color: #21BD64;
    min-width: 670px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 999;
    padding: 30px 30px;
    border-radius: 0 0 10px 10px;
    top: 44px;
}

.dropdown-content .linha {
    width: 100%;
}

.dropdown-content h6 {
    font-weight: 800;
    color: #fff;
    font-size: 16px;
}

.dropdown-content a {
  padding: 5px 0px !important;
  text-decoration: none;
  display: block;
  transition: .5s;
}

.dropdown-content a:hover {
    text-decoration: none;
    color: #fff;
    border: none !important;
}

.dropdown:hover .dropdown-content {
    display: block;
}

.menu {
    background: #033A42;
    font-family: 'Open Sans';
}

.menu nav a {
    color: #fff;
    padding: 10px 0;
    transition: .1s;
}

.menu nav a:hover {
    text-decoration: none;
    padding: 8px 0;
    border-bottom: 4px solid #58CD8B;
}

.menu nav a.active {
    text-decoration: none;
    padding: 8px 0;
    border-bottom: 4px solid #58CD8B;
}

.menu nav {
    display: flex;
    width: 100%;
    justify-content: space-between;
    padding: 0px 0;
}

.menu .app {
    display: flex;
    align-content: center;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 0 10px;
}

.menu .app span {
    color: #21BD64;
    font-weight: 600;
}

.menu .app a {
    background: #022B31;
    padding: 2px 7px;
    border-radius: 5px;
    color: #fff;
}

.infobanner {
    height: 435px;
    font-family: 'Open Sans';
    display: flex;
    align-items: center;
}

.infobanner.bannernome {
    background: url(../img/banner-nome.webp);
    background-size: 100%;
    background-repeat: no-repeat;
}

.infobanner.banner1 {
    background: url(../img/banner-inicio.webp);
    background-size: 100%;
    background-repeat: no-repeat;
}

.infobanner.banner2 {
    background: url(../img/banner-inicio-2.webp);
    background-size: 100%;
    background-repeat: no-repeat;
}

.infobanner.banner3 {
    background: url(../img/banner-inicio-3.webp);
    background-size: 100%;
    background-repeat: no-repeat;
}

.infobanner h1 {
    color: #fff;
    font-size: 40px;
    margin: 0px 0 20px;
    font-weight: 700;
}

.infobanner h1 b {
    color: #00682F;
}

.infobanner h6 {
    color: #21bd64;
    display: block;
    width: fit-content;
    border-top: 4px solid #21bd64;
    padding: 10px 0 0;
    font-weight: bold;
}

.infobanner a {
    color: #fff;
    background: #21BD64;
    text-decoration: none;
    font-size: 16px;
    display: block;
    width: 55%;
    align-items: center;
    gap: 0;
    padding: 5px 10px;
    border-radius: 5px;
    text-align: center;
    transition: .5s;
}

.infobanner a:hover {
    text-decoration: none;
    color: #fff;
    transform: scale(1.1);
}

.infobanner a:hover i {
    padding: 0 5px;
}

.infobanner a i {
    font-size: 16px;
    transition: .5s;
}

.infobanner p {
    color: #fff;
}

#benner{
    position: relative;
}

#benner ul.redes {
    position: absolute;
    top: 7%;
    left: 50px;
    list-style: none;
    padding: 0;
    z-index: 9;
}

#benner .carousel-control-prev {
    position: absolute !important;
    width: 5%;
    background: white;
    height: 50px;
    border-radius: 0 10px 10px 0;
    display: flex;
    top: 40%;
}

#benner .carousel-control-prev span.seta {
    clip-path: polygon(100% 50%, 0 0, 0 100%);
    display: block;
    width: 20px;
    height: 20px;
    background: #21BD64;
    opacity: 1;
    transform: rotate(180deg);
    color: white;
}

#benner .carousel-control-next {
    position: absolute;
    width: 5%;
    background: white;
    height: 50px;
    border-radius: 10px 0 0 10px;
    display: flex;
    top: 40%;
}

#benner .carousel-control-next span.seta {
    clip-path: polygon(100% 50%, 0 0, 0 100%);
    display: block;
    width: 20px;
    height: 20px;
    background: #21BD64;
    opacity: 1;
    transform: rotate(0deg);
    color: white;
}

@keyframes sobedesce {
    0% {
        top: 0;
    }
    50% {
        top: -15px;
    }
    100% {
        top: 0px;
    }
}

#benner ul.redes li a {
    color: #fff;
    text-decoration: none;
    font-size: 20px;
    text-align: center;
    display: block;
}

#benner ul.redes:after {
    content: '';
    display: block;
    width: 1px;
    height: 150px;
    background: #fff;
    margin: auto;
}

#benner ul.redes:before {
    content: '';
    display: block;
    width: 1px;
    height: 150px;
    background: #fff;
    margin: auto;
}

.sobre {
    padding: 80px 0;
    font-family: 'Open Sans';
    position: relative;
}

.sobre span {
    background: #21BD64;
    width: 200px;
    height: 5px;
}

.sobre h1 {
    color: #033A42;
    font-weight: 800;
}

.sobre p {
    color: #033A42;
}

.sobre img.maior {
    position: absolute;
    width: 78%;
    margin: auto;
    right: 0;
    left: 0;
    bottom: -80px;
}

.sobre img.fundo {
    position: absolute;
    bottom: -245px;
    left: -110px;
}

.sobre a {
    color: #fff;
    background: #21BD64;
    text-decoration: none;
    font-size: 16px;
    display: block;
    width: 55%;
    align-items: center;
    gap: 0;
    padding: 5px 10px;
    border-radius: 5px;
    text-align: center;
    transition: .5s;
}

.sobre a:hover {
    text-decoration: none;
    color: #fff;
    transform: scale(1.1);
}

.sobre a:hover i {
    padding: 0 5px;
}

.sobre i {
    transition: .5s;
}

.servicos {
    padding: 80px 0;
    font-family: 'Open Sans';
    background: url(../img/background-servicos.webp);
    background-size: 100%;
    background-repeat: no-repeat;
}

.servicos img {
    width: 100%;
    display: block;
    margin: 0 0 10px;
}

.servicos .titulo {
    margin: 0 auto 30px;
}

.servicos .titulo span {
    display: block;
    background: #21BD64;
    width: 200px;
    height: 10px;
    margin: 0 auto 10px;
}

.servicos .titulo h1 {
    text-align: center;
    font-weight: 800;
    color: #033A42;
    margin: 0 0 20px;
}

.servicos .titulo h2 {
    text-align: center;
    font-weight: 600;
    color: #033A42;
    margin: 0 0 20px;
    font-size: 20px;
}

.servicos a {
    text-decoration: none;
    margin: 0 0 20px;
    display: block;
}

.servicos a:hover {
    text-decoration: none;
}

.servicos h4 {
    font-size: 20px;
    text-decoration: none;
    color: #033a42;
    font-weight: 800;
}

.servicos p {
    color: #033A42;
}

.chamada {
    font-family: 'Open Sans';
    background: url(../img/banner-meio.webp);
    background-size: cover;
    background-repeat: no-repeat;
}

.chamada span {
    display: block;
    background: #022B31;
    width: 130px;
    height: 10px;
    margin: 0 0 10px;
}

.chamada h1 {
    font-weight: 800;
    color: #fff;
}

.chamada p {
    color: #fff;
}

.chamada a {
    color: #fff;
    background: #022B31;
    text-decoration: none;
    font-size: 16px;
    display: block;
    width: 55%;
    align-items: center;
    gap: 0;
    padding: 5px 10px;
    border-radius: 5px;
    text-align: center;
    transition: .5s;
}

.chamada a:hover {
    text-decoration: none;
    color: #fff;
    transform: scale(1.1);
}

.chamada a:hover i {
    padding: 0 5px;
}

.chamada i {
    transition: .5s;
}

.chamada .texto {
    height: 370px;
    align-self: center;
    display: flex;
    flex-wrap: wrap;
    align-content: center;
    align-items: center;
}

.equipa {
    padding: 80px 0;
    font-family: 'Open Sans';
    background: url(../img/letras.webp);
    background-position: top left;
    background-size: 45%;
    background-repeat: no-repeat;
}

.equipa .col-md-6 {
    align-self: center;
}

.equipa iframe {
    width: 100%;
    height: 300px;
    border-radius: 10px;
}

.equipa h1 {
    color: #033A42;
    font-weight: 800;
}

.equipa h5 {
    color: #033A42;
    font-weight: 800;
    margin: 0 0 30px;
}

.equipa h5 img {
    width: 200px;
}

.equipa p {
    color: #033A42;
}

.equipa a {
    color: #fff;
    background: #58CD8B;
    text-decoration: none;
    font-size: 16px;
    display: block;
    width: 55%;
    align-items: center;
    gap: 0;
    padding: 5px 10px;
    border-radius: 5px;
    text-align: center;
    transition: .5s;
}

.equipa a:hover {
    text-decoration: none;
    color: #fff;
    transform: scale(1.1);
}

.equipa a:hover i {
    padding: 0 5px;
}

.equipa i {
    transition: .5s;
}

.rodape {
    padding: 80px 0;
    font-family: 'Open Sans';
    background: #426B71;
    color: #fff;
}

.rodape .fone {
    padding: 20px 0;
    border-bottom: 2px solid #033A42;
    margin: 0;
}

.rodape .fone i.tel {
    background: #58CD8B;
    width: 80px;
    display: flex;
    text-align: center;
    height: 80px;
    align-content: center;
    justify-content: center;
    align-items: center;
    font-size: 35px;
    border-radius: 10px;
    margin: auto;
    transform: rotate(90deg);
}

.rodape .fone h2 {
    font-weight: 800;
}

.rodape .fone .col-md-8 {
    align-self: center;
}

.rodape .fone .col-md-3 {
    align-self: center;
}

.rodape .fone a {
    color: #fff;
    background: #58CD8B;
    text-decoration: none;
    font-size: 16px;
    display: block;
    width: 100%;
    align-items: center;
    gap: 0;
    padding: 5px 10px;
    border-radius: 5px;
    text-align: center;
    transition: .5s;
}

.rodape .fone a:hover {
    color: #fff;
    text-decoration: none;
    transform: scale(1.1);
}

.rodape .fone a:hover i {
    padding: 0 5px;
}

.rodape .fone i {
    transition: .5s;
}

.rodape .logos {
    margin: 30px 0;
}

.rodape .logos img {
    width: 100%;
}

.rodape span {
    display: block;
    font-weight: 800;
}

.rodape .links {
    margin: 20px 0 0;
}

.rodape .links a {
    display: block;
    color: #fff;
    margin: 0 0 10px;
    width: fit-content;
    text-decoration: none;
    transition: .5s;
}

.rodape .links a:hover {
    color: #fff;
    text-decoration: none;
    padding: 0 10px;
}

.rodape .links a.app {
    display: flex;
    width: fit-content;
    background: #022B31;
    padding: 20px;
    flex-wrap: wrap;
    gap: 0 15px;
    text-decoration: none;
    border-radius: 10px;
    align-items: center;
    margin: 10px 0;
    transition: .5s;
}

.rodape .links a.app:hover {
    background: #58CD8B;
}

.rodape .links a.app b {
    display: block;
}

.rodape .links a.app i {
    font-size: 40px;
}

.wecan {
    font-family: 'Open Sans';
    background: #365F65;
    color: #fff;
}

.wecan p {
    padding: 10px 0;
    margin: 0;
    text-align: center;
}

.wecan a {
    font-family: 'Libre Franklin';
    font-weight: 600;
    color: #fff;
    text-decoration: none;
    transition: 1s;
}

.wecan a:hover {
    box-shadow: inset 70px 0 0 black;
    color: white;
    text-decoration: none;
}

.wecan a span {
    font-family: 'Poppins';
    color: gold;
    font-size: 20px;
    line-height: 0px;
}

.apresenta {
    font-family: 'Open Sans';
    padding: 0px 0 !important;
    color: #fff;
    position: relative;
}

.apresenta .caixa {
    position: absolute;
    width: 80%;
    left: 0;
    right: 0;
    margin: auto;
    top: 35%;
    z-index: 5;
}

.apresenta img.fundo {
    width: 100%;
    z-index: 0;
    top: 0;
    position: relative;
}

.apresenta span {
    display: block;
    background: #21BD64;
    width: 100px;
    height: 5px;
    margin: 0 auto 10px;
}

.apresenta h1 {
    text-align: center;
    font-size: 30px;
    text-transform: uppercase;
}

.historia {
    font-family: 'Open Sans';
    padding: 80px 0;
    margin: 80px 0;
    background: #58CD8B;
    color: #fff;
    position: relative;
}

.historia span {
    background: #033A42;
    width: 8px;
    bottom: 80px;
    left: -20px;
    height: 170px;
    display: block;
    position: absolute;
}

.historia h1 {
    font-weight: 900;
}

.missao {
    padding: 80px 0;
    font-family: 'Open Sans';
    color: #033A42;
}

.missao .row {
    width: 100%;
    margin: 20px 0;
}

.missao .row .col-md-9 {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    align-content: center;
}

.missao h2 {
    font-size: 20px;
    font-weight: 900;
}

.missao img {
    display: block;
    margin: auto;
}

.gvc {
    padding: 80px 0;
    font-family: 'Open Sans';
    background: url(../img/letras-solucoes.webp);
    background-position: center;
    background-repeat: no-repeat;
}

.gvc .caixa {
    background: #033A42;
    width: 100%;
    border-radius: 10px;
    padding: 40px;
    position: relative;
}

.gvc .caixa:after {
    content: '';
    display: block;
    background: #21BD64;
    width: 100px;
    height: 4px;
    border-radius: 5px;
    position: absolute;
    bottom: -2px;
    left: 0;
    right: 0;
    margin: auto;
}

.gvc .caixa img {
    width: 100%;
}

.insta {
    padding: 80px 0;
    font-family: 'Open Sans';
    background: url(../img/background-servicos.webp);
    background-size: 100%;
    background-repeat: no-repeat;
    margin: 30px 0;
}

.insta h1 {
    color: #033A42;
    font-weight: 800;
    text-align: center;
}

.insta .titulo {
    margin: 0 auto 30px;
}

.insta p {
    color: #033A42;
    text-align: center;
}

.insta ul {
    margin: auto;
    display: flex;
    width: 200px;
    justify-content: space-between;
    list-style: none;
    padding: 0;
}

.insta ul li a {
    color: #21BD64;
    text-decoration: none;
    font-size: 20px;
}

.insta .caixa {
    background: #58CD8B;
    display: block;
    width: 100%;
    height: 250px;
}

.tdserv {
    padding: 40px 0;
    margin: 40px 0;
    font-family: 'Open Sans';
}

.tdserv img {
    display: block;
    margin: 0 auto 20px;
    width: 100%;
}

.tdserv .texto {
    display: flex;
    align-items: center;
}

.tdserv.esquerda {
    background: url(../img/background-servicos.webp);
    background-repeat: no-repeat;
    background-size: cover;
}

.tdserv .texto h1 {
    color: #033A42;
    font-weight: 800;
}

.tdserv .texto p {
    color: #033A42;
}

.tdserv .texto label {
    display: block;
    width: 130px;
    height: 10px;
    background: #58cd8b;
}

.tdserv .texto a {
    color: #fff;
    background: #58CD8B;
    text-decoration: none;
    font-size: 16px;
    display: block;
    width: fit-content;
    align-items: center;
    gap: 0;
    padding: 5px 30px;
    border-radius: 5px;
    text-align: center;
    transition: .5s;
}

.tdserv .texto a:hover {
    transform: scale(1.1);
}

.aplicativo {
    padding: 80px 0;
    font-family: 'Open Sans';
    background: url(../img/banner-app.webp);
    background-size: cover;
    background-repeat: no-repeat;
    color: #fff;
}

.aplicativo {
    padding: 80px 0;
    font-family: 'Open Sans';
    background: url(../img/banner-app.webp);
    background-size: cover;
    background-repeat: no-repeat;
    color: #fff;
}

.aplicativo .col-md-6 {
    align-self: center;
}

.aplicativo label {
    background: #21bd64;
    width: 100px;
    height: 10px;
    display: block;
}

.aplicativo h1 {
    font-weight: 800;
    font-size: 30px;
    margin-bottom: 20px;
}

.aplicativo img {
    width: 100%;
    margin: 0 0 30px;
}

.aplicativo ul {
    display: flex;
    list-style: none;
    padding: 0;
    margin: 0;
}

.aplicativo ul li a {
    display: flex;
    width: fit-content;
    background: #21BD64;
    padding: 20px;
    flex-wrap: nowrap;
    gap: 0 15px;
    text-decoration: none;
    border-radius: 10px 0 0 10px;
    align-items: center;
    margin: 10px 0;
    color: #fff;
}

.aplicativo ul li a b {
    display: block;
}

.aplicativo ul li a.dois{
    border-radius: 0px 10px 10px 0px;
    border-left: 1px solid #198E4B;
}

.aplicativo ul li a:hover {
    text-decoration: none;
}

.aplicativo ul li a i {
    font-size: 40px;
}

.aplicativo .conteudo {
    width: 100%;
    margin: 50px 0;
}

.aplicativo .conteudo span {
    background: #21bd64;
    width: 100px;
    height: 7px;
    margin: 0 0 5px;
    display: block;
}

.aplicativo .conteudo h2 {
    font-weight: 800;
    font-size: 22px;
}

.representa {
    padding: 80px 0;
    font-family: 'Open Sans';
}

.representa label {
    display: block;
    background: #21BD64;
    width: 100px;
    height: 10px;
}

.representa h1 {
        color: #033A42;
    font-weight: 800;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    align-content: center;
}

.representa p {
    color: #033A42;
}

.representa iframe {
    width: 100%;
    height: 500px;
    margin: 30px 0;
}

.catalogo {
    padding: 40px 0;
    margin: 80px 0;
    font-family: 'Open Sans';
    background: url(../img/banner-catalogo.webp);
    background-repeat: no-repeat;
    background-size: cover;
    color: #fff;
}

.catalogo h1 {
    font-size: 30px;
    font-weight: 800;
}

.catalogo h1 b {
    color: #58CD8B;
}

.catalogo a {
    color: #fff;
    background: #58CD8B;
    text-decoration: none;
    font-size: 16px;
    display: block;
    width: fit-content;
    align-items: center;
    gap: 0;
    padding: 5px 30px;
    border-radius: 5px;
    text-align: center;
    transition: .5s;
}

.catalogo a:hover {
    text-decoration: none;
    color: #fff;
    transform: scale(1.1);
}

.catalogo .col-md-4 {
    align-self: center;
}

.contatopag {
    padding: 0px 0;
    font-family: 'Open Sans';
    position: relative;
}

.contatopag .container {
    padding: 80px 15px;
}

.contatopag:before {
    content: '';
    background: #426B71;
    width: 40%;
    height: 100%;
    position: absolute;
    z-index: -1;
    left: 0;
}

.contatopag .infos {
    align-self: center;
}

.contatopag .cada {
    display: flex;
    align-items: center;
    justify-content: initial;
    margin-bottom: 30px;
}

.contatopag .cada img {
    margin: 0 10px;
}

.contatopag .cada:hover .texto span {
    color: #fff;
}

.contatopag .cada:hover a {
    color: #fff;
}

.contatopag .cada:hover .texto {
    padding: 0px 20px;
}

.contatopag .cada:hover i {
    position: absolute;
    border-radius: 10px;
    width: 100%;
    height: 80px;
    text-align: end;
    padding: 20px 10px;
    justify-content: flex-end;
}

.contatopag .cada i {
    padding: 10px;
    display: flex;
    justify-content: center;
    animation-name: auto;
    width: 45px;
    height: 45px;
    text-align: center;
    align-items: center;
    align-self: center;
    background: #58CD8B;
    color: #fff;
    border: 2px solid #58CD8B;
    border-radius: 50%;
    font-size: 20px;
    margin: 0 15px 0 0;
    z-index: -1;
    transition-property: position, border-radius, width, padding;
    transition-duration: 0s, 0s, .5s, 0s;
}

.contatopag .cada span {
    display: block;
    font-weight: 600;
    color: #58CD8B;
    transition: 1s;
}

.contatopag .cada a {
    font-size: 16px;
    color: #fff;
    text-decoration: none;
    transition: 1s;
}

.contatopag h2 {
    font-size: 40px;
    color: #022B31;
    font-weight: 800;
}

.contatopag form input[type="text"], .contatopag form input[type="email"] {
    display: block;
    width: 100%;
    padding: 10px 5px;
     border-radius: 5px; 
    border-bottom: 1px solid gray;
    margin-bottom: 15px;
    border: 1px solid silver;
}

.contatopag form textarea {
    border-top: none;
    padding: 10px 5px;
    border: 1px solid silver;
    border-radius: 5px;
    display: block;
    width: 100%;
    margin-bottom: 30px;
}

.contatopag form input[type="submit"]{
    padding: 10px 20px;
    color: #fff;
    border-radius: 5px;
    text-align: center;
    margin: 30px auto;
    display: block;
    font-size: 16px;
    text-transform: uppercase;
    text-decoration: none;
    transition: .5s;
    background: #58CD8B;
    border: none;
    width: 100%;
}

.contatopag form span {}

.contatopag .img img {
    margin: 0 auto 30px;
    display: block;
    width: 90%;
}

.mapa {
    padding: 0px 0 !important;
}

.trabalhe {
    padding: 0px 0;
    font-family: 'Open Sans';
    background: #022B31;
    color: #fff;
}

.trabalhe img {
    width: 100%;
}

.trabalhe .col-md-7 {
    align-self: center;
}

.trabalhe .texto {
    padding: 0 30px;
}

.trabalhe label {
    display: block;
    background: #21BD64;
    width: 100px;
    height: 10px;
    margin: 0 0 10px;
}

.trabalhe h1 {
    font-weight: 800;
    font-size: 30px;
}

.trabalhe span {
    display: block;
}

.trabalhe input {
    padding: 8px 10px;
    border-radius: 5px;
    display: block;
    width: 100%;
    border: none;
    margin: 0 0 10px;
}

.trabalhe input[type="file"]{
    background: #fff;
    padding: 5px 10px;
}

.trabalhe textarea {
    padding: 8px 10px;
    border-radius: 5px;
    display: block;
    width: 100%;
    border: none;
    margin: 0 0 10px;
}

.trabalhe input[type="submit"]{
    color: #ffff;
    background: #21bd64;
    margin: 10px auto;
    display: block;
}

.catalogos {
    padding: 80px 0;
    font-family: 'Open Sans';
}

.catalogos .cada {
    margin: 0 0 20px;
}

.catalogos img {
    width: 90%;
    margin: auto;
    display: block;
}

.catalogos h2 {
    font-style: italic;
}

.catalogos h2 b {
    color: #21BD64;
}

.catalogos .col-md-8 {
    align-self: center;
}

.catalogos a {
    text-decoration: underline;
    color: #000;
}

#popup {
    display: none;
    position: fixed;
    z-index: 999;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgba(0,0,0,0.4);
}

#popup img {
    max-width: 450px;
}

#popup-content {
    margin: auto;
    padding: 0px;
    width: fit-content;
}

#close {
        color: #000000;
    float: right;
    font-size: 28px;
    font-weight: bold;
    background: #fff;
    line-height: 0px;
    height: 30px;
    width: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
}

#close:hover,
#close:focus {
    color: #000;
    text-decoration: none;
    cursor: pointer;
}

.inst {
    padding: 4rem 15px;
    font-family: 'Open Sans';
}

.inst h1 {
        color: #033A42;
    font-weight: 800;
    text-align: center;
    margin-bottom: 30px;
}

.inst iframe {
    width: 100%;
    border-radius: 10px;
    margin-bottom: 30px;
}