/* stylesheet for Sassafras Package Design */
@font-face {
	font-family: 'SaginawLight';
	src: url('../fonts/SaginawLight.eot');
	src: local('Saginaw  Light'), local('SaginawLight'), url('../fonts/SaginawLight.woff') format('woff'), url('../fonts/SaginawLight.ttf') format('truetype'), url('../fonts/SaginawLight.svg#SaginawLight') format('svg');
}

@font-face {
	font-family: 'SaginawMedium';
	src: url('../fonts/SaginawMedium.eot');
	src: local('Saginaw  Medium'), local('SaginawMedium'), url('../fonts/SaginawMedium.woff') format('woff'), url('../fonts/SaginawMedium.ttf') format('truetype'), url('../fonts/SaginawMedium.svg#SaginawMedium') format('svg');
}

@font-face {
	font-family: 'SaginawBold';
	src: url('../fonts/SaginawBold.eot');
	src: local('Saginaw  Bold'), local('SaginawBold'), url('../fonts/SaginawBold.woff') format('woff'), url('../fonts/SaginawBold.ttf') format('truetype'), url('../fonts/SaginawBold.svg#SaginawBold') format('svg');
}

html, body, div, span, 
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
img, ins, kbd, q, s, samp,
small, strike, strong, 
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td{ margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; }
body{ line-height: 1; }
blockquote, q{ quotes: none; }
table{ border-collapse: collapse; border-spacing: 0; }

body{ background: #2b180a; color: #fff; font: 14px/1.25em Georgia, Times, "Times New Roman", serif; margin: 0; }

#container{ width: 1000px; margin: 0 auto; }
html,body,#bg,#bg table, #bg td,#cont{ width: 100%; height: 100%; overflow: hidden; }
#bg{ position: absolute; width: 200%; height: 200%; top: -50%; left: -50%; }
#bg td{ vertical-align: middle; text-align: center; }
#bg img{ min-height: 50%; min-width: 50%; margin: 0 auto; }
#scroller{ height: 100%; width: 100%; overflow: scroll; position: absolute; z-index: 100; }

#logo{ display: block; float: left; }
#social{ float: right; padding-top: 50px; }
#social img{ width: 32px; }

#page_body{ clear: both; }

#navigation{ background: url(../images/ghost.png); height: 35px; margin-top: 3px; clear: both; }

/*** ESSENTIAL UP STYLES ***/
.sf-menu, .sf-menu *{ margin: 0; padding: 0; list-style: none; font-family: "Gill Sans", GillSans, verdana; }
.sf-menu{ line-height: 1.0; }
.sf-menu ul{ position: absolute; bottom: -999em; width: 10em; /* left offset of submenus need to match (see below) */ }
.sf-menu ul li{ width: 100%; }
.sf-menu li:hover{ visibility: inherit; /* fixes IE7 'sticky bug' */ }
.sf-menu li{ float: left; position: relative; }
.sf-menu a{ display: block; position: relative; }
.sf-menu li:hover ul,
.sf-menu li.sfHover ul{ left: 0; bottom: 2.5em; /* match top ul list item height */ z-index: 99; }

/*** DEMO SKIN ***/
.sf-menu a{ padding: .75em 1em; text-decoration:none; }
.sf-menu a, .sf-menu a:visited { color: #fff; }
.sf-menu li li{ background: url(../images/ghost.png); margin-bottom: 3px; }
.sf-menu li li a{ padding: 5px; }
.sf-menu li a:hover{ background: #000; opacity: .6; }

/*** arrows **/
.sf-menu a.sf-with-ul{ min-width: 1px; /* trigger IE7 hasLayout so spans position accurately */ }
a > .sf-sub-indicator { /* give all except IE6 the correct values */ top: .8em; /* use translucent arrow for modern browsers*/ }
#navigation a:link,
#navigation a:visited,
#navigation a:hover{ color: #fff; }

a:link,
a:visited{ color: #fff; }
a:hover{ color: #ccc; text-decoration: none; }

#homeshow{ width: 1000px; height: 500px; clear: both; display: block; }

#text{ background: url(../images/ghost.png); width: 547px; height: 500px;  float: right; }
#content{ float: right; width: 350px; height: 325px; padding: 0 25px 50px; overflow: auto; }
#spotlight{ float: left; }
#spotlight img{ display: block; }

.jScrollPaneContainer{ position: relative; overflow: hidden; z-index: 1; float: left; margin: 50px 25px 50px 50px; width: 400px !important; height: 375px !important; }

.jScrollPaneTrack{ position: absolute; cursor: pointer; right: 0; top: 0; height: 375px !important; background: #5a7074; -moz-border-radius: 10px; -webkit-border-radius: 10px; }
.jScrollPaneDrag{ position: absolute; background: #dbd7cf; cursor: pointer; overflow: hidden; -moz-border-radius: 10px; -webkit-border-radius: 10px; }
.jScrollPaneDragTop{ position: absolute; top: 0; left: 0; overflow: hidden; }
.jScrollPaneDragBottom{ position: absolute; bottom: 0; left: 0; overflow: hidden; }

h2{ font: 36px SaginawMedium; color: #5a7074; }
h2 span{ font: bold 16px "Gill Sans", GillSans, verdana; display: block; position: relative; top: -26px; left: 25px; color: #fff; }

h3{ font: 24px SaginawMedium; color: #fff; margin-bottom: .5em; }
h4{ font: 18px SaginawBold; color: #fff; }

#content p{ margin-bottom: 1.25em; }
#content ul,
#content ol{ margin: 0 0 1.25em 25px; }

div.content{ display: none; float: right; clear: both; width: 902px; height: 500px; background: url(../images/ghost.png); }
div.content a, div.navigation a{ text-decoration: none; color: #fff; }
div.content a:focus, div.content a:hover, div.content a:active{ text-decoration: underline; }
div.controls{ float: left; height: 45px; background: url(../images/ghost.png); }
div.controls a:link,
div.controls a:visited{ color: #fff; text-decoration: none; }
div.controls a:hover{ color: #fff; }
div.ss-controls{ float: left; width: 95px; text-align: center; font: 20px SaginawBold; }
div.ss-controls a{ display: block; }

div.slideshow{ clear: both; }
div.slideshow span.image-wrapper{ padding-bottom: 0; }
div.slideshow a.advance-link{ padding: 2px; display: block; }
div.slideshow img{ border: none; display: block; margin: -2px auto; }

div.navigation{ width: 90px !important; float: left !important; padding: 5px 0 0 5px; background: url(../images/ghost.png); }
ul.thumbs{ clear: both; margin: 0; padding: 0; }
ul.thumbs li{ float: left; padding: 0; margin: 0 3px 4px 0; list-style: none; }
html>body ul.thumbs li{ margin: 0 5px 5px 0; }
a.thumb{ width: 40px; height: 40px; overflow: hidden; display: block; }
ul.thumbs li.selected a.thumb{  }
a.thumb: focus{ outline: none; }
ul.thumbs img{ border: none; display: block; }
div.pagination{ clear: both; }
div.navigation div.bottom{ margin-top: 12px; }

/* Minimal Gallery Styles */
#thumbs-min ul.thumbs li{ float: none; padding: 0; margin: 0; list-style: none; }
#thumbs-min a.thumb{ padding: 0px; display: inline; border: none; }
#thumbs-min ul.thumbs li.selected a.thumb{ background: inherit; font-weight: bold; }

form#contact{ width: 320px; }
form#contact fieldset { margin: 0; border: none; padding: 0; width: 320px; }
form#contact legend{ display: block; width: 310px; clear: both; color: highlight; font-size: 14px; padding-left: 0; padding-top: 0.8em; }
form#contact label{ float: left; display: block; clear: none; padding: 5px 0 0; white-space: nowrap; }
form#contact img{ display: block; margin: 10px 0 0 0; padding: 0; }
form#contact input, #contact select,
form#contact textarea{ width: 100%; margin-top: 0.1em; }
form#contact input.checkbox,
form#contact input.radio{width: auto; height: auto; margin: 0 .4em 0 0; padding-left: 0.3em; }
form#contact input#submit{ clear: both; float: left; width: auto; }
form#contact p{ font-size: 12px; text-indent: 0; margin: 0; }

.sessions fieldset{ width: 350px; border: none; }
.sessions input[type="checkbox"], .session input[type="radio"]{ margin: 0 15px 0 0; }
.sessions input[type="text"], .session textarea{ width: 250px; float: left; margin: 3px; }
.sessions input[type="submit"], .session input[type="reset"]{ margin: 3px 0 5px 175px; float: left; }
.sessions input[type="submit"]:hover, .session input[type="reset"]:hover{ cursor: pointer; }
.sessions fieldset p{ clear: both; font-style: italic; }

#session{ margin-bottom: 10px; }
#session label{ clear: left; float: left; width: 150px; padding: 5px; text-align: right; }
#session input[type="text"]{ width: 150px; float: left; margin: 3px; }
#session input[type="submit"]{ clear: both; }
#session p{ text-align: center; padding: 10px 0; }

.required, .error{ color: #79674b; }
.error{ float: left; font-style: italic; width: 100px; padding-top: 2px; font-size: 10px; }

.kalamazoo_message{ padding: 20px; margin: 0 10px 10px; border: 1px solid #79674b; color: #79674b; font-style: italic; font-size: 10px; }

#footer{ color: #000; padding: 10px; font: 12px "Gill Sans", GillSans, verdana; }
.vcard div{ display: inline; padding-right: 10px; }
#footer a:link{ color: #000; }
#footer a:visited{ color: #000; }
#footer a:hover{ text-decoration: none; }

.clear{ clear: both; height: 0; }