body {
    background: #383838;
    color: #ff9933;
    font-family: 'Source Sans Pro', sans-serif;
	overflow:hidden;
}
/* MENU */
.top {
	margin-top:45rem;
    margin-left: 0.5em;
    float:left;
	position:absolute;
}
nav {
	margin-top:2em;
    list-style-type: none;
	padding-left: 2em;
	padding-right:2em;
	text-align: left;
	font-size: 1.29em;
	position: fixed;
    max-width: 35em;
}
nav a {
    display: inline;
}
nav a:link {
	color: #3399ff;
	text-decoration:none;
}  
nav a:visited {
    color: #3399ff;
}
/* Change color when selecting menu item */
nav a:hover {
    color: #ff9933;
	font-size:1em;
}
/* Color active menu item */
nav a.active {
    color: #ff9933;
	font-size:1em;
}
ul {
   list-style-type: square; 
}
/* DROPDOWN MENU */
.dropbtn {
    background-color: #383838;
    color: #3399ff;
	font-family: 'Source Sans Pro', sans-serif;
	font-size:1em;
	border: none;
}
.dropbtn:hover {
    color: #ff9933;
}
.dropdown {
    width:10rem;
    position: relative;
    display: inline-block;
}
.dropdown-content {
	display: none;
    position: absolute;
	top: 0;
	left: 0;
    background-color: #383838;
    color: #3399ff;
	font-family: 'Source Sans Pro', sans-serif;
	font-size:1em;
	border: none;
	text-align: left;
	padding-left: 0.4em;
}
.dropdown:hover .dropdown-content {
    display: block;
}
.dropdown-content a {
    color: #3399ff;
	text-decoration:none;
    display: block;
}
/* HEADLINES */
h1 {
	font-size: 50px;
	margin-top: -12px;
    margin-left: -5px;
	text-align: left;
}
h1:after {
	content:"_";
}
h2 {
	font-size: 25px;
	margin-top: -5px;
}
h2:after {
	content:"_";
}
h3	{
	font-size: 20px;
}
/* CONTENT */
/* Main content styling
Hide the scrollbar, outer 'frame' */
.hidden-scrollbar {
	margin-top:9rem;
    max-width: 35em;
	margin-left: 1.7em;
	padding-right: 30px;
	position:absolute;
	font-size: 1.2em;
	background: #383838;
	color: #ff9933;  
	overflow:hidden;
	text-align:justify;
	z-index:1;
}
/* Inner 'frame'
Organizing it like this hides the scrollbar but you're still able to scroll */
.hidden-scrollbar .inner {
    max-height:35rem;
	overflow:auto;
	margin:1em -300px 2em 0.6em;
	padding-right:300px;
	z-index:1;
}
/* Link styling for main content
Add '+' before links (I don't like underlining or changing color) */
.hidden-scrollbar a:before {
	content: "+";
}
/* Links content */
.hidden-scrollbar a:link {
	color: #ff9933;
	text-decoration:none;
}  
.hidden-scrollbar a:visited {
	color: #ff9933;
	text-decoration:none;
	} 
.hidden-scrollbar a:hover {
	color: #3399ff;
	text-decoration:none;
	}
a:link {
	color: #ff9933;
	text-decoration:none;
}  
a:visited {
	color: #ff9933;
	text-decoration:none;
	} 
a:hover {
	color: #3399ff;
	text-decoration:none;
	} 
/* responsive height scaler content and clean image remover */
@media all and (max-width: 65em) {
    .rightimg {
      display: none;
        }
    .rightimg2 {
      display: none;
        }
    .hidden-scrollbar .inner {
    max-height:24rem;
        }
    .top {
    margin-top:33rem;    
    }
}
@media all and (min-width: 65em) and (max-width: 80em) {
    .hidden-scrollbar .inner {
    max-height:29rem;
        }
    .top {
    margin-top:38rem;    
    }
}
@media all and (min-width: 80rem) {
    .hidden-scrollbar .inner {
    max-height:35rem;
        }
    .top {
    margin-top:46rem;    
    }
}
/* IMAGES */
/* Position pictures on the right */
/*.logo TODO */
.rightimg {
	margin-top:10em;
	margin-left:48em;
    float:left;
	position:absolute;
	opacity:0.7;
	border-left-color: #ff9933;
	border-left-style: solid;
}
.rightimg:hover {
	opacity:1.0;
}
.rightimg2 {
	margin-top:25em;
	margin-left:48em;
    float:left;
	position:absolute;
	opacity:0.7;
    border-left-color: #ff9933;
	border-left-style: solid;
}
.rightimg2:hover {
	opacity:1.0;
}
