/* Genral Settings */
html {background-color: #000; overflow-y: hidden;}

html, body  { margin: 0; padding: 0; overflow-x: hidden; font-family: "Century Gothic","Lucida Grande", Arial, sans-serif; color: #fff;font-weight: normal;}
a, a img {outline: none; border: none;}
p a, a {color:#666;}
p a:hover, a:hover {color:#fff;}


/* Font Handling */
h1 {font-weight: normal; line-height: 0px; padding: 5px 0 0 0;}
h2 {font-weight: normal; font-size: 22px;color: #fff; padding: 0 0 0 20px; }
h3 {font-weight: normal; font-size: 12px;color: #fff; padding: 0 0 0 20px;}
h4 {font-weight: normal;}
h5 {font-weight: normal; font-size: 18px;color: #fff; line-height: 0.5px; padding: 0 0 0 2px;}


.right {color: #cf5959; float:right;padding: 0 10px 0 10px; text-align: right;}
.left {color:#ff8f3d; float:left;padding: 0 10px 0 20px; text-align: left;}


p {font-size: 10px; font-weight: normal; letter-spacing: 2px; line-height: 1.7em;}
span.gray {color: #666;}
.red {color: #cf5959;}
.orange {color: #ff8f3d;}




/* Basic Content */
div#header {position: fixed; top: 0px; width: 100%; height:60px; margin:0 auto; background: url("../img/bg.header.png") repeat-x; }
#logo { position: absolute; right:35px; top:15px; width: 150px; height:30px;}

div#footer {position: fixed; bottom: 0px; width: 100%; height:33px; margin:0 auto; background-color: #000;font-size: 10px; font-weight: normal; letter-spacing: 1px; line-height: 1em;color: #666}
div#footer ul li{ display: inline;}
div#footer ul li a {text-decoration: none; color: #666;}
div#footer ul li a:hover {text-decoration: none; color: white;}
ul.footerLinks {position: absolute; float: left; left: 35px; padding: 0;}
ul.footerCopy {position: absolute; float: right; right: 35px; color: #666;}
div#footer ul li a.whiteActive {color:#fff;}



/* Navigation */
.menu { position: absolute; left:25px; top:11px;}
.menuRed { position: absolute; left:25px; top:11px;}
.second {position: relative; left: 210px; top: 11px; width:300px;}
.secondOrange {position: relative; left: 210px; top: 11px;}


.pop {position: absolute;display: inline;}
.pop ul {float: left; list-style-type: none; font-weight: normal; font-size: 12px; padding-left: 20px;}
.pop ul li {list-style-type: none;  font-weight: normal; font-size: 12px;}
.pop ul li .red, .pop ul li .orange {background: url(../img/assets.png) no-repeat 9px 3px; padding-left: 20px; line-height: 30px;}


.pop ul li .red:hover {color: #cf5959;background: url(../img/assets.png) no-repeat -182px -28px;}
.pop ul li .orange:hover {color:#ff8f3d;background: url(../img/assets.png) no-repeat -181px 4px;}

.pop ul li .redActive {background: url(../img/assets.png) no-repeat -184px -28px;padding-left: 20px; line-height: 30px;color: #cf5959;}
.pop ul li .orangeActive {background: url(../img/assets.png) no-repeat -184px 4px;padding-left: 20px; line-height: 30px;color:#ff8f3d;}

.pop .pop_menu {display: none; }
.pop .pop_toggle {background: url(../img/assets.png) no-repeat 9px 3px; width: 100px; height: 19px; overflow: hidden; cursor: pointer; }

.menuRed .pop .pop_toggle {background: url(../img/assets.png) no-repeat -182px -28px; width: 100px; height: 20px; overflow: hidden; cursor: pointer; }

.secondOrange .pop .pop_toggle {background: url(../img/assets.png) no-repeat -183px 4px; width: 100px; height: 20px; overflow: hidden; cursor: pointer; }
 
.active .pop_menu {display: block; background-color: #000; color: #fff; position: absolute; top:28px; margin: 0 0 0 -300px; padding: 0 1em 0em 285px; width: 150em; }
.active .pop_menu a {color: #fff; text-decoration: none; }
.menu .active .pop_toggle, .menuRed .active .pop_toggle {z-index: 2000; position: absolute; top: 0; left: 0; background: url(../img/assets.png) no-repeat -184px -43px; }
.second .active .pop_toggle, .secondOrange  .active .pop_toggle {z-index: 2000; position: absolute; top: 0; left: 0; background: url(../img/assets.png) no-repeat -184px -11px; }




/* Frontpage */
div#wrapper {width: 750px; margin:0 auto;}
div#wrapper a {text-decoration: none; outline: none; }

div#contentFrontpage {position:absolute; bottom:40%; width: 750px;height: 220px;}
div#contentFrontpage h2 {position: absolute;}
div#contentFrontpage h2.right {right:10px; top:-5px;}
div#contentFrontpage h2.left {left:5px; top:-5px;}


div#contentFrontpage a {width: 360px; height: 220px; display: block; padding: 3px 0 0 0;}
div#contentFrontpage a p {color: #fff; margin: 0;position: absolute;}
div#contentFrontpage a p.right {right:5px; top: 40px;}
div#contentFrontpage a p.left {left:5px; top: 40px;}



div#teaserLeft {position:relative; float: left; width: 360px; height: 220px; background: url(../img/assets.png)0 -523px;}
div#teaserLeft:hover {width: 360px; height: 220px; background: url(../img/assets.png)0 -747px;}

div#teaserRight {position:relative;float: right; width: 360px; height: 220px; background: url(../img/assets.png)0 -75px;}
div#teaserRight:hover {position:relative;float: right; width: 360px; height: 220px; background: url(../img/assets.png) 0 -299px;}

div#content {position: fixed; bottom: 34px; width: 100%; height:180px; margin:0 auto; background: url("../img/bg.content.png") repeat-x; }
div#contentText {width: 740px; margin: 0 auto; padding: 10px 0 0 0;}
div.textLeft {width: 330px; float: left; padding: 0 0 0 5px;}
div.textRight {width: 330px; float: right; padding: 0 0 0 5px;}




/* Subpage */
div#wrapperSubpage {width: 1000px;margin:0 auto;}
div#wrapperSubpage a {text-decoration: none; outline: none; }

div#contentSubpage {position:absolute; width: 1000px; height:500px; background: url(../img/bg.page.content.png) no-repeat;margin:-250px 0px 0px -500px; top: 50%; left: 50%;}
div#contentSubpage a.close {position:absolute; top:15px; right:18px; width: 95px; height:20px; padding-top: 3px; background: url(../img/close.png) no-repeat right; font-size: 11px; color:#fff; text-decoration: none; letter-spacing: 2px;}
div#contentSubpage a.close:hover { background: url(../img/close.hover.png) no-repeat right; color:#fff;}

div#wrapContentRed {position: absolute; top:40px; left: 20px; width:420px;}
div#wrapContentRed p {padding: 0px 0 0 2px; width: 400px;}

div#wrapContentOrange {position: absolute; top:40px; right: 20px; width:420px;}
div#wrapContentOrange p {padding: 0px 0 0 2px; width: 400px;}

div#wrapContentRed h2, div#wrapContentRed h3 {padding: 0;}

.data div#wrapContentRed {overflow-y: scroll; width: 920px; height: 435px;}
.data div#wrapContentRed p { width: 920px; padding: 0;}

/* Breadcrumb */
div#contentSubpage a.bread {position: relative; top:10px; margin: 0 0 0 20px; font-size: 11px;color:#666;text-decoration: none; letter-spacing: 2px;}
div#contentSubpage a.bread:hover {color:#fff;}

div#contentSubpage span.breadRed {position: relative; top:10px; margin: 0 0 0 -5px; font-size: 11px;text-decoration: none; letter-spacing: 2px;background: url(../img/assets.png) no-repeat -183px -28px;padding-left: 20px; line-height: 30px;color: #cf5959;}
div#contentSubpage span.breadOrange {position: relative; top:10px; margin: 0 0 0 -5px; font-size: 11px;text-decoration: none; letter-spacing: 2px;background: url(../img/assets.png) no-repeat -183px 4px;padding-left: 20px; line-height: 30px;color: #ff8f3d;}
div#contentSubpage span.breadWhite {position: relative; top:10px; margin: 0 0 0 -5px; font-size: 11px;text-decoration: none; letter-spacing: 2px;background: url(../img/assets.png) no-repeat 9px 3px; padding-left: 20px; line-height: 30px;color: #fff;}

/* Slideshow */
div#wrapSlideRed {position: absolute; top:50px; right: 20px;}
div#wrapSlideOrange {position: absolute; top:60px; left: 20px;}
.hidden {display: none;}

a.jFlowPrev {display: block; width: 86px; height:19px; background: url(../img/assets.png) 0px -58px;float: left;}
a.jFlowNext {display: block; width: 86px; height:19px; background: url(../img/assets.png) 0px -34px;float: left;}
a.jFlowPrev:hover {background: url(../img/assets.png) -87px -58px;}
a.jFlowNext:hover {background: url(../img/assets.png) -87px -34px;}

#prevNextRed {position: relative; z-index: 2; cursor: pointer; float: left;}
#prevNextOrange {position: relative; z-index: 2; cursor: pointer; float: right;}

div#slides p {margin: 0; padding: 0 1em;position: relative;top: -50px;line-height: 50px;height: 50px;background: black;opacity: .7; filter:alpha(opacity=70);color: white;}
div#wrapSlideOrange p { text-align: right; margin: 0; padding: 0 1em;position: relative;top: -50px;line-height: 50px;height: 50px;background: black;opacity: .7; filter:alpha(opacity=70);color: white;}
