html {
    box-sizing: border-box;
    font-size: 62.5%;
    scroll-behavior: smooth;
}
*, *:before, *:after {
    box-sizing: inherit;
}
body{
    font-size: 18px;
    line-height: 1.4;
    font-family: 'Heebo', sans-serif;
}
/* estilos globales */
h1{
    font-family: 'Raleway', sans-serif;
    margin: 2rem 0;
    font-size: 45px;
}
h2{
    font-family: 'Raleway', sans-serif;
    margin: 2rem 0;
    font-size: 35px;
    text-transform: capitalize;
}
h3,h4{
    font-family: 'Maitree', serif;
}
h3{
    font-size: 30px;
}
h4{
    font-size: 25px;
}
a{
    text-decoration: none;
    font-size: 20px;
}
@media (min-width: 700px) {
    h1{
        font-size: 50px;
    }
    h2{
        font-size: 40px;
    }
    h3{
        font-size: 30px;
    }
    h4{
        font-size: 20px;
    }
    
}
img{
    max-width: 100%;
}
option {
    background-color: rgba(0,0,0,0.8);
}
.contenedor{
    max-width: 120rem;
    margin: 0 auto;
}
.full-view{
    padding: 0rem;
    display: flex;
    align-items: center;
}
@media (min-width: 768px) {
    .full-view{
        /* min-height: 100vh; */
        padding: 5rem;
        display: flex;
        align-items: center;
    }
    /* .aux-fv{
        min-height: 100vh;
    } */
}
.centrar-texto{
    text-align: center;
}
.btn{
    display: inline-block;
    padding: .5rem 1.5rem;
    border-radius: .5rem;
    color: white;
    cursor: pointer;
    font-family: 'Oxygen', sans-serif;
}
.btn:disabled{
    opacity: 0.5;
    cursor: not-allowed;
}
.btn-main{
    background: #88826c;
    transition: all .3s;
}
.btn-main:hover{
    background-color: #C0B897;
    color: white;
}
.btn-border{
    border: 1.9px solid #88826c;
    color: #88826c;
    background-color: transparent;
}
.btn-border:hover {
    border-radius: .4rem;
    transition: .3s ease-in-out;
    background-color: #C0B897;
    color: rgba(0,0,0,0.9);
}
.btn-border:disabled:hover{
    background-color: transparent;
    cursor: not-allowed;
    color: #b8a462;
}
.btn-border-black{
    border: 1.9px solid #000;
    color: #000;
    background-color: transparent;
}
.btn-border-black:hover {
    border-radius: .4rem;
    transition: .3s ease-in-out;
    background-color: #000;
    color: #fff;
}
/* *************** */
/* Menu Inicial */
/* *************** */
.menu_color {
    background: #111111;
}
.menu_redes {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    padding: 0.8rem;
    position: relative;
}
.menu_redes a i {
    font-size: 1.5rem;
    padding: 0.8rem;
    color: white;
}
.menu_redes a i:hover {
    color: #b8a462;
    transition: .4s ease-in-out;
}
.bar-datos{
    display: flex;
    justify-content: flex-end;
}
.bar-datos a{
    transition: all 0.5s ease-out;
    display: flex;
    align-items: center;
    border: solid #88826c .1rem;
    margin-right: 1rem;
    color: #88826c;
    padding: .1rem 1rem;
    width: 5.5%;
    max-height: 3.5rem;
    max-width: 100%;
}
.bar-datos a:first-child{
    width: auto;
}
.bar-datos a i{
    color: #88826c;
    padding: 0;
}
.bar-datos a p{
    margin: 0;
    margin-left: 1rem;
    overflow: hidden;
}
.bar-datos a:hover{
    transition: all 0.5s ease-out;
    width: auto;
}
@media screen and (max-width: 800px) {
    .menu_redes {
        display: none;
    }
}

/* ************** */
/* Menu Principal */
/* ************** */
.menu_color_s {
    background: #040505;
}
#menu_color_s {
    transition: .5s ease-in-out;
}
.menu_principal {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}
.menu_fixed {
    position: fixed;
    z-index: 1000;
    top: 0;
    width: 100%;
}
.menu a {
    color: #ffff;
    padding: .7rem;
}
.menu .active {
    color: #88826c;
}
.menu a:hover {
    color: #88826c;
    transition: .4s ease-in-out;
}
.menu a.activo:hover{
    color: #fff;
}
.logotipo {
    display: flex;
    flex-direction: column;
    align-items: center;
    color: #88826c;
    padding: 1.5rem;
}
.logotipo img {
    width: 10rem;
}
.logotipo h2{
    font-size: 2rem;
    margin: 1rem 0 0 0;
    /* margin-left: 1rem; */
}
.menu_bar {
    display: none;
}
@media screen and (max-width:800px ) {
    /* ****************** */
    .menu-burger{
        position: relative;
        display: flex;
        /* justify-content: space-between; */
        align-items: center;
        transition: all .5s ease-in-out;
    }
    .menu-burger a{
        padding: 0;
        position: absolute;
        right: 2rem;
    }
    .btn-burger{
        /* position: absolute; */
        /* right: 0;s */
        width: 3rem;
        height: .2rem;
        background-color: #88826c;
        border-radius: .5rem;
        transition: all .5s ease-in-out;
    }
    .btn-burger::before, .btn-burger::after{
        content: '';
        position: absolute;
        width: 3rem;
        height: .2rem;
        background-color: #88826c;
        border-radius: .5rem;
        transition: all .5s ease-in-out;
    }
    .btn-burger::before{
        transform: translateY(-10px);
    }
    .btn-burger::after{
        transform: translateY(10px);
    }
    /* ****************** */
    .menu_principal {
        width:76%;
		height:100%;
		top:-100%;
		margin:0;
		position: fixed;
        background: #040505;
        display: block;
        left: 0;
        transition: .4s ease-in-out;
    }
    .menu_bar {
		/* display:block; */
		width:100%;
		background:#000;
        position: fixed;
        z-index: 1000;
        overflow: hidden;
	}
	/* .menu_bar .btn-menu {
		display:block;
		padding: 2rem;
        background: #040505;
		color:#C0B897;
		text-decoration:none;
		font-weight: bold;
		font-size:3rem;
		-webkit-box-sizing:border-box;
		-moz-box-sizing:border-box;
		box-sizing:border-box;
	} */
    .menu_bar span {
		float:right;
	}
    .menu_principal{
        z-index: 1200;
    }
    .menu {
        display: flex;
        justify-content: center;
        align-items: flex-start;
        flex-direction: column;
        margin-top: 1rem;
    }
    .menu a {
        padding: 2rem;
        border-bottom: 1px solid #C0B897;
        width: 100%;
    }
    .logotipo img {
        text-align: center;
        max-width: 100px;
    }
    .menu_bar img{
        max-width: 50px;
    }
    .menu_bar h2{
        font-size: 1.5rem;
    }
    /* animación de close */
    .menu-burger.open .btn-burger{
        transform: translateX(-50px);
        background: transparent;
    }
    .menu-burger.open .btn-burger::before{
        transform: rotate(45deg) translate(35px, -35px);
    }
    .menu-burger.open .btn-burger::after {
        transform: rotate(-45deg) translate(35px, 35px);
    }
}
/* ******* */
/* Banner */
/* ****** */
.slid {
    height: 65.2rem;
    background:linear-gradient(rgba(0,0,0,0.5),rgba(0,0,0,0.5)),url(../img/imagen4.jpg) center no-repeat scroll;
    background-size: cover;
}
.slid  div {
    max-width: 120rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 70rem;
    margin: 0 auto;
}
.slid h1 {
    max-width: 80%;
    color: #fff;
    padding-left: 2rem;
}
@media (min-width: 768px) {
    .slid h1 {
        max-width: 50%;
        padding-left: 0rem;
    } 
}
.titulo_mover a{
    color: #fff;
    display: flex;
    align-items: center;
    /* max-width: 10px; */
    margin-top: 2rem;
    padding-left: 2rem;
}
@media (min-width: 768px) {
    .titulo_mover a{
        padding-left: 0rem;
    }
    
}
.titulo_mover a p{
    background-color: #C0B897;
    padding: 1rem;
    margin: 0;
}
.titulo_mover a span{
    display: flex;
    align-items: center;
    background-color: #88826c;
    padding: 1rem 2rem;
    margin: 0;
    min-height: 100%;
}

/* ******* */
/* btn flotantes */
/* ****** */
.btn-flotantes{
    position: relative;
}
.btn-flotantes a{
    position: fixed;
    color: #fff;
    background-color: #aea788;
    border-radius: 5rem;
    padding: 1rem;
    z-index: 1200;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 3rem;
    bottom: 2rem;
}
.btn-flotantes a.btn-wsp{
    left: 2rem;
    z-index: 1000;
}
.btn-flotantes a.btn-up{
    right: 2rem;
}
.btn-flotantes a:hover{
    background-color: #C0B897;
    transition: .3 ease-in all;
    font-size: 3.5rem;
}
/* ************** */
/* Servicios */
/* ************* */
.site-contador{
    flex-direction: column;
    background-color: #111111;
}
.numeros{
    display: grid;
    /* grid-template-columns: 1fr; */
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
    color: #fff;
}
.number{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 2rem;
}
.number p{
    margin: 0;
}
.number span{
    font-size: 5rem;
    margin: 0;
    color: #C0B897;
    font-weight: bold;
}
.tit-number p{
    font-size: 5rem;
    margin: 0;
    color: #C0B897;
    font-weight: bold;
}
.number:hover{
    background-color: #040505;
}
@media (min-width: 593px) {
    .number{
        padding: 5rem;
    }
.number span{
    font-size: 6rem;
}
}
@media (min-width: 820px) {
    .numeros{
        grid-template-columns: repeat(4, 1fr);
    }
}
/* ************** */
/* Servicios */
/* ************* */
.site-servicios{
    display: flex;
    flex-direction: column;
}
.tit-servicios h2,.tit-servicios h3{
    margin: 0;
}
.tit-servicios h3{
    font-weight: normal;
    color: #C0B897;
}
.cont-servicios{
    padding: 2rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
@media (min-width: 768px) {
    .site-servicios{
        display: grid;
        grid-template-columns: repeat(2,1fr);
        gap: 1rem;
    }
    .cont-servicios{
        padding: 5rem;
    }
}
.icon-services{
    background-color: #111;
    display: grid;
    grid-template-columns: repeat(2,1fr);
}
.card-servicios{
    padding: 1em;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.card-servicios span{
    margin:1rem 0 0 0;
    font-size: 2rem;
    text-transform: capitalize;
    color: #fff;
}
@media (min-width: 570px) {
    .card-servicios{
        padding: 2rem;
    }
    .card-servicios span{
        margin: 2rem 0 0 0;
    }
}
.card-servicios svg{
    width: 50px;
    height: 50px;
}
.card-servicios svg g{
    fill:#C0B897;
}
.card-servicios p{
    color: #8f8f8f;
    margin-bottom: 0;
}
.card-servicios:nth-child(1),.card-servicios:nth-child(2){
    border-bottom: solid .2rem black;
}
.card-servicios:nth-child(2),.card-servicios:nth-child(4){
    border-left: solid .2rem black;
}
/* *************** */
/* site about-us */
/* *************** */
.site-exp{
    background-color: #0a0a0a;
}
.site-exp span{
    /* font-weight: bold; */
    background: #C0B897;
    color: #040505;
    padding: .4rem;
    border-radius: .5rem;
    margin-right: 1rem;
}
.cont-sli-exp{
    display: grid;
    gap: 2rem;
    padding:2rem;
}
@media (min-width: 999px) {
    .cont-sli-exp{
        grid-template-columns: repeat(2 ,1fr);
        padding: 5rem 2rem;
    }
}
/* slider pag */
.cont-exp{
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: #fff;
    width: 100%;
}
.tit-exp{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-start;
}
.tit-exp h2{
    margin: 0;
    color: #C0B897;
}
.tit-exp h3{
    margin: 0;
    font-weight: normal;
}
/* slider */
.cont-exp .cont-img{
    position: relative;
    display: flex;
    justify-content: space-between;
    width: 100%;
}
.cont-img .fle-izq,.cont-img .fle-der{
    position: absolute;
    border: none;
    background-color: rgba(0,0,0,0.3);
    font-size: 3rem;
    height:50%;
    top: calc(50% - 25%);
    line-height: 4rem;
    width: 5rem;
    color: #fff;
    z-index: 500;
    cursor: pointer;
    transition: .2s ease all;
}
.cont-img .fle-izq:hover ,.cont-img .fle-der:hover{
    background-color: rgba(0,0,0,0.9);
}
.cont-img .fle-izq{
    left: 0;
}
.cont-img .fle-der{
    right: 0;
}
/* indicadores */
.cont-exp .indicadores button{
    background-color: #a1a1a1;
    height: .5rem;
    width: 2rem;
    cursor: pointer;
    border: none;
    margin-right: 1rem;
}
.indicadores button:hover,.cont-exp .indicadores button.activo{
    background-color: #b8a462;    
}
/* imagenes slider */
.cont-exp .cont-slider{
    width: 100%;
    overflow: hidden;
    scroll-behavior: smooth;
}
.cont-exp .cont-slider .slider{
    display: flex;
    flex-wrap: nowrap;
    max-height: 300px;
}
.cont-exp .cont-slider .slider .sli{
    min-width: 100%;
    transition: .3s ease all;
}
.cont-exp .cont-img .cont-slider .sli img{
    width: 100%;
    vertical-align: top;
}
.cont-exp .cont-img .cont-slider .sli:hover{
   /* transform: scale(1.1); */
   transition: .3s ease all;
   z-index: 600;
}
.sli{
    position: relative;
}
.hover-img{
    position: absolute;
    top:0;
    min-height: 100%;
    width: 100%;
    display: flex;
    align-items: flex-end;
    background: linear-gradient(rgba(0,0,0,0),rgba(0,0,0,1));
    transform: scale(1);
    transition: all .4s ease-in;
    padding: 2rem;
    text-transform: capitalize;
}
.hover-img a{
    color: white;
}
@media (min-width: 800px) {    
    .hover-img{
        transform: scale(0);
    }
    .sli:hover .hover-img{
        transform: scale(1);
    }
}
.site-exp{
    color: white;
}
/* ********* */
/* Adaptable */
/* ********* */
.cont-movil{
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 1rem;
    overflow: hidden;
}
@media (min-width: 880px) {
    .cont-movil{
        max-height: 450px;
    }
}
.cont-movil .img-movil{
    display: flex;
    align-items: center;
}
@media (min-width: 768px) {
    .cont-movil .img-movil{
        padding: 5rem 0;
    }  
}
.cont-movil .img-movil img{
    max-height: 500px;
}
.txt-movil{
    padding: 5rem 2rem;
    min-height: 100%;
}
@media (min-width: 768px) {
    .txt-movil{
        padding: 5rem;
    }  
}
.txt-movil .servicio{
    display: flex;
}
.txt-movil .servicio h3{
    margin: 0;
    margin-bottom: 1rem;
}
.txt-movil .servicio p{
    margin: 0;
    margin-bottom: 2rem;
}
.txt-movil .servicio svg{
    margin-right: 2rem;
}
.txt-movil .servicio svg g{
    fill: #a38235;
}
@media (max-width: 768px) {
    .cont-movil{
        grid-template-columns: 1fr;
    }  
    .cont-movil .img-movil img{
        display: none;
    }
}
/* ************* */
/* foooter*/
/* *************** */
footer{
    background-color: #0a0a0a;
}
footer span{
    font-weight: bold;
    color: #b8a462;
}
.cont-footer{
    max-width: 120rem;
    display: flex;
    flex-wrap: wrap;
    margin: 0 auto;
    padding: 2rem 0;
}
.info-footer{
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    width: 100%;
}
.footer-contact{
    flex: 0 0 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 2rem;
}
.footer-contact svg{
    min-width: 50px;
    min-height: 50px;
}
.footer-contact g{
    fill: #b8a462;
}
@media (min-width: 780px) {
    .info-footer{
        flex-wrap: nowrap;
    }
    .footer-contact{
        flex-direction: row;
        flex: 0 0 calc(33% - 1rem);
    }
    .footer-contact svg{
        min-width: 80px;
        min-height: 80px;
    }
}
.txt-footer{
    padding-left: 1rem;
}
.footer-contact span{
    color: #b8a462;
    font-weight: bold;
    /* font-size: 6rem; */
}
.txt-footer p{
    /* margin: 0 1rem; */
    color: white;
    margin: 0;
}
/* .txt-footer h4{
    margin: 0 1rem;
    color: white;
    text-decoration: none;
    text-transform: none;
} */
.footer-emp{
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    position: relative;
}
.footer-emp h4{
    margin-top: 0;
    color: white;
    text-decoration: none;
}

.fot-emp a:hover{
    color: #46A70E;
}
.fot-emp{
    color: #d1d1d1;
    flex: 0 0 100%;
    padding: 0;
    text-align: justify;
    position: relative;
}
@media (min-width: 375px) {
    .fot-emp{
        padding: 2rem;
    }
    
}
.fot-emp img{
    max-width: 250px;
    margin: 0;
}
.fot-emp h4{
    text-align: center;
}
@media (min-width: 1024px) {
    .fot-emp{
        flex: 0 0 calc(33.3% - 1rem);
    }
    .fot-emp{
        padding: 5rem 2rem;
    }
}
.fot-emp a{
    color: white;
    text-decoration: none;
    display: flex;
    align-items: center;
    justify-content: flex-start;
}
.fot-icon-red{
    display: flex;
    justify-content: space-around;
    min-width: 100%;
}
.fot-emp .fot-icon-red a:hover g{
    fill: #b8a462;
}
.footer-emp a i{
    color: #46A70E;
    font-size: 3rem;
    overflow: hidden;
}
.footer-emp a p{
    margin-left: 1rem;
}
.fot-emp p{
    width: 80%;
    margin: 0 auto;
}
.fot-emp h4{
    margin-top: 2rem;
    /* width: 80%; */
}
@media (min-width: 375px) {
    .fot-emp p{
        width: 100%;
    }
    .fot-emp h4{
        width: 100%;
        letter-spacing: .1rem;
    }
}
.centrar{
    text-align: center;
}
.footer-emp input[type="email"]{
    padding: 1.5rem;
    background-color: #d1d1d1;
    color: #111111;
    border: none;
    border-radius: .5rem;
    width: 80%;
    margin: 1rem auto 0;
}
.footer-emp input[type="email"]:focus{
    background-color: white;
}
.footer-emp button{
    border: none;
    width: 80%;
    margin: 0 auto;
}
.footer-emp button:hover{
    cursor: pointer;
    background-color: #b8a462;
}
.fot-emp form{
    display: flex;
    flex-direction: column;
}
.footer-emp button{
    margin-top: 1rem;
}
.auxemp{
    text-align: center;
}
@media (min-width: 375px) {
    .fot-emp form{
        flex-direction: row;
    }
    .footer-emp button{
        /* margin-top: 1rem; */
        margin-left: 1rem;
    }
}
.der{   
    border-right: none;
}
.bot{
    border-bottom: none;
}
.izq{
    border-left:none;
}
.txt-footer{
    text-align: center;
}
@media (min-width: 780px) {
    .der{   
        border-right: #d1d1d1 solid .2rem;
    }
    .bot{
        border-bottom: #d1d1d1 solid .2rem;
    }
    .izq{
        border-left: #d1d1d1 solid .2rem;
    }
    .txt-footer{
        text-align: left;
    }
}
.desarrollado{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background-color: #000;
    color: #fff;
    padding: 1rem 0;
}
.desarrollado p{
    margin: 0;
    /* margin-right: 1rem; */
}
.desarrollado a.logotipo h2{
    /* max-width: 50px; */
    margin: 0 1rem;
}
.desarrollado a.logotipo{
    padding: 0;
}
@media (min-width: 768px) {
    .desarrollado{
        flex-direction: row;
    }
}
/* *************** */
/* banner-portafolio */
/* *************** */
.banner-portafolio{
    background: linear-gradient(rgba(0,0,0,0.5),rgba(0,0,0,0.5)),url(../img/banner-form2.jpg) top fixed;
    background-size: cover;
    color: #fff;
    text-align: center;
    min-height: 30rem;
    display: flex;
    align-items: center;
    justify-content: center;
}
.banner-portafolio h2{
    margin: 0;
}
/* *************** */
/* bf-portafolio */
/* *************** */
.bf-portafolio{
    display: grid;
    grid-template-columns:1fr;
    padding: 2rem;
    overflow: hidden;
    justify-items: center;
}
.bf-portafolio .img-movil{
    display: flex;
    align-items: center;
}
@media (min-width: 880px) {
    .bf-portafolio{
        max-height: 450px;
        padding: 5rem 0;
    }
}
@media (min-width: 768px) {
    .bf-portafolio{
        grid-template-columns: repeat(2, 1fr);
        padding: 5rem 2rem;
    }
    .bf-portafolio .img-movil{
        padding: 3rem 0;
        transition: all .3s ease-in;
    }  
    .bf-portafolio .img-movil:hover{
        transition: all .3s ease-in;
        padding: 0;
    }
}
.bf-portafolio .img-movil img{
    max-height: 500px;
    display: none;
}
@media (min-width: 768px) {
    .bf-portafolio .img-movil img{
        display: block;
    }
    
}
/* ****************************** */
/* portafolio */
.card{
    text-align: center;
    padding: 5rem 0;
}
.card form {
	width: 100%;
	display: flex;
	justify-content: center;
	margin-bottom: 20px;
}
.card .barra-busqueda,.card .barra-busqueda-afiliados {
	width: 80%;
	height: 40px;
	line-height: 40px;
	background: #fff;
	padding: 0 20px;
	border-radius: 100px;
    border: #111111 solid .1rem;
	text-align: center;
    margin-right: 0;
}
@media (min-width: 440px) {
    .card .barra-busqueda,.card .barra-busqueda-afiliados {
        width: 50%;
    }
    
}
.card .info-categorias{
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 2rem;
    flex-direction: column;
}
.card .info-categorias p{
    margin: 0;
    margin-right: 0rem;
    margin-bottom: 2rem;
    font-weight: bold;
}
.card .categoria{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    text-transform: capitalize;
}
.card .categoria a{
    /* color: #C0B897; */
    color: #111111;
    margin-left: 0rem;
    font-size: 1.8rem;
}
@media (min-width: 390px) {
    .card .info-categorias{
        flex-direction: row;
    }
    .card .info-categorias p{
        margin-right: 2rem;
        margin-bottom: 0;
    }
    .card .categoria{
        flex-direction: row;
    } 
    .card .categoria a{
        margin-left: 1rem;
    }
}
.card .categoria a:first-child{
    margin-left: 0rem;
}
.card .categoria a:hover{
    color: #111111;
}
.card .categoria a.activo{
    /* font-weight: bold; */
    border-bottom: #C0B897 solid .2rem;
}
.grid {
    margin-top: 1rem;
	position: relative;
	width: 100%;
	opacity: 0;
	transition: opacity 0.5s linear 1s;
}
.grid.imagenes-cargadas {
	opacity: 1;
}
.grid .item {
	position: absolute;
	display: block;
	padding: 0;
    margin: 1rem;
    width: calc(50% - 20px); 
}
@media (min-width: 768px) {
    .grid .item {
        width: calc(33.333333% - 20px); 
    }
}
.grid .item-content{
	position: relative;
}

.grid .item img {
	width: 100%;
	cursor: pointer;
	vertical-align: top;
    position: relative;
}

.grid .item-content::before {
    content: "";
    display:flex;
    width: 100%;
    height: 1rem;
    z-index: 1000;
    background-color: #111111;
    top: -1rem;
    left: 0;
    border-top-left-radius: .5rem;
    border-top-right-radius: .5rem;
    position: absolute;
    transition:  all .3s;
}
.grid .item-content::after{
    content: "";
    display:flex;
    width: 100%;
    height: 1rem;
    z-index: 1000;
    background-color: #111111;
    bottom: 0rem;
    left: 0;
    border-bottom-left-radius: .5rem;
    border-bottom-right-radius: .5rem;
    position: absolute;
    transition:  all .3s;
}

.grid .item .item-content{
    position: relative;
}
.hover-portafolio{
    position: absolute;
    top:0;
    min-height: 100%;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(rgba(0,0,0,0.5),rgba(0,0,0,0.5));
    transform: scale(0);
    transition: all .4s ease-in;
    padding: 2rem;
}
.hover-portafolio a{
    color: white;
}
.hover-portafolio a span{
    font-weight: bold;
}
.grid .item .item-content:hover .hover-portafolio{
    transform: scale(1);
}
.grid .item .item-content:hover::after,.grid .item .item-content:hover::before{
    background-color: #be9943;
    border-radius: 0%;
    transition: all .3s ease;
}

/* **************************** */

/*  */
/* formulario de contacto */
/*  */
/* seccion de formulario */
.ph-contact{
    background: linear-gradient(rgba(0,0,0,0.5),rgba(0,0,0,0.5)),url(../img/banner-form2.jpg) center fixed;
    background-size: cover;
    min-height: 60rem;
    display: grid;
    grid-template-columns: 1fr;
    align-items: center;
    padding: 5rem 2rem;
}
.form{
    color: #fff;
    background-color: rgba(0,0,0,0.8);
    padding: 5rem 2rem;
    position: relative;
}
.txt-ph{
    color: white;
    padding: 1rem;
}
.form form{
    display: flex;
    flex-direction: column;
    padding: 1rem;
    min-height: 30rem;
}
.dat-name{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
}
@media (min-width: 768px) {
    .dat-name{
        flex-direction: row;
    }
    
}
.form input[type="email"],input[type="tel"],input[type="text"],input[type="date"],select{
    margin-top: 1rem;
    padding: 1.5rem;
    background-color: transparent;
    color: white;
    border: none;
    border-bottom: #b8a462 solid .1rem;
    width: 100%;
}
.form input[type="tel"],.form select{
    margin-left: 1rem;
}
.form input[type="email"]{
    /* margin-bottom: 1rem; */
    margin-right: 0;
}
.form textarea{
    height: 10rem;
    margin-bottom: 3rem;
    padding: 2rem;
    border: none;
    color: white;
    background-color: transparent;
    border-bottom: #b8a462 solid .1rem;
}
.form textarea:focus{
     background-color: rgba(255,255,255,0.8);
     color: black;
}
.form textarea::placeholder{
    color: rgb(182, 181, 181);
}
.form input[type="email"]:focus,input[type="tel"]:focus,input[type="text"]:focus{
     background-color: rgba(255,255,255,0.8);
     color: black;
}
.form input[type="email"]::placeholder,input[type="tel"]::placeholder,input[type="text"]::placeholder,input[type="date"]::placeholder,select::placeholder{
   color: rgb(182, 181, 181);
}
.form button{
    margin-top: 3rem;
}
.form select{
    background-color: rgba(0,0,0,0);
}
.footer-form{
    display: flex;
    align-items: center;
}
.footer-form p{
    margin-left: 1rem;
}
.footer-form p a{
    color: #b8a462;
}
@media (max-width: 925px) {
    .dat-name input[type="text"],input[type="tel"], input[type="date"],select{
        width: 100%;
    }
}
@media (min-width: 900px) {
    .ph-contact{
        grid-template-columns: repeat(2, 1fr);
        padding: 5rem;
    }
}
/* ************** */
/*  */
/* formulario de contacto */
/*  */
/* seccion de formulario */
.site-date{
    background: linear-gradient(rgba(0,0,0,0.5),rgba(0,0,0,0.5)),url(../img/banner-form2.jpg) center fixed;
    background-size: cover;
    min-height: 60rem;
    padding: 5rem 0;
}
.cont-date{
    padding: 0 2rem;
}
@media (min-width: 768px) {
    .cont-date{
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        align-items: center;
    }
}
.form .cont-horario{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}
.form .cont-horario .info-horario{
    display: flex;
    align-items: center;
}
@media (min-width: 768px) {
    .form .cont-horario{
        flex-direction: row;
        align-items: center;
    }
    
}
.form .cont-horario .info-horario svg:last-of-type{
    margin-left: 0rem;
}
@media (min-width: 768px) {
    .form .cont-horario .info-horario svg:last-of-type{
        margin-left: 2rem;
    } 
}
.form .cont-horario .info-horario svg{
    width: 3rem;
    height: 3rem;
}
.form .cont-horario .info-horario svg g{
    fill: #b8a462;
}
.form .cont-horario .info-horario p{
    margin-left: 1rem;
}
/* ************************* */

.alerta {
    position: absolute;
    top: 0;
    left: 0;
    padding:1rem;
    text-align: center;
    color: #fff;
    width: 100%;
    /* margin: 0 auto; */
    display: block;   
    /* border-radius: .5rem; */
}
.error {
    color: rgb(148, 5, 5);
    background-color: rgb(216, 81, 81);
}
.success{
    color: rgb(3, 94, 38);
    background-color: rgb(11, 192, 50);
}
/* ************************* */
/* ************************* */
/* ***** Directorio *** */
/* ************************* */
/* ************************* */
#grid-afiliados{
    min-height: 40rem;
}
.grid .item-afiliado {
	position: absolute;
	display: block;
	padding: 0;
    margin: 1rem;
    width: calc(50% - 20px); 
}
@media (min-width: 768px) {
    .grid .item-afiliado {
        width: calc(25% - 20px); 
    }
}
.grid .item-content-afiliado{
	position: relative;
}

.grid .item-afiliado .item-content-afiliado{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    /* background-color: #F0F2F5; */
    border: #f0f2f5 solid .2rem;
    border-radius: 1rem;
    padding: 3rem 0;
}
.grid .item-afiliado .item-content-afiliado p{
    color: #111111;
    /* margin-bottom: 0; */
}
.grid .item-afiliado .item-content-afiliado img{
    width: 150px;
    height: 150px;
    object-fit: cover;
}
.grid .item-afiliado .item-content-afiliado:hover{
    transition: .3s ease-out all;
    -webkit-box-shadow: 0px 0px 50px 0px rgba(0,0,0,0.5); 
    box-shadow: 0px 0px 50px 0px rgba(0,0,0,0.5);
    border: #fff solid .2rem;
}

.grid .item-afiliado .item-content-afiliado:hover img{
    transition: .3s ease-out all;
    transform: scale(1.1);
}
.grid .item-afiliado .item-content-afiliado{
    position: relative;
}
.grid .item-afiliado .item-content-afiliado .redes{
    margin: 0 0 2rem;
    color: #b8a462;
}
.grid .item-afiliado .item-content-afiliado .redes a {
    color: #b8a462;
    padding-right: 1rem;
}
.grid .item-afiliado .item-content-afiliado .redes a:last-child {
    padding-right: 0rem;
}

.d-none-alert{
    display: none!important;
}
.ntf-alert{
    position: absolute;
    display: flex;
    background-color: #C0B897;
    color: #fff;
    padding: 20px;
    right: 10px;
    bottom: 10px;
    /* left: auto; */
    z-index: 10000;
    border-radius: 5px;
}