* {
	margin: 0;
	padding: 0
}

body {
	text-align: center;
	background-image: url("img/fondohomesinusb.jpg");
	background-position: center;
	background-size: cover
}

button {
	background-color: #445;
	color: white;
	display: inline-block;
	padding: 7px;
	border-radius: 5px
}

#header {
	display: inline-block;
	padding: 15px;
	border-radius: 15px;
	background-color: #556;
	color: white;
	margin: 0 0 15px
}

#manito {
	position: absolute;
	right: 0;
	top: 60vh;
	height: 15vh;
	width: 15vw;
	background-color: rgba(180,100,100,0.5);
	font-size: 25px;
	padding: 2vw 0;
	display: none;
	transition: transform 1s
}

#manito:hover {
	cursor: pointer
}

.abreIzquierda {
	transform-origin: 0 100%
}

.abreDerecha {
	transform-origin: 100% 100%
}

.abreIzquierda:hover {
	transform: rotateY(65deg) rotateZ(-5deg) scale(1.3,1.2)
}

.abreDerecha:hover {
	transform: rotateY(-65deg) rotateZ(5deg) scale(1.3,1.3)
}

#manito[left="0vw"]:hover {
	background-color: blue
}

#manito[right="0vw"]:hover {
	background-color: green
}

.espejado {
	-moz-transform: scale(-1, 1);
	-webkit-transform: scale(-1, 1);
	-o-transform: scale(-1, 1);
	-ms-transform: scale(-1, 1);
	transform: scale(-1, 1)
}

img {
	width: 60vw;
	z-index: 10;
	border-radius: 15px
}

#sobrecontainer {
	text-align: center;
	font-size: 0
}

.container {
	display: inline-block;
	position: relative;
	top: 0
}

.overlay {
	position: relative;
	top: 4vw;
	height: 3vw;
	padding: 1vh 0;
	font-size: 12px;
	width: 2.18vw;
	background: rgba(100,100,100,0.5);
	z-index: 90;
	display: inline-block
}

#tiagarro1 {
	position: absolute;
	top: 1vh;
	left: 3.7vw;
	display: flex;
	align-items: stretch
}

#tiagarro2 {
	position: absolute;
	top: 1vh;
	left: 3.7vw;
	display: flex;
	align-items: stretch
}

#tiagarro2 .overlay {
	width: 2.9vw
}

#overnota12 {
	margin-left: 1.6vw
}

#overnota36 {
	margin-left: 1.6vw
}

.botonota {
	width: 2.7vw;
	height: 2.7vw;
	display: inline-block;
	border-radius: 15px;
	border: 1px solid black;
	text-align: center;
	position: absolute;
	top: 0;
	left: 0;
	background: green;
	font-size: 1px;
	color: black
}

input {
	width: 5vw
}

#logohome {
	line-height: 1.8;
	font-family: "Raleway", sans-serif;
	position: absolute;
	top: 0;
	left: 0;
	display: inline-block;
	background-color: white;
	width: 25vw;
	padding: 16px;
	vertical-align: middle;
	text-decoration: none;
	color: black;
	letter-spacing: 4px;
	opacity: 0.7
}

a:visited {
	text-decoration: none;
	color: black
}

#logohome img {
	width: 6vw;
	float: left
}

#logohome:hover {
	opacity: 0.9
}

#errormidi {
	display: none;
	max-width: 18vw;
	position: fixed;
	top: 15vh;
	right: 0;
	color: red;
	background-color: #faa;
	opacity: 0.9;
	padding: 10px;
	border: 5px solid #a22;
	z-index: 99;
	border-radius: 20px;
	font-size: 0.8em
}

#errormidi a {
	float: right;
	cursor: pointer
}

#mapas {
	position: absolute;
	right: 0;
	top: 60vh;
	background-color: white;
	cursor: pointer;
	padding: 10px
}

footer {
	margin: auto;
	width: 58vw;
	color: white;
	background-color: #333;
	padding: 15px
}

footer h2,footer p {
	padding: 5px
}

footer a {
	color: white
}

.switchVibr {
	position:absolute;
	left:81.5vw;
	width:15vw;
	border-radius: 15vw;
	display:inline-block;
	transform: translate(0,57vh);
}

@media screen and (max-width: 780px) {
	.switchVibr{
		transform: translate(0,15vh);
	}
	#logohome {
		position: relative;
		width: 100%
	}

	#manito {
		font-size: 0.7rem;
		height: 10vh
	}

	#mapas {
		position: relative;
		top: 0
	}

	#desbloquear {
		width: 90vw !important;
		left: 5vw !important;
	}
}

#desbloquear {
	display: none;
	width: 40vw;
	position: absolute;
	top: 45vh;
	left: 30vw;
/*background-color: rgba(160, 160, 160, 0.9);*/
	


	background-color: rgba(250, 250, 250, 0.9);
	font-size: 1em;
	padding: 20px;
	box-sizing: border-box;
	border-radius: 15px;
	z-index: 98;
}

#desbloquear * {
	border-radius: 7px;
	z-index: 99;
}

#instrucciones {
	background-color: gray;
	color: white;
/*#197;*/
	
	padding: 20px;
	margin: 3vw;
}

#passDiv {
	background-color: #1b9;
	padding: 20px;
	margin: auto;
	margin: 3vw;
}

#passDiv input {
	width: 70%;
	text-align: center;
	margin: 7px;
}

#passButt {
	color: #222;
	background-color: silver;
	margin: 7px;
}

#mailDiv {
	background-color: aquamarine;
	padding: 20px;
	margin: 3vw;
	font-size: 0.7em;
}

form input {
	width: 40%;
	padding: 5px;
	margin: 10px 0;
}

label {
	margin: 10px;
}


/*
#mailAD {
	width: 40vw;
	text-align: center;	
}
#mailBody {
	width:  40vw;
	height:  30vh;
}*/


#debug {
	display: none;
	background-color: blue;
	color: white;
}