body {

	font-family: 'NombreDeTuFuente', sans-serif; /* Reemplaza 'sans-serif' con una fuente de respaldo si es necesario */

	position: relative;

	font-weight:400;

	background: #F9F9FB;

	color:#43484E;

	font-size: 15px;

}




body  section{

	padding: 75px 0;

}


@font-face {
  font-family: 'NombreDeTuFuente'; /* Nombre que le darás a la fuente */
  src: url('../fonts/FuturaMediumBT.ttf') format('opentype'); /* Ruta al archivo .otf */
  font-weight: normal; /* Ajusta según el peso de la fuente */
  font-style: normal; /* Ajusta según el estilo de la fuente */
}

@font-face {
  font-family: 'NombreDeTuFuente2'; /* Nombre que le darás a la fuente */
  src: url('../fonts/FuturaBoldBT.ttf') format('opentype'); /* Ruta al archivo .otf */
  font-weight: normal; /* Ajusta según el peso de la fuente */
  font-style: normal; /* Ajusta según el estilo de la fuente */
}

@font-face {
  font-family: 'NombreDeTuFuente3'; /* Nombre que le darás a la fuente */
  src: url('../fonts/FuturaLTPaneuropeanBook.ttf') format('opentype'); /* Ruta al archivo .otf */
  font-weight:normal;/* Ajusta según el peso de la fuente */
  font-style: normal; /* Ajusta según el estilo de la fuente */
}

.fuente-go {
  font-family: 'NombreDeTuFuente3', sans-serif; /* Fuente para "GO" */
}

.fuente-west {
  font-family: 'NombreDeTuFuente2', sans-serif; /* Fuente para "WEST" */
}



a:focus,

a:hover {

	text-decoration:none;

	outline:none;

	outline-offset: 0;

	color: #43484E;

}





img {width:100%;}

.center {text-align: center;}

.justify {text-align: justify;}

.justifyc {text-align: justify;text-align-last: center;}



.imgc {

display: block;

margin-right: auto;

margin-left: auto;

text-align: center;

}




.dly01 { animation-delay: 0.1s;}

.dly02 { animation-delay: 0.2s;}

.dly03 { animation-delay: 0.3s;}

.dly04 { animation-delay: 0.4s;}

.dly05 { animation-delay: 0.5s;}

.dly06 { animation-delay: 0.6s;}

.dly07 { animation-delay: 0.7s;}

.dly08 { animation-delay: 0.8s;}

.dly09 { animation-delay: 0.9s;}

.dly10 { animation-delay: 1.0s;}

.dly11 { animation-delay: 1.2s;}



.no_marg {margin-left: 0;margin-right: 0;}

.no_padd {padding-left: 0;padding-right: 0;}



.btn.active.focus, 

.btn.active:focus, 

.btn.focus, 

.btn:active.focus, 

.btn:active:focus, 

.btn:focus {

    outline: 0px auto transparent;

    outline-offset: -2px;

}



button.active.focus, 

button.active:focus, 

button.focus, 

button:active.focus, 

button:active:focus, 

button:focus {

    outline: 0px auto transparent;

    outline-offset: -2px;

}

a.active.focus, 

a.active:focus, 

a.focus, 

a:active.focus, 

a:active:focus, 

a:focus {

    outline: 0px auto transparent;

    outline-offset: -2px;

}



button,

.btn {

	-webkit-transition: 300ms;

	-moz-transition: 300ms;

	-o-transition: 300ms;

	transition: 300ms;

	line-height: 1;

}







/*====================

======Header CSS=====

======================*/



#navigation .navbar {

  background: #154F25;
  border-radius: 0;
  border-bottom: 0;
  padding-bottom: 0;

}


#navigation .navbar-nav.navbar-left li {

	padding: 0 10px;
  /* margin-right: 25px; */

}

#navigation .navbar-nav.navbar-left  {

	margin-top: 13px;
  margin-bottom: 13px;

}
/* .logo{
  margin-bottom: 13px;
} */

#navigation .navbar-nav.navbar-left li a {

	color: #ffffff;
	font-size: 14px;
	font-weight: 400;

}

#navigation .navbar-nav.navbar-left li a:hover {

  color: #F1BA3E;;

}


#navigation .social-icons {
  margin-top: 13px;
  margin-bottom: 13px;
}

#navigation .social-icons li {
  display: inline-block;
  margin-left: 10px;
}

#navigation .social-icons li a {
  color: #ffffff;
  font-size: 18px;
  text-decoration: none;
}

#navigation .social-icons li a:hover {
  color: #F1BA3E;; /* Color al pasar el cursor */
}


.navbar-header{
  margin-left: 25%;
}

.navbar-right{
  margin-right: 5% !important;
}

.navbar-nav.navbar-right:last-child {
  margin-right: 0px;
}


#navigation .navbar-nav.navbar-left li {
  position: relative; /* Necesario para el posicionamiento absoluto */
  padding: 0 10px;
}

#navigation .navbar-nav.navbar-left li:not(:last-child)::after {
  content: ""; /* Crear un contenido vacío */
  position: absolute;
  right: -5px; /* Ajusta la posición según sea necesario */
  top: 50%; /* Centrar verticalmente */
  transform: translateY(-50%); /* Centrar verticalmente */
  width: 1px; /* Ancho de la línea */
  height: 20px; /* Altura de la línea */
  background-color: #ffffff; /* Color de la línea */
}


/*======================

====Main Slider CSS=====

=======================*/




.logo{width: 190px; padding: 10px 0 10px 10px;}




#gral {padding: 40px 0 80px;}

#gral_ {padding: 40px 0;}









.logo_send {

    width: 250px;

    padding: 10px;

    margin: 0 auto;

    display: block;

}

.topper.navbar-inverse {

    background-color: #fff;

    border-color: #fff;

}

.navbar-inverse{
  margin-bottom: 0px;
  border: none;
}


.row {
  margin-right: 0px;
  margin-left: 0px;
}


/*ESTILOS NUEVOS PAGINA*/

.row {
  margin-right: 0px;
  margin-left: 0px;
}

.navbar-inverse .navbar-nav .open .dropdown-menu>li>a, 
    .navbar-inverse .navbar-nav .open .dropdown-menu {
       border: none;
       box-shadow: none;
       border-radius: 0;
    }


    .navbar-inverse .navbar-nav>li>a:focus,
    .navbar-inverse .navbar-nav>li>a:hover {
        background-color: transparent !important; /* Cambiar el color de fondo a transparente */
    }

    .dropdown-menu > li {
      margin-bottom: 10px; /* Cambiar el valor según lo que desees */
  }


  /*SECCION BANNER PRINCIPAL*/

  #banner {
    position: relative;
    width: 100%;
    max-height: 750px; /* Altura máxima del banner */
    overflow: hidden; /* Para ocultar cualquier contenido que exceda la altura */
}

#banner img {
    width: 100%;
    height: auto;
    max-height: 750px; /* Asegura que la imagen no supere la altura máxima del banner */
    object-fit: cover; /* Cubre el contenedor sin distorsionar la imagen */
}

.texto-banner {
    position: absolute;
    top: 50%;
    left: 27%; /* Puedes ajustar este valor según tu diseño */
    transform: translateY(-50%);
    color: white;
    z-index: 1; /* Para que esté por encima de la imagen */
}

.texto-chico {
    font-size: 28px;
    opacity: .8;
}

.texto-grande {
    font-size: 80px;
    margin: 10px 0;
    font-weight: bold;
   
    line-height: 1.2;
}

.rectangulo {
    width: 200px; /* Ancho del rectángulo */
    background-color: #53B9C7;/* Color de fondo del rectángulo con transparencia */
   padding-top: 10px;
   padding-bottom: 10px;
    text-align: center;
}

.rectangulo p {
    color: rgb(0, 0, 0);
    margin-bottom: 0;
    opacity: .7;
}




/*SECCIONES NUEVAS DE LA PAGINA*/


/*SECCION BOTONES DE A TRES*/

#seccion-tres{
 padding-top: 60px;
 padding-left: 100px;
 padding-right: 100px;
}


.rectangulo {
  width: 100%;
  background-color: transparent;
  height: 70px;
  border: 2px solid #154F25;
  color: #154F25;
  text-align: center;
  line-height: 50px; 
  margin-top: 10px;
  transition: background-color 0.3s, transform 0.3s;
}

.rectangulo:hover {
  background-color:  #154F25; /* Cambia el color de fondo al pasar el mouse */
  color: white;
  transform: scale(1.05); /* Aumenta el tamaño un 5% */
}



/*SECCION BOTONES DE A TRES*/

/*SECCION ACERCA DE*/
 #seccion-acerca{
  padding: 0;
 }
 

.nopadding{
  padding: 0;
}

.imgacerca{
  padding: 30px;
}



#seccion-valle{
  padding-top: 60px;
 padding-left: 130px;
 padding-right: 130px;
}


.imgvalle{
  max-height: 700px;
  object-fit: cover;
}

#seccion-valle h2{
  font-family: 'NombreDeTuFuente';
  font-size: 5rem;
  color: #154F25;
}

#seccion-valle p{
  font-size: 1.6rem;
}

.dovtres{
  margin-top: 20px;
}



.grid-container {
  display: grid;
  grid-template-columns: 1fr 1fr; /* Dos columnas del mismo tamaño */
  /* height: 300px; 
  margin-bottom: 30px; */
}
.grid-column {
  padding: 10px;
  box-sizing: border-box; /* Incluye padding y borde en el tamaño total */
}
.grid-column--1 {
  display: flex;
  justify-content: center;
  align-items: center;
}

.image {
  max-width: 100%; /* Asegura que la imagen no se desborde */
  height: auto; /* Mantiene la proporción de la imagen */
}
.grid-column--2 {
  display: flex; /* Cambiado para usar flexbox */
  flex-direction: column; /* Organiza elementos en columna */
  justify-content: space-between; /* Espacia los elementos para que el último esté al final */
  height: 100%; /* Asegura que ocupe toda la altura de la columna */
}

/*SECCION ACERCA DE*/


/*SECCION DE 4 MOVIMIENTOS*/

#seccion-cuatro{
 padding-top: 0px;
}


#name_ {padding: 0;}
.btn_name {
    position: absolute;
    left: 0;
    right: 0;
}
#name_ .btn-danger {
    color: #fff;
    background-color: #8ec74b;
    border-color: #8ec74b;
    border-radius: 0 0 5em 5em;
}
#name_ .btn-danger:focus, #name_ .btn-danger:hover {
    background-color: #8ec74b;
    border-color: #8ec74b;
}
#name_ .btn-danger i {font-size: 2em;}
#name_ .btn-danger:hover i {
	animation: shake 2000ms cubic-bezier(.36,.07,.19,.97) both;
	transform: translate3d(0, 0, 0);
}

.no_marg {margin-left: 0; margin-right: 0;}
.no_padd {padding-left: 0; padding-right: 0;}



.mdx_003 {
  position: relative;
    display: block;
    overflow: hidden;
    margin: 0 auto;
    width: 100%;
    background-color: #000;
    box-shadow: 0 0 5px rgb(0 0 0 / 15%);
    padding: 25% 25px;
    background-attachment: fixed;
    background-size: cover;
    color: #fff;
}

.mdx_003 * {
  -webkit-transition: all 0.95s;
  transition: all 0.95s;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.mdx_003 img {
    max-width: 100%;
    vertical-align: top;
    width: 65%;
    margin: 35px auto;
    display: block;
}
.mdx_003:hover img {
	opacity: 0;
	transform: translate(0,100px);
    -webkit-transform: translate(0,100px);
    -o-transform: translate(0,100px);
    -moz-transform: translate(0,100px);
}
.mdx_003 figcaption {
  position: absolute;
  height: 75px;
  left: 0;
  right: 0;
  bottom: -75px;
  overflow: hidden;
  padding: 40px;
  background-color: transparent;
  border-radius: 0;
}
.mdx_003 h3 {
  font-size: 40px;
  letter-spacing: 10px;
  font-weight: 800;
  text-transform: uppercase;
  margin: 10px 0;
}
.mdx_003 blockquote {
  padding: 0;
  margin: 30px 0 0 0;
  font-size: 1em;
  border-left: none;
}
.mdx_003:hover figcaption,
.mdx_003.hover figcaption {
  height: calc(100%);
}

.mdx_003.bg_001 {
    background: linear-gradient(rgb(50 62 72 / 60%), rgb(50 62 72 / 30%)), url(../img/frame1.png);
    background-size: cover;
    background-position: 50% 50%;
}
.mdx_003.bg_002 {
    background: linear-gradient(rgb(50 62 72 / 60%), rgb(50 62 72 / 30%)), url(../img/frame2.png);
    background-size: cover;
    background-position: 50% 50%;
}
.mdx_003.bg_003 {
    background: linear-gradient(rgb(50 62 72 / 60%), rgb(50 62 72 / 30%)), url(../img/frame3.png);
    background-size: cover;
    background-position: 50% 50%;
}

.mdx_003.bg_004 {
  background: linear-gradient(rgb(50 62 72 / 60%), rgb(50 62 72 / 30%)), url(../img/frame4.png);
  background-size: cover;
  background-position: 50% 50%;
}


@keyframes shake {
  10%, 90% {
    transform: translate3d(0, -1px, 0);
  }
  20%, 80% {
    transform: translate3d(0, 2px, 0);
  }
  
  30%, 50%, 70% {
    transform: translate3d(0, -2px, 0);
  }
  40%, 60% {
    transform: translate3d(0, 2px, 0);
  }
}
#ESP_ {
	background: #8ec74b;
	color: #fff;
	padding: 1px 0;
    position: relative;
    z-index: 1000;
}
.ttl_ {margin: 70px 0 50px;}
.ttl_  span {font-weight: 700;font-size: 150%;display: block;margin: 10px 0 0;}


.card_ * {
	-webkit-transition: 900ms;
	-moz-transition: 900ms;
	-o-transition: 900ms;
	transition: 900ms;
}
.card_ {
	width: 250px;
	padding: 30px;
	color: #fff;
	display: inline-block;
}
.img_py {
	padding: 20px;
	margin: 0 auto;
	display: block;
}
.card_ img {
	opacity: 1
}
.card_:hover img {
	transform: translate(0,70px);
    -webkit-transform: translate(0,70px);
    -o-transform: translate(0,70px);
    -moz-transform: translate(0,70px);
	opacity: 0.1;
	position: relative;
    z-index: 0;
}
.card_ button {
	opacity: 0;
	-webkit-transition: 1500ms;
	-moz-transition: 1500ms;
	-o-transition: 1500ms;
	transition: 1500ms;
}
.card_:hover button {
	transform: translate(0,150px);
    -webkit-transform: translate(0,150px);
    -o-transform: translate(0,150px);
    -moz-transform: translate(0,150px);
	opacity: 1;
	position: relative;
    z-index: 100;
}
.card_ h3 {
	opacity: 1;
}
.card_:hover h3 {
	transform: translate(0,-165px);
    -webkit-transform: translate(0,-165px);
    -o-transform: translate(0,-165px);
    -moz-transform: translate(0,-165px);
}
.card_ .btn-danger {
    color: #fff;
    background-color: #8ec74b;
    border-color: #8ec74b;
    border-radius: 0;
	width: auto;
	padding: 10px 30px;
}
.card_ .btn-danger:hover,
.card_ .btn-danger:focus {
    color: #fff;
    background-color: #232323;
    border-color: #232323;
    border-radius: 2em;
	box-shadow: 0 0 20px 0 #8ec74b;
	-webkit-box-shadow: 0 0 20px 0 #8ec74b;
}

/*SECCION DE 4 MOVIMIENTOS*/


/*SECCION DE UBICACION Y CONTACTO*/

#ubicontact {
  padding: 0;
  /* background-color: #525462; */
}
#ubicontact h2{
  font-family: 'NombreDeTuFuente', sans-serif;
  font-size: 5rem;
}

.divisor {
  background-color:#0F4A1F;
  height: 25px;
}

.divcontacto{
  
  padding-left: 40px;
  
}

.divcontacto h2{
  color: #0F4A1F;
}


.form-control {
  font-family: 'NombreDeTuFuente', sans-serif;
  width: 100%;
  height: auto;
  padding: 10px 15px;
  margin: 0 0 15px;
  font-size: 16px;
  border-radius: 0;
border: 1px solid #b3b3b3;
  /* border: 1px solid #dddddd; */
  -webkit-box-shadow: none;
  box-shadow: none;
-webkit-transition: 300ms;
transition: 300ms;
}
.form-control:focus {
  border-color: #ababab;
  outline: 0;
  -webkit-box-shadow: inset 0 0 0 rgb(0 0 0 / 0%), 0 0 8px rgb(0 0 0 / 30%);
  box-shadow: inset 0 0 0 rgb(0 0 0 / 0%), 0 0 8px rgb(0 0 0 / 30%);
}


.btn_01 {
  padding: 10px 20px;
  font-size: 26px;
  border: 1px solid #0F4A1F;
  color: #fff;
  background: #0F4A1F;
  border-radius: 5px;
  margin-top: 20px;
  font-family: 'NombreDeTuFuente', sans-serif;
  margin-bottom: 10px;
 
}
.btn_01:focus,
.btn_01:hover {
border: 1px solid #F1BA3E;
  color: #ffffff;
  background: #F1BA3E;
}

/*SECCION DE UBICACION Y CONTACTO*/


/*SECCION FOOTER*/

footer{
  padding-top: 25px;
  padding-bottom: 15px;
  padding-left: 10%;
  padding-right: 10%;
  background-color: #0F4A1F;
}

footer ul {
  list-style: none;
  
}



footer a:hover{
  color: #F1BA3E;
}

footer a{
  font-family: 'NombreDeTuFuente', sans-serif;
  font-size: 1.7rem;
  color: white;
}

.lista-iconos li:nth-child(-n+2) {
  display: inline;
  padding: 0.3em;


}

.lista-iconos{
  padding-left: 0px;
  color: white;
}

.imgfooter{
  max-width: 230px;
}

.imgfooter2{
  max-width: 130px;
}

.lista-acerca{
  padding: 0;
}



#ftr {
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 1000;
  width: 30%; /* Para que los íconos se distribuyan a lo largo del ancho */
  display: flex; /* Flexbox para organizar íconos en una fila */
  justify-content: flex-start; /* Alinea íconos al inicio */
  padding: 10px; /* Añade espacio alrededor */
}

#ftr a {
  margin: 0 10px; /* Espacio entre los enlaces */
}

#ftr .social {
  width: 50px;
  height: 50px;
  color: #fff;
  border-radius: 50%;
  font-size: 25px;
  text-align: center;
  line-height: 50px; /* Asegura que el ícono esté centrado verticalmente */
  box-shadow: -5px 10px 15px -10px rgb(0 0 0 / 60%);
  transition: background 0.3s ease; /* Transición suave para el cambio de color */
}

.scl_1{
  position: relative !important;
}


#ftr .fa-whatsapp {background: #25d366;}
#ftr .fa-whatsapp:hover {background: #128c7e;}

#ftr .fa-facebook {background: #3b5998;}
#ftr .fa-facebook:hover {background: #2d4373;}

#ftr .fa-instagram {background: #e4405f;}
#ftr .fa-instagram:hover {background: #c13584;}