/*CSS RESET http://meyerweb.com/eric/tools/css/reset/  License: none (public domain) */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, 
table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {margin:0; padding:0; border:0; font-size:100%; font:inherit; vertical-align:baseline;}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;} body {line-height: 1;} ol, ul {list-style: none;} blockquote, q {quotes: none;} blockquote:before, blockquote:after, q:before, q:after {content: '';	content: none;} table {border-collapse: collapse; border-spacing: 0;}

/*MAIN*/
@font-face {font-family: Eurostile; src: url(../fonts/Eurostile.otf);}

body {font-family:Eurostile,arial,helvetica; font-size:10pt; color:#686868; overflow:auto; 
    background-color:black;}

header {font-family:Eurostile,Arial,Helvetica; background:black; color:#909090; 
    position:fixed; top:0px; left:0px; width:100%; height:40px; z-index:100;}
nav {padding:0px; text-align:center;}

ul {list-style-type:none; margin:0; padding:0; overflow:hidden; background-color:black;}
li {display:inline-block; padding:0px 0px 0px 20px;}
li a, .dropbtn {color:#909090; text-align:center; text-decoration:none;}
li a:hover, .dropdown:hover .dropbtn {background-color:black;}
li.dropdown {display: inline-block;}
.dropdown-content {display:none; position:absolute; background-color:black; min-width:180px; z-index: 1;}
.dropdown-content a {color:#909090; padding:4px 16px; text-decoration:none; display:block;
                    margin:10px; text-align:left;}
.dropdown-content a:hover {background-color:black;}
.dropdown:hover .dropdown-content {display:block;}

#menu-icon {display:none; width:30px; height:30px; background:#4B4B4B url(../img/menu-icon.png) center;}

/*starts the page at 100 pixels from the top*/
br.begin {line-height:100px;}

div.title {font-family:Eurostile,arial,helvetica; font-size:36pt; background-color:black;
    text-align:center; border:0px; color:#858585; line-height:150%}

div.titlesmall {font-family:Eurostile,arial,helvetica; font-size:20pt; background-color:black;
    text-align:center; border:0px; color:#858585; line-height:180%}

div.homebody {position:relative; top:90px;}
div.pagebody {position:relative; top:60px;}

img.wide {width:100%; height:auto;}

/*use for subtitles and minor headings*/
p.subtitle {line-height:120%; font-size:24pt; text-align:center;}

/*use for small subtitles and small descriptive headings*/
p.subtitle2 {line-height:120%; font-size:16pt; text-align:center;}

/*use for paragraphs*/
p.bodytext {line-height:120%; font-size:12pt; max-width:700px; margin:auto; padding:10px}

hr {border:none; background-color:#404040; color:#404040; height:2px; max-width:750px;}

/*does not float the image*/
div.nofloat {padding: 2px 10px 2px 10px; margin-bottom: 2px;}

div.img-resize {position:relative;}
img.contained {max-width:640px; height:auto; width:90%;}

/*Polaroid style captions on images - combined with either div.left or div.right*/
div.container {text-align:center; font-style:italic; padding:10px 10px; max-width:540px;}



table {font-size:inherit; font-family:inherit; background:black; color:#909090; line-height:140%
    width:100%; border-collapse:collapse; max-width:850px;}
tr{background:inherit;}
tr.bottom{background:inherit; border-bottom: 1px}
td, th {padding: 6px; border: 0px solid #ccc; text-align: left; vertical-align: top;}


/*MEDIA QUERY*/

@media only screen and (max-width:980px)
{
img.wide {width:120%; height:auto;}
}

@media only screen and (max-width:640px)
{
#title {top:30px; left:80px; }
header {position:absolute; background:black; text-align:left; top:25px; left:20px; width:20px;}
#menu-icon {display:inline-block; width:30px; height:30px; background:black url(../pics/menu-icon.png) center;}
nav ul, nav:active ul {display:none; position:absolute; background:#4B4B4B; border: 5px solid #444;
	left:10px; top:20px; width:180px; padding:0px 0px; margin:0px; border-radius: 4px 0 4px 4px;}
nav li {width:100%; padding:0px; margin:20px 0px 0px 16px; text-align:left;}
nav:hover ul {display:block;}
li.dropdown {display:inline-block; text-align:left;}
.dropdown-content {display:block; position:relative; background:#4B4B4B;}
.dropdown-content a {display:block; padding:0px; margin:20px 0px 0px 16px;}
.dropdown:hover .dropdown-content {display:block;}

#logo {margin:0px; display:none;}

br.begin {line-height:30px;}

div.title {font-family:Eurostile,arial,helvetica; font-size:24pt; background-color:black;
    text-align:center; border:0px; color:#858585; line-height:150%}

div.titlesmall {font-family:Eurostile,arial,helvetica; font-size:12pt; background-color:black;
    text-align:center; border:0px; color:#858585; line-height:180%}

img.wide {width:180%; height:auto;}

/* Force table to not be like tables anymore */
table, thead, tbody, th {display: block;}
tr {display:block; border:none;}
td {display:block; border:none; position:relative; padding-left:10px;}
}