/* mexitlan */

body
{
margin:0;
padding:0;

background:#e4d5b7;

color:#333;
font-family:sans-serif;
}




/* a */
a
{
text-decoration:none;
color:white;
}






header
{

}

footer
{
background:black;
margin:auto;
max-width:1200px;
}









/* divs */
.innercont
{
max-width:1200px;
width:96%;
margin:auto;
}

#content
{
margin:auto;
max-width:1200px;
background:white;
}

.next
{
display:inline-block;
}

.player
{
background:black;
color:white;
max-width:300px;
padding:5px;
border-radius:5px;
}




.center
{
margin:auto;
text-align:center;
}

.center300
{
max-width:300px;
margin:auto;
text-align:center;
}




.loading
{
color: #888; 
font-style: italic;
}

.clear
{
clear:both;
}

.col3
{
display:inline-block;
vertical-align:top;
width:32%;
}

.node
{
display:inline-block;
width:47%;
padding:5px;
background:#027F00;
background:beige;
border-radius:8px;
}

.mapsymbol
{
transition:.2s;
}
.mapsymbol:hover
{
transform:scale(1.5);
}





/* img */
.fit
{
width:100%;
max-width:100%;
}

.ofc100
{
object-fit:cover;
height:100px;
width:100px;
}

.ofc200
{
object-fit:cover;
height:200px;
width:200px;
}










/* input */
input
{
padding:9px;
border-radius:5px;
border:2px solid black;
}

select
{
padding:9px;
border-radius:5px;
border:2px solid black;
}

textarea
{
padding:9px;
border-radius:5px;
border:2px solid black;
}

input[type=radio]
{

height:2em;
}

input[type=checkbox]
{
transform:scale(2.5);
}








/* menu */
#menucont
{
width:100%;
/*
background-color:#4C0082;*/
background-color:black;
}



ul {
list-style-type: none;
margin:0;
padding:0;
overflow:hidden;
/*background-color:#4C0082;*/
background-color:black;
font-size:20px;
}

li 
{
float: left;
}

li a, .dropbtn 
{
display:inline-block;
padding:12px;
color:white;
text-align:center;

text-decoration:none;
}

li a:hover, .dropdown:hover .dropbtn 
{
background-color:red;
}

li.dropdown 
{
display:inline-block;
}

li>a:after 
{ 
content:' ▼'; 
}

li>a:only-child:after 
{ 
content:''; 
}






/* dropdown*/
.dropdown-content 
{
display: none;
position: absolute;
/*background-color: #4C0082;*/
background:white;

min-width: 160px;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
z-index: 1;
}

.dropdown-content a 
{
color:black;
padding:12px 16px;
text-decoration:none;
display:block;
text-align:left;
}

.dropdown-content a:hover 
{
background-color: red;
color:white;
}

.dropdown:hover .dropdown-content 
{
display: block;
}
















/* sidenav */
#sidenav
{
display:none;
}
/* Fixed sidenav, full height */
.sidenav 
{


height:100%;
width:200px;
position:fixed;
z-index:1;
top:0;
left:0;
background-color:green;
overflow-x:hidden;
padding-top:20px;
}

/* Style the sidenav links and the dropdown button */
.sidenav a,.dropdown-btn 
{
padding:6px 8px 6px 16px;
text-decoration:none;
font-size:20px;
color:white;
display:block;
border:none;
background:none;
width:100%;
text-align:left;
cursor:pointer;
outline:none;
}

/* On mouse-over */
.sidenav a:hover, .dropdown-btn:hover 
{
color: #f1f1f1;
}





/* Main content???? */
.mainxxx
{
margin-left:200px;/* Same as the width of the sidenav */
font-size:20px;/* Increased text to enable scrolling */
padding:0px 10px;
}

/* Add an active class to the active dropdown button */
.active 
{
background-color:green;
color:white;
}

/* Dropdown container (hidden by default). Optional: add a lighter background color and some left padding to change the design of the dropdown content */
.dropdown-container 
{
display:none;
background-color:#262626;
padding-left:8px;
}

/* Optional: Style the caret down icon */
.fa-caret-down 
{
float: right;
padding-right: 8px;
}

/* Some media queries for responsiveness */
@media screen and (max-height: 450px) 
{
.sidenav {padding-top: 15px;}
.sidenav a {font-size: 18px;}
}








/* buttons */
.blackbutton
{
display:inline-block;
background:black;
color:white;
padding:9px;
}

.redbutton
{
display:inline-block;
background:red;
color:white;
padding:9px;
}









/* text */
.w
{
color:white;
}

.poppins2
{
font-family:Poppins;
font-weight:700;
font-size:2vw;
}

.detail
{
color:grey;
font-size:0.8vw;
}

@media screen and (max-width:600px) 
{
.detail
{
font-size:4vw;
}
}