/* RESET */

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;}

/* END OF RESET */


/*could make this font-size 100%*/

b, strong {font-weight: bold;}
i, em {font-style: italic;}
br {margin-bottom:0; line-height:0.167in}


a, a:link, a:visited  {text-transform:uppercase; font-size:75%; text-decoration:none; outline:none; color:#ffc; border-bottom: dotted 1px #ffc; }
a:hover {border-bottom:none; text-decoration:underline}
/*removes dotted border from highslide images, place after a*/
a:active {position:relative; top:1px; left:1px; outline:none}



html {font-size:0.167in}

body {font-family:verdana,arial,sans-serif; margin:0; height:100%; max-width:960px; margin:0; height:100%; width:99%; }

#total {background:#5A8686; float:left; border-left:10px solid #455c5a; border-right:10px solid #455c5a; width:100%; }

#indexT {background:#455c5a; padding:5px 10px 5px 10px; text-align:center; width:100%}
#indexL {float:left; width:400px; padding:10px; margin:50px auto 0 auto; font-family:"Baskerville Old Face",Georgia,"Times New Roman",Times,serif; font-weight: bold; text-align:center; color:#FFC; text-shadow:2px 2px 4px #000; }
#indexL img {width:400px; margin:0; border:none}
#indexL h1 {font-size:1.7em; margin-top:1em;}
#indexL h2 {font-size:1.2em; margin-top:2em; margin-bottom:40px}

#indexU {background:#5A8686; float:left; margin-top:50px; margin-left:50px; width:450px}
#indexU ul {margin-left:1.5em; list-style:disc; color:#FFC; }
#indexU ul li {margin-top:20px}
#indexU ul li img {float:right; height:70px; padding:0 5px}

#indexF {background:#455c5a; padding:5px 10px 5px 10px; text-align:center; width:100%;}
#indexF img {height:150px; margin-right:3px; margin-left:auto; margin-top:10px}

#indexF2 {background:#455c5a; padding:5px 10px 5px 10px; text-align:center; width:100%;}
#indexF2 img {height:100px; margin-right:3px; margin-left:auto; margin-top:10px}



@media only screen and (max-width:970px) {
#indexF img {height:130px; margin-right:1px}
}

@media only screen and (max-width:949px) {
#indexL img {width:350px; margin:0; border:none}
#indexU {margin-top:40px; width:350px; margin-left:5px}
}

@media only screen and (max-width:849px) {
#indexL img {width:300px; margin:0; border:none}
#indexM {width:300px; padding:10px; padding-bottom:100px}
#indexU {margin-top:40px; width:250px}
#indexU ul li img {display:none}
#indexF img {height:110px; margin-right:1px}
#indexF2 img {height:90px; margin-right:1px}
}

@media only screen and (max-width:749px) {
body {max-width:480px}
#indexL {float:left; width:480px; padding:0; margin:0; margin-top:40px; }
#indexL img {width:300px; margin:0; border:none}
#indexL h2 {margin-bottom:10px; margin-top:10px}
#indexU {clear:left; margin:10px 20px; width:400px; }
#indexU ul li {margin-top:5px}
#indexU ul li img {display:none}
.displayN {display:none}
#indexF img {height:150px; margin-right:40px}
}

@media only screen and (max-device-width:480px) {
body {max-width:480px}
#indexL {float:left; width:480px; padding:0; margin:0; margin-top:40px; }
#indexL img {width:300px; margin:0; border:none}
#indexL h2 {margin-bottom:10px; margin-top:10px}
#indexU {clear:left; margin:10px 20px; width:400px; }
#indexU ul li {margin-top:5px}
#indexU ul li img {display:none}
.displayN {display:none}
#indexF img {height:150px; margin-right:40px}
}

















/*




@media screen and (min-width:960px) {
#indexT {background:#455c5a; padding:20px; text-align:center}
#indexL {width:400px; padding:10px; margin:0; margin-top:40px; }
#indexL img {width:400px; margin:0; border:none}
#indexM {width:400px; padding:10px; padding-bottom:100px}

#indexF {clear:both;background:#455c5a; padding:5px 30px 5px 0px}
#indexF img {height:150px; margin-left:30px}



#indexR {float:right; width:100px; display:none}
#indexR img {width:100px; margin-top:1em}
#indexU {float:right; margin-top:50px}
}


@media screen and (min-width:800px) and (max-width:959px) {
#indexL {float:left; width:420px; padding:20px; border:1px dotted}
#indexL img {width:400px; margin:auto}
#indexM {float:left; width:380px; margin:auto; padding-top:100px; border:1px dotted; }
#indexR {border:1px dotted; clear:left}
#indexR img {height:140px;}
}

@media screen and (max-width:849px) {
#indexL {width:320px}
#indexL img {width:300px}
#indexM {border:1px dotted; width:320px;}
#indexR {}
}



*/