@import url('https://fonts.googleapis.com/css?family=Mada:300,400,700&display=swap');

html, body {
	height: 100%;
	
}
body {
	font-family: 'Mada', sans-serif;
	font-size: 14px;
	background-color: #6d6d6d; 
	

}

a:hover{
	color: #ff4c45 !important;
	text-decoration: none;
} 

.header {
	color: #FFFFFF;
	height: 8vh;
	max-height: 50px;

}

.header h1 {
	font-size: calc(22px + 6 * ((100vw - 320px) / 680));
	font-weight: 300;
	margin-top: 10px;

}

.header h1 a{
	color: #FFFFFF;

}

.header h1 a img {
	max-width: calc(10px + 6 * ((100vw - 320px) / 680));;

}

.header h1 i {
	padding-right: 20px;
	color: #FFFFFF;

}

.header h1:hover i {
	color: #ff4c45;

}

.header .home {
	text-align: right;
	/*font-size: calc(18px + 6 * ((100vw - 320px) / 680));*/
	margin-top: 10px;

}

.header .home a {
	color: #FFFFFF;
}

.header .home img {
	max-width: calc(25px + 6 * ((100vw - 320px) / 680));

}

.footer {
	position: absolute;
	bottom: 0px;	
	background-color: #6d6d6d; 
	width: 100%;
	padding: 10px 0;
	font-size: 200%;
	color: #FFFFFF;
	height: 100px;
	font-weight: 300;
	z-index: 99;
	height: 70px;


}

.footer a {
	color: #FFFFFF;
}

/* Full screen */
#full_screen_container:-webkit-full-screen {  
  width: 100vw;
  height: 100vh;
}

#full_screen_btn {
	width: 100px;
	height: 100px;
	position: absolute;
	top: 3vh;
	left: 5vh;
	font-size: 35px;
}

#full_screen_btn a {
	color: #bd4747;
}

.clima  {
	font-size: calc(18px + 6 * ((100vw - 320px) / 680));
	text-align: center;
	margin-top: 5px;
}

.clima a {
	color: #FFFFFF;
}

.clima img  {
	max-width: 20px;
	
}

.clima a img  {
	max-width: 35px;
	
}

.clima  i {
	margin: 0 10px;
	opacity: 0.7;
}

.clima i.active {
	opacity: 1;
}

@media (max-width: 768px) { 

	.cv-nav-next {
		position: absolute;
		bottom: -80px !important;

	}

}



/* Small devices */
/*
@media (max-height: 300px) { 
	
	body {
		background: #000000 !important;
		color: #FFFFFF;
		height: 100%;
	}

	body::before {
	  content: 'El alto de pantalla del dispositivo es muy pequeño. Para poder tener una correcta experiencia en la app por favor rotalo o utilizá uno con una pantalla más grande.';
	  font-size: 20px;
	  display: inline-block;
    padding: 20%;
    text-align: center;
    font-weight: 300;


	}

	div:not(#full_screen_container) {
		display: none;
	}

}
*/

@media (max-height:500px) and (orientation: landscape) {

	body:not(.producto) {
		background: #374852 !important;
		color: #FFFFFF;
		height: 100%;
		
	}

	body:not(.producto)::before {
	  content: 'El alto de pantalla del dispositivo es muy pequeño, por favor rotalo para tener una correcta experiencia en la app.';
	  font-size: 20px;
	  display: inline-block;
    padding: 27% 10% 0 10%;
    text-align: center;
    font-weight: 300;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url('../../images/common/rotate.jpg');
    background-position: top 7% center;
    background-repeat: no-repeat;

	}

	div {
		visibility: hidden;
	}
	
	.container{
		display: none;
	}

	#full_screen_container div {
		visibility: visible;
	}

}


/* Small devices */
@media (max-width: 900px) { 
	
	#full_screen_btn {
		display: none;
	}

	.clima  {
		margin-top: 10px;
	}

	.foto_producto  {
		margin-top: 2vh;
	}

}
