html, body {
font-family: 'Source Sans Pro', sans-serif;
color: #d9d9d9;
background: #1B1B1B;
margin: 0;
}

.head {
height: 200px;
text-align: center;
position: relative;
overflow: hidden;
margin: 0 auto;
border-left: 3px solid black;
border-right: 3px solid black;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}

.nav {
height: 50px;
position: sticky;
top: 0;
z-index: 1000;
margin: 0 auto;
border-bottom: 3px solid black;
background: #1B1B1B;
}

.main {
border-left: 3px solid black;
border-right: 3px solid black;
border-bottom: 3px solid black;
margin: 0 250px;
min-height: 300px;
}

.cntnt {
margin: 10px 25px;
}

.footer {
margin: 0 auto;
margin: 1% 250px 8px 250px;
padding: 8px 10px;
border: 3px solid black;
font-size: 12px;
text-align: center;
}

.infobox {
padding: 12px;
background: none;
width: auto;
box-sizing: border-box;
border: 4px double #555555;
margin: 0 auto;
margin-top: 5px;
}

::-webkit-scrollbar {width: 5px;}
::-webkit-scrollbar-track {background: transparent;}
::-webkit-scrollbar-thumb {background-color: #39FF14;border-radius: 20px;border: 0 solid #222;}
::-webkit-scrollbar-thumb:hover {background-color: #14AA14;}

@media screen and (max-width: 922px) {

.head {
height: 100px;
border-left: 2px solid black;
border-right: 2px solid black;
}

.nav {
border-bottom: 2px solid black;
}

.main {
border-left: 3px solid black;
border-right: 3px solid black;
border-bottom: 3px solid black;
margin: 0 10px;
}

.footer {
margin: 1% 10px 8px 10px;
font-size: 11px;
border: 2px solid black;
padding: 10px;
}

}

.mobile {
display: none;
width: 0;
height: 0;
overflow: hidden;
}

@media screen and (max-width: 922px) {
.desk {
display: none;
width: 0;
height: 0;
overflow: hidden;
}

.mobile {
display: contents;
width: auto;    /* reset width */
height: auto;   /* reset height */
overflow: visible;
}

}