@font-face {
    font-family: "PFDinTextUniversalRegular";
    font-style: normal;
    font-weight: normal;
    src: url("../fonts/pfdintextpro-regularweb.eot?#iefix") format("embedded-opentype"), url("../fonts/pfdintextpro-regularweb.woff") format("woff"), url("../fonts/pfdintextpro-regularweb.ttf") format("truetype"), url("../fonts/pfdintextpro-regularweb.svg#PFDinTextProRegular") format("svg");
}
@font-face {
    font-family: "pfnotepadregular";
    font-style: normal;
    font-weight: normal;
    src: url("../fonts/pfnotepad-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/pfnotepad-webfont.woff") format("woff"), url("../fonts/pfnotepad-webfont.ttf") format("truetype");
}
@font-face {
  font-family: 'PF Bodoni Script Pro Bold';
  font-weight: normal;
  font-style: normal;
  src: url(../fonts/PFBodoniScriptProBold.eot);
  src: url(../fonts/PFBodoniScriptProBold.eot#iefix) format('embedded-opentype'),
  url(../fonts/PFBodoniScriptProBold.woff) format('woff'),
  url(../fonts/PFBodoniScriptProBold.ttf) format('truetype');
}


html {height: 100%;}
body { color: #000000; margin:0px; padding:0px; font: 14px arial; line-height:24px; z-index: 0; min-width: 1000px;}
.siteBody {text-align:center; height: 100%; background: #000;}
.siteBody-helper {padding: 0; text-align: left; height: 100%; position: relative; overflow: hidden;}

a {color: #341815; text-decoration:none;}
a:hover {text-decoration:underline;}

h1, h2, h3, h4, h5, h6 { color: #000; font-weight: 300; margin-bottom: 5px; margin-top: 5px;}


h1 { font: italic bold 25px/35px "pfnotepadregular"; }
h2 { font: italic bold 22px/35px "pfnotepadregular"; }
h3 { font: bold 23px/30px "pfnotepadregular"; margin-top: 30px;}
h4 { font-size: 14px; line-height: 22px; }
h5 { font-size: 12px; line-height: 20px; }


.float-left, .pull-left {float:left;}
.float-right, .pull-right {float:right;}
.clear { clear: both; display: block; float: none !important; height: 0; overflow: hidden; width: 0;}
.wrapper {margin:auto; position:relative;}
.wrapper-helper {/*padding-left: 10px; padding-right: 10px;*/}

/** general fixes **/
.img {border:none;}
.siteBody p {margin: 0; padding:0; text-align: justify;}
.siteBody ul {list-style:none; margin:0; padding:0;}
.content-body ul {list-style:disc; margin: 10 0; padding: 0 0 0 20px;}
.content-body p {margin: 10px 0;}

/************* template *************/
.w1000 {width:1000px;}

.align-left {text-align: left;}
.align-right {text-align: right;}
.align-center {text-align: center;}
.align-justify {text-align: justify;}

.content p {margin: 10px 0;}
.content ul {padding-left: 30px; list-style: disc;}

.siteBody input[type="text"] {border: 1px solid #e5e5e5; height: 30px; color: #808080; width: 100%}
.siteBody textarea {border: 1px solid #e5e5e5; color: #808080; width: 100%}

.top-wrapper {position: relative; z-index:10;}
.top-wrapper .row1 {background: url(../images/template/papyrus_cut.png) 0 -130px repeat-x; height: 100px; position: absolute; top:0px; width: 100%; z-index: 15;}
.top-wrapper .row1-shadow {display: none; background: url(../images/template/row1shadow.png) left bottom repeat-x; height: 180px; position: absolute; top:65px; width: 100%; z-index:11; }
.logo { float: left; position: relative; margin-top: 12px; margin-left: 35px; z-index: 16;}
.logo-helper {position: relative;}
.sparkle {background: url(../images/template/sprite.png) -30px -80px no-repeat; width: 30px; height:30px; position: absolute;}
.headerNotice {font-family: 'PF Bodoni Script Pro Bold'; font-size: 26px; position: absolute; z-index: 16; right: 70px; top: 15px; color:#fff; text-shadow: 1px 1px 2px #000000;}

.mainmenuBlock {width: 226px; bottom: 0px; left: 40px; z-index:13; position: absolute;}
.mainmenuBlock-helper { position: relative; z-index: 16;}
.mainmenuBlock .menutop {background: url(../images/template/sprite.png) 0 0 no-repeat; height: 18px; }
.mainmenuBlock .menuitems {background: url(../images/template/sprite.png) -226px 0 repeat-y; padding: 10px 8px 0;}
.mainmenuBlock .menubottom {background: url(../images/template/sprite.png) 0 -18px no-repeat; height: 18px; }
 ul.mainmenu li {padding-left: 25px; position: relative;}
 ul.mainmenu li.active {background: url(../images/template/sprite.png) 0 -160px no-repeat;}
 ul.mainmenu li a {color: #000; font: bold 18px/28px "pfnotepadregular"; font-style: italic;}
 ul.mainmenu li > div {display: none;}

.optionsBlock {width: 190px; height: 43px; position: absolute; bottom: 0; left:15px; margin: auto; background: url(../images/template/sprite.png) -5px -265px no-repeat; z-index: 14;}
.optionsBlock-helper {height: 100%; background: url(../images/template/sprite.png) 0 -40px no-repeat;}
ul.lang-options {padding: 7px 0 0 20px; float: left;}
ul.lang-options li a {width: 24px; height: 19px; display:inline-block; overflow: hidden; text-indent: -400px; color: transparent; font-size: 0px; background: url(../images/template/sprite.png) 0 -230px no-repeat;}
ul.lang-options li.lang-en a {background-position: 0 -230px;}
ul.lang-options li.lang-el a {background-position: 0 -249px;}
ul.lang-options li {display: inline-block; margin: 0 3px;}

.musicControl {float: right; margin: 17px 18px 0 0;}
.musicControl .musicControl-helper {}

.rightmenuBlock {position: absolute; right:0px; top: 180px; z-index: 10;}
.rightmenuBlock ul {}
.rightmenuBlock ul li {clear: both; float: right; margin-right: -100%; position: relative;}
.rightmenuBlock ul li a {display: block;  padding-left: 7px; font-family: "Times New Roman"; font-size: 14px; line-height:28px; color: #000; /*color: #535353;*/ background: url("../images/template/sprite.png") -225px 0 no-repeat;}
.rightmenuBlock ul li a .loading-icon {position: absolute; right: 0px; top:0; padding:0 10px 0 0;}
.rightmenuBlock ul li span {display: block; padding: 0 35px 0 10px; border-top: 1px solid #e0dac8; background: url(../images/template/sidemenu_libg.png) right center no-repeat; }
.rightmenuBlock ul li a:hover {text-decoration: none; color: #8C8C8C;}

.closeBtn {background: url(../images/template/sprite.png) -143px -90px no-repeat; height: 50px; width: 75px; position: absolute; right: -75px; top: 30px; cursor: pointer; }

.bottom-wrapper {position: absolute; width: 100%; bottom: 0px; z-index: 11;}
.bottom {background: url("../images/template/papyrus_cut.png") repeat-x 0 0; height: 80px; position: relative; z-index:6;}
.bottom .wrapper {height: 100%;}
.content {position: absolute; bottom:-10px; right: 25px; width: 670px; background: url(../images/template/content-bg.jpg) left top repeat-y;  box-shadow: 0 0 4px 0 #000000; -webkit-box-shadow: 0 0 4px 0 #000000; -moz-box-shadow: 0 0 4px 0 #000000; }
.content .pageheader {background: #341815; position: absolute; top: -20px; left: 20px; color: #fff; font: bold 20px/40px "times new roman"; font-style: italic; height: 40px; padding: 0 15px;}
.content-closed {height: 160px;}
.content-opened {height: 600px;}
.content > div.corner {background: url(../images/template/sprite.png) -40px -115px no-repeat; height:10px; width:10px; position: absolute; bottom:0; left: -10px;}
.content .control {position: absolute; top:10px; right: 10px; width: 66px; height: 12px; background: url(../images/template/sprite.png) no-repeat; cursor: pointer;}
.content .control-open-el {background-position: -60px -90px;}
.content .control-close-el {background-position: -60px -102px;}
.content .control-open-en {background-position: -60px -114px;}
.content .control-close-en {background-position: -60px -126px;}
.content-helper {/*margin: 40px 20px 10px;*/ height:100%; }
.content .contentWrap {height: 120px; overflow: auto; position: relative; top: 30px; padding: 0 15px; margin: 0 10px;}
.content .contentWrap > div {padding-bottom: 30px;}
.content.content-opened .contentWrap {height: 560px;}
.contentWrap a {font-weight: bold;}
.socialicons {float: left; margin-top: 33px; padding-left: 40px;}
.socialicons a {background: url(../images/template/sprite.png) 57px -90px no-repeat; float: left; height: 30px; padding-right: 35px; color: #715748; font: bold 14px/30px "times new roman";}
.socialicons a:hover {text-decoration:none;}
.socialicons a.FacebookShare {margin-right: 20px;}
.socialicons a.FacebookShare:hover {background-position:  57px -120px;}
.socialicons a.FacebookLike {background-position: 44px -90px;}
.socialicons a.FacebookLike:hover {background-position: 44px -120px;}
.footer-wrapper {position: absolute; width: 100%; bottom:0px;}
.footer {background: url(../images/template/footer-bg2.png) repeat-x; color: #fff; font-size: 13px; line-height: 50px; height: 50px; z-index:5;}
.footer a {color: #fff; }
.row2-shadow {background: url(../images/template/row2shadow.png) left top repeat-x; height: 45px; width: 100%; position: absolute; bottom: 110px; z-index:4;}

.footerInfo {background: #00aeb1; font-size: 12px; line-height: 15px;}
.footerInfo .wrapper-helper {padding: 25px 0; color: #fff;}
.footerInfo, .footerInfo a {color: #fff;}

/** photo gallery **/
.contentImageFrame {position: relative; display: inline-block; margin: 0 10px; background: url(../images/template/galleryOuter.png)}
.contentImageFrame img {display: block;}
.frameItem {position: absolute; width: 20px; height: 25px; }
.frameTL {top:0px; left:0px; background: url(../images/template/galleryFrame.png) -20px -25px no-repeat;}
.frameTR {top:0px; right:0px; background: url(../images/template/galleryFrame.png) 0 -25px no-repeat;}
.frameBL {bottom:0px; left:0px; background: url(../images/template/galleryFrame.png) -20px 0 no-repeat;}
.frameBR {bottom:0px; right:0px; background: url(../images/template/galleryFrame.png) 0px 0 no-repeat;}
.gallery .imageWrapper {padding-top:10px; background: url(../images/template/galleryShadow.png) center top no-repeat;}
.gallery .imageWrapper .imageFrame {padding-bottom:10px; background: url(../images/template/galleryShadow.png) center bottom no-repeat;}
.gallery .header {position: relative; top: -15px;}
.gallery .header span {font: bold 18px "Times New Roman"; margin: 0px;}
.gallery a.back {position: absolute; right: -15px; background: url(../images/template/galleryBack.png) left -1px no-repeat; padding-left: 20px; margin: 0 0 0 0; font: italic bold 16px "pfnotepadregular"}
.gallery .imageOuter {background: url(../images/template/galleryOuter.png)}

/** contact page **/
.contact #pageContent > div > div {float: left; width: 45%;}
.contact-addon {float: right; width: 40%}
.contact-addon div.label {display: none;}
.contact-addon input[type="text"] {margin-bottom: 5px; border: 1px solid #858585; padding: 0px 5px; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box;}
.contact-addon textarea { border: 1px solid #858585; padding: 5px; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box;}
.contact-addon form h3 {font-weight: bold;}
.contact-addon form h3 span { border-left: 3px solid #341815; padding-left: 10px; color: #341815;}
ul.message, ul.error {position: absolute; top: 30px; left: 30px; right: 30px; font-weight: bold;padding-left: 15px; margin: 0; list-style: none !important; font-size: 12px;}
ul.message {background-color: #C3D2E5; border-bottom: 3px solid #84A7DB; border-top: 3px solid #84A7DB; color: #0055BB; }
ul.error {background-color: #E6C0C0; border-bottom: 3px solid #DE7A7B; border-top: 3px solid #DE7A7B; color: #CC0000; }
.closePopup {position: absolute; width: 24px; height: 24px; top: -12px; right: -12px; background: url(../images/prettyPhoto/facebook/sprite.png) 0 0 no-repeat; cursor: pointer;}


/* buttons */
.cssButton_roundedLow {box-shadow: rgba(255, 255, 255, 0.796875) 0px 1px 1px 0px inset; -webkit-box-shadow: rgba(255, 255, 255, 0.796875) 0px 1px 1px 0px inset; -moz-box-shadow: rgba(255, 255, 255, 0.796875) 0px 1px 1px 0px inset; border-width: 1px; border-style: solid; cursor: pointer; display: inline-block; font: bold 13px/normal Arial, 'Trebuchet MS', sans-serif; height: auto; margin: 5px 0px 5px 0px; outline: none; overflow: visible; padding: 5px 10px 5px 10px; position: relative; text-align: center; text-decoration: none; width: auto}
.cssButton_roundedLow:hover, .cssButton_roundedLow:active, .cssButton_roundedLow:focus {outline: none; text-decoration: none}
.cssButton_roundedLow {border-radius: 2px; -webkit-border-radius: 2px; -moz-border-radius: 2px}
.cssButton_tan, .cssButton_tan:focus {background-color: #C51; background-image: -webkit-linear-gradient(top, #C60 0px, #930 100%); background-image: -moz-linear-gradient(top, #C60 0px, #930 100%); background-image: -o-linear-gradient(top, #C60 0px, #930 100%); background-image: -ms-linear-gradient(top, #C60 0px, #930 100%); background-image: linear-gradient(top, #C60 0px, #930 100%); filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0, startColorStr=#CC6600, endColorStr=#993300); -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#CC6600', endColorstr='#993300')"; border-color: #C60; color: #FFF;}
.cssButton_tan:hover {background-color: #C60; background-image: -webkit-linear-gradient(top, #C60 0px, #C60 100%); background-image: -moz-linear-gradient(top, #C60 0px, #C60 100%); background-image: -o-linear-gradient(top, #C60 0px, #C60 100%); background-image: -ms-linear-gradient(top, #C60 0px, #C60 100%); background-image: linear-gradient(top, #C60 0px, #C60 100%); filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0, startColorStr=#CC6600, endColorStr=#CC6600); -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#CC6600', endColorstr='#CC6600')"}
.cssButton_tan:active {background-color: #940; background-image: -webkit-linear-gradient(top, #930 0px, #C80 100%); background-image: -moz-linear-gradient(top, #930 0px, #C80 100%); background-image: -o-linear-gradient(top, #930 0px, #C80 100%); background-image: -ms-linear-gradient(top, #930 0px, #C80 100%); background-image: linear-gradient(top, #930 0px, #C80 100%); filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0, startColorStr=#993300, endColorStr=#CC8800); -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#993300', endColorstr='#CC8800')"}
.cssButton_lightBrown, .cssButton_lightBrown:focus {background-color: #ac7d5e; background-image: -webkit-linear-gradient(top, #c58b64 0px, #83583b 100%); background-image: -moz-linear-gradient(top, #c58b64 0px, #83583b 100%); background-image: -o-linear-gradient(top, #c58b64 0px, #83583b 100%); background-image: -ms-linear-gradient(top, #c58b64 0px, #83583b 100%); background-image: linear-gradient(top, #c58b64 0px, #83583b 100%); filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0, startColorStr=#c58b64, endColorStr=#83583b); -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#c58b64', endColorstr='#83583b')"; border-color: #c58b64; color: #333;}
.cssButton_lightBrown:hover {background-color: #c58b64; background-image: -webkit-linear-gradient(top, #c58b64 0px, #ac7d5e 100%); background-image: -moz-linear-gradient(top, #c58b64 0px, #ac7d5e 100%); background-image: -o-linear-gradient(top, #c58b64 0px, #ac7d5e 100%); background-image: -ms-linear-gradient(top, #c58b64 0px, #ac7d5e 100%); background-image: linear-gradient(top, #c58b64 0px, #ac7d5e 100%); filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0, startColorStr=#c58b64, endColorStr=#ac7d5e); -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#c58b64', endColorstr='#ac7d5e')"}
.cssButton_lightBrown:active {background-color: #83583b; background-image: -webkit-linear-gradient(top, #83583b 0px, #d4956b 100%); background-image: -moz-linear-gradient(top, #83583b 0px, #d4956b 100%); background-image: -o-linear-gradient(top, #83583b 0px, #d4956b 100%); background-image: -ms-linear-gradient(top, #83583b 0px, #d4956b 100%); background-image: linear-gradient(top, #83583b 0px, #d4956b 100%); filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0, startColorStr=#83583b, endColorStr=#d4956b); -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#83583b', endColorstr='#d4956b')"}
.cssButton_darkBrown, .cssButton_darkBrown:focus {background-color: #630; background-image: -webkit-linear-gradient(top, #830 0px, #4f1e00 100%); background-image: -moz-linear-gradient(top, #830 0px, #4f1e00 100%); background-image: -o-linear-gradient(top, #830 0px, #4f1e00 100%); background-image: -ms-linear-gradient(top, #830 0px, #4f1e00 100%); background-image: linear-gradient(top, #830 0px, #4f1e00 100%); filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0, startColorStr=#883300, endColorStr=#4f1e00); -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#883300', endColorstr='#4f1e00')"; border-color: #830; color: #FFF;}
.cssButton_darkBrown:hover {background-color: #830; background-image: -webkit-linear-gradient(top, #830 0px, #830 100%); background-image: -moz-linear-gradient(top, #830 0px, #830 100%); background-image: -o-linear-gradient(top, #830 0px, #830 100%); background-image: -ms-linear-gradient(top, #830 0px, #830 100%); background-image: linear-gradient(top, #830 0px, #830 100%); filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0, startColorStr=#883300, endColorStr=#883300); -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#883300', endColorstr='#883300')"}
.cssButton_darkBrown:active {background-color: #4f1e00; background-image: -webkit-linear-gradient(top, #4f1e00 0px, #a43e00 100%); background-image: -moz-linear-gradient(top, #4f1e00 0px, #a43e00 100%); background-image: -o-linear-gradient(top, #4f1e00 0px, #a43e00 100%); background-image: -ms-linear-gradient(top, #4f1e00 0px, #a43e00 100%); background-image: linear-gradient(top, #4f1e00 0px, #a43e00 100%); filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0, startColorStr=#4f1e00, endColorStr=#a43e00); -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#4f1e00', endColorstr='#a43e00')"}
/*Light Grey*/
.cssButton_lightGrey, .cssButton_lightGrey:focus {
	background-color:#DDD;
	background-image:-webkit-linear-gradient(top, #EEE 0px, #CCC 100%);
	background-image:-moz-linear-gradient(top, #EEE 0px, #CCC 100%);
	background-image:-o-linear-gradient(top, #EEE 0px, #CCC 100%);
	background-image:-ms-linear-gradient(top, #EEE 0px, #CCC 100%);
	background-image:linear-gradient(top, #EEE 0px, #CCC 100%);
	filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0, startColorStr=#EEEEEE, endColorStr=#CCCCCC);
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#EEEEEE', endColorstr='#CCCCCC')";
	border-color:#DDD;
	color:#333;
	text-shadow:0px 1px 5px #FFF;
}
	.cssButton_lightGrey:hover {
		background-image:-webkit-linear-gradient(top, #EEE 0px, #EEE 100%);
		background-image:-moz-linear-gradient(top, #EEE 0px, #EEE 100%);
		background-image:-o-linear-gradient(top, #EEE 0px, #EEE 100%);
		background-image:-ms-linear-gradient(top, #EEE 0px, #EEE 100%);
		background-image:linear-gradient(top, #EEE 0px, #EEE 100%);
		filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0, startColorStr=#EEEEEE, endColorStr=#EEEEEE);
		-ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#EEEEEE', endColorstr='#EEEEEE')";
		background-color:#EEE;
	}
	.cssButton_lightGrey:active {
		background-color:#CCC;
		background-image:-webkit-linear-gradient(top, #CCC 0px, #EEE 100%);
		background-image:-moz-linear-gradient(top, #CCC 0px, #EEE 100%);
		background-image:-o-linear-gradient(top, #CCC 0px, #EEE 100%);
		background-image:-ms-linear-gradient(top, #CCC 0px, #EEE 100%);
		background-image:linear-gradient(top, #CCC 0px, #EEE 100%);
		filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0, startColorStr=#CCCCCC, endColorStr=#EEEEEE);
		-ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#CCCCCC', endColorstr='#EEEEEE')";
	}


/* resets */


/* supersized */
#supersized-loader { position:absolute; top:50%; left:50%; z-index:0; width:60px; height:60px; margin:-30px 0 0 -30px; text-indent:-999em; background:url(../images/supersized/progress.gif) no-repeat center center;}

#supersized {  display:block; position:fixed; left:0; top:0; overflow:hidden; z-index:-999; height:100%; width:100%; }
#supersized img { width:auto; height:auto; position:relative; display:none; outline:none; border:none; }
#supersized.speed img { -ms-interpolation-mode:nearest-neighbor; image-rendering: -moz-crisp-edges; }	/*Speed*/
#supersized.quality img { -ms-interpolation-mode:bicubic; image-rendering: optimizeQuality; }			/*Quality*/

#supersized li { display:block; list-style:none; z-index:-30; position:fixed; overflow:hidden; top:0; left:0; width:100%; height:100%; background:#111; }
#supersized a { width:100%; height:100%; display:block; }
#supersized li.prevslide { z-index:-20; }
#supersized li.activeslide { z-index:-10; }
#supersized li.image-loading { background:#111 url(../images/supersized/progress.gif) no-repeat center center; width:100%; height:100%; }
#supersized li.image-loading img{ visibility:hidden; }
#supersized li.prevslide img, #supersized li.activeslide img{ display:inline; }

/* shutter theme */
/* Controls Bar
----------------------------*/
#controls-wrapper { margin:0 auto; height:42px; width:100%; bottom:0px; left:0; z-index:4; background:url(../images/supersized/nav-bg.png) repeat-x; position:fixed; }
#controls { overflow:hidden; height:100%; position:relative; text-align:left; z-index:5; }
#slidecounter { float:left; color:#999; font:14px "Helvetica Neue", Helvetica, Arial, sans-serif; text-shadow:#000 0 -1px 0; margin:0px 10px 0 15px; line-height:42px; }
#slidecaption { overflow:hidden; float:left; color:#FFF; font:400 14px "Helvetica Neue", Helvetica, Arial, sans-serif; text-shadow:#000 1px 1px 2px; margin:0 20px 0 0; line-height:42px; }

#navigation { float:right; margin:0px 20px 0 0; }
#play-button{ float:left; margin-top:1px;border-right:1px solid #333; background:url('../images/supersized/bg-hover.png') repeat-x 0 44px; }
#play-button:hover{ background-position:0 1px; cursor:pointer; }

#prevslide, #nextslide{ position:absolute; height:43px; width:43px; top:50%; margin-top:-21px; opacity:0.6; }
#prevslide{ left:10px; background:url('../images/supersized/back.png'); }
#nextslide{ right:10px; background:url('../images/supersized/forward.png'); }
#prevslide:active, #nextslide:active{ margin-top:-19px; }
#prevslide:hover, #nextslide:hover{ cursor:pointer; }

ul#slide-list{ padding:15px 0; float:left; position:absolute; left:50%; }
ul#slide-list li{ list-style:none; width:12px; height:12px; float:left; margin:0 5px 0 0; }
ul#slide-list li.current-slide a, ul#slide-list li.current-slide a:hover{ background-position:0 0px; }
ul#slide-list li a{ display:block; width:12px; height:12px; background:url('../images/supersized/nav-dot.png') no-repeat 0 -24px; }
ul#slide-list li a:hover{ background-position:0 -12px; cursor:pointer; }

#tray-button{ float:right; margin-top:1px; border-left:1px solid #333; background:url('../images/supersized/bg-hover.png') repeat-x 0 44px; }
#tray-button:hover{ background-position:0 1px; cursor:pointer; }

/* Progress Bar
----------------------------*/
#progress-back{ z-index:5; position:fixed; bottom:42px; left:0; height:8px; width:100%; background:url('../images/supersized/progress-back.png') repeat-x; }
#progress-bar{ position:relative; height:8px; width:100%; background:url('../images/supersized/progress-bar.png') repeat-x; }

/* Thumbnail Navigation
----------------------------*/
#nextthumb,#prevthumb { z-index:2; display:none; position:fixed; bottom:61px; height:75px; width:100px; overflow:hidden; background:#ddd; border:1px solid #fff; -webkit-box-shadow:0 0 5px #000; }
#nextthumb { right:12px; }
#prevthumb { left:12px; }
#nextthumb img, #prevthumb img { width:150px; height:auto;  }
#nextthumb:active, #prevthumb:active { bottom:59px; }
#nextthumb:hover, #prevthumb:hover { cursor:pointer; }

/* Thumbnail Tray
----------------------------*/
#thumb-tray{ position:fixed; z-index:3; bottom:0; left:0; background:url(../images/supersized/bg-black.png); height:150px; width:100%; overflow:hidden; text-align:center; -moz-box-shadow: 0px 0px 4px #000; -webkit-box-shadow: 0px 0px 4px #000; box-shadow: 0px 0px 4px #000; }

#thumb-back, #thumb-forward{ position:absolute; z-index:5; bottom:42px; height:108px; width:40px; }
#thumb-back{ left:0; background: url('../images/supersized/thumb-back.png') no-repeat center center;}
#thumb-forward{ right:0; background:url('../images/supersized/thumb-forward.png') no-repeat center center;}
#thumb-back:hover, #thumb-forward:hover{ cursor:pointer; background-color:rgba(256,256,256, 0.1); }
#thumb-back:hover{ border-right:1px solid rgba(256,256,256, 0.2); }
#thumb-forward:hover{ border-left:1px solid rgba(256,256,256, 0.2); }

ul#thumb-list{ display:inline-block; list-style:none; position:relative; left:0px; padding:0 0px; }
ul#thumb-list li{ background:#111; list-style:none; display:inline; width:150px; height:108px; overflow:hidden; float:left; margin:0; }
ul#thumb-list li img { width:200px; height:auto; opacity:0.5; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)"; filter:alpha(opacity=60); -webkit-transition: all 100ms ease-in-out; -moz-transition: all 100ms ease-in-out; -o-transition: all 100ms ease-in-out; -ms-transition: all 100ms ease-in-out; transition: all 100ms ease-in-out; }
ul#thumb-list li.current-thumb img, ul#thumb-list li:hover img{ opacity:1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter:alpha(opacity=100); }
ul#thumb-list li:hover{ cursor:pointer; }