@import url('https://fonts.googleapis.com/css2?family=Inconsolata:wght@300&family=Karla:wght@200&family=Lato:wght@100&family=Nunito:wght@300&family=Poppins:wght@100&family=Quicksand:wght@300;500;700&display=swap');

.info-mun-small{
    padding-top: 43px;
    padding-bottom: 66px;
}
.info-mun{
    position: relative;
    margin-bottom: 40px;
    background-position: bottom center;
    background: #2ebdaf;
    padding: 71px 0 78px;
    background-size:cover ;
    
}
.info-mun h2{
    font-family: Comfortaa;
    color: #fff;
    text-transform: uppercase;
    font-weight: 500;
    font-size: 30px;
    margin: 0 50px;
}
.container-info{
    margin-right: auto;
    margin-left: auto;
    padding-left: 15px;
    padding-right: 15px;
}

/*Fin seccion info*/


/*Contenedor de cards*/
.container-main{
    width: 90%;
    margin:auto;
}
.container__card{
    max-width: 1600px;
    margin: auto;
    margin-top: 10px;
    perspective: 1000px;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}

.card__father{
    margin: 20px;
    perspective: 1000px;
}

.card__father:hover .card{
    transform: rotateY(180deg);
}
.card{
    width: 300px;
    height: 300px;
    position: relative;
    transform-style: preserve-3d;
    transition: all 600ms;
}

.card__front{
    background-size:cover;
    background-position: center;
}

.card__front,
.card__back{
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    backface-visibility: hidden;
    transform-style: preserve-3d;
    border-radius: 10px;
}

.card__back{
    transform: rotateY(180deg);
    background: white;
    width: 300px;
    height: 300px;
}
.body__card_back{
    padding: 25px;
    text-align: center;
    transform: translateZ(10px);
}
.body__card_back h1{
    font-family: Quicksand;
    font-weight: 100 !important;
    margin-top: 30px;
    color: #575252;
    font-size: 35px;
}
.body__card_back p{
    font-family: Quicksand;
    font-weight: 200 !important;
    margin-top: 20px;
    font-size: 25px;
}

.card__back a{
    list-style: none;
    text-decoration: none;
    padding: 6px 20px;
    justify-content: center;
    margin: 100px;
    align-items: center;
    font-size: 15px;
    cursor: pointer;
    border: none;
    color: white;
    background: #58B0F6;
    box-shadow: 1px 1px 30px -5px #58B0F6;
    border-radius: 10px;
    transition: box-shadow 600ms;
}

.body__card_back input:hover{
    box-shadow: 1px 1px 30px 0px #449de6;
}