@media screen {/* -------------------------------------------------------------- 
  
   Boilerplate reset.css
   * Resets default browser CSS.
   
-------------------------------------------------------------- */

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; }
body { line-height: 1.5; background: #fff; margin: 0; }
table { border-collapse: collapse; border-spacing: 0; }
caption, th, td { text-align: left; font-weight:400; }
blockquote:before, blockquote:after, q:before, q:after { content: ""; }
blockquote, q { quotes: "" ""; }
a img { border: none; }

/* Removes Firefox imposed outline */
a { outline: none; }

/* Clearing floats without extra markup  */
.wrapper { display: inline-block; }
.wrapper:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
* html .wrapper { height: 1%; }
.wrapper { display: block; }
}
@media screen {
/* This is where you set your desired font size. The line-heights 
   and vertical margins are automatically calculated from this. 
   The percentage is of 16px (0.75 * 16px = 12px). */
body { font-size: 10px; line-height: 1.1em;}


/* Default fonts and colors. */
body { font-family: Helvetica, Arial, sans-serif; color: #333;}
h1,h2,h3,h4,h5,h6 { font-weight: normal; text-transform: uppercase;}


/* Headings
-------------------------------------------------------------- */

h1 { font-size: 1.3em; margin-bottom: 1.2em; font-family: 'Trebuchet MS', Helvetica, sans-serif; }
h2 { font-size: 12px; margin-bottom: 1.2em; font-family: 'Trebuchet MS', Helvetica, sans-serif; }
h3 { font-size: 1em; margin-bottom: .5em; }
h4 { font-size: 1em; margin-bottom: 1em; }
h5 { font-size: 1em; margin-bottom: 1em;  }
h6 { font-size: 1em;  }
h1 a,h2 a,h3 a,h4 a,h5 a,h6 a {
    text-decoration: none;
}

/* Text elements
-------------------------------------------------------------- */

p { margin: 0 0 1.1em; }

ul, ol { margin: 0 1.5em 1.5em 1.5em; }
ul { list-style-type: circle; }
ol { list-style-type: decimal; }

dl { margin: 0 0 1.5em 0; }
dl dt { font-weight: bold; }
dl dd { margin-left: 1.5em; }

abbr, acronym { border-bottom: 1px dotted #000; }
address { margin-top: 1.5em; font-style: italic; }
del { color: #000; }

a { color: #333; text-decoration: underline;}
a:hover, a.hover, a.active, a.selected { color: #EF0000; }

blockquote { margin: 1.5em; }
strong { font-weight: bold; }
em, dfn { font-style: italic; }
dfn { font-weight: bold; }
pre, code { margin: 1.5em 0; white-space: pre; }
pre, code, tt { font: 1em monospace; line-height: 1.5; } 
tt { display: block; margin: 1.5em 0; line-height: 1.5; }


/* Tables
-------------------------------------------------------------- */

table { margin-bottom: 30px; }
th { font-weight: bold; }
td {}
th,td { padding: 5px 10px 5px 0; vertical-align: top;}
tfoot { font-style: italic; }
caption { background: #ffc; }


/* Some default classes
-------------------------------------------------------------- */
.title { }
.small { font-size: .8em; margin-bottom: 1.875em; line-height: 1.875em; }
.large { font-size: 1.2em; margin-bottom: 1.25em; }
.quiet { color: #ccc; }
.thin { font-weight: normal; }

.hide { display: none; }
.highlight { color: #EF0000; }

.top { margin-top: 0; padding-top: 0; }
.bottom { margin-bottom: 0; padding-bottom: 0; }

.emphasis { color: #EF0000; }

.align-right { text-align: right;}
.align-left { text-align: left;}
.float-right { float: right; }
.float-left { float: left; }
.clear { clear: both; }

.aside {
    float: right;
    text-align: right;
    width: 212px;
}

.text-content {
    background: #fff;
    color: #555;
    padding: 30px;
}
p.error { color: red; }

input, textarea, select {}
}
@media screen {/* Site */
html, body { height: 100%; }
body { 
    position: relative; min-width: 1000px;    
    background: #ccc;
}

/* Main Blocks */
#wrap {
    position: absolute;
    left: 50%; margin-left: -480px;
    top: 50%; margin-top: -300px;
    background: #fff;
    width: 890px; height: 560px;
    padding: 20px 35px;
}
#header {
    position: relative;
    margin-bottom: 22px;
}
#header h1 { margin: 0; }
#header h1 a {
    display: block;
    background: url('/static/img/logo.png');
    width: 200px; height: 47px;
    text-indent: -9999px;
    margin-left: -10px;
}
#content {
    position: relative;
    height: 400px;
}

.page { height: 394px; padding-right: 40px;}

/* Main Nav Menu */
#main-menu {
    padding-top: 10px; margin-top: -1px;
    border-top: solid 1px #ccc; 
}
#main-menu ul {
    list-style: none;
    margin: 0; padding: 0;
}
#main-menu li {
    margin: 0; padding: 0; 
    float: left;
    margin-right: 8px;
    color: #ccc;
}
#main-menu a {
    text-decoration: none;
    text-transform: uppercase;
}

#submenu { 
    margin-top: 10px;
}
#submenu ul {
    list-style: none;
    margin: 0; padding: 0;
}
#submenu li { 
    margin: 0; padding: 0;
    float: left;
    margin-right: 8px;
    color: #ccc;
}
#submenu a { 
    text-decoration: none;
    text-transform: uppercase;
    font-family: 'Trebuchet MS', sans-serif;
}

/* Slideshow */
#slideshow {
    position: relative;
    width: 890px; height: 400px;
    overflow: hidden;
}
#slideshow .images {
    width: 890px; height: 400px;
    list-style: none; margin: 0;
}
#slideshow-controls {
    position: absolute; z-index: 1000;
    left: 4px; bottom: 4px;
}
#slideshow-controls .playpause {
    color: #fff; cursor: pointer; text-indent: -9999px;
    display: block; width: 16px; height: 16px;
}
#slideshow-controls .play {
    background: url('/static/img/play.gif');
}
#slideshow-controls .pause {
    background: url('/static/img/pause.gif');
}
#slideshow-numbers {
    position: absolute;
    left: 26px; bottom: 0;
}
#slideshow-numbers a {
    color: #988; cursor: pointer;
    font-size: 12px;
    padding: 2px 6px;
    text-decoration: none;
}
#slideshow-numbers a:hover {
    color: #ccc;
}
#slideshow-numbers a.active {
    color: #fff;
}

/* Page Scroller */
.scroller-controls.scroller-vertical {
    position: absolute;
    top: 0; right: 0;
    height: 410px;
}
.scroller-controls.scroller-vertical .scroller-next,
.scroller-controls.scroller-vertical .scroller-prev {
    display: none; width: 0;
}
.scroller-controls.scroller-vertical .scroller-scrollbar {
    position: relative;
    background: #fff;
    border: solid 1px #CCCCCC;
    width: 11px; height: 100%;
    /*margin-left: 15px;*/
}
.scroller-controls.scroller-vertical .scroller-handle {
    position: absolute;
    width: 11px; height: 140px;
    background: #CCCCCC;
}
.scroller-controls.scroller-vertical .scroller-handle:hover,
.scroller-controls.scroller-vertical .scroller-handle.ui-draggable-dragging {
    background: #888687;
}


/* Images */
.images { overflow: hidden; height: 380px;}
.images table { margin: 0; }
.images td { padding: 0; padding-right: 4px; padding-bottom: 4px;  }
.images.single-row td { padding-right: 15px; }
.images td img { display: block; border: solid 1px #fff;}
.images td a:hover img { display: block; border: solid 1px #ccc;}

.scroller-controls.scroller-horizontal {
    position: absolute;
    bottom: 0;
    width: 890px;
}
.scroller-controls.scroller-horizontal .scroller-next,
.scroller-controls.scroller-horizontal .scroller-prev {
    display: block; 
    position: absolute; top: 0;
    width: 15px; height: 15px;
    cursor: pointer;
    text-indent: -9999px;
    display: none; width: 0;
}
.scroller-controls.scroller-horizontal .scroller-next {}
.scroller-controls.scroller-horizontal .scroller-next:hover {}
.scroller-controls.scroller-horizontal .scroller-prev {}
.scroller-controls.scroller-horizontal .scroller-prev:hover {}
.scroller-controls.scroller-horizontal .scroller-scrollbar {
    position: relative;
    background: #fff;
    border: solid 1px #CCCCCC;
    height: 11px; width: 100%;
    /*margin-left: 15px;*/
}
.scroller-controls.scroller-horizontal .scroller-handle {
    position: absolute;
    height: 11px; width: 140px;
    background: #CCCCCC;
}
.scroller-controls.scroller-horizontal .scroller-handle:hover,
.scroller-controls.scroller-horizontal .scroller-handle.ui-draggable-dragging {
    background: #888687;
}

.views {
    margin-top: 10px;
}
.views a {
    display: block;
    text-indent: -9999px;
    width: 26px; height: 21px;
    float: left;
}
.views .multi {
    background: url('/static/img/collection_views.png') no-repeat;
    margin-right: 5px;
}
.views .single {
    background: url('/static/img/collection_views.png') no-repeat -34px 0;
}

/* Blog */
.blog-index {
    width: 890px;
    height: 375px; 
    overflow: auto;
    font-size: 12px;
    line-height: 14px;
}
.blog-index .wrapper { height: 370px; }
.blog-index .divider {height: 360px; width: 16px; border-left: 1px solid #ddd; }
.blog-entry .body * { padding-right: 10px }
.blog-entry .info { display: none; }
.blog-entry { line-height: 14px; }
.blog-entry p { line-height: 14px; margin-bottom: 14px; }

.blog-tools {
    position: absolute;
    bottom: -94px; right: 0;
    z-index: 100;
    height: 83px;
}
.blog-tools td { text-align: center; width: 100px; padding: 0 0 5px 0;} 
.blog-tools ul { margin: 0; list-style: none; }
.blog-tools a { text-decoration: none; }
.blog-tools a.view-more { display: inline-block; padding-top: 2px; }

.blog-content-list { list-style: none; margin-left: 0; }
.blog-content-list li { padding-top: 4px; }
.blog-content-list a { text-decoration: none; font-size: 12px; }

.tools td { width: 150px;}

#blog-extras h3 { cursor: pointer; margin: 0; padding-bottom: 5px; width: 100px; }
#blog-extras h3:hover,
#blog-extras h3.active, #blog-extras h3.active a {color: #EF0000; }
#blog-extras ul { background: #fff; }
#blog-extras li { background: #fff; }
#blog-extras .blog-link-list { 
    width: 300px; position: absolute; left: 0; 
}
.link-category { margin-bottom: 20px; }
.link-category table { margin-bottom: 0; width: 100%; }
.link-category td { width: 200px; padding: 5px 20px 5px 0; }
.link-category a { padding-right: 10px; font-size: 12px; text-decoration: none; }

/* Forms */
input[type=text], input[type=password], textarea {
    border: solid 1px #ccc;
    width: 340px;
}
label { text-transform: uppercase; }
input.submit {background: #888; color: #fff; border: none; padding: 4px 20px;}

/* Login Form */
input[type=text], input[type=password] {
    width: 250px; 
}
#login { 
    width: 340px;
    margin: 0 auto;
    padding-top: 80px;
}

/* Contact Form */
#contact .page-text { width: 350px;}
#contact-form {
    float: right;
    margin-right: 50px;
}
.error input, .error textarea { border-color: red; }
.error label, .error em { color: red; }
.error em { font-weight: bold; }

/* File List */
#file-list { font-size: 12px; line-height: 1.5em;}

/* Tooltips */
#tooltip {
	position: absolute;
	z-index: 3000;
	border: 1px solid #ccc;
	background-color: #eee;
	padding: 8px;
	opacity: 0.85;
        width: 200px;
}
#tooltip h3, #tooltip div { margin: 0; }

/* Addthis*/
.addthis_toolbox {
    position: absolute;
    bottom: 9px; right: 4px;
}
.at300bs.at15t_expanded, .at300bs.at15t_compact {
    background: transparent url('/static/img/addthis.gif') no-repeat !important;
}

/* Video */
#video {
    width: 600px;
    float: left;
}
#video-caption {
    float: right;
    width: 240px;
    margin-right: 30px;
}
#video-caption .scroll{
    height: 360px;
}

.popup {
    position: absolute; z-index: 1000;
    top: 50%; left: 50%;
}
#video-popup {
    background: #000;
    margin-left: -250px;
}
#video-popup object {
    margin: 10px;
}
#video-popup .caption { padding: 10px; color: #aaa; }
.video-overlay { background-color: #000 !important; color: #fff; }
.close-popup { 
    position: absolute;
    bottom: 0; right: 0;
    text-decoration: none; color: #aaa;
    font-size: 16px; font-weight: bold;
    cursor: pointer; padding: 10px;
}

/* Users */
#user-tools {
    position: absolute;
    top: 4px; right: 0;
}
#user-tools a { text-decoration: none; }
}