/******
DEFAULTS

Do not modify these defaults except to specify proper fonts
******/

* {
	margin: 0;
	padding: 0;
}

html, body, form, fieldset, div, table, tr, td, img {
	border: none;
}

h1, h2, h3, h4, h5, h6, p, pre, blockquote, 
ul, ol, li, dl, dd, address, hr {
	margin: 1em 0;
	border: none;
}

li, dd, blockquote {
	margin-left: 2em;
}

/* fonts */

body {
	font: 12px arial,helvetica,sans-serif;
}

input, select, textarea {
	font: 11px arial,helvetica,sans-serif;
}

/******
TEXT BASICS

These declarations can be freely modified to suit the design and
color scheme. Other common text elements should be added here.
******/

h1 {
    margin-top: 0;
    font-size: 2em;
    font-family: "futura",arial,sans-serif;
}
h2 {
    margin: .75em 0;
    font-size: 1.5em;
}
h3 {
    margin: .6em 0;
    font-size: 1.2em;
}
a {
    outline: none;
    color: #1f3454;
    text-decoration: none;
    font-weight: bold;
}
a:hover {
    text-decoration: underline;
}
hr {
    border: none;
    color: #000;
    background: #000;
    height: 1px;
}


/******
IMAGES/MEDIA

These declarations support the styles included in image.tmpl, 
video_clip.tmpl, audio_clip.tmpl, and flash_clip.tmpl.
Do not delete.
******/

img,
object {
    display: block;
}
img.inline {
    display: inline;
}
div.pic small {
    font-weight: bold;
    font-size: 10px;
    line-height: 1.2;
}
div.video,
div.audio,
div.flash {
    margin: 1em 0;
}
div.align-c {
    margin: 1em auto;
}
/* Smaller bottom margin */
div.align-r {
    float: right;
    margin: 0 0 .5em 1em;
}
/* Smaller bottom margin */
div.align-l {
    float: left;
    margin: 0 1em .5em 0;
}
div.align-f {
    margin: 0;
}
div.border {
    border: 1px solid #000;
    padding: 2px;
}


/******
TABLES

Basic declarations for display of tabular data. Modify as needed
******/

td, th {
    padding: 2px 5px;
}
th {
    text-align: left;
}
tr {
    vertical-align: top;
}


/******
FORM BASICS

These styles are used extensively on many forms and often on stub forms
in category.tmpl. Do not delete, but you can modify for look and feel. Most
other form-specific styles are in forms.css.
******/

form div.formrow {
    margin: 6px 0;
}
form label {
    display: block;
    font-weight: bold;
}
form label.inline {
    display: inline;
    font-weight: bold;
}
form input {
    vertical-align: middle;
}
form input.submit {
    margin: 1em 0;
    font-weight: bold;
    overflow: visible; /* removes extra space beside text in IE Win 5.5+ */
    padding: 1px 2px;
}
form input.submit.inline {
    margin: 0;
}
form span.req {
    font-weight: bold;
    color: red;
}


/******
UTILITY CLASSES

Many of these utility declarations are used in the reference template sets.
Feel free to add your own but do not delete any of the following.
******/

.odd {
	background: #ccc;
}
.even {
	background: #fff;
}
.padded {
	padding: 1px 10px;
}
.nomargin {
	margin: 0;
}
.margintop {
	margin-top: 1em;
}
.margintoponly {
	margin: 1em 0 0 0;
}
.marginbottom {
	margin-bottom: 1em;
}
.marginbottomonly {
	margin: 0 0 1em 0;
}
.amp {
    font-style: italic;
}
.comments {
    padding-left: 15px;
    background: url(../images/comment.gif) no-repeat;
}

/* these will need to be adjusted to fit the content space */

.leftcell {
	width: 280px;
	padding: 0 10px 0 0;
	float: left;
}
.rightcell {
	width: 280px;
	padding: 0 0 0 10px;
	float: left;
}

/* These declarations are used for technorati-style rounded-corner boxes and dividers. Fixes for IE6 are in /assets/ie6.css. */

.boxc {
    position: relative;
}
.boxc b.cn {
    height: 10px;
    width: 10px;
    position: absolute;
    background-image: url(../images/roundwhite.png);
}
.boxc b.tl {
    top: -1px;
    left: -1px;
    background-position: left top;
}
.boxc b.tr {
    top: -1px;
    right: -1px;
    background-position: right top;
}
.boxc b.bl {
    bottom: -1px;
    left: -1px;
    background-position: left bottom;
}
.boxc b.br {
    bottom: -1px;
    right: -1px;
    background-position: right bottom;
}

/* specific looks for different classes of round boxes */

.round_std {
    padding: 1px 20px;
    background: #ccc;
}


/******
LEADINS AND STORY LISTS

Basic declarations for display of default leadins and story lists. Modify as needed,
here or in story-type-specific stylesheets.
******/

.archivebox,
.eventbox,
.rssbox,
.jsonbox {
    margin: 1em 0;
}

.leadin,
.archiveitem,
.archiveboxitem,
.eventitem,
.eventboxitem,
.rssboxitem,
.jsonboxitem {
    margin: 0 0 1em;
}
.leadin .img,
.archiveitem .img,
.archiveboxitem .img,
.eventitem .img,
.eventboxitem .img {
    float: left;
    margin-right: 10px;
}
.leadin h3.title,
.archiveitem h3.title,
.archiveboxitem h3.title,
.eventitem h3.title,
.eventboxitem h3.title,
.rssboxitem h3.title,
.jsonboxitem h3.title {
    margin: 0;
	font-size: 12px;
	line-height: 16px;
}
.leadin p,
.archiveitem p,
.archiveboxitem p,
.eventitem p,
.eventboxitem p,
.rssboxitem p,
.jsonboxitem p {
    margin: 0;
}
.leadin p.teaser,
.archiveitem p.teaser,
.archiveboxitem p.teaser,
.eventitem p.teaser,
.eventboxitem p.teaser {
    margin-top: 0;
}


/******
HACKS

These hacks are used extensively in the reference template set and other sets built from it.
Do not delete. Some IE-specific declarations are in conditional comments in category.tmpl
******/

.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}
.clearfix {
    display: inline-block;
}
/* Hides from IE-mac \*/
.clearfix {display: block;}
/* End hide from IE-mac */

.ir {
	margin: 0;
	padding: 0;
	text-indent: -8888px; /* Phark image replacement */
}


/******
SITE STRUCTURE

These styles are used to support the layout of category.tmpl. By default,
the styles to support the reference site are provided. Modify as needed.
******/

body {
    background: #416caf url(../images/bg_body.jpg) repeat-x;
}

#container {
    margin: 20px auto;
    padding: 0 10px; /* room for abpos rounded top and bottom */
    width: 951px;
    position: relative;
    background: url(../images/bg_container.png) repeat-y;
}

#container b.contop {
    height: 8px;
    width: 971px;
    position: absolute;
    left: 0;
    top: -8px;
    background: url(../images/bg_container_top1.png) no-repeat;
}
#container b.conbot {
    height: 11px;
    width: 971px;
    position: absolute;
    left: 0;
    bottom: -11px;
    background: url(../images/bg_container_bottom1.png) no-repeat;
}

/* top */

#top {
    height: 112px;
    background: url(../images/bg_top1.jpg) no-repeat;
}
#search_box {
    float: right;
    padding: 60px 25px 0 0;
}
#search_keywords {
    padding: 5px 5px 0 5px;
    border: 2px solid #fff;
    height: 18px;
    width: 130px;
    background: #97abdb;
    color: #fff;
}
#top h2,
#top h2 a {
    height: 112px;
    width: 590px;
    display: block;
}

/* topnav */

#topnav {
    border-top: 1px solid #c29b63;
    height: 41px;
    position: relative;
    z-index: 10;
}
#topnav ul {
    margin: 0;
    list-style: none;
}
#topnav ul ul {
    position: absolute;
    top: 41px;
    left: -999em;
    background: #b3bdcb;
    border: 5px solid #fff;
    z-index: 32767;
}
#topnav li:hover ul, #topnav li.over ul {
    left: 0;
    z-index: 32767;
}
#topnav li {
    margin: 0;
    padding-right: 1px;
    float: left;
    position: relative;
}
#topnav li a,
#topnav li strong {
    height: 41px;
    display: block;
}
#topnav li li a,
#topnav li li strong {
    padding: 5px 10px;
    width: 150px;
    height: auto;
    display: block;
    line-height: 1;
    color: #162439;
    border-bottom: 1px dotted #162439;
}
#topnav li li a:hover {
    text-decoration: none;
	color: #3f66a4;
}
#topnav li li.last a {
    border-bottom: none;
}
#nav1 {
    width: 67px;
	background: url(../images/bg_topnav-new.jpg) 0 0;
    /*background: url(../images/bg_topnav3.jpg) 0 0;*/
}
#nav1:hover,
#nav1.over {
    background-position: 0 -41px;
}
#nav2 {
    width: 152px;
	background: url(../images/bg_topnav-new.jpg) -68px 0;
    /*background: url(../images/bg_topnav3.jpg) -68px 0;*/
}
#nav2:hover,
#nav2.over {
    background-position: -68px -41px;
}
#nav3 {
    width: 115px;
	background: url(../images/bg_topnav-new.jpg) -221px 0;
    /*background: url(../images/bg_topnav3.jpg) -221px 0;*/
}
#nav3:hover,
#nav3.over {
    background-position: -221px -41px;
}
#nav4 {
    width: 100px;
	background: url(../images/bg_topnav-new.jpg) -337px 0;
    /*background: url(../images/bg_topnav3.jpg) -337px 0;*/
}
#nav4:hover,
#nav4.over {
    background-position: -337px -41px;
}
#nav5 {
    width: 90px;
	background: url(../images/bg_topnav-new.jpg) -438px 0;
    /*background: url(../images/bg_topnav3.jpg) -438px 0;*/
}
#nav5:hover,
#nav5.over {
    background-position: -438px -41px;
}
#nav6 {
    width: 58px;
	background: url(../images/bg_topnav-new.jpg) -529px 0;
    /*width: 163px;
    background: url(../images/bg_topnav3.jpg) -529px 0;*/
}
#nav6:hover,
#nav6.over {
    background-position: -529px -41px;
    /*background-position: -529px -41px;*/
}
#nav7 {
    width: 100px;
    background: url(../images/bg_topnav-new.jpg) -588px 0;
    /*width: 100px;
    background: url(../images/bg_topnav3.jpg) -693px 0;*/
}
#nav7:hover,
#nav7.over {
    background-position: -588px -41px;
    /*background-position: -693px -41px;*/
}
#nav8 {
    width: 163px;
	background: url(../images/bg_topnav-new.jpg) -688px 0;
    /*width: 57px;
    background: url(../images/bg_topnav3.jpg) -794px 0;*/
}
#nav8:hover,
#nav8.over {
    background-position: -688px -41px;
    /*background-position: -794px -41px;*/
}
#nav9 {
    width: 97px;
	background: url(../images/bg_topnav-new.jpg) -852px 0;
    /*width: 98px;
    background: url(../images/bg_topnav3.jpg) -852px 0;*/
}
#nav9:hover,
#nav9.over {
    background-position: -852px -41px;
}
#middle {
    background: #e8eff9 url(../images/bg_middle1.gif) repeat-y;
}

/* content */

#content {
    padding: 0 30px 10px 30px;
    width: 568px;
    float: left;
}
#tools {
    margin: 0 -30px;
    padding: 10px 30px;
    background: #1d3252 url(../images/bg_tools1.gif) repeat-x;
    text-align: right;
}
#tools ul {
    margin: 0;
    list-style: none;
}
#tools li {
    margin: 0;
    padding: 0 10px 0 20px;
    display: inline;
}
#tools a {
    color: #849dc5;
}
#tools a:hover {
    text-decoration: none;
}
#tools li.english {
    background: url(../images/tool_english1.gif) no-repeat;
	padding: 0 10px 0 13px;
}
#tools li.espanol {
    background: url(../images/tool_espanol1.gif) no-repeat;
	padding: 0 10px 0 13px;
}
#tools li.email {
    background: url(../images/tool_email1.gif) no-repeat;
}
#tools li.print {
    background: url(../images/tool_print1.gif) no-repeat;
}
p#breadcrumbs {
    margin: 1em 0;
}
p#breadcrumbs a {
    color: #1f3454;
}
p#breadcrumbs a:hover {
    text-decoration: none;
}

/* sidebar */

#sidebar {
    padding: 10px 14px 10px 13px;
    width: 296px;
    float: left;
}
.sidebar_box {
    margin: 0 0 1em 0;
    border: 2px solid #fff;
}
#sidebar_homefacebook	{
	margin: 0 0 1em;
}
#signup_box {
    padding: 40px 10px 10px 12px;
    background: #b3c4dd url(../images/bg_signup_box.gif) no-repeat;
}
#signup_box p {
    margin: 0 0 .5em 0;
    font-size: 14px;
    color: #fff;
}
#,
#signup_box_zip {
    padding: 5px 5px 0 5px;
    border: 2px solid #fff;
    height: 18px;
    width: 126px;
    background: #6981a9;
    color: #fff;
}
#signup_box_zip { width: 66px; }

#buttons ul {
    margin: 0;
    list-style: none;
}
#buttons li {
    margin: 0;
}
#buttons a {
    height: 55px;
    width: 292px;
    display: block;
    border-bottom: 2px solid #fff;
}
#buttons li.last a {
    border: none;
}
#buttons li.donate { background: url(../images/sidebar_donate1.gif) no-repeat; }
#buttons li.maldefian { background: url(../images/sidebar_maldefian1.gif) no-repeat; }
#buttons li.opportunities { background: url(../images/sidebar_opportunities1.gif) no-repeat; }
#buttons li.specialevents { background: url(../images/sidebar_special_events1.gif) no-repeat; }
#buttons li.scholarships { background: url(../images/sidebar_scholarships1.gif) no-repeat; }

#bottom {
    padding: 10px;
    background: #162439;
    color: #fff;
    text-align: center;
}
#bottom ul {
    margin: .5em 0;
    list-style: none;
}
#bottom li {
    margin: 0;
    padding: 0 5px;
    border-right: 1px solid #6e84a6;
    display: inline;
}
#bottom li.last {
    border-right: none;
}
#bottom a {
    color: #6e84a6;
}
#bottom p {
    margin-bottom: 0;
}