/* Import Fonts */
@import url(http://fonts.googleapis.com/css?family=Libre+Baskerville|Open+Sans);

body {
	font-family: 'Crimson Text', Georgia, sans-serif;
	font-size: 16px;
	line-height: 1.1;
	font-weight:400;
    text-align:center;
	-webkit-font-smoothing: antialiased;
    font-smoothing: antialiased;
	color: #f5f5f5;
	background: #000;
}
h1, h2, h3, h4, h5, h6{
	font-family: 'Libre Baskerville', Georgia, serif;
	color:#fff;
	font-weight: normal;
	letter-spacing: 1px;
}
h1{
	font-size: 50px; 
	line-height: 70px; 
	padding: 0; 
	margin: 0;
	background-image: url("../gfx/divider.png");
	background-position:bottom;
	background-repeat:no-repeat;
	text-align: center;
	height:130px;
	text-transform:uppercase;
}

h2{
	font-family: 'Alex Brush', serif;
	font-size: 90px; 
	line-height: 70px; 
	padding: 0; 
	padding-bottom: 10px;
	margin: 0;
	text-align: center;
}

h2 img {
    max-width: 480px;
}

h3{
    font-family:'Crimson Text';
	font-size: 14px; 
	line-height: 35px; 
	padding: 0; 
	margin: 0; 
	color: #b7b7b7;
	text-align:center;
	background-image: url("../gfx/divider.png");
	background-position:bottom;
	background-repeat:no-repeat;
	text-align: center;
    text-transform:uppercase;
    letter-spacing:5px;
	height:110px;
}
	
h5{
	font-size: 18px; 
	line-height: 35px; 
	padding: 0; 
	margin: 0; 
	color: #b7b7b7;
}

a {
	color: #f2f2f2;
	text-decoration:none;
	font-weight: normal;
}
a:hover {text-decoration:underline;}

a, button, div, span, h1, p, input, textarea { outline: none;}

.clear { clear: both; }

#maximage {
	display:none;
	position:fixed !important;
}

.gradient {
	left:0;
	height:100%;
	position:absolute;
	top:0;
	width:100%;
	z-index:999;
}

.show{display: block;}
.hide{opacity: 0;}

/* Set Page Elements */
.content { 
	float:left;
	margin:20px 80px;
	position:absolute;
	top:200px;
	width:650px;  /* 550 */
	z-index:0;
	-webkit-font-smoothing:antialiased;
}
.content.show { z-index: 9999;}

#banners {
	margin-top: 20px;
	vertical-align: middle;
}

#logo {
	font-family: 'Alex Brush', serif;
	font-size: 72px;
	bottom:50px;
	height:auto;
	left:45px;
	position:absolute; 
	z-index:1000;
	color: #fff;
}

.footer-bar{
	position:absolute;
	bottom: 10px;
	left:0px;
	z-index:0;
}
.footer-bar ul li { 
	list-style: none;
	display: inline;
	padding-right: 8px;
	padding-left: 8px;
	font-size: 11px;
}
.footer-bar ul li a {color: #f3f3f3;}

.main-navslot {
	position:absolute;
	top: 0px;
	left: 80px;
}
.main-navslot ul {margin: 0; padding:0; display: block}
.main-navslot ul li{
    font-family:'Open Sans Condensed';
    font-size:13px;
	list-style: none;
	display:block;
	float: left;
	background: #393939;
	/*padding:90px 15px 10px;*/
	margin: 1px;
	opacity: .6;
    letter-spacing:3px;
}
.main-navslot ul li:hover {opacity: 1; color:#ffa800;}
.main-navslot ul li a {padding: 90px 15px 10px 15px;display: block;}
.menu-headline {display: none;}

button.full-screen{ 
	position: absolute;
	top: 0;
	right: 0;
	width: 31px;
	height: 31px;
	background: url("../gfx/full-screen-btn.png");
	border: 0;
	cursor: pointer;
	opacity: .7;
}
button.full-screen:hover {opacity: 1;}

#arrow_left, #arrow_right {
	bottom:30px;
	height:42px;
	position:absolute;
	right:40px;
	width:42px;
	z-index:1000;
	cursor: pointer;
}
#arrow_left {
	right:95px;
}

hr {
    border-color: #777;
    margin-top: 50px;
    max-width: 250px;

}
.vip img {
	-webkit-filter: blur(2px) grayscale(1) !important;
    filter: blur(2px) grayscale(1) !important;
}



.albumbox {
  	margin: 0px auto 20px;
  	left:0px;
  	right: 0px;
}

.albumbox img {
	margin: 0 2% 2% 0%; /*15px 20px 6px 0px;*/
	width: 28%;
	padding: 0;
	float: left;
	border: 1px solid #bebebe;
}

.albumbox img:hover{
    opacity: .8;
  	-webkit-transition: all .2s ease;
  	-moz-transition: all .2s ease;
  	-o-transition: all .2s ease;
  	transition: all .2s ease;
}

.albumbox li {
    padding: 0;
  	margin: 0;
  	list-style-type: none;
}

.album { 
	display: inline-block;
    min-width: 100px;
    max-width: 150px;
  	width: 23%;
    text-align: center;
  	padding: 0 15px 30px 0;
	vertical-align: top;
}

.album img { 
	max-width: 100%; 
	border: 1px solid #333; 
}
.album a span { 
	text-transform: uppercase; 
	font-size: 11px; 
	color:#fff;
}
.album a:hover span { 
	color: #fff;
}


.scroll-pane {width: 100%;height: 200px;overflow: auto;}


.btn-dark {
    cursor: pointer;
    margin-top: 10px;
    padding: 12px 22px;
    display: inline-block;
    background: #fff;
    letter-spacing: 1px;
    font-weight: 400;
    color: #000 !important;
    font-size: 10px;
    line-height: 12px;
    border: 1px solid #000;
    text-transform: uppercase;
	outline: none;
	position: relative;
	overflow:hidden;
    text-decoration: none;
    -webkit-transition: all 300ms linear;
    -moz-transition: all 300ms linear;
    -o-transition: all 300ms linear;
    -ms-transition: all 300ms linear;
    transition: all 300ms linear; 
}
.btn-dark:hover {
	background: #222;
	color: #fff !important;
    font-weight: 400;
    border: 1px solid #fff;
}


/* width : 850px ----------- */
@media only screen and (max-width : 850px),
only screen and (max-device-width : 850px){
	
	.cp {cursor: pointer;}
	.menu-headline {display: block;background: url(../gfx/menu-line.png) no-repeat left center;padding: 8px 0px 5px 30px;margin: 10px 0px 0px 25px;font-family:'Open Sans';font-size:14px;text-align: left;text-transform: uppercase;cursor: pointer; line-height: 18px;}
	.main-navslot {left: 0px;right: 0px;  background: rgba(20,20,20,0.9); z-index: 99999; height: 50px; position: fixed;} 
	.main-navslot ul {position: absolute;left: 10px;right: 10px;top: auto;z-index: 9999;display: none;}
	.main-navslot ul li {float: none; opacity: 0.97; margin: 0; border-bottom: 1px dashed #555;}
	.main-navslot ul li a {padding: 10px 15px;}
	.main-navslot ul li:hover {opacity: 1; color:#ffa800; opacity: 0.97;}
	
	button.full-screen { z-index: 99999; position: fixed;}

	.content {top: 150px;left: 0px;right: 0px;margin: 20px 10px; padding-bottom: 50px;width: inherit;}
	#arrow_left, #arrow_right {bottom: 15px;right: 15px; position: fixed; z-index: 99999;}
	#arrow_left {right: 70px;}

	.scroll-pane {width: 100% !important;height: auto !important;overflow: visible !important;}
	.jspContainer {width: 100% !important;height: auto !important;overflow: visible !important;}
	.jspPane {width: 100% !important;overflow: visible !important;margin: 0px !important;position: relative !important;}
	.jspVerticalBar {display: none !important;}
}


/* width : 550px ----------- */
@media only screen and (max-width : 550px),
only screen and (max-device-width : 550px){

	h2 {font-size: 60px;line-height: 60px;}
	h2 img {width: 100%;}
	h3 {line-height: 25px;}
	h5 {line-height: 25px;}

	#smartAlertBox {width: 95% !important;margin: 20px auto !important;}
}