.navbar_boton {
	color: #333;
	background-position: bottom;
	background-image: -webkit-linear-gradient(0deg,#009045,#70a83b,#a3bd31);
	background-size: 0% 0%;
	margin-bottom: 4px;
	background-repeat: no-repeat;
	cursor: pointer;
	padding-left: 10px !important;
	padding-right: 10px !important;
}
.navbar_boton:hover {
	color: #000;
	background-size: 100% 5%;
	animation-name: ani_btn;
	animation-duration: 1.4s;
}

@keyframes ani_btn {
	0% {background-size: 0% 5%;}
	15% {background-size: 100% 5%;}
	37% {background-size: 78% 5%;}
	50% {background-size: 100% 5%;}
	64% {background-size: 91% 5%;}
	70% {background-size: 100% 5%;}
	100% {background-size: 100% 5%;}
}

@media (min-width:799px) {
    @supports (background-attachment:fixed) {
    .bg_fix {background-attachment:fixed !important;}
    }
}

.escalado {
	color: #009966;
	font-size: 30px;
	animation: escalar;
	animation-duration: 1s;
}

.compartir {
	height: 100%;
	width: 50px;
	background-color: #fff;
	color: #333;
}
.compartir:hover {
	transition: all 0.3s ease-in-out; 
	background-color: transparent;
	color: white;

}

#casa{
	font-size: 25px;text-decoration: none; color: #999;
}

#casa:hover {
	text-decoration: none;
	color: #555;
	animation-name: casa_anim;
	animation-duration: 1s;
}

@keyframes casa_anim {
	0% {font-size: 25px;transform: rotate(0deg);}
	70% {font-size: 20px;transform: rotate(20deg);}
	100% {font-size: 30px;transform: rotate(0deg);}
}


::-webkit-scrollbar{
    width: 10px;
    background-color: #F5F5F5;
}
::-webkit-scrollbar-track{
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    background-color: #F5F5F5;
}
::-webkit-scrollbar-thumb{
    background-color: #F90; 
    background-image: -webkit-linear-gradient(90deg,rgba(255, 255, 255, .2) 25%,transparent 25%,transparent 50%,rgba(255, 255, 255, .2) 50%,rgba(255, 255, 255, .2) 75%,transparent 75%,transparent);
}

.scrollverde ::-webkit-scrollbar-thumb{
    background-color: #3dc02f; 
    background-image: -webkit-linear-gradient(90deg,transparent 16.6%,rgba(255, 255, 255, .2) 16.6%,rgba(255, 255, 255, .2) 32.2%,transparent 32.2%,transparent 49.8%,rgba(255, 255, 255, .2) 49.8% ,rgba(255, 255, 255, .2) 66.4%,transparent 66.4%,transparent 83%,rgba(255, 255, 255, .2) 83%,rgba(255, 255, 255, .2) 99.6%);
}

.nav_item:hover {
	transition: all 0.3s ease-in-out;
	border-bottom: 1px solid #f90;
}

.cmb_clr_verde{
	transition: all 0.3s ease-in-out;
	background-color: rgba(40,167,69,0.8);
	color: white;
}




.cmb_clr_verde:hover{
	transition: all 0.3s ease-in-out;
	background-color: rgba(030,089,069,0.8);
	color: white;
}

.chat {
	position: absolute;
	width: 100%;
	height: 100vh;
	max-width: 300px;
	right: 0px;
	top: 85px;
	background-color: rgba(0,0,0,0.5);
}

.item-servicios {
	overflow: hidden; 
}

.item-servicio_1 {
	cursor: pointer;
	background-color: #999;
	padding: 5px;
	border-radius: 5px;
	text-align: center;
	color: white;
}
.item-servicio_2 {
	cursor: pointer;
	background-color: #666;
	padding: 5px;
	border-radius: 5px;
	text-align: center;
	color: white;
}

.item-servicio_1:hover {
	transition: all 0.1s ease-in-out;
	background-color: #3dc02f;
	padding: 10px;
	border-radius: 5px;
	text-align: center;
	color: white;
}
.item-servicio_2:hover {
	transition: all 0.1s ease-in-out;
	background-color: #F90;
	padding: 10px;
	border-radius: 5px;
	text-align: center;
	color: white;
}

button {
	margin-top: 1px;
	margin-bottom: 1px;
}
a {
	color: #555;
}

.deg:hover {
	background-image: -webkit-linear-gradient(45deg,rgba(255,255,255,0),rgba(255,255,255,0.4),rgba(255,255,255,0));
	color: #444;
	animation-name: giro_izq;
	animation-duration: 5s;
	animation-iteration-count: infinite;
}

.deg:hover >*{
	animation-name: giro_der;
	animation-duration: 5s;
	animation-iteration-count: infinite;
}


@keyframes giro_izq{
	0% {-webkit-transform: rotate(0deg);}
	20% {-webkit-transform: rotate(180deg);}
	40% {-webkit-transform: rotate(0deg);}
	100% {-webkit-transform: rotate(0deg);}
}

@keyframes giro_der{
	0% {-webkit-transform: rotate(0deg);}
	20% {-webkit-transform: rotate(-180deg);}
	40% {-webkit-transform: rotate(0deg);}
	100% {-webkit-transform: rotate(0deg);}
}


.contenedor_texto {
	font-family: Century Gothic;
	top: 30px;
}

.logo_EcoYuma {
	position: relative;
	left: -7px;
	top: 0px;
	width:300px;
	height:186px;
	border:0px solid #808080;
	text-align: center;
}

.logo_EcoYuma_arb{ 
	position: absolute;
	height:97%;
    width:99%;
    margin:0px auto;
    animation-name: escalar;
    animation-duration: 2s;
}

.logo_EcoYuma_arb_tallo{ 
	position: absolute;
	height:186px;
    width:300px;
    margin:0px auto;
	background-image: url(../imagenes/ecoyuma/tallo.png);
	background-size: 100%; 
}

.logo_EcoYuma_arb_hojas{ 
	position: absolute;
    width: 185px;
    height: 129px;
    margin:0px auto;
	background-image: url(../imagenes/ecoyuma/hojas.png);
	background-size: 100%;
	animation-name: mover_hojas;
    animation-duration: 10s;
    animation-iteration-count: infinite;
}

.btn-circle-outline-green{
	cursor: pointer;
	border: 1px solid;
	background-color: none;
	width: 50px;
	height: 50px;
	border-radius: 30px;
	color: white;
	border-color: white;
	font-size: 23px;
}
.btn-circle-outline-green:hover {
	background-color: rgba(087,166,057,0.7);
	color: white;
	border-color: transparent;
}

.btn-circle-small-green{
	cursor: pointer;
	border: 1px solid;
	background-color: transparent;
	font-size: 22px;
	width: 40px;
	height: 40px;
	border-radius: 20px;
	color: #95680c;
	border-color:  #95680c;
	overflow: hidden;
}
.btn-circle-small-green:hover {
	background-color: #95680c;
	color: white;
	border-color: transparent;
}

.btn-circle-small-blue{
	cursor: pointer;
	border: 1px solid;
	background-color: transparent;
	font-size: 23px;
	width: 40px;
	height: 40px;
	border-radius: 20px;
	color: #afa318;
	border-color:  #afa318;
	overflow: hidden;
}
.btn-circle-small-blue:hover {
	background-color: #afa318;
	color: white;
	border-color: transparent;
}

.btn-circle-big-blue{
	cursor: pointer;
	border: 1px solid;
	background-color: rgba(255,255,255,0.5);
	font-size: 30px;
	width: 70px;
	height: 70px;
	border-radius: 35px;
	color: #006b68;
	border-color:  #006b68;
	overflow: hidden;
}
.btn-circle-big-blue:hover {
	background-color: #006b68;
	color: white;
	border-color: transparent;

}

.btn-circle-small-lightblue{
	cursor: pointer;
	border: 1px solid;
	background-color: transparent;
	font-size: 23px;
	width: 40px;
	height: 40px;
	border-radius: 20px;
	color: #708627;
	border-color: #708627;
	overflow: hidden;
}
.btn-circle-small-lightblue:hover {
	background-color: #708627;
	color: white;
	border-color: transparent;
}

.btn-circle-small-red{
	cursor: pointer;
	border: 1px solid;
	background-color: transparent;
	font-size: 23px;
	width: 40px;
	height: 40px;
	border-radius: 20px;
	color: #4f7a2d;
	border-color:  #4f7a2d;
	overflow: hidden;
}
.btn-circle-small-red:hover {
	background-color: #4f7a2d;
	color: white;
	border-color: transparent;
}

.btn-circle-small-purple{
	cursor: pointer;
	border: 1px solid;
	background-color: transparent;
	font-size: 23px;
	width: 40px;
	height: 40px;
	border-radius: 20px;
	color: #006b33;
	border-color:  #006b33;
	overflow: hidden;
}
.btn-circle-small-purple:hover {
	background-color: #006b33;
	color: white;
	border-color: transparent;
}

.btn-circle-small-facebook{
	cursor: pointer;
	border: 1px solid #fff8;
	background-color: transparent;
	font-size: 20px;
	width: 40px;
	height: 40px;
	border-radius: 20px;
	color: #fff8;
}
.btn-circle-small-facebook:hover {
	background-color: #4e598f;
	color: white;
	border-color: #4e598f;
}

.btn-circle-small-twitter{
	cursor: pointer;
	border: 1px solid #fff8;
	background-color: transparent;
	font-size: 20px;
	width: 40px;
	height: 40px;
	border-radius: 20px;
	color: #fff8;
}
.btn-circle-small-twitter:hover {
	background-color: #65a2d9;
	color: white;
	border-color: #65a2d9;

}

.btn-circle-small-instagram{
	cursor: pointer;
	border: 1px solid #fff8;
	background-color: transparent;
	font-size: 23px;
	width: 40px;
	height: 40px;
	border-radius: 20px;
	color: #fff8;
}

.btn-circle-small-instagram:hover {
	background-image: -webkit-linear-gradient(90deg,#fccc66,#dd3569,#515cd2);
	color: white;
	border-color: #4e598f;
}	

.sombra{
	-webkit-box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.36);
	-moz-box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.36);
	box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.36);
}

.menu_boton{
	position: absolute;
	top: 0px;
	right: 0px;
	padding: 10px 10px 20px 20px;
	font-family: Quicksand;
	font-size: 18px;
	border-radius: 0px 0px 0px 40px;
	color: white;
	background-color: rgba(255,255,255,0.3);
	border: 0px solid #fff6;
	outline: none;
	cursor: pointer;
}

.menu_desplegable {
	transition: all 0.2s ease-in-out;
	border-radius: 30% 0% 0% 0%;
	position: absolute;
	overflow: hidden;
	top: 0px;
	right: 0px;
	background-color: #6c3c0088;
	width: 0px;
	height: 100vh;
	font-family: Quicksand;
}

.item_menu {
	margin: 0px;
	padding: 7px 17%;
	color: #eee;
	font-size: 1.2em;
	display: flex; 
	align-items: center;
	cursor: pointer;
}

.item_menu:hover {
	transition: all 0.2s ease-in-out;
	background-color: #d5b48b;
	color: #38332b;
}

.menu_boton:hover {
	transition: all 0.2s ease-in-out;
	color: #000;
	background-color: #fff;
}

@media (max-width: 500px){
	.menu_desplegable {border-radius: 0px;}
}

.logo_EcoYuma_tex{
	height:186px;
    width: 300px;
    margin:0px auto;
	background-size: 100%;
	animation-name: aparecer;
    animation-duration: 3s;
}

.cnt_logo{
	width: 350px;
	height: 350px; 
	transform: scale(0.9);
	background-color: rgba(255,255,255,0.3); 
	border-radius: 175px;
	margin: -40px;
	overflow: hidden;
}

.imagen_fixed {
	background:url('imagenes/noticias/fondo_not.gif'); 
	background-size:cover; 
	background-position:center; 
	background-attachment:fixed;
	-webkit-box-shadow: inset 10px 10px 212px 0px rgba(0,0,0,0.9);
	-moz-box-shadow: inset 10px 10px 212px 0px rgba(0,0,0,0.9);
	box-shadow: inset 10px 10px 212px 0px rgba(0,0,0,0.9);
}

.bg_logo_EcoYuma {
	background: gray;
}

.cnt_logo:hover{
	transition: all 0.8s ease-in-out;
	transform: scale(1);
	-webkit-transform: scale(1);
	background-color: rgba(255,255,255,0.6);
	-webkit-box-shadow:0 0 20px rgba(0,0,0,0.8);
	-moz-box-shadow:0 0 20px rgba(0,0,0,0.8);
	box-shadow:0 0 20px rgba(0,0,0,0.8);
}

.cnt_logo:hover >*{
	transition: all 0.8s ease-in-out;
	transform: rotate(-360deg);	
	-webkit-transform: scale(0.9);
	filter: inherit;
}

.logo_EcoYuma_tex_1{
	top: -5px;
	height:186px;
    width: 300px;
    margin:0px auto;
    position: absolute;
	background-image: url(../imagenes/ecoyuma/tex1.png);
	background-size: 100%;
	animation-name: aparecer;
    animation-duration: 5s;
}
.logo_EcoYuma_tex_2{
	height:186px;
    width: 300px;
    margin:0px auto;
    position: absolute;
	background-image: url(../imagenes/ecoyuma/tex2.png);
	background-size: 100%;
	animation-name: escalar;
    animation-duration: 3s;
}

@keyframes desplazar_x{
	0% {right: -300px;}
	40% {right: -10px;}
	100% {right: -10px;}
}

.logo_EcoYuma_tex_3{
	right: -10px;
	height:186px;
    width: 300px;
    margin:0px auto;
    position: absolute;
	background-image: url(../imagenes/ecoyuma/tex3.png);
	background-size: 100%;
	animation-name: desplazar_x;
    animation-duration: 5s;
}


.aparecer {
	animation-name: aparecer;
    animation-duration: 2s;
    background-color: rgba(0,0,0,0);
    color: white;
}

.ocultar {
	animation-name: ocultar;
    animation-duration: 2s;	
}

.centrado {
	display: flex; justify-content: center; align-items: center;
}

.seccion_bienvenida {
	width: 100%;
	height: 100vh;
	text-align: center;
	background-color: black;
}

.aparecer_prin{
	animation-name: aparecer_prin;
	animation-duration: 8s;
}

.seccion_bienvenida_contenedor{
	position: absolute;
	top: 0px;
	background: rgba(0,0,0,0);
	width:100%;
	height:100vh;
}

.subir_y_bajar{
	position: relative;
	animation-name: subir_bajar;
	animation-duration: 1s;
	animation-iteration-count: infinite;
}

.logo_EcoYuma_arb_cargando{ 
	position: absolute;
	height:97%;
    width:99%;
    margin:0px auto;
    animation-name: escalar_cargando;
    animation-duration: 2s;
    animation-iteration-count: infinite;
}

.cambiar_color {
	animation-name: cam_color;
	animation-duration: 10s;
	animation-iteration-count: infinite;
}

.sacudir{
	animation-name: mover_hojas;
	animation-duration: 5s;
	animation-iteration-count: infinite;
}

@keyframes cam_color {
	0% {background-color: rgba(42,70,172,1);}
	50% {background-color: rgba(4,93,0,1);}
	100% {background-color: rgba(42,70,172,1);}
}

@keyframes escalar_cargando {
	0% {transform: scale(0.5);top: 15px;left: -18px;}
	50% {transform: scale(0.7);top: 12px;left: -7px;}
	100% {transform: scale(0.5);top: 15px;left: -18px;}
}
@keyframes subir_bajar {
	0% {top: -5px;}
	100% {top: 10px; opacity: 0;}
}

@keyframes mover_hojas {
	0% {
		transform: rotate(0deg);
	}
	5% {
		transform: rotate(-3deg);
	}
	10% {
		transform: rotate(0deg);
	}
	15% {
		transform: rotate(-3deg);
	}
	20% {
		transform: rotate(0deg);
	}
	25% {
		transform: rotate(-3deg);
	}
	30% {
		transform: rotate(0deg);
	}
	100% {
		transform: rotate(0deg);	
	}
}


@keyframes escalar {
	0% {transform: scale(0);}
	100% {transform: scale(1);}
}

@keyframes aparecer {
	0% {opacity: 0;}
	40% {opacity: 0;}
	100% {opacity: 1;}
}

@keyframes aparecer_prin {
	1% {opacity: 0;}
	10% {opacity: 1;}
	90% {opacity: 1;}
	100% {opacity: 0;}
}

@keyframes ocultar {
	0% {opacity: 1;}
	100% {opacity: 0;}
}