@media screen
{
#header {
    display:block;
    clear:left;
    float:left;
    width:90%;
    margin-left:4em;
    margin-right:4em;
    background-color:rgb(67,115,188);
    background-image:url(headergrad.png);
    background-repeat:repeat-x
}
body {
    background-color:rgb(65,65,80);
    background-image:url(gradient.png);
    background-repeat:repeat;
    color:rgb(220,255,255);
    font-family:Helvetica,Verdana,sans-serif
}
img {
    border-style: none
}
.mainsect {
    line-height:1.5em
}
a:link {
    color:rgb(235,235,255);
    background-color:transparent
}
a:visited {
    color:#cccc33;
    background-color:transparent
}
a:hover {
    color:#333333;
    background-color:white
}
a:active {
    color:#333333;
    background-color:white
}
#logo {
    display:block;
    float:left
}
#menubar {
    display:block;
    float:left;
    margin-left:1ex
}
#menubar ul {
    padding-left:0
}
.navitem, .currentnavitem {
    list-style-type:none;
    list-style-image:none;
    display:block;
    float:left
}
.currentnavitem {
    color:white;
    background-color:#333333;
    margin-top:3ex;
    height:3ex
}
.navitem {
    padding-top:1.5ex;
    padding-bottom:1.5ex;
    height:3ex
}
.navitem a, .currentnavitem {
    background-image:url(gradient.png);
    background-position: right top;
    background-repeat:no-repeat;    
    text-decoration:none;
    padding-top:1.5ex;
    padding-right:1em;
    padding-bottom:1.5ex;
    padding-left:1em;
    font-family: Helvetica, Verdana, sans-serif;
    font-size: 80%
}
.navitem a {
    background-color:#ddffdd
}
.navitem a:link {
    color:black
}
.navitem a:hover {
    color:black;
    background-color:white
}
.navitem a:active {
    color:black
}
.navitem a:visited {
    color:black
}
#main {
    display:block;
    clear:left;
    float:left;
    width:90%;
    margin-left:4em;
    margin-right:2ex
}
h1 {
    text-align:center;
    font-family:Helvetica,Verdana,sans-serif;
    font-size:130%;
    color:rgb(235,235,255);
    border-style:none;
    margin-top:2em
}
h2 {
    font-family:Helvetica,Verdana,sans-serif;
    font-size:130%;
    margin-top:1.5em;
    margin-bottom:2em;
    color:rgb(255,255,215)
}
h3 {
    font-family:Helvetica,Verdana,sans-serif;
    font-size:110%;
    margin-top:1.5em;
    margin-bottom:2em;
    font-style:italic;
    color:rgb(235,235,255)
}
dt {
    margin-top:2ex
}
div.floater ul li {
    margin-left:1ex
}
ul li {
    list-style-image:url(bullet.png);
    padding-left: 0;
    margin-top:2ex
}
div.floatsect {
    display:block;
    float:right;
    margin-left:1em;
    margin-bottom:1em;
    width:25%;
    font-size:80%;
}
div.floatsect h1 {
    text-decoration:none;
    font-size:100%;
    font-family:Helvetica,Verdana,sans-serif;
    color:rgb(235,235,255);
    background-color:transparent;
    border-style:none;
    text-align:center
}
div.mainsect {
    display:block;
    float:left;
    width:70%
}
div.event, div.floater {
    display:block;
    border-style:solid;
    background-color: rgb(50,50,50);
    background-image:url(floatergrad.png);
    background-repeat:repeat
}
h2.eventname {
    font-family:Helvetica,Verdana,sans-serif;
    font-size:100%;
    color:rgb(235,235,255);
    text-align:center;
    font-weight:bold;
    text-transform:uppercase;
}
.eventdatetime {
    font-weight:bold;
    text-align:center;
    color:rgb(235,235,255)
}
.eventlocation, .eventdesc, .floater p {
    margin-left:1em;
    margin-right:1em
}
.floater ul li {
    margin-left:1ex
}
.locname, .locstreet, .loccitystatezip, .locdesc, .eventlocation a  {
    display:block
}
.locname, .locstreet, .loccitystatezip {
    font-style:italic
}
.locdesc {
    margin-top:1em
}
.eventlocation a:link, .eventlocation a:visited, .floater a:link, .floater a:visited {
    background-color:transparent
}
.eventlocation a:hover, .eventlocation a:active, .floater a:hover, .floater a:active {
    color:#333333;
    background-color:white
}
#skipnav {
    display: none
}
#footer {
    display:block;
    clear:left;
    float:left;
    text-align:center;
    width: 100%;
    font-size: 70%
}
.emailshortdesc {
    color:rgb(235,235,255);
    font-weight:bold
}
.topic {
    color:rgb(255,255,215);
    font-weight:bold;
    font-variant:small-caps
}
.websitename {
    color:rgb(235,235,255);
    font-weight:bold
}
.email {
    color:rgb(255,255,215);
    font-weight:bold;
    font-variant:small-caps
}
.picture {
    display:block;
    float:right;
    padding-top:2ex;
    padding-bottom:2ex;
    padding-left:2ex
}
.supplemental {
    font-size:70%
}
p.firstinsect:first-letter {
    float:left;
    font-family:serif;
    margin-top:0;
    padding-top:0;
    font-size:300%
}
caption {
    font-weight:bold;
    margin-bottom:1em;
    padding-bottom:1em
}
table {
    background-color:#222222;
    border-style:ridge;
    border-color:white;
    border-collapse: collapse;
    margin: 3em 3em 3em 4em;
    border-width:.5ex .5ex .5ex .5ex
}
td {
    border-style:ridge;
    border-color:white;
    padding: 1ex 1ex 1ex 1ex;
    font-size:80%
}
td a:link {
    color:white;
    background-color:#222222
}
td a:visited {
    color:#77ccff;
    background-color:#222222
}
td a:hover {
    color:#333333;
    background-color:white
}
td a:active {
    color:#cc3333;
    background-color:white
}
}

@media handheld {
body {
    background-color:white;
    color:black;
    font-family:Helvetica,Verdana,sans-serif
}
}

@media screen and (max-width: 799px) {
#header {
    display:block;
    clear:none;
    float:none;
    width:90%;
    margin-left:1em;
    margin-right:1em;
    color:black;
    background-color:white;
    background-image:none
}
body {
    margin-left:1em;
    margin-right:1em;
    color:black;
    background-color:white;
    background-image:none;
    font-family:Helvetica,Verdana,sans-serif;
    font-size:1em
}
img {
    display: none
}
.mainsect {
    line-height:1em
}
a:link {
    color:black;
    background-color:white;
    text-decoraton:underline
}
a:visited {
    color:blue;
    background-color:white
}
a:hover {
    color:white;
    background-color:black
}
a:active {
    color:white;
    background-color:black
}
a:focus {
    color:white;
    background-color:black
}
#logo {
    display:none;
    float:none
}
#logo img {
    display:none
}
#menubar {
    display:block;
    clear:none;
    float:none;
    margin-left:0
}
#menubar ul {
    padding-left:0
}
.navitem, .currentnavitem {
    list-style-type:disc;
    list-style-image:none;
    display:list-item;
    clear:none;
    float:none
}
.currentnavitem {
    color:black;
    background-color:white;
    margin-top:0
}
.navitem {
    margin-top:0;
    padding-top:0;
    padding-bottom:0
}
.navitem a, .currentnavitem {
    background-image:none;
    padding-top:0;
    padding-right:0;
    padding-bottom:0;
    padding-left:0;
    font-family: Helvetica, Verdana, sans-serif;
    font-size: 1em
}
.navitem a {
    color:black;
    background-color:white;
    text-decoration:underline
}
.navitem a:link {
    color:black;
    background-color:white;
    text-decoration:underline
}
.navitem a:hover {
    color:white;
    background-color:black
}
.navitem a:active {
    color:white;
    background-color:black
}
.navitem a:visited {
    color:blue;
    background-color:white
}
.navitem a:focus {
    color:white;
    background-color:black
}
#main {
    display:block;
    clear:none;
    float:none;
    width:90%;
    margin-left:1em;
    margin-right:1em
}
h1 {
    text-align:center;
    font-family:Helvetica,Verdana,sans-serif;
    font-size:1.5em;
    line-height:1.5em;
    color:black;
    background-color:white;
    border-style:none;
    margin-top:2em
}
h2 {
    font-family:Helvetica,Verdana,sans-serif;
    font-size:1.5em%;
    color:black;
    background-color:white;
    margin-top:1.5em;
    margin-bottom:2em
}
h3 {
    font-family:Helvetica,Verdana,sans-serif;
    font-size:1em;
    color:black;
    background-color:white;
    margin-top:1.5em;
    margin-bottom:2em;
    font-style:italic
}
dt {
    margin-top:2ex
}
div.floater ul li {
    margin-left:1ex
}
ul li {
    list-style-image:none;
    list-style-type:disc;
    padding-left: 0;
    margin-top:2ex
}
div.floatsect {
    display:block;
    clear:none;
    float:none;
    margin-left:0;
    margin-bottom:0;
    width:100%;
    font-size:1em;
}
div.floatsect h1 {
    text-decoration:none;
    font-size:1em;
    font-family:Helvetica,Verdana,sans-serif;
    color:black;
    background-color:white;
    border-style:none;
    text-align:center
}
div.mainsect {
    display:block;
    clear:none;
    float:none;
    width:100%
}
div.event, div.floater {
    display:block;
    border-style:none;
    color:black;
    background-color: white;
    background-image:none
}
h2.eventname {
    font-family:Helvetica,Verdana,sans-serif;
    font-size:1em;
    color:black;
    background-color:white;
    text-align:center;
    font-weight:bold;
    text-transform:uppercase;
}
.eventdatetime {
    font-weight:bold;
    text-align:center;
    color:black
}
.eventlocation, .eventdesc, .floater p {
    margin-left:1em;
    margin-right:1em
}
.floater ul li {
    margin-left:1ex
}
.locname, .locstreet, .loccitystatezip, .locdesc, .eventlocation a  {
    display:block
}
.locname, .locstreet, .loccitystatezip {
    font-style:italic
}
.locdesc {
    margin-top:1em
}
.eventlocation a:link, .floater a:link  {
    color:black;
    background-color:white
}
.eventlocation a:visited, .floater a:visited {
    color:blue;
    background-color:white
}
.eventlocation a:hover, .eventlocation a:active, .eventlocation a:focus, .floater a:hover, .floater a:active, .floater a:focus {
    color:white;
    background-color:black
}
#skipnav {
    display: none
}
#footer {
    display:block;
    clear:none;
    float:none;
    text-align:center;
    width: 100%;
    font-size: 1em
}
.emailshortdesc {
    color:black;
    font-weight:bold
}
.topic {
    color:black;
    font-weight:bold;
    font-variant:small-caps
}
.websitename {
    color:black;
    font-weight:bold
}
.email {
    color:black;
    font-weight:bold;
    font-variant:small-caps
}
.picture {
    display:none
}
.supplemental {
    display:none
}
p.firstinsect:first-letter {
    float:none;
    font-family:Helvetica,Verdana,sans-serif;
    margin-top:0;
    padding-top:0;
    font-size:100%
}
caption {
    font-weight:bold;
    margin-bottom:1em;
    padding-bottom:1em
}
table {
    background-color:#222222;
    border-style:ridge;
    border-color:white;
    border-collapse: collapse;
    margin: 3em 3em 3em 4em;
    border-width:.5ex .5ex .5ex .5ex
}
td {
    border-style:ridge;
    border-color:white;
    padding: 1ex 1ex 1ex 1ex;
    font-size:80%
}
td a:link {
    color:white;
    background-color:#222222
}
td a:visited {
    color:#77ccff;
    background-color:#222222
}
td a:hover {
    color:#333333;
    background-color:white
}
td a:active {
    color:#cc3333;
    background-color:white
}
}

@media print {
#menubar, img {
    display:none
}
h1 {
    font-size:16pt
}
h2 {
    font-size:14pt
}
}

/* a real computer with a screen >480 pixels wide
@media screen and (min-device-width: 480px)

 A mobile device with a screen < 480 pixels wide
@media only screen and (max-width: 480px) 

This media query expresses that the style sheet is usable on devices with viewport (the part of the screen/paper where the document is rendered) widths between 400 and 700 pixels:
@media screen and (min-width: 400px) and (max-width: 700px) { … }

@media handheld and (min-width: 20em), 
  screen and (min-width: 20em) { … }
*/





