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;
	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;
    color: gold ;
    background-color: #222 ;
}
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;
} 

h1,h2,h3,h4,h5,h6{
    color: gold ;
    width: 80% ;
    margin: 20px auto;
}

h1{
    font-size:    26px ;
    text-align: center ;
    margin-top:   10px ;
    color:gold;
}

p  { font-size: 24px ;
    line-height: 1.3;
    text-align: left;
    width:80% ;
    margin: 15px auto;
    color:#ddd;
}

img{
    max-width: 100%;
    margin: 20px auto ;
    float: middle ;
    display: block ;
}


#content{
    margin: 0px auto 10px auto ;
    width:                100% ;
    max-width:           460px ;
    padding: 5px 20px ;
    background-color: rgba(10,10,10,.9) ;
}

#sitename{
    display: block;
    float:  center;
    width:   100% ;   
    background-repeat: no-repeat ;
    background-position: center ;
    clear:both ;
}

#tagline{
    font-size: 20px ;
    width: 80% ;
    display: block;
    margin: 8px auto ;
    text-align: center ;
}

a{
    color: #ffffff;
}
a:hover{
    color: #ffffff;
    text-decoration: none ;
}
a:visited{
color: #ffffff;
    text-decoration: none ;   
}
.toc a{
    display:block;
    margin-top:5px;
    margin-bottom:5px;
    text-decoration: none;
    font-size:16px;
}
.toc a:hover{
    font-weight:bolder;
}

#forgot a{
    display: block;
    width: 80% ;
    margin: 10px auto ;
    color: #ffffff ;
    font-size: 18px ;
    text-align: center ;
}
#forgot a:hover{
    color: #f1c232 ;
    font-weight: bold ;
}
#forgot a:visited{
    color: #f1c232 ;
}
#terms h2{
    width:90% ;
    margin: 5 auto ;
    color: aqua ;
    text-align:left ;
    font-size: 24px ;
    font-family: 'arial', serif ;
}
#terms h3{
    width:90% ;
    margin: 5 auto ;
    color: aqua ;
    text-align:left ;
    font-size: 20px ;
    font-family: 'arial', serif ;
}
#terms p{
    font-size:18px ;
    width:90% ;
    color:#ddd;
}

fieldset {
    width: 99% ;
    margin: 10px auto ;
}

.field{
    display:block;
    float:left;
    width:100%;
    clear:both ;
}
.field label{
    width:80% ;
    display:none ;
    clear:both;
    margin: 5px auto ;
    text-align: center ;
    font-size: 30px ;
}
.field input,select{
    width:  80% ;
    display:block ;
    clear:both;
    margin: 5px auto ;
    height: 30px ;
    border-radius: 5px ;
    border: 2px solid #00ffff ;
    background-color: #ccccff ;
    font-size: 20px ;
    padding-left:10px ;
    color: #b509ce ;
}

.field select{
    width:84%;
}

::-webkit-input-placeholder { /* WebKit browsers */
    color:    #215596;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color:    #215596;
    opacity:  1;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
    color:    #215596;
    opacity:  1;
}
:-ms-input-placeholder { /* Internet Explorer 10+ */
    color:    #215596;
}


.fieldReqs{
    width:90% ;
    display:block ;
    clear:both;
    margin:5px auto ;
    text-align:center ;
    color: #6ae2ff ;
    font-size: 15px ;
}


div .check{
    margin: 5px auto ;
    clear: both ;
    display: block ;
    float:left;
}

.check input{
    height:25px;
    width:25px;
    margin:0 15px ;
    background-color: #f1c232;
}
.check label{
    font-family: 'arial', serif ;
    font-size: 20px ;
}
.check a{
    color: #ffffff ;
}
.check a:hover{
    text-decoration: none ;
}
.check table{
    display:block;
    margin: 0 auto ;
    width:95% ;
    clear:both;
}
.check td{
    padding-top: 5px ;
    padding-bottom:5px ;
    vertical-align:top;
    color:aqua;
}
.check label{
    vertical-align:middle;
}

.register{
    width:80%;
    display:block;
    clear:both;
    margin: 0 auto ;
    padding-top:5px ;
}
#register{
    width:  184px ;
    display: block ;
    margin:5px auto ;
    height:   66px ;
    cursor:pointer ;
    border: 0 ;
    background-image: url('https://i.imgur.com/u1GQgnc.png') ;
    background-repeat: no-repeat ;
    background-position:  center ;
    background-color:    #111 ;
}
.register input[type=button]{
    width:  184px ;
    display: block ;
    margin:5px auto ;
    height:   66px ;
    cursor:pointer ;
    border: 0 ;
    background-image: url('https://i.imgur.com/u1GQgnc.png') ;
    background-repeat: no-repeat ;
    background-position:  center ;
    background-color:    #111 ;
}

hr {
    height: 3px ;
    background-color: #6ae2ff ;
    border: 0 ;
    max-width: 400px ;
    width: 80% ;
}

#formError{
    color: #ffffff ;
    font-weight: bold ;
    display:block;
    margin: 10px auto ;
    font-size: x-large ;
    width: 80% ;
    text-align: center ;
}
#formError a{
    color: #ffffff ;
}

#success{
    display:block;
    margin: 10px auto ;
    font-size: x-large ;
    width: 80% ;
    text-align: left ;
    color:#ddd;
}

#footer{
    max-width:640px;
    width:100%;
    text-align:center;
    margin:30px auto;
    font-size:14pt;
}
#footer_links{
	text-align:center;
}
#footer_links a{
    color:magenta;
}
#footer_links p{
    color:gray;
}

.hrule{
    height: 3px ;
    background-image: url("https://i.imgur.com/60KlDeb.png");
    background-repeat:      no-repeat ;
    background-color:     transparent ;
    background-position: center center;
}


/* LEADERBOARDS */
.leaderboard table{
    width: 80% ;
    min-width: 240px ;
    margin: 0 auto ;
}
.leaderboard td{
    text-align:center;
    width: 33%;
}
.leaderboard th{
    font-weight: bold ;
    font-size: 20px ;
    text-align: center;
}
.player td{
    font-weight: bold ;
    color: #ff965b ;
}

/* LOAD APPROPRIATELY-SIZED ICONS */
@media screen and (min-width: 641px) {
	body {
		background:black url(https://i.imgur.com/ORv4wu0.png) no-repeat fixed top center;
	}
}
@media screen and (min-width: 401px) {
    #sitename{
        height: 130px ;
        background-image: url('https://i.imgur.com/OxYdIQv.png') ;
    }

}

@media screen and (max-width: 400px) {
    #sitename{
        height: 90px ;
        background-image: url('https://i.imgur.com/qeqPDMI.png') ;
    }
    .register{
        width:90% ;
    }
    #content{
        border: 0 ;
    }
}