/* FONTS */
@import url(http://fonts.googleapis.com/css?family=Cantora+One);


/* CSS reset */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { 
	margin:0;
	padding:0;
}
html,body {
	margin:0;
	padding:0;
}
table {
	border-collapse:collapse;
	border-spacing:0;
}
fieldset,img { 
	border:0;
}
input{
	border:1px solid #b0b0b0;
	padding:3px 5px 4px;
	color:#979797;
	width:190px;
}
address,caption,cite,code,dfn,th,var {
	font-style:normal;
	font-weight:normal;
}
ol,ul {
	list-style:none;
}
caption,th {
	text-align:left;
}

q:before,q:after {
	content:'';
}
abbr,acronym { border:0;
}
/* General Demo Style */
body{
	overflow-y: scroll;
	overflow-x: hidden;
}


/* SLIDESHOW */

.slideshow, .slideshow:after {
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0px;
	left: 0px;
	z-index: 0;
	list-style: none;
}

.slideshow:after {
	content: '';
	background: transparent repeat top left;
}

.slideshow li span {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0px;
	left: 0px;
	color: transparent;
	background-size: cover;
	background-position: 50% 50%;
	background-repeat: none;
	opacity: 0;
	z-index: 0;
	-webkit-backface-visibility: hidden;
    -webkit-animation: imageAnimation 36s linear infinite 0s;
    -moz-animation: imageAnimation 36s linear infinite 0s;
    -o-animation: imageAnimation 36s linear infinite 0s;
    -ms-animation: imageAnimation 36s linear infinite 0s;
    animation: imageAnimation 36s linear infinite 0s; 	
}

.slideshow li div {
	z-index: 100;
	position: absolute;
	bottom: 30px;
	left: 0px;
	width: 100%;
	text-align: center;
	opacity: 0;
	color: #fff;
    -webkit-animation: titleAnimation 36s linear infinite 0s;
    -moz-animation: titleAnimation 36s linear infinite 0s;
    -o-animation: titleAnimation 36s linear infinite 0s;
    -ms-animation: titleAnimation 36s linear infinite 0s;
    animation: titleAnimation 36s linear infinite 0s; 
}

/* SLIDES */
.slideshow li:nth-child(1) span {
	background-image: url(../img/1.jpg);
}

.slideshow li:nth-child(2) span {
	background-image: url(../img/2.jpg);
    -webkit-animation-delay: 6s;
    -moz-animation-delay: 6s;
    -o-animation-delay: 6s;
    -ms-animation-delay: 6s;
    animation-delay: 6s; 
}

.slideshow li:nth-child(3) span {
	background-image: url(../img/3.jpg);
    -webkit-animation-delay: 12s;
    -moz-animation-delay: 12s;
    -o-animation-delay: 12s;
    -ms-animation-delay: 12s;
    animation-delay: 12s; 
}

.slideshow li:nth-child(4) span {
	background-image: url(../img/4.jpg);
    -webkit-animation-delay: 18s;
    -moz-animation-delay: 18s;
    -o-animation-delay: 18s;
    -ms-animation-delay: 18s;
    animation-delay: 18s;
}

.slideshow li:nth-child(5) span {
	background-image: url(../img/5.jpg);
    -webkit-animation-delay: 24s;
    -moz-animation-delay: 24s;
    -o-animation-delay: 24s;
    -ms-animation-delay: 24s;
    animation-delay: 24s;
}

.slideshow li:nth-child(6) span {
	background-image: url(../img/6.jpg);
    -webkit-animation-delay: 30s;
    -moz-animation-delay: 30s;
    -o-animation-delay: 30s;
    -ms-animation-delay: 30s;
    animation-delay: 30s; 
}

.slideshow li:nth-child(7) span {
	background-image: url(../img/7.jpg);
    -webkit-animation-delay: 36s;
    -moz-animation-delay: 36s;
    -o-animation-delay: 36s;
    -ms-animation-delay: 36s;
    animation-delay: 36s; 
}

.slideshow li:nth-child(8) span {
	background-image: url(../img/8.jpg);
    -webkit-animation-delay: 42s;
    -moz-animation-delay: 42s;
    -o-animation-delay: 42s;
    -ms-animation-delay: 42s;
    animation-delay: 42s; 
}

.slideshow li:nth-child(9) span {
	background-image: url(../img/9.jpg);
    -webkit-animation-delay: 48s;
    -moz-animation-delay: 48s;
    -o-animation-delay: 48s;
    -ms-animation-delay: 48s;
    animation-delay: 48s; 
}

.slideshow li:nth-child(10) span {
	background-image: url(../img/11.jpg);
    -webkit-animation-delay: 54s;
    -moz-animation-delay: 54s;
    -o-animation-delay: 54s;
    -ms-animation-delay: 54s;
    animation-delay: 54s; 
}

.slideshow li:nth-child(12) span {
	background-image: url(../img/12.jpg);
    -webkit-animation-delay: 60s;
    -moz-animation-delay: 60s;
    -o-animation-delay: 60s;
    -ms-animation-delay: 60s;
    animation-delay: 60s; 
}


.slideshow li:nth-child(13) span {
	background-image: url(../img/13.jpg);
    -webkit-animation-delay: 66s;
    -moz-animation-delay: 66s;
    -o-animation-delay: 66s;
    -ms-animation-delay: 66s;
    animation-delay: 66s; 
}

.slideshow li:nth-child(14) span {
	background-image: url(../img/14.jpg);
    -webkit-animation-delay: 66s;
    -moz-animation-delay: 66s;
    -o-animation-delay: 66s;
    -ms-animation-delay: 66s;
    animation-delay: 66s; 
}

.slideshow li:nth-child(15) span {
	background-image: url(../img/15.jpg);
    -webkit-animation-delay: 72s;
    -moz-animation-delay: 72s;
    -o-animation-delay: 72s;
    -ms-animation-delay: 72s;
    animation-delay: 72s; 
}

.slideshow li:nth-child(16) span {
	background-image: url(../img/16.jpg);
    -webkit-animation-delay: 78s;
    -moz-animation-delay: 78s;
    -o-animation-delay: 78s;
    -ms-animation-delay: 78s;
    animation-delay: 78s; 
}

.slideshow li:nth-child(17) span {
	background-image: url(../img/17.jpg);
    -webkit-animation-delay: 84s;
    -moz-animation-delay: 84s;
    -o-animation-delay: 84s;
    -ms-animation-delay: 84s;
    animation-delay: 84s; 
}

.slideshow li:nth-child(18) span {
	background-image: url(../img/18.jpg);
    -webkit-animation-delay: 90s;
    -moz-animation-delay: 90s;
    -o-animation-delay: 90s;
    -ms-animation-delay: 90s;
    animation-delay: 90s; 
}

.slideshow li:nth-child(19) span {
	background-image: url(../img/19.jpg);
    -webkit-animation-delay: 96s;
    -moz-animation-delay: 96s;
    -o-animation-delay: 96s;
    -ms-animation-delay: 96s;
    animation-delay: 96s; 
}

.slideshow li:nth-child(20) span {
	background-image: url(../img/20.jpg);
    -webkit-animation-delay: 102s;
    -moz-animation-delay: 102s;
    -o-animation-delay: 102s;
    -ms-animation-delay: 102s;
    animation-delay: 102s; 
}


@keyframes imageAnimation {
	0%   { opacity : 0; animation-timing-function: ease-in; }
	8%   { opacity : 1; animation-timing-function: ease-out; }
	17%  { opacity : 1 }
	25%  { opacity : 0 }
	100% { opacity : 0 }
}

@keyframes titleAnimation {
	0%   { opacity : 0 }
	8%   { opacity : 1 }
	17%  { opacity : 1 }
	19%  { opacity : 0 }
	100% { opacity : 0 }
}

/* Animation for the slideshow images */
@-webkit-keyframes imageAnimation { 
    0% { opacity: 0;
    -webkit-animation-timing-function: ease-in; }
    8% { opacity: 1;
         -webkit-animation-timing-function: ease-out; }
    17% { opacity: 1 }
    25% { opacity: 0 }
    100% { opacity: 0 }
}
@-moz-keyframes imageAnimation { 
    0% { opacity: 0;
    -moz-animation-timing-function: ease-in; }
    8% { opacity: 1;
         -moz-animation-timing-function: ease-out; }
    17% { opacity: 1 }
    25% { opacity: 0 }
    100% { opacity: 0 }
}
@-o-keyframes imageAnimation { 
    0% { opacity: 0;
    -o-animation-timing-function: ease-in; }
    8% { opacity: 1;
         -o-animation-timing-function: ease-out; }
    17% { opacity: 1 }
    25% { opacity: 0 }
    100% { opacity: 0 }
}
@-ms-keyframes imageAnimation { 
    0% { opacity: 0;
    -ms-animation-timing-function: ease-in; }
    8% { opacity: 1;
         -ms-animation-timing-function: ease-out; }
    17% { opacity: 1 }
    25% { opacity: 0 }
    100% { opacity: 0 }
}
@keyframes imageAnimation { 
    0% { opacity: 0;
    animation-timing-function: ease-in; }
    8% { opacity: 1;
         animation-timing-function: ease-out; }
    17% { opacity: 1 }
    25% { opacity: 0 }
    100% { opacity: 0 }
}
/* Animation for the title */
@-webkit-keyframes titleAnimation { 
    0% { opacity: 0 }
    8% { opacity: 1 }
    17% { opacity: 1 }
    19% { opacity: 0 }
    100% { opacity: 0 }
}
@-moz-keyframes titleAnimation { 
    0% { opacity: 0 }
    8% { opacity: 1 }
    17% { opacity: 1 }
    19% { opacity: 0 }
    100% { opacity: 0 }
}
@-o-keyframes titleAnimation { 
    0% { opacity: 0 }
    8% { opacity: 1 }
    17% { opacity: 1 }
    19% { opacity: 0 }
    100% { opacity: 0 }
}

.no-cssanimations .slideshow li span {
	opacity : 1;
}

/* BODY */
.container{
	position: relative;
	width: 100%;
}

/* HEADER */

header {
	width: 100%;
	height:180px;
	position: absolute;
	top: 0px;
	z-index: 410;
	background: url(../img/broken_noise.png);	
}

nav {
	width: 290px;
	height: auto;
	height: 100%;
	position: fixed;
	top: 0px;
	left: 20px;
	z-index: 402;
	padding-bottom: 20px;
	padding-top: 10px;
	background: url(../img/broken_noise.png);
	border-left: 1px solid #888;
	border-right: 1px solid #888;
	border-bottom: 1px solid #777;
	background: url(../img/dark_leather.png) rgba(0,0,0,0.6);
}
 

h2 {
text-align: center;
color: #ccc;
}

.sidebar-bg {
	background: #000;
	position: relative;
	top: 0px;
	left: 20px;
	z-index: 401;
	height: auto;
	width: 234px;
	border-left: 1px solid #fff;
	border-right: 1px solid #fff;
	background: url(../img/broken_noise.png);
	background: url(../img/dark_leather.png);
}

#sidebar-content {
	margin-top: 0px;
	text-align: center;
	font-size: 18px;
	line-height: 36px;
	border-top: 160px solid rgba(255,255,255,0.2);
}

#sidebar-content2 {
	margin-top: 3px;
	text-align: center;
	font-size: 18px;
	line-height: 36px;
	border-top: 0px solid rgba(255,255,255,0.2);
}

#sidebar-content li {
	padding: 8px;

}

#main-content {
	  left: 33%;
    padding: 20px;
    position: absolute;
    top: 20px;
    width: 60%;
}

.inlineframe {
	width: 100%;
	height: 100%;
}

nav2 {
    background: url("../img/dark_leather.png") repeat scroll 0 0 rgba(0, 0, 0, 0.6);
    border-bottom: 1px solid #777777;
    border-left: 1px solid #888888;
    border-right: 1px solid #888888;
    height: 6%;
    left: 20px;
    padding-bottom: 20px;
    padding-top: 0;
    position: fixed;
    top: 0;
    width: 290px;
    z-index: 402;
}

@media screen and (max-width: 970px) {

header {
  height: auto;
  position: initial;

}