/*#############################################################
Name: Dark Ritual
Date: 2006-11-06
Description: Tribal-style three column layout.
Author: Viktor Persson
URL: http://templates.arcsin.se

Feel free to use and modify but please provide credits.
#############################################################*/

/* standard elements */
* {
        margin: 0;
        padding: 0;
}

a {color: #682;}

a:hover {color: #9A6;}

body {
        background: #333 url(../img/bg.gif);
        color: #333;
        font: normal 62.5% "Lucida Sans Unicode",sans-serif;
        margin: 5% 0;
}

p,ul {
        padding-bottom: 1em;
}

ul {margin-left: 1.2em;}

li {list-style: none;}
.main li {list-style-image: url(../img/li.gif);}
.main a {font-weight: normal;}

h1 {font-size: 1.2em;}

blockquote {
        background: #FFF;
        border-bottom: 1px solid #EEE;
        border-top: 1px solid #EEE;
        color: #333;
        display: block;
        font-size: 0.9em;
        margin-bottom: 1.2em;
        padding: 6px 12px;
}
blockquote p {padding: 3px 0;}

h1,h2,h3 {color: #994;}

/* misc */
.clearer {clear: both;}
.main_right .padded {position: relative; top: -160px; padding: 10px 0px 6px 25px;}
.main .padded {padding: 18px 24px;}
.meta {font-size: 0.8em; color: #666;}
.left {float: left;}
.middle {padding-left: 90px;}
.right {float: right;}
.selected {background: #9C997C !important;}
.char { padding-right: -5px; position: relative; float: right; opacity:.30; filter: alpha(opacity=30); -moz-opacity: 0.3;}
.instructor_img {position: relative; float: right; top: 20px; margin-left: 10px; margin-bottom: 20px;}
.left_aligned_img {float: left; padding-right: 20px;}
.motto {text-align: center;}
.motto img {padding: 3px; border: 2px solid #222}
.motto p {font-size: 12px; font-weight: bolder;}
.eagle { border: none; padding: none; margin: none; position: relative; top: -172px; right: 3px; width:245px; height: 242px;}
/*.menu_header {cursor: pointer;} */
.photo_title {font-size: smaller;}
.img_selected {border: 10px solid #ddd;}
#gallery {text-align: center;}
#gallery a img {border: 10px solid #fff;}

/* structure */
.container {
        font-size: 1.2em;
        background: url(../img/bgcontainer.gif) repeat-y;
        margin: 0 auto;
        width: 840px;
        border: 12px solid #222;
}

/* header */
.header {
        float: left;
        width: 813px;
        background: #fff url(../img/header.jpg) no-repeat;
        font: normal 2.4em Verdana,sans-serif;
        line-height: 109px;     
        border: 3px solid #222;         
}

/* structure */
.top {
        background: #222;
        color: #DDD;
        float: left;
        font: normal 1.4em Verdana;
        height: 50px;
        text-align: center;
        width: 650px;   
}
.subnav {
        float: left;
        width: 160px;
}
.main {
        float: left;
        width: 500px;
}
.main_right {
        float: right;
        width: 175px;
        color: #CCC;
}

/* sub-navigation */
.subnav h1 {
        background: #222;
        color: #FFE;
        font: bold 1.1em Verdana,sans-serif;
        line-height: 24px;
        padding-left: 8px;
}
.subnav ul {
    margin: 0; padding: 0;
}

.subnav li {
        border-bottom: 1px solid #696755;
        list-style: none;
}

.subnav li a {
        background: #89866F;    
        color: #111;
        display: block;
        padding: 8px 0 8px 12px;
        width: 148px;
        text-decoration: none;
}

.subnav li a:hover {
        background: #9C997C;
        color: #000;
}

/* footer */
.footer {
        background: url(../img/bgfooter.gif) repeat-x;
        color: #CCC;
        font-size: 0.9em;
        line-height: 39px;
        width: 100%;
        text-align: center;
}
.footer .left,.footer .right {padding: 0 16px;}
.footer a {color: #EEE;}
.footer a:hover {color: #FAFCB0;}

/* coda slider */
#slider {  
  margin: 0 auto;
  position: relative;    
}

.scroll {
  width: 460px;
  overflow: auto;
  overflow-x: hidden;    
  position: relative; /* fix for IE to respect overflow */
  clear: left;
  padding-left: -80px;  
}

.scrollContainer div.panel {
  padding: 10px;
  width: 450px;
}

ul.navigation {
    font-size: 0.9em;
    list-style: none;
    margin: 0;
    padding: 0;
    padding-bottom: 19px;
    padding-left: 15px;
}

ul.navigation li {
    display: inline;
    margin-right: 10px;
}

ul.navigation a {
    padding: 1px;
    color: #000;
    text-decoration: none;
    font-weight: normal;
}

ul.navigation a.c_selected {
    border-bottom: 3px solid #222;    
    outline: none;
}

.scrollButtons {
    position: absolute;
    top: 2px;
    cursor: pointer;
}

.scrollButtons.left {
    left: -10px;
}

.scrollButtons.right {
    right: -20px;
}
.scrollButtonsRight {
    right: 25px !important;
}