body { font-family: 'Lato', arial, sans-serif; background-color:#FFF; text-align: center;  }

/* basic typographic rules & form elements
---------------------------------------------------------------------------------------------------------*/
h1 { font-family: 'Lato', sans-serif; color:#383838; font-weight: 700; font-size: 32px; padding-bottom: 10px; border-bottom:1px dashed #eaeaea; margin: 0px 0 10px 0;  }
h2 { font-family: 'Lato', sans-serif; color:#383838; font-weight: 700; font-size: 24px; margin: 0px 0 10px 0; }
h3 { font-family: 'Lato', sans-serif; color:#b7b7b7; font-weight: 700; font-size: 18px; margin: 0px 0 10px 0; }
h4 { font-family: 'Lato', sans-serif; color:#383838; font-weight: 700; font-size: 16px; margin: 0px 0 5px 0; }

a { color:#0072bc; text-decoration:none; }
a:active { color:#0072bc; }
a:link    { color:#0072bc; }
a:hover   { color:#0072bc; text-decoration:underline; }
a:visited { color:#0072bc; }

body, p, li, td { font-size: 14px; color: #000 }
p { line-height: 18px; margin-bottom: 10px; }

li { line-height: 18px; margin-bottom: 7px; }

b, strong { font-weight: 700; }
i, em { font-style: italic }

/* Clears
---------------------------------------------------------------------------------------------------------*/
.lc { clear: left; }

/* Basic Layout & Wraps 
---------------------------------------------------------------------------------------------------------*/
.body-container { margin-left: auto; margin-right: auto; min-width: 1200px; width: 100%; min-height: 500px; text-align: center; position: relative; }
.body-wrap { position: relative; margin-left: auto; margin-right: auto; width: 1200px; }

.header { background: url('/lib/images/backgrounds/background-header01.png') no-repeat; width: 100%; height: 104px; margin-top:20px; }
.navigation-container { position: absolute; z-index:5; right: 18px; top:40px; width: 710px; height: 46px; }

.hp-box-container { margin-left: auto; margin-right: auto; width:1100px; background-color:#eaeaea; margin-top:20px; padding: 30px 0 30px 0; background-image:url('/lib/images/backgrounds/background-services.png'); background-repeat:no-repeat; }
.hp-box-vote { float: left; cursor: pointer; width: 225px; height: 338px; margin:0 20px 0 68px; background-image:url('/lib/images/backgrounds/background-vote-blue.png'); background-repeat:no-repeat; }
.hp-box-vote:hover { background-image:url('/lib/images/backgrounds/background-vote-bl.png'); }

.hp-box-box { float: left; cursor: pointer; width: 225px; height: 338px; margin-right:20px; background-image:url('/lib/images/backgrounds/background-box-on.png'); background-repeat:no-repeat; }
.hp-box-box:hover { background-image:url('/lib/images/backgrounds/background-box-off.png'); }

.hp-box-ribbon { float: left; cursor: pointer; width: 225px; height: 338px; margin-right:20px; background-image:url('/lib/images/backgrounds/background-ribbon-red.png'); background-repeat:no-repeat; }
.hp-box-ribbon:hover { background-image:url('/lib/images/backgrounds/background-ribbon-bl.png'); }

.hp-box-capitol { float: left; cursor: pointer; width: 225px; height: 338px; margin-right:20px; background-image:url('/lib/images/backgrounds/background-capitol-blue.png'); background-repeat:no-repeat; }
.hp-box-capitol:hover { background-image:url('/lib/images/backgrounds/background-capitol-bl.png'); }


.hp-box-book { float: left; cursor: pointer; width: 225px; height: 338px; background-image:url('/lib/images/backgrounds/background-book-on.png'); background-repeat:no-repeat; }
.hp-box-book:hover { background-image:url('/lib/images/backgrounds/background-book-off.png'); }

.hp-box-none { float: left; cursor: pointer; width: 225px; height: 338px; color:#000; }

.box-top { color:#666664; text-transform:uppercase; font-size:18px; line-height: 20px; border-bottom: 1px solid #dcdede; margin: 150px 0 10px 20px; width: 180px; height: 30px; }
.box-bottom { width: 200px; height: 140px; font-size:11px; line-height: 16px; margin: 0 0 0 10px;  }

.box-topfinal { color:#666664; text-transform:uppercase; font-weight:400; font-size:28px; line-height: 32px; margin: 140px 0 10px 20px; width: 180px; }
.box-bottomfinal { width: 180px; height: 140px; font-size:13px; line-height: 18px; margin: 0 0 0 20px;  }


.hp-lower-container { margin-left: auto; margin-right: auto; width:1000px; background-color:#f7f7f7; padding: 30px 50px 30px 50px; }
.hp-lower-float { float:left; width: 500px; padding: 0; text-align:left; }

.hp-lower-float h1 { font-size: 26px; font-weight: 500; color:#383838; margin-bottom: 20px; }
.hp-lower-float .highlight { color:#ed1c24; }
.hp-lower-float a { font-size: 16px; }
.hp-lower-float p { font-size:13px; line-height:24px; }

.content-container { margin-left: auto; margin-right: auto; width:1100px; background-color:#fff; margin-top:20px; padding: 0px 0 10px 0; text-align:left; }
.content-container p { font-size:13px; line-height:24px; }

.content-left { float:left; width: 755px; margin:0 50px 0 40px; }
.content-right { float:left; width: 200px; }

.content-image { width: 755px; height: 100px; background-color:#eaeaea; margin-bottom:20px; background-repeat:no-repeat; }

.footer-container { margin-left: auto; margin-right: auto; width:1100px; height: 200px; background-color:#313131; background-image:url('/lib/images/backgrounds/background-footer01.png'); background-position: 720px 20px; background-repeat: no-repeat; }
.footer-left { float:left; margin: 25px 0 0 25px; width: 740px; height: 150px; }
.footer-right { float:left; margin: 25px 0 0 0; width: 310px; height: 150px; text-align:right;  }
.footer-right p { margin-top: 100px; font-size: 10px; color:#cecece; }
.footer-left td { text-align:left; padding: 5px 20px 0 20px; }
.footer-left td a { color:#eaeaea; font-size: 14px; text-decoration: none; }
.footer-left td p { margin:10px 0 0 2px; }


a.nav-menu, a.nav-menu:active, a.nav-menu:link, a.nav-menu:visited { display:block; padding: 0 15px 0 15px; margin:0; width: 170px; height: 30px; line-height: 30px; border-bottom: 1px solid #eaeaea; color:#ed1c24; text-transform:none; !important}
a.nav-menu:hover { background-color:#eaeaea; color:#000; text-transform:none;  !important}

/* News
---------------------------------------------------------------------------------------------------------*/
.news-left { float:left; width: 60px; }
.news-right { float:left; width: 690px; margin-bottom:20px; }
.news-right h2 a { font-size:16px; }

.calendar { width: 46px; height: 50px; background-color: #000; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; text-align: center; }
.calendar-number { font-family: 'Lato', sans-serif; font-weight: 700; font-size: 24px; color:#FFF; padding: 5px 0 0 0; }
.calendar-month { font-family: 'Lato', sans-serif; font-weight: 700; font-size: 10px; color:#FFF; padding: 3px 0 0 0; }

/* Navigation
---------------------------------------------------------------------------------------------------------*/
#topnav, #topnav ul { padding: 0; margin: 0; list-style: none; }
#topnav li a { font-family: 'Lato', font-weight: 300; sans-serif; display: block; height: 46px; color: #000; font-size: 15px; line-height: 40px; text-align: center; text-decoration: none; padding: 0px 20px 0px 20px; }
#topnav li a:hover { color: #ed1c24; }
#topnav li { float: left; text-align: left; }
#topnav li:hover ul, #topnav li.sfhover ul { left: auto; }
#topnav li ul { position: absolute; width: 150px; padding: 0; left: -999em; z-index 500; }
#topnav li ul li a { font-size: 14px; text-align: left; color:#000; background-color:#FFF; height: 34px; line-height: 34px; padding: 0px 5px 0px 5px; width: 150px; overflow: hidden; border-left: 1px solid #ededed;border-right: 1px solid #ededed; border-bottom: 1px solid #ededed; }
#topnav li ul li a:hover { background-color:#ededed; color:#000;  }
#topnav li ul li { margin:0; padding:0; }

#topnav li ul ul { margin: -35px 0 1px 221px; }
#topnav li:hover ul, #topnav li li:hover ul, #topnav li.sfhover ul, #topnav li li.sfhover ul { left: auto; }
#topnav li:hover ul ul, #topnav li:hover ul ul ul, #topnav li.sfhover ul ul, #topnav li.sfhover ul ul ul { left: -999em; }
#topnav li:hover ul, #topnav li li:hover ul, #topnav li li li:hover ul, #topnav li.sfhover ul, #topnav li li.sfhover ul, #topnav li li li.sfhover ul { left: auto; }

.trigger { background-image: url('/lib/images/backgrounds/background-nav-drop.png'); background-repeat: no-repeat; background-position: center 33px; }
.slide-slogan { text-transform:uppercase; margin-left: 500px; margin-top: 40px; width: 625px; height: 350px; font-weight: 400; color:#666664; font-size: 50px; line-height: 60px; }
.highlight { color:#ed1c24; }
.highlight-bl { color:#0072bc; }


/* form elements
---------------------------------------------------------------------------------------------------------*/
.search-textbox { outline: none; font-size: 16px; color: #FFF; height: 40px; width: 205px; border: 0px; background-color: #243B56; vertical-align: bottom; }
.search-button { outline: none; height: 50px; width: 32px; background-image:url("/lib/images/icons/search32.png"); background-position: 50% 80%; background-repeat:no-repeat; background-color: #243B56; border: 0px; vertical-align: top; }

input[type=text] { outline: none; margin: 2px; font-size: 12px; line-height:30px; height: 30px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; border: 1px solid #ccc; max-width: 100%; }
input[type=password] { outline: none; font-size: 12px; line-height:30px; height: 30px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; border: 1px solid #ccc; width: 100%; }
select { outline: none; font-size: 12px; line-height:30px; height: 30px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; border: 1px solid #ccc; }
textarea { outline: none; font-size: 12px; height: 18px; width: 100%; height:200px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; border: 1px solid #ccc; }

.button, input[type=button], input[type=submit], input[type=reset] { outline: none; font-size: 12px; height: 30px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; border: none; color: #FFF; background-color: #000; }
.button:hover, input[type=button]:hover, input[type=submit]:hover, input[type=reset]:hover { outline: none; font-size: 12px; height: 30px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; border: none; color: #FFF; background-color: #0072bc; }
