* body {
  font-family: 'Roboto-Light';
  font-size: 17px;
  color: #666;
}

/* fuentes personalizadas */

@font-face {
  font-family: "WebSymbolsRegular";
  src: url('../fonts/websymbols-regular-webfont.eot');
  src: url('../fonts/websymbols-regular-webfont.eot?#iefix') format('embedded-opentype'),
    url('../fonts/websymbols-regular-webfont.woff') format('woff'),
    url('../fonts/websymbols-regular-webfont.ttf') format('truetype'),
    url('../fonts/websymbols-regular-webfont.svg#WebSymbolsRegular') format('svg');

  font-weight: normal;
  font-style: normal;
}


/* Estílos generales */

/* Iconos redes sociales */

.icono {
  font-family: "WebSymbolsRegular";
}

/* fuente del logo ASPHALTIC GRAIN CONDENSED PERSONAL USE  */

@font-face {

  font-family: "asphaltic";
  src: url('../fonts/ASPHALTIC GRAIN CONDENSED PERSONAL USE.ttf');

}

/* fuente del logo Ailerons-Typeface.otf  */

@font-face {

  font-family: "ailerons";
  src: url('../fonts/Ailerons-Typeface.otf');

}

/* fuente del logo Roboto-Light.ttf  */

@font-face {

  font-family: "Roboto-Light";
  src: url('../fonts/Roboto-Light.ttf');

}

/* ---------------- */

#header {
  display: flex;
  min-height: 170px;
  background: white;
  margin: 0;
  align-items: center;
  justify-content: center;
}

.logotipo {
  display: flex;
  align-items: center;
  padding-left: 20px;

}

/* Imagen del logotipo*/
.logotipo img {
  height: 325px;
  margin-right: 20px;
  margin-top: 20px;
  margin-left: 40px;
}

a {
  text-decoration: none;
}

/* contenedor de la cabecera */

.titulo_1 {
  font-size: 7vW;
  font-weight: bold;
  color: #d1d9b4;
  font-family: 'asphaltic';
  letter-spacing: 2px;
  margin-top: 62px;
  text-shadow: 1px 1px 1px #555, 3px 3px 5px #ccc;
  padding-left: 35px;
  padding-right: 10px;
}

.titulo_2 {
  text-align: center;
  font-family: 'Roboto-Light';
  color: #666;
  font-size: 23px;
  letter-spacing: 1px;
  text-shadow: 3px 3px 5px #ccc;
  padding-left: 45px;

}


/* menu navegación */
#menu {
  background: #d1d9b4;
width: 97%;
box-shadow: 0px 3px 3px #888;
margin: auto;
margin-top: 20px;
margin-bottom: 5px;
z-index: 99;

}

/* caja submenu servicios */
#menu #submenu {
/* background:#d4d8b8; */
background: white;
box-shadow: 0px 2px 2px #666;
}


/* caja menu servicios */

#menu #submenu>li:hover>a {
background: #d1d9b4;
box-shadow: 0px 0px 6px #6e7059 inset;
}

/* color letras del navegador del menu */
#menu .navbar-nav .nav-item .nav-link {
color: rgb(82, 70, 70);
font-size: 14px !important;
font-weight: bold;
letter-spacing: 1px;
text-shadow: 2px 5px 15px #666;
text-transform: uppercase;
letter-spacing: 1.6px;
}

#menu .navbar-nav .nav-item .nav-link a {
color: rgb(82, 70, 70);
font-size: 1em !important;
font-family: 'Roboto-Light';
font-weight: bold;
letter-spacing: 1px;
text-shadow: 2px 5px 15px #666;
text-transform: uppercase;
letter-spacing: 1.6px;
}




/* color letras del navegador del menu cuando se pasa el ratón */
#menu .navbar-nav .nav-item .nav-link:hover {
/* color: rgb(98, 174, 177); */
color: white;
text-decoration: underline;
}



/* fuente submenus */

.dropdown-item {
font-size: 0.9rem !important;
font-weight: bold !important;
font-family: 'Roboto-Light';
color: rgb(82, 70, 70);
letter-spacing: 1.6px;
text-align: start;
}

/* submenu 1 */

#menu #listasubmenu_1 #submenu_1 {
/*caja desplegable */
/* background:#d4d8b8; */
background: white;
list-style: none;
display: none;
position: absolute;
z-index: 1;
border: 1px solid rgba(0, 0, 0, .15);
border-radius: 0.25rem;
text-align: left;
top: 100%;
left: 0;
min-width: 10rem;
padding: 0.5rem 0;
margin: 0;
padding-right: 1px;
margin-top: 0.125rem;
box-shadow: -2px 1px 6px rgb(87, 85, 85);



}

/* posición caja */
#menu #listasubmenu_1:hover #submenu_1 {
display: block;
position: absolute;
margin-top: -76px;
margin-left: 220px;
}

/* caja desplegable de los enlaces */
#menu #listasubmenu_1:hover #submenu_1 li {
width: 245px;
background: white; /* color enlaces sin pasar el cursor */
text-decoration: none;
text-align: start;

}


#menu #listasubmenu_1:hover #submenu_1 li a {
color: rgb(82, 70, 70);
transition: all 300ms;

}

#menu #listasubmenu_1:hover #submenu_1 li a:hover {
background: #d1d9b4;
box-shadow: 0px 0px 6px #6e7059 inset;

}

/* submenu 2 */

#menu #submenu_2 {
  background: white;
list-style: none;
display: none;
position: absolute;
z-index: 1;
border: 1px solid rgba(0, 0, 0, .15);
border-radius: 0.25rem;
text-align: left;
top: 100%;
left: 0;
min-width: 10rem;
padding: 0.5rem 0;
margin: 0;
padding-right: 1px;
margin-top: 0.125rem;
box-shadow: -2px 1px 6px rgb(87, 85, 85);

}

/* posición caja */
#menu #listasubmenu_2:hover #submenu_2 {
display: block;
position: absolute;
margin-top: -46px;
margin-left: 220px;
}

/* caja desplegables de los enlaces */
#menu #listasubmenu_2:hover #submenu_2 li {
width: 245px;
 background: white;
text-decoration: none;
text-align: start;
}


#menu #listasubmenu_2:hover #submenu_2 li a {
color: rgb(82, 70, 70);
transition: all 300ms;
}

#menu #listasubmenu_2:hover #submenu_2 li a:hover {
background: #d1d9b4;
box-shadow: 0px 0px 6px #6e7059 inset;
}


/* Fin navegador */



/*  video */
#myVideo {

  right: 0;
  bottom: 0;
  width: 100%;
  min-height: 84%;
  border-radius: 7px;

}

#video_index {

  border-radius: 10px;
  border: 1px solid #ccc;
  box-shadow: 2px 2px 10px #555;
  width: 1000px;
  min-height: 84%;
  padding: 10px;
  margin-top: 30px;
  margin-right: 10px;
  margin-left: 10px;
  justify-content: center;
}

.content_video {
  display: flex;
  justify-content: center;
}


.content_video h1 {
  font-family: 'tangerine';
  font-style: italic;
  font-size: 43px;
  color: #666;
  text-shadow: 3px 3px 5px #aaa;
  line-height: 40px;
  letter-spacing: 1px;
  margin-top: 30px;
  margin-bottom: 20px;
  padding: 5px;
}






/* fin slider */

#presentacion {
  margin-bottom: 20px;
  
}



#presentacion_padre {
  position: relative;
}

#prentacion_bienvenidos {
  position: absolute;
  margin-top: 70px;
}


/* primeras letras del párrafo bienvenido ( el arca ) */
#bienvenido_arca {
  color: #d1d9b4;
  font-weight: bold;
  text-decoration: underline 1px;
  letter-spacing: 1px;
  font-size: 40px;
  margin-top: 50px;
  text-shadow: 1px 1px 1px #555, 3px 3px 5px #ccc;
  
}

/* párrafo bienvenido */

#bienvenido_gaia {
  font-size: 17px;
  color: #666;
  line-height: 25px;
  letter-spacing: 1px;
  text-align: justify;
}

#estas_bien {
  font-family: 'tangerine';
  font-style: italic;
  font-size: 43px;
  color: #666;
  text-shadow: 3px 3px 5px #aaa;
  line-height: 40px;
  letter-spacing: 1px;
}


/*  slider testimonios */

.carousel-indicators {
  color: #d1d9b4;
  bottom: 200px;
}


.carousel-indicators [data-bs-target] {
  background: #d1d9b4;
  border-radius: 30%;
  width: 17px;
  height: 0px;
}

#testimonios h2 {
  font-family: 'Roboto-Light';
  color: #d1d9b4;
  text-transform: uppercase;
  text-align: center;
  font-weight: bold;
  letter-spacing: 2px;
  font-size: 40px;
  margin-bottom: 40px;
  text-shadow: 1px 1px 1px #555, 3px 3px 5px #ccc;
}

#container_testimonio {
  overflow: hidden;
  background: linear-gradient(-157deg, white 47%, #ccc 70%);
  margin-top: 10px;
  margin-bottom: 40px;
  padding-bottom: 90px;
}

#contenedor_testimonio {
  margin-top: 4%;
}

.box_testimonio_center {
  display: flex;
  justify-content: center;
  width: 100%;
}

.img-text {
  width: 100%;
  display: block;
  text-align: center;
  padding: 15px;
  color: #fff;
  border-radius: 15px;
  box-shadow: 3px 3px 6px #666, 3px 3px 7px #ccc;
  overflow: auto;
  background: linear-gradient(to bottom, #d1d9b4 15%, white 40%);
}


.img-text h2 {
  font-size: 25px;
  text-transform: uppercase;
  letter-spacing: 2px;
  font-weight: bold;
  font-family: 'Roboto-Light';
  text-shadow: 1px 1px 1px #666, 3px 3px 5px #ccc;
}

.img-text h4 {
  font-size: 18px;
  text-transform: uppercase;
  letter-spacing: 3px;
  font-weight: bold;
  font-family: 'Roboto-Light';
  text-shadow: 1px 1px 1px #666, 3px 3px 5px #ccc;
}

.img-text p {
  font-family: 'Roboto-Light';
  color: #666;
  text-align: left;
  letter-spacing: 2px;
  font-size: 14px;
}

#fondo_contenido_slider {
  background: #d1d9b4;
}

.single-box {
  width: 98%;
  position: relative;
  margin-bottom: 20px;
  display: flex;
  justify-content: center;
}

.img-area {
  position: absolute;
  width: 100px;
  height: 100px;
  border: 5px solid #fff;
  overflow: hidden;
  top: 38px;
  left: 130px;
  margin-bottom: 50px;
  border-radius: 50%;
}

.img-area img {
  width: 100%;
  height: 100px;
}

#indicators_testimonio {
  left: 0;
  top: auto;
  bottom: -50px;
}

#indicators_testimonio button {
  background: #fff;
  border-radius: 50%;
  width: 17px;
  height: 0px;
  margin-top: 10px;
}

#slider_item .active {
  background: #fff;
  border-radius: 50%;
  width: 15px;
  height: 5px;
}



.cont-testimonio {
  height: 700px;
  border-radius: 15px;
  background: linear-gradient(to bottom, #d1d9b4 8%, white 20%);
}

.cont-testimonio h3 {
  color: #fff;
  font-size: 25px;
  text-transform: uppercase;
  letter-spacing: 2px;
  font-weight: bold;
  font-family: 'Roboto-Light';
  text-shadow: 1px 1px 1px #666, 3px 3px 5px #ccc;
  padding-top: 20px;
}

.cont-testimonio h4 {
  font-size: 18px;
  text-transform: uppercase;
  letter-spacing: 3px;
  font-weight: bold;
  font-family: 'Roboto-Light';
  text-shadow: 1px 1px 1px #666, 3px 3px 5px #ccc;
  color: #fff;
  padding-bottom: 10px;
}

.cont-testimonio p {
  font-family: 'Roboto-Light';
  color: #666;
  text-align: left;
  letter-spacing: 2px;
  font-size: 17px;
  padding: 15px;
  margin-top: 20px;
  line-height: 25px;
  text-align: justify;
}

.cont-testimonio hr {
  color: #fff;
}

.carousel-control-prev-icon,
.carousel-control-next-icon {
  background-color: #d1d9b4;
  border-radius: 30%;
}


/* footer */



footer {
  padding: 20px;
  box-shadow:
    inset 0 -3em 3em #d1d9b4,
    0 0 0 2px rgb(255, 255, 255),
    0.3em 0.3em 1em rgba(0, 0, 0, 0.3);
}

.footer-h3 {
  text-decoration: 1px underline;
  text-shadow: 3px 3px 5px #666;
  padding-top: 30px;
  padding-bottom: 10px;
  font-size: 20px;
}

.footer-h3 a {
  text-decoration: none;
}


.social-footer {
  color: #666;
}

.social-footer a img {
  width: 25px;
}


.social-footer a spam {
  color: #666;
}

.social-footer ul li {
  font-size: 15px;
}

.social-footer ul li a {
  color: #666;
}

/* Redes sociales */

.redes-container {
  display: flex;
  justify-content: center;
}

.redes-sociales {
  display: flex;
  align-items: center !important;
  width: 100%;
  padding: 10px;
}

.redes-sociales a {
  margin: 0 5px;
}

.redes-sociales .linea-horizontal {
  flex-grow: 1;
  height: 1px;
  background-color: #d1d9b4;
  margin: 0 10px;
}

.redes-sociales a {

  color: #d1d9b4;

  margin: 0 10px;
  /* Separación entre los iconos */
  font-size: 24px;
  /* Tamaño de los iconos */
}

.redes-sociales a:hover {
  color: #c2ca9b;
}

.nav-line {
  height: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #d1d9b4;
  font-size: 15px;
  letter-spacing: 1px;
 
}

.nav-link {
  text-decoration: none;
  color: #d1d9b4;
  padding-left: 5px;
  font-weight: bold;
  position: relative;
} 

.nav-link:hover {
  text-decoration: underline;
  color: #c2ca9b;

}

.nav-link::before {
  content: "|";
  position: absolute;
  left:0px;
  
  color: #d1d9b4;

}

.nav-link:first-child::before {
  content: "";
}
 
.logo-footer {
  margin-top: 10px;
  /* Separación del logo respecto a los enlaces */
  text-align: center;
}

.logo-footer img {
  width: 100px;
  /* Ancho del logo */

}

#firma_footer {
  width: 120px;
  margin: 0 auto;
  color: #666;
}

#derechos_autor {
  display: flex;
  justify-content: center;
}

#derechos_autor a,
h5,
spam {
  /* color: #c2ca9b; */
  color: #d1d9b4;
  font-size: 16px;
}

#derechos_autor a {
  font-weight: 800;
}

#derechos_autor a:hover {
  text-decoration: underline;
  color: #c2ca9b;
}


/* contacto */

#caja_contacto {
  width:318px;
  max-height: 250px;
  background: #d4d8b8;
  color: white;
  box-shadow: inset 5px 5px 5px 0 #888;
  padding-top: 20px;
  padding-bottom: 15px;
  border-radius: 5px;
  border: 2px solid white;
}



/* Iconos contacto */

#redes_sociales a {
  display: block;
  text-decoration: none;
  color: #666;
  font-size: 25px;
  margin-right: 10px;
}






/* formulario contacto */

#contacto_cont {
  display: block;
  margin: 0px auto;
  margin-top: -32px;
  font-size: 17px;
}

#contacto_p1 h2 {

  color: #666;
  font-size: 60px;
  font-weight: normal;
  letter-spacing: 4px;
  text-shadow: 3px 3px 5px #666;
  animation: showTextContacto 4s linear;

}


.box_contacto {

  min-height: 260px;
  background-color: #d1d9b4;
  padding-top: 23px;
  padding-bottom: 25px;
  overflow: hidden;
  margin-bottom: 40px;
  border-radius: 4px;
  box-shadow: 3px 9px 6px #666, 3px 3px 7px #ccc;
}


#titulo_contacto {
  font-size: 25px;
  color: white;
  text-shadow: 1px 1px 1px #666, 3px 3px 5px #ccc;
  text-transform: uppercase;
}

#banner_contacto h1 {
  display: block;
  font-size: 50px;
  font-weight: bold;
  margin-top: -130px;
  text-align: center;
  text-transform: uppercase;
  color: white;
  text-shadow: 1px 1px 1px #666, 3px 3 px 5px #ccc;
  letter-spacing: 9px;
}



#banner_contacto img {

  width: 100%;
  max-height: 350px;
  border-radius: 10px;
  box-shadow: 25px 25px 10px #777;
  margin: auto;
  margin-top: 50px;
  margin-bottom: 50px;
  margin-left: 15px;
}



#firma_politica {

  display: flex;
  text-align: center;
}


/* Formulario contacto */

/* #caja_contactame {
  margin: 0px auto;
  margin-bottom: 50px;
  border-radius: 7px;

} */

.contenedorFormulario {

  background: #d1d9b4;
  padding-top: 20px;
  padding-left: 40px;
  padding-right: 20px;
  padding-bottom: 3px;
  margin-bottom: 50px;
  border-radius: 4px;
  text-align: left;
  text-transform: uppercase;
  font-weight: bold;
  letter-spacing: 1px;
  color: #000;
  box-shadow: 3px 9px 6px #666, 3px 3px 7px #ccc;
}

.contenedorFormulario h1 {
  font-size: 25px;
  color: white;
  text-shadow: 1px 1px 1px #666, 3px 3px 5px #ccc;
  text-decoration: underline;
}

#form_contacto {
  display: block;
  text-align: left;
  margin: 20px auto;
  height: 50% !important;


}

.enviar {
  display: block;
  width: 190px;
  margin-top: 20px !important;
  border-radius: 0.4rem;
  margin: 0px auto;
  background: rgb(255, 255, 255, 1);
  border: 2px solid #a7a7a7;
  letter-spacing: 2px;
  font-weight: bold;
  color: #666;
  box-shadow: 0px 0px 5px #666;
}

.enviar:hover {

  /* background: rgb(255,255,255,1); */
  background: #bec2a5;
  transition: all 300ms;
  color: white;
  box-shadow: inset 8px 8px 10px 0 #666;
  /* box-shadow: 0px 0px 6px rgb(71, 70, 70) inset; */

}

.form-control {
  display: block;
  border-radius: 0.4rem;

}

textarea {
  height: 120px;

}


th,
td {
  display: block;
  margin-bottom: 3px;
  font-size: 13px;
}

#contents {
  width: 75%;
  padding-bottom: 10px;
  margin: 0 auto;
  margin-bottom: 30px;
  border-radius: 7px;
  background: linear-gradient(-157deg, white 47%, #ddd 104%);

}

#img_contacto img {
  display: block;
  width: 65%;
  max-height: 400px;
  margin-bottom: 20px;
}

#label_privacidad {

  font-size: 12px;
  text-transform: none;
  letter-spacing: 1px;
}

#label_privacidad a {
  text-decoration: none;

  color: white;
  font-size: 14px;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 1px;
}

#label_privacidad a:hover {
  text-decoration: underline;
  font-size: 16px;
}

table ul li {
  color: red;
  background: yellow;
}

.alert-success {

  width: 98%;
  display: block;
  padding-left: 0px;
  background: rgb(129, 245, 129);
  color: white !important;
  text-align: center;
  margin-left: 20px;
  margin-top: -670px;
  margin-bottom: 580px;
  border: 3px dotted white;
}

.alert-error {
  width: 98%;
  padding-left: 0px;
  background: orange;
  color: white !important;
  text-align: center;
  margin-left: 20px;
  margin-top: -670px;
  margin-bottom: 580px;
  border: 3px dotted white;
}


#caja_contacto .overlay {
  display: block;
  height: 20px;
  font-family: 'roboto';
  font-weight: bold;
  font-size: 14px;
  letter-spacing: 1px;
  text-shadow: 0px 0px 1px #ccc;
  border: 1px solid white;
  border-radius: 5px;
  box-shadow: 0px 0px 4px #ccc;
  background: #bec2a5;
  position: absolute;
  padding-bottom: 25px;
  padding-left: 5px;
  padding-right: 5px;
  margin-left: 175px;
  margin-top: -32px;
  transform: translatex(-80%);
  opacity: 0;
  transition: all 1s;

}



#caja_contacto div:hover .overlay {
  opacity: 1;
  transform: translatex(0%);

 }



/*  Fin contacto */


/* redes sociales fija */

.social {

  width: 46px;
  position: fixed;
  background: #f2f3e9;
  border-radius: 5px;
  box-shadow: 3px 9px 6px #666, 3px 3px 7px #d1d9b4;
  top: 95%;
  height: 130px;
  margin-top: -100px;
  padding-top: 7px;
  padding-left: 5px;
  /*  transform: translatex(-38%); */
  transition: all 200ms;
  z-index: 100;
}

.social:hover {
  transform: translatex(0%);
}

.social h3 {
  font-family: 'roboto';
  font-size: 10px;
}

.social a {
  font-size: 13px;
  /* color: #c2ca9b; */
  color: #d1d9b4;
  padding-left: 5px;
  padding-top: 3px;
  display: block;
  margin-bottom: 10px;
}

.social a:hover {
  color: #c2ca9b;
}


#firma_politica {
  display: block;
  padding-top: 40px;
}


/* politica de privacidad */

#titulos_declaracion {
  font-size: 20px;
  margin-top: 50px;
}

#banner_privacidad h1 {
  display: block;
  font-family: 'lobster';
  font-size: 35px;

  margin-top: 325px;
  text-align: center;

  color: white;
  text-shadow: 1px 1px 1px #444, 3px 3px 5px #555;
  letter-spacing: 7px;
}

#banner_privacidad {
  display: block;
  background-image: url("../img/politica_privacidad.png");
  border-radius: 240px;
  width: 96%;
  height: 500px;
  overflow: hidden;
  background-size: 121% 70%;
  /* tamaño de la imagen en el fondo de la caja */
  background-repeat: no-repeat;
  background-position: center center;
  animation: backBannerPrivacidad 2s linear;
}



#titulo_privacidad h2 {
  color: #666;
  font-family: 'tangerine';
  font-size: 60px;
  font-weight: normal;
  letter-spacing: 4px;
  text-shadow: 3px 3px 5px #666;
  text-decoration: underline 1px #ccc;
  font-style: italic;
}

#caja_privacidad {
  font-family: 'roboto';
  font-size: 14px;
  color: #666;
  letter-spacing: 2px;
  line-height: 28px;
}


/* fin privacidad */

/*  Aviso legal */

#banner_aviso_legal h1 {
  display: block;
  font-family: 'lobster';
  font-size: 35px;

  margin-top: 325px;
  text-align: center;

  color: white;
  text-shadow: 1px 1px 1px #444, 3px 3px 5px #555;
  letter-spacing: 7px;
}

#banner_aviso_legal {
  display: block;
  background-image: url("../img/aviso_legal.png");
  border-radius: 240px;
  width: 96%;
  height: 500px;
  overflow: hidden;
  background-size: 121% 70%;
  /* tamaño de la imagen en el fondo de la caja */
  background-repeat: no-repeat;
  background-position: center center;
  animation: backBannerPrivacidad 2s linear;
}


/* blog */

#caja_banner {
  width: 100%;

}

#banner_blog {
  width: 100%;
  height: 300px;
  background-image: url("../img/banner_blog1.jpg");
  background-size: 100% 100%;
  background-repeat: no-repeat;
  margin-top: 50px;
  margin-bottom: 100px;
  border-radius: 10px;
  box-shadow: 25px 25px 10px #777;
  margin-right: 20px;
  margin-left: 41px;
}


#contents {
  width: 75%;
  padding-bottom: 10px;
  margin: 0 auto;
  margin-bottom: 100px;
  border-radius: 7px;
  background: linear-gradient(-157deg, white 47%, #ddd 104%);
}

#titulo_elige {
  display: block;
  margin-top: 40px;
  margin-bottom: 20px;
  background: #e8ead9 70%;
  position: relative;
  top: 0;
  width: 320px;
  height: 70px;
  z-index: 0;
  border-radius: 4px;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
  box-shadow: 3px 3px 6px #666, 3px 3px 7px #ccc;
}


#categorias_blog {

  position: relative;
  width: 100%;
  font-size: 1.6em;
  font-weight: bold;
  text-align: center;
  color: rgb(82, 70, 70);
  letter-spacing: 1.6px;
  text-transform: uppercase;
  margin-top: -32px;
  padding-bottom: 20px;
  text-shadow: 1px 1px 1px #666, 3px 3px 5px #666;
  line-height: 73px;
}


#linia_subrayado {
  background: #d1d9b4;
  position: absolute;
  width: 62%;
  height: 8px;
  bottom: 27%;
  left: 20%;
  border-radius: 15px;
  z-index: -1;
}

#caja_categorias {
  width: 100%;
  margin-top: 50px;
  margin-bottom: 20px;
}

/*caja_boton */
#boton_categorias {
  display: block;
  border: 1px solid #ccc;
  box-shadow: 3px 3px 6px #666, 3px 3px 7px #ccc;
  width: 200px;
  height: 43px;
  margin: auto;
  margin-top: 10px;
  margin-bottom: 20px;
  font-size: 11px;
  font-weight: bold;
  text-shadow: 2px 5px 15px #666;
  text-transform: uppercase;
  letter-spacing: 0.2px;
  color: #666;
  padding-top: 13px;
  padding-bottom: 10px;
  padding-left: 7px;
  padding-right: 7px;
  background: linear-gradient(to bottom, #d1d9b4 50%, #d4d8b8 100%);
}

#boton_categorias:hover {

  background: #bec2a5;
  border: 1px solid #ccc;
  color: white;
  font-weight: 700;
  letter-spacing: 0.2px;
  box-shadow: inset 8px 8px 10px 0 #666;
  transition: all 500ms;
}

#content_blog {
  margin-left: 35px;
  margin-right: 20px;
}

#contenido_articulos {
  width: 30%;
}

/* Artículos */
#title {
  display: flex;
  justify-content: center;
}

.title {
  color: #666;
  letter-spacing: 1px;
  margin-bottom: 50px;
  text-shadow: 3px 3px 5px #aaa;
  text-transform: uppercase;
  text-decoration: underline;
  text-align: start;
}


.title_articulo {
  color: #666;
  letter-spacing: 1px;
  margin-top: 20px;
  margin-bottom: 50px;
  text-shadow: 3px 3px 5px #aaa;
  text-transform: uppercase;
  text-align: center;
}


.date {
  display: block;
  color: rgb(165, 154, 154);
  font-size: 13px;
  letter-spacing: 1px;
}

.date_page {
  display: block;
  color: rgb(165, 154, 154);
  font-size: 13px;
  letter-spacing: 1px;
  margin-left: 35px;
}

.content {
  line-height: 25px;
  color: #444;
  font-family: 'Roboto-Light';
}

.fondo_articulos {
  background: #f2f3e9;
  box-shadow: 3px 3px 3px 10px #f2f3e9;
  border-radius: 2px;
}

#article {
  margin: 0 auto;
  margin-top: 40px;
  background: #f2f3e9;
  box-shadow: 3px 3px 3px 10px #f2f3e9;
  border-radius: 2px;
}


/* Para quitarle los estilos y cambiarlos a los enlaces de articulos de la página de cada categoría */
.data h2 a {

  color: #444;
  font-family: 'Roboto-Light';
  font-size: 25px;
  font-weight: 500;
  letter-spacing: 2px;
  text-shadow: 3px 3px 5px #aaa;
  text-align: center;
  margin-bottom: 10px;
}

.data h2 a:hover {
  color: #d1d9b4;
  text-shadow: 3px 3px 5px #ddd;
  transition: all 300ms;
}

.data h2 {
  text-align: center;
}

/* Para quitarle los estilos y cambiarlos a los enlaces de categorias de la página de cada categoría */

#data_pag a {
  text-decoration: none;
  color: rgb(165, 154, 154);
  font-size: 13px;
  letter-spacing: 1px;
}

#data_pag a:hover {
  color: #d1d9b4;
  font-weight: bold;
  text-decoration: underline;
  transition: all 300ms;
}

#data_page {
  text-align: center;
  margin-bottom: 20px;
}

/* titulo articulo */
#data_page a {
  text-decoration: none;
  color: #555;
  font-size: 21px;
  letter-spacing: 1px;

}

#data_page a:hover {
  color: #d1d9b4;
  text-decoration: underline;
  text-shadow: 1px 1px 1px #555, 3px 3px 5px #ccc;
}

.image {
  display: flex;
  justify-content: center;
}

.image>img {

  width: 96%;
  margin-top: 20px;
  border-radius: 5px;
  box-shadow: 2px 2px 7px rgb(87, 85, 85);
}

#image_articulo {
  max-width: 800px;
  /* display: flex;
  justify-content: center; */
  margin: auto;
}

#image_articulo img {
  width: 100%;
  max-height: auto;
  margin-bottom: 15px;
  margin-top: 30px;
  border-radius: 5px;
  box-shadow: 2px 2px 7px rgb(87, 85, 85);
}


/* Media query para el ancho mínimo */
@media screen and (max-width: 260px) {
  #image_articulo img {
    width: 260px;
    /* Ancho mínimo de 250px */
  }
}


#content_content {
  letter-spacing: 1px;
  text-align: left;
  line-height: 25px;
}


#content_resumen {
  letter-spacing: 1px;
  line-height: 25px;


}

/*  Paginación blog */
.center_pagination {
  display: flex;
  justify-content: center;
}

.center_pagination_actual {
  display: flex;
  justify-content: center;
}

.pagination {
  display: flex;
  justify-content: start;
  margin-bottom: 20px;
}

.boton_pagination {
  width: 75px;
  height: 28px;
  text-decoration: none;
  color: #666;
  font-size: 12px;
  font-weight: bold;
  margin-left: 5px;
  margin-right: 2px;
  margin-top: 5px;
  border-radius: 5px;
  border: 1px solid #d1d9b4;

  box-shadow: 3px 3px 6px #666, 3px 3px 7px #ccc;
  cursor: pointer;
  letter-spacing: 1px;

}

.boton_pagination:hover {
  background: #d1d9b4;
  color: white;
  font-weight: bold;
  box-shadow: inset 8px 8px 10px 0 #666;
  transition: all 500ms;
}

.actual {
  margin-left: 10px;
  margin-right: 5px;
  margin-top: 10px;
  margin-bottom: 40px;
}

/* Fin artículos */


/* Página artículos */

#presentacion_pag_blog {
  margin-bottom: 20px;
  border-radius: 2px;

}

#caja_articulo {
  width: 90%;
  background: white;
  padding: 20px;
  border-radius: 5px;
  box-shadow: 3px 25px 25px #666;
  margin-bottom: 40px;
  margin-top: 40px;

}

/* caja verde de la lista de articulos */
#caja_general_articulos {
  width: 1000px;
  background: #f2f3e9;
  box-shadow: 3px 3px 3px 10px #f2f3e9;
  border-radius: 2px;
  margin-bottom: 50px;
}

/* caja verde de un articulo */
#caja_general_pag_articulos {
  max-width: 1200px;
  background: #f2f3e9;
  box-shadow: 3px 3px 3px 10px #f2f3e9;
  border-radius: 2px;
  margin-bottom: 50px;
  margin-left: 10px;
}


#caja_articulos {

  width: 95%;
  height: 640px;
  background: white;
  padding-top: 20px;
  padding-left: 20px;
  padding-right: 20px;
  margin-bottom: 40px;
  border-radius: 5px;
  box-shadow: 3px 1px 6px #777, 3px 3px 20px #aaa;
  font-size: 14px;
  overflow: hidden;
}

#caja_articulos:hover {
  width: 97%;
  box-shadow: 18px 18px 10px #777;
  transition: all 200ms;
}

/* flecha arriba blog*/
#boton_arriba a img {
  display: block;
  width: 65px;
  margin: 0px auto;
  margin-top: 40px;
  margin-bottom: 40px;
}


#caja_articulo .chincheta_1,
#caja_articulo .chincheta_2 {
  display: block;
  width: 40px;
  position: absolute;
  margin-top: -42px;
}

#caja_articulo .chincheta_2 {
  left: 76%;
}

#boton_articulos {
  display: block;
  border: 2px solid #d1d9b4;
  box-shadow: 3px 3px 6px #666, 3px 3px 7px #ccc;
  width: 200px;
  height: 43px;
  margin: auto;
  font-size: 11px;
  font-weight: bold;
  text-shadow: 2px 5px 15px #666;
  text-transform: uppercase;
  letter-spacing: 2px;
  color: #666;
  padding-top: 13px;
  padding-left: 7px;
  padding-right: 7px;
}


#boton_articulos:hover {
  background: #d1d9b4;
  color: white;
  font-size: 12px;
  font-weight: bold;
  box-shadow: inset 8px 8px 10px 0 #666;
  transition: all 500ms;
}

/* fin blog */

/* Indicación del blog en base.htmml */
#descubre_blog {
  background: #f2f3e9;
  border-radius: 7px;
  border: none;
  box-shadow: 3px 3px 15px #f2f3e9;
  display: flex;
  justify-content: center;
  margin-top: 50px;
  margin-bottom: 40px;
  margin-left: 10px;
  margin-right: 10px;
  padding: 20px;
  line-height: 25px;
}

.box-visita-blog {
  max-width: 1000px;
  padding: 0 auto;
}

.box-visita-blog p {

  margin: 0 auto;
}


/* sobre mi*/


#mi-container {
  background-color: #f2f3e9;
  margin-left: 15px;
  margin-right: 15px;
  margin-top: 30px;
  margin-bottom: 30px;
  padding-top: 15px;
  padding-bottom: 15px;
  padding-left: 15px;
  padding-right: 15px;
  border-radius: 10px;
  box-shadow: 5px 5px 10px #f2f3e9;
}

.custom-img {
  max-width: 420px;
  height: auto;
  margin-bottom: 20px;
  border-radius: 10px;
  box-shadow: 4px 4px 10px rgb(87, 85, 85);

}

#text-soy {
  font-weight: bold;
  margin-bottom: 20px;
  letter-spacing: 1px;

}


#text-miHistoria {
  margin-top: 40px;
  margin-bottom: 30px;
  letter-spacing: 1px;
  text-decoration: underline;
  font-style: italic;
  font-weight: 400;

}

#box_sobreMi {
  margin-top: 40px;
}

#box_sobreMi p,
#box_2_historia p {
  letter-spacing: 2px;
  line-height: 40px;


}


@media (min-width: 768px) {
  .custom-img {
    margin-right: 20px;
    margin-bottom: 0;

  }
}

/* CSS */
@media (max-width: 992px) {
  #mi-container {
    max-width: 1200px;
    /* Ancho deseado para pantallas mayores a 991px */
  }

}

@media (max-width: 390px) {
  #mi-container {
    max-width: 370px;
    /* Ancho deseado para pantallas mayores a 991px */

  }

}


@media (max-width: 833px) {
  .custom-img {
    max-width: 370px;
  }
}

@media (max-width: 390px) {
  .custom-img {
    max-width: 320px;
  }
}

@media (max-width: 360px) {
  .custom-img {
    max-width: 300px;
  }
}

@media (max-width: 326px) {
  .custom-img {
    max-width: 280px;
  }
}

@media (max-width: 1200px) {

  #box_sobreMi {
    margin-left: 40px;

  }
}

@media (max-width: 991px) {

  #box_sobreMi {
    margin-left: 5px;
    margin-right: 5px;

  }
}

#btn_sobre_mi {
  display: block;
  border: 1px solid #ccc;
  border-radius: 5px;
  box-shadow: 3px 3px 6px #666, 3px 3px 7px #ccc;
  width: 200px;
  height: 50px;
  margin: auto;
  margin-top: 80px !important;
  margin-bottom: 20px;
  font-size: 17px;
  font-weight: bold;
  letter-spacing: 2px !important;
  text-shadow: 2px 5px 15px #666;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: #666;
  padding-left: 7px;
  padding-right: 7px;
  background: linear-gradient(to bottom, #d1d9b4 50%, #d4d8b8 100%);
  margin-top: -60px;
  line-height: 2.9;
  text-align: center;

}


#btn_sobre_mi:hover {
  background: #bec2a5;
  border: 1px solid #ccc;
  color: white;
  font-weight: 700;
  box-shadow: inset 8px 8px 10px 0 #666;
  transition: all 500ms;
}


#btn_sobre_mi_2 {
  display: block;
  border: 1px solid #ccc;
  border-radius: 5px;
  box-shadow: 3px 3px 6px #666, 3px 3px 7px #ccc;
  width: 200px;
  height: 50px;
  margin: auto;
  margin-bottom: 10px;
  font-size: 17px;
  font-weight: bold;
  letter-spacing: 2px !important;
  text-shadow: 2px 5px 15px #666;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: #666;
  padding-left: 7px;
  padding-right: 7px;
  background: linear-gradient(to bottom, #d1d9b4 50%, #d4d8b8 100%);
  line-height: 2.9;
  text-align: center;
}

#btn_sobre_mi_2:hover {
  background: #bec2a5;
  border: 1px solid #ccc;
  color: white;
  font-weight: 700;
  box-shadow: inset 8px 8px 10px 0 #666;
  transition: all 500ms;
}


#text_aprender h2,
#text_frase h2 {

  font-family: 'tangerine';
  font-size: 44px;
  font-weight: normal;
  color: #444;
  margin-top: 50px;
  margin-bottom: 30px;
  text-shadow: 1px 1px 4px #555;
  text-align: center;
  padding: 15px;
  line-height: 68px;
}

#text_aprender,
#text_frase {
  max-width: 1500px;
  margin-left: 10px;
  margin-right: 10px;
  letter-spacing: 2px;
  border-radius: 7px;
  background: linear-gradient(46deg, #bbb, #ccc, #bbb);
  box-shadow: 3px 3px 13px #999;
}


#titulo_valores {
  letter-spacing: 2px;
  font-weight: 700;
  margin-bottom: 45px;

}

#img_sobre_Mi {

  border-radius: 10px;
  box-shadow: 4px 4px 10px rgb(87, 85, 85);
  padding: 0px;
}



/*----------------------- Servicios ----------------------- */

/* template terapias para animales */

.card-img-top {

  width: 100%;
  height: 400px;
  object-fit: fill;
}

.efecto2
{
  position: relative;
}
.efecto2:before, .efecto2:after
{
/* Posiciona la sobora por detras del color de la caja*/
                  z-index: -1;
                  position: absolute;
                  /* no aplico ningún contenidos HTML */
                  content: "";
                  /* posiciona la sombra con respecto al borde inferior, izquierdo y superior */
                  bottom: 15px;
                  left: 10px;
                  top: 80%;
                  /* configura el ancho */
                  width: 50%;
/* color de fondo */
                  background: #777;
                  /* definicion de la sombra estandar para box-shadow */
                  -webkit-box-shadow: 0 15px 10px #777;
                  -moz-box-shadow: 0 15px 10px #777;
                  box-shadow: 0 15px 10px #777;
                  /* rotacion de la sombra */
                  -webkit-transform: rotate(-3deg);
                  -moz-transform: rotate(-3deg);
                  -o-transform: rotate(-3deg);
                  -ms-transform: rotate(-3deg);
                  transform: rotate(-3deg);
}

/* Aquí, gracias una potente propiedad de CSS3 (transform: rotate), rotamos la sombra para crear el efecto deseado.

Luego solo para la sombra que está “después” de la caja, es decir, a la derecha, modificamos la rotación y la posición de la misma:
 */

.efecto2:after
{
                  /* rotacion de la sombra */
                  -webkit-transform: rotate(3deg);
                  -moz-transform: rotate(3deg);
                  -o-transform: rotate(3deg);
                  -ms-transform: rotate(3deg);
                  transform: rotate(3deg);
                  /* posiciona la sombra con respecto al borde izquierdo y derecho */
                  right: 10px;
                  left: auto;
}



/* cards prueba animales */


.flow > * + * {
  margin-top: var(--flow-space, 1em);
}

/* CARD COMPONENT */
#fondo-cards{
  background: #f2f3e9;
  box-shadow: 3px 3px 3px 10px #f2f3e9;
  border-radius: 2px;
  margin-bottom: 50px;
}
.card {
  display: grid;
  place-items: center;
  width: 80vw;
  max-width: 21.875rem;
  height: 28.125rem;
  overflow: hidden;
  border-radius: 0.625rem;
  box-shadow: 0.25rem 0.25rem 0.5rem rgba(0, 0, 0, 0.25);
  padding: 0px;
}

.card > * {
  grid-column: 1 / 2;
  grid-row: 1 / 2;
}

.card__background {
  object-fit: cover;
  max-width: 100%;
  height: 100%;
}

.card__content {
  --flow-space: 0.9375rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-self: flex-end;
  height: 97%;
  padding: 12% 1.25rem 1.875rem;
  background: linear-gradient(
    180deg,
    hsla(0, 0%, 0%, 0) 0%,
    hsla(0, 0%, 0%, 0.3) 10%,
    hsl(0, 0%, 0%) 100%
  );
}

.card__content--container {
  --flow-space: 1.25rem;
}

.card__title {
  position: relative;
  width: -moz-fit-content; /* Prefijo necesario para Firefox  */
  width: fit-content; 
  color: #fff;
  font-size: 21px;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-weight: bold;
  font-family: 'Roboto-Light';
  text-shadow: 1px 1px 1px #666, 3px 3px 5px #ccc;
  padding-top: 20px;
}



.card__title::after {
  content: "";
  position: absolute;
  height: 0.3125rem;
  width: calc(100% + 1.25rem);
  bottom: calc((1.25rem - 0.5rem) * -1);
  left: -1.25rem;
  background-color: var(--brand-color);
}

.card__description{
  color: #fff;
}


@media (any-hover: hover) and (any-pointer: fine) {
  .card__content {
    transform: translateY(30%);
    transition: transform 500ms ease-out;
    transition-delay: 500ms;
  }

  .card__title::after {
    opacity: 0;
    transform: scaleX(0);
    transition: opacity 1000ms ease-in, transform 500ms ease-out;
    transition-delay: 500ms;
    transform-origin: right;
  }

  .card__background {
    transition: transform 500ms ease-in;
  }

  .card__content--container > :not(.card__title),
  .card__button {
    opacity: 0;
    transition: transform 500ms ease-out, opacity 500ms ease-out;
  }

  .card:hover,
  .card:focus-within {
    transform: scale(1.05);
    transition: transform 500ms ease-in;
  }

  .card:hover .card__content,
  .card:focus-within .card__content {
    transform: translateY(0);
    transition: transform 500ms ease-in;
  }

  .card:focus-within .card__content {
    transition-duration: 0ms;
  }

  .card:hover .card__background,
  .card:focus-within .card__background {
    transform: scale(1.3);
  }

  .card:hover .card__content--container > :not(.card__title),
  .card:hover .card__button,
  .card:focus-within .card__content--container > :not(.card__title),
  .card:focus-within .card__button {
    opacity: 1;
    transition: opacity 500ms ease-in;
    transition-delay: 1000ms;
  }

  .card:hover .card__title::after,
  .card:focus-within .card__title::after {
    opacity: 1;
    transform: scaleX(1);
    transform-origin: left;
    transition: opacity 500ms ease-in, transform 500ms ease-in;
    transition-delay: 500ms;
  }
}

/* -------------------- */


/* Asesor felino */
#titulo_fel {
  position: relative;
  text-align: center;
  margin-top: 30px;
  margin-bottom: 73px;
}

#titulo_asesor_felino h1 {
  width: 100%;
  position: absolute;
  font-size: 30px;
  font-weight: normal;
  text-transform: uppercase;
  letter-spacing: 4px;
  text-shadow: 3px 3px 5px #666;
  left: 50%;
  transform: translate(-50%, -50%);
  margin-top: 50px;
}

#cont_asesor {
  padding-top: 35px;
  padding-bottom: 50px;
  border-radius: 5px;
  margin-top: 60px;
  line-height: 40px;
  text-align: justify;
}


#cont_asesor h2 {
  margin-bottom: 10px;
  font-family: 'Roboto-Light';
  font-size: 17px;
  line-height: 25px;
  letter-spacing: 1.7px;
  margin-left: 60px;
}


#huella_gato {
  width: 33px;
  float: left;
  display: block;
  margin-top: -12px;
}

#puedo_ayudar_1 {
  display: flex;
  justify-content: center;
}

#puedo_ayudar {
  
 
  display: flex;
  align-items: center;
  justify-content: center;
  
  width: 220px;
  height: 45px;
  border: 1px #ccc;
  background: linear-gradient(to bottom, #d1d9b4 70%, #d4d8b8 100%);
  font-weight: bold;
  margin-top: 30px;
  margin-bottom: 30px;
  border-radius: 5px;
  box-shadow: 2px 2px 5px #666;
  
}

#puedo_ayudar h2{
  letter-spacing: 2px;
  font-weight: bold;
  font-size: 17px;
  margin: 0px auto;

}


#gato_portada img {
  width: 320px;
  height: 320px;
  border-radius: 183px;
  box-shadow: 4px 4px 20px #888, 4px 4px 20px #ccc, 4px 4px 20px white;
}

#gato_portada {
  display: flex;
  justify-content: center;
  margin-bottom: -65px;
}

#barra {
  display: flex;
  justify-content: center;
  margin-top: 40px;
  margin-bottom: 50px;
}

#barra_separadora {
  width: 70%;
  height: 1px;
  background: #d1d9b4;
  border-radius: 3px;
  box-shadow: 1px 1px 5px #d1d9b4;
}

/* cajas 1 y 2 del contenido de las terapias */

.lista_1,
.lista_2 {
  border: 2px solid #d1d9b4;
  margin-bottom: 50px;
  border-radius: 7px;
  box-shadow: 2px 2px 20px #777;
  
}


.lista_1 ul,
.lista_2 ul {
  margin: auto;
  margin-bottom: 33px;
  
}


.lista_huellas {
  list-style: none;
  list-style-image: url("../img/huellas.png");
  
}



.lista_huellas_2 {
  list-style: none;
  list-style-image: url("../img/persona2.png");
  
}


#lista_ayudar {
  margin: auto;
  margin-bottom: 20px;
  margin-left: 10px;
}


#lista_ayudar li {
  font-size: 17px;
  color: #666;
  letter-spacing: 1px;
  margin: auto;
  margin-top: 16px;
  margin-bottom: 14px;
  line-height: 25px;

}


#lista_ayuda li {
  font-size: 17px;
  color: #666;
  letter-spacing: 1px;
  margin: auto;
  margin-top: 16px;
  margin-bottom: 14px;
  line-height: 25px;
  text-align: justify;
}

#texto_huellas {
  padding-bottom: 5px;
}


#text_asesor {
  font-family: 'tangerine';
  font-size: 50px;
  font-weight: normal;
  color: #444;
  text-shadow: 2px 2px 6px #444;
  text-align: center;
  margin-top: 10px;
  line-height: 68px;
}

#text_asesor_2 {
  font-family: 'tangerine';
  font-size: 40px;
  font-weight: normal;
  color: #444;
  margin-bottom: 35px;
  text-shadow: 2px 2px 3px #999;
  text-align: center;
  line-height: 68px;
}

#btn_cita {
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #ccc;
  box-shadow: 3px 3px 6px #666, 3px 3px 7px #ccc;
  width: 200px;
  height: 50px;
  margin: auto;
  margin-top: 20px;
  margin-bottom: 50px;
  font-size: 16px;
  font-weight: bold;
  text-shadow: 2px 5px 15px #666;
  text-transform: uppercase;
  letter-spacing: 2px;
  color: #666;
  align-items: center;
  justify-content: center;
  background: linear-gradient(to bottom, #d1d9b4 50%, #d4d8b8 100%);
}

#btn_cita:hover {
  background: #bec2a5;
  border: 1px solid #ccc;
  color: white;
  font-weight: 700;
  letter-spacing: 0.9px;
  box-shadow: inset 8px 8px 10px 0 #666;
  transition: all 500ms;
}


/*En que consiste */
#btn_puedo {
  /* display: block; */
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #ccc;
  box-shadow: 3px 3px 6px #666, 3px 3px 7px #ccc;
  width: 255px;
  height: 45px;
  text-transform: uppercase;
  margin: auto;
  margin-top: 30px;
  font-size: 17px;
  font-weight: bold;
  text-shadow: 2px 5px 15px #666;
  letter-spacing: 2px;
  color: #666;
  padding-top: 9px;
  padding-left: 7px;
  padding-right: 7px;
  padding-bottom: 12px;
  background: linear-gradient(to bottom, #d1d9b4 50%, #d4d8b8 100%);
}

#btn_puedo:hover {
  background: #bec2a5;
  border: 1px solid #ccc;
  color: white;
  font-weight: 700;
  letter-spacing: 0.9px;
  box-shadow: inset 8px 8px 10px 0 #666;
  transition: all 500ms;
}

/* -------------------------- */

.lista_asesor {
  border: 2px solid #d1d9b4;
  margin: auto;
  margin-bottom: 50px;
  border-radius: 7px;
  box-shadow: 2px 2px 20px #777;
}



#hago h3 {
  font-family: 'Roboto-Light';
  font-size: 25px;
  color: #666;
  margin-top: 25px;
  padding-left: 5px;
  padding-right: 5px;
  padding-top: 30px;
}

#hago_1 {
  width: 100%;
  height: 88%;
  min-height: 300px;
  border: 1px #ccc;
  background: linear-gradient(to bottom, #d1d9b4 50%, #d4d8b8 100%);
  border-radius: 3px;
  text-align: center;
  font-weight: bold;
  font-size: 20px;
  margin-top: -4px;
  margin-bottom: 30px;
  padding-bottom: 20px;
  box-shadow: 2px 2px 5px #666;
}



#lista_hago {
  padding-top: 35px;
  padding-bottom: 20px;
  margin: auto;
  
}

#lista_hago li {
  letter-spacing: 1px;
  padding-top: 10px;
  margin: auto;
  margin-bottom: 15px;
  line-height: 25px;
  font-size: 17px;
  
}


#gato_asesor img {
  width: 200px;
  height: 200px;
  border-radius: 183px;
  box-shadow: 4px 4px 20px #888, 4px 4px 20px #ccc, 4px 4px 20px white;
  margin-top: 20px;
}

#text_precio_asesor h3 {
  font-family: 'Roboto-Light';
  background: #f2f3e9;
  font-size: 25px;
  font-weight: bold;
  text-transform: uppercase;
  text-align: center;
  margin-bottom: 30px;
  padding-top: 20px;
  padding-bottom: 20px;
  color: #666;
  letter-spacing: 3px;
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
  text-shadow: 2px 2px 6px #777;
  box-shadow: 2px 2px 6px #aaa;
}

#precio_asesor h3 {
  font-size: 18px;
  text-align: center;
  margin-bottom: 30px;
  letter-spacing: 1px;
}

/* Efectos en las letras */
.tuclase {
  text-align: left;
  font-family: 'Roboto-Light' black;
  font-weight: bold;
  font-size: 30px;
  background: #202020;
  -webkit-background-clip: text;
  -moz-background-clip: text;
  background-clip: text;
  color: transparent;
  text-shadow: 0px 3px 3px rgba(255, 255, 255, 0.4), 0px -1px 1px rgba(0, 0, 0, 0.3);
}


/* servicios - submenu 1 */
/* terapia craneosacral para animales */
#cont_craneo_1 h2 {
  font-size: 15px;
  color: #666;
  letter-spacing: 1px;
  margin: auto;
  line-height: 23px;
}

.tuclase_aviso {
  margin-left: 40px;
  margin-right: 40px;
  margin-bottom: 40px;
  
}

.tuclase_aviso h3 {
  font-family: arial black;
  font-weight: bold;
  font-size: 21px;
  background: #202020;
  -webkit-background-clip: text;
  -moz-background-clip: text;
  background-clip: text;
  color: transparent;
  text-shadow: 0px 3px 3px rgba(255, 255, 255, 0.4), 0px -1px 1px rgba(0, 0, 0, 0.3);
  border: 4px solid #dfe1c8;
  border-radius: 5px;
  text-align: center;
  padding: 0 auto;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-left: 5px;
  padding-right: 5px;
  box-shadow: 2px 2px 10px inset #666;
  
}



/* -------------------------------------------------------------------------------------------------------- */

/* Colaboraciones*/

/*  video */
#myVideo {
  right: 0;
  bottom: 0;
  width: 100%;
  min-height: 84%;
  border-radius: 7px;
}

#video_colaboraciones {
  border-radius: 10px;
  border: 1px solid #ccc;
  box-shadow: 2px 2px 10px #555;
  width: 95%;
  min-height: 84%;
  padding: 10px;
  margin-top: 50px;
  margin-bottom: 50px;
  margin-right: 10px;
  margin-left: 10px;
  justify-content: center;
  z-index: -1;
}

.content_video_colaboraciones {
  display: block;
  bottom: 0;
  color: #f1f1f1;
  width: 100%;
  padding: 20px;
  margin-top: -130px;
  line-height: 2.2;
}


#content_colaboraciones {
  font-family: 'Roboto-Light';
  border: 1px solid #d1d9b4;
  border-radius: 5px;
  box-shadow: 2px 2px 5px #d1d9b4;
  padding: 25px;
  margin-bottom: 30px;
}

#content_colaboraciones ul li {
  line-height: 25px;
  font-size: 17px;
}


#titulo_colaborar {
  color: #666;
  font-family: 'Roboto-Light';
  font-size: 30px;
  font-weight: normal;
  letter-spacing: 4px;
  text-shadow: 3px 3px 10px #666;
  margin-bottom: 35px;
}


#img_colaboraciones img {
  width: 900px;
  min-width: 360px;
  height: 400px;
  margin-bottom: 50px;
  border-radius: 7px;
  box-shadow: 3px 3px 10px #666;
  padding: 0px;
}


/* fin colaboraciones*/


/* ultimos posts */

#caja_post {
  width: 300px;
  border: black;
  background: #948bd5;
}

/* Botón scroll arriba página */
#myBtn {
  display: none;
  position: fixed;
  bottom: 20px;
  right: 10px;
  z-index: 99;
  font-size: 18px;
  border: none;
  outline: none;
  background-color: #d1d9b4;
  color: white;
  cursor: pointer;
  padding: 15px;
  border-radius: 7px;
  background-image: url("../img/arrow-2.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 60%;
  width: 40px;
  height: 40px;
  border: 2px solid white;
}

#myBtn:hover {
  background-color: #a7ad90;

}


.aviso-cookies {
  display: none;
  position: fixed;
  padding: 20px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  max-width: 600px;
  width: 90%;
  height: 328px;
  line-height: 150%;
  border-radius: 10px;
  background-color: #fff;
  border: 1px solid #ccc;
  box-shadow: -5px 5px 30px rgba(0, 0, 0, 0.5), 5px 5px 30px rgba(0, 0, 0, 0.5);
  text-align: center;
  z-index: 100;
}


.aviso-cookies .galleta {
  max-width: 100px;
  position: absolute;
  top: -50px;
  left: calc(50% - 50px);
}

.aviso-cookies.activo {
  display: block;
}

.aviso-cookies .titulo {
  margin-bottom: 15px;
  font-weight: 900;
}

.aviso-cookies .parrafo {
  margin-bottom: 15px;
}

.aviso-cookies .boton {
  width: 200px;
  background: #d1d9b4;
  border: none;
  color: #fff;
  text-align: center;
  padding: 15px 20px;
  font-weight: 700;
  cursor: pointer;
  transition: .3s ease all;
  border-radius: 5px;
  margin-bottom: 15px;
  text-shadow: 0px 3px 3px rgba(255, 255, 255, 0.4), 0px -1px 1px rgba(0, 0, 0, 0.3);
  letter-spacing: 1.5px;
}

.aviso-cookies .boton:hover {
  background: #a7ad90;
}

.aviso-cookies .enlace {
  color: #a7ad90;
  text-decoration: none;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 1px;
  text-shadow: 0px 3px 3px rgba(255, 255, 255, 0.4), 0px -1px 1px rgba(0, 0, 0, 0.3);
  margin-top: 15px;
}

.aviso-cookies .enlace:hover {
  text-decoration: underline;
}

.fondo-aviso-cookies {
  display: none;
  background: rgba(0, 0, 0, .20);
  position: fixed;
  z-index: 99;
  width: 100vw;
  height: 100vh;
  top: 0;
  left: 0;
}

.fondo-aviso-cookies.activo {
  display: block;
}



/*  mailchimp */

.form_mailchimp {
  background: #d1d9b4;
  box-shadow: 3px 9px 6px #666, 3px 3px 7px #ccc;
  border-radius: 5px;
}

#mc_embed_signup input {
  border-radius: 5px !important;
}


/* error 404 */

#box_error_404 {
  margin-top: 100px;
  margin-bottom: 100px;
  gap: 30px;
}

.logotipo_error_404 img {
  width: 155px;
}

#box_error_404 h1 {
  font-size: 20px;
}