@font-face {
		font-family: "Bebas Neue";
		src: url("fonts/BebasNeue.otf") format("opentype");
}

@font-face {
			font-family: "NordicaHairline";
			src: url("fonts/NordicaHairline.otf") format("opentype");	
}

@font-face {
			font-family: "NordicaThin";
			src: url("fonts/NordicaThin.otf") format("opentype");	
}

body {
		margin: 0;
		width: 100%;
		height: 100%;
}

/*************** slideshow***************/

div {
	text-align: center;
	margin: auto;
}

#slideshow {
			display: none;
			height: 100%;
			width: 100%;
			bottom: 0;
}

#slideshow img {
				position: absolute;
				left: 0;
				top: 0;
				width: 100%;
				height: 100%;
				
				z-index: 8;
}

#slideshow img.active {
    	z-index:10;
}

#slideshow img.last-active {
    	z-index:9;
}

/*************** Navigational Bar ***************/

#nav_bar {
			background-color: white;
			z-index: 999;
			position: absolute;
			width: 200px;
			height: 100%;
			float: left;
}

.button {
		display: inline-block;
		text-align: center;
		margin-top: 30%;
		height: 50px;
		width: 100px;
		text-decoration: none;
		
		position: relative;
		padding bottom: 1px;
}

.button:after {
    content: '';
    display: block;
    margin: auto;
    height: 1px;
    width: 0px;
    background: transparent;
    transition: width .5s ease, background-color .5s ease;
}
.button:hover:after {
    width: 100%;
    background: black;
}

p {
	font-family: "NordicaThin";
	color: black;
	opacity: 0.6;
}

#logo {
		height: 130px;
		width: 130px;
		
		margin-left: 20px;
		margin-top: 20%;
}