/* 3D Slideshow */ 
* {
	margin: 0;
	padding: 0;
}


html, body {
	max-width: 100%;
	overflow-x: hidden;
	overflow-y: hidden;
	background-color: white;
	font-family: "favorit", sans-serif;
	text-decoration:none;
	-moz-user-select: none;
   -khtml-user-select: none;
   -webkit-user-select: none;

   /*
     Introduced in Internet Explorer 10.
     See http://ie.microsoft.com/testdrive/HTML5/msUserSelect/
   */
   -ms-user-select: none;
   user-select: none;
 /*animation: fade 1s ease-in-out;*/
}

#fader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 9;
    pointer-events: none;
    background: white;
    animation-duration: 300ms;
    animation-timing-function: ease-in-out;
}



a {
	text-decoration:none;
	color:black;
}

p {
	text-decoration:none;
}

#copen:hover {
	cursor:pointer;

}


#contact {
	position:fixed;
	display:none;
	left:200px;
	bottom:40px;
}

#contact p {
font-size:12px;
  color:black;
  opacity:0.5;
  word-spacing:.14em;
  color:black;

}

#email {
	color:grey;
}
#email :hover {
	background-color:lightgrey;
	color:black;

}

#navleft {
  position: fixed;
  color:black;
  top:25px;
  left:30px;
  font-size:12px;
  letter-spacing:.005em;
  word-spacing:.14em;
}

#navright {
	display:none;
  position: fixed;
  color:black;
  top:25px;
  right:30px;
  text-align:right;
  font-size:12px;
  letter-spacing:.005em;
  word-spacing:.14em;
}

#navbright {

  position: fixed;
  color:lightgrey;
  bottom:25px;
  right:30px;
  text-align:right;
  font-size:10px;
  letter-spacing:.005em;
  word-spacing:.14em;
}


#navbleft {
  position: fixed;
  color:black;
  bottom:25px;
  left:30px;
  text-align:left;
  font-size:12px;
  letter-spacing:.005em;
  word-spacing:.14em;
}

#navbleft p:hover {
	background-color:black;
}

#slideshow {
	margin: 0 auto;
	padding-top: 25vh;
	height: 100vh;
	width: 100%;
	box-sizing: border-box;
 
}

.slideshow-title {
	font-size: 62px;
	color: #000;
	margin: 0 auto;
	text-align: center;
	margin-top: 25%;
	letter-spacing: 1px;
	font-weight: 300;
}


/*
#t-one {
	

	font-size: 12px;
	letter-spacing:.005em;
  word-spacing:.14em;
	z-index:99;
	color:black;
	position:absolute;
	bottom:10px;
	pointer-events: none;
transform: rotateY(40deg) translateZ(340px);  

} 
*/




.sub-heading-two {
	font-size: 15px;
} .sub-heading-three {
	font-size: 13px;
} .sub-heading-four {
	font-size: 11px;
} .sub-heading-five {
	font-size: 9px;
} .sub-heading-six {
	font-size: 7px;
} .sub-heading-seven {
	font-size: 5px;
} .sub-heading-eight {
	font-size: 3px;
} .sub-heading-nine {
	font-size: 1px;
}

.entire-content {
	margin: auto;
	width: 240px;
	perspective: 1000px;
	position: relative;
	padding-top: 40px;

	
}



#carrousel {
	width: 100%;
	position: absolute;
	float: right;
	animation: rotar 60s infinite forwards linear;
	transform-style: preserve-3d;
	

}

.content-carrousel:hover {
	
	cursor: pointer;

}

.content-carrousel figure {
	width: 100%;
	height: 150px;
	overflow: hidden;
	position: absolute;
}

.content-carrousel figure:nth-child(1) {
	transform: rotateY(0deg) translateZ(400px); 
} .content-carrousel figure:nth-child(2) {
	transform: rotateY(40deg) translateZ(400px); 
} .content-carrousel figure:nth-child(3) {
	transform: rotateY(80deg) translateZ(400px); 
} .content-carrousel figure:nth-child(4) {
	transform: rotateY(120deg) translateZ(400px); 
} .content-carrousel figure:nth-child(5) {
	transform: rotateY(160deg) translateZ(400px); 
} .content-carrousel figure:nth-child(6) {
	transform: rotateY(200deg) translateZ(400px); 
} .content-carrousel figure:nth-child(7) {
	transform: rotateY(240deg) translateZ(400px); 
} .content-carrousel figure:nth-child(8) {
	transform: rotateY(280deg) translateZ(400px); 
} .content-carrousel figure:nth-child(9) {
	transform: rotateY(320deg) translateZ(400px); 
} .content-carrousel figure:nth-child(10) {
	transform: rotateY(360deg) translateZ(400px); 
} 

.shadow {
    position: absolute;
    border-radius: 4px;
}



.content-carrousel img {
	image-rendering: auto;
	transition: all 300ms;
	width: 100%;
	
}

.content-carrousel img {
	image-rendering: auto;
	transition: all 300ms;
	height:100%;


}

.content-carrousel img:hover {
	transform: scale(1.1);
	transition: all 300ms;
	opacity:0.8;



}



.p-title {
	display:none;
	font-size:40px;
	position:fixed;
	top:15px;
	left:200px;

}


.mob-title {
	visibility:hidden;

}

#mob-nav {
	visibility:hidden;


}

#mob-info {
	display:none;
	visibility:hidden;
}



@keyframes rotar {
	from {
		transform: rotateY(0deg);
	} to {
		transform: rotateY(360deg);
	}
}

@keyframes fade {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes fade-out {
    from { opacity: 1 }
      to { opacity: 0 }
}

@keyframes fade-in {
    from { opacity: 0 }
      to { opacity: 1 }
}

#fader.fade-out {
    opacity: 0;
    animation-name: fade-out;
}

#fader.fade-in {
    opacity: 1;
    animation-name: fade-in;
}



@font-face {
  font-family: favorit;
  src: url(fonts/Favorit.ttf);
}