@charset "UTF-8";
.body {
height:100%;
background-image: url("/images/mesamezcla.png");
background-repeat:no-repeat;
background-size:cover; 
background-attachment: fixed;
background-position:center;
padding-top:5px;
color:#ffffff;
font-family: 'Roboto' , sans-serif;
font-size: 16px; 
letter-spacing:1px;
margin: 0 0 0 0;
}
 .content {
	width:100%;
	max-width:1024px;
	/*height:400px;
	line-height:400px;*/
	margin:135px auto;
	text-align:center;
	font-family: 'Roboto' , sans-serif;
	/*background-color:#CCCCCC;*/
}
  .content2 {
	width:100%;
	max-width:640px;
	
	border-radius:5px;
	background-color:#000000;
	padding: 5px 0 5px 0;
	opacity:0.7;
	font-family: 'Roboto' , sans-serif;
	font-size: 22px;
	letter-spacing:1px
	text-align:center;
	z-index:999;
 
}
 .content4 {
	width:100%;
	margin:150px auto;
	max-width:1024px;
	border-radius:5px;
	background-color:#ffffff;
	padding: 5px 10px 5px 10px;
	opacity:0.8;
	font-family: 'Roboto' , sans-serif;
	font-size: 16px;
	letter-spacing:1px
	text-align:center;
	z-index:999;
 
}
.mapdiv {
border-radius:35px;
overflow: hidden;
width: 'fit-content';
display: 'flex';
height: 'fit-content';
width:100%;
opacity:0.9;
}
 .content img {
	vertical-align:middle;
}

.fade-in { 
 animation: fadeIn ease 5s; 
 -webkit-animation: fadeIn ease 5s; 
 -moz-animation: fadeIn ease 5s; 
 -o-animation: fadeIn ease 5s; 
 -ms-animation: fadeIn ease 5s; 
} 
@keyframes fadeIn { 
 0% {opacity:0;} 
 100% {opacity:1;} 
} 

@-moz-keyframes fadeIn { 
 0% {opacity:0;} 
 100% {opacity:1;} 
} 

@-webkit-keyframes fadeIn { 
 0% {opacity:0;} 
 100% {opacity:1;} 
} 

@-o-keyframes fadeIn { 
 0% {opacity:0;} 
 100% {opacity:1;} 
} 

@-ms-keyframes fadeIn { 
 0% {opacity:0;} 
 100% {opacity:1;} 
}