html,
body {
    margin:0;
    padding:0;
    height:100%;
	font-family: TopBarFont;
}

@font-face {
    src: url(../fonts/ufonts.com_fremont-caps-regular.woff);
    font-family: TopBarFont;
}

h3{
	font-weight:bold;
}

/* navbar */
.navbar-default {
    background-color: #151515;
    border-color: black;
	min-height:40px !important;
}

/* link */
.navbar-default .navbar-nav > li > a {
    padding-top:10px !important; 
    padding-bottom:0 !important;
    height: 40px;
    color: #C5B358;
	font-size:20px;
}
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
    color: #C5B358;
	text-shadow: 0 0 10px white;
}
.navbar-default .navbar-nav > .active > a, 
.navbar-default .navbar-nav > .active > a:hover, 
.navbar-default .navbar-nav > .active > a:focus {
    color: #ffffff;
    background-color: black;
}

#main{
	background-color:#F5F5DC;
}

#logo-img{
	display:inline-block;
	-webkit-filter: drop-shadow(0 0 10px black);
    filter: drop-shadow(0 0 10px black); 
	transition: all 0.2s ease-out 0s;
	margin-bottom:0px;
}

#logo-img:hover{
	-webkit-filter: drop-shadow(0 0 20px black);
    filter: drop-shadow(0 0 20px black); 
	transition: all 0.2s ease-in 0s;
	cursor:pointer;
}

.top-text{
	display:inline-block;
	-webkit-filter: drop-shadow(0 0 10px black);
    filter: drop-shadow(0 0 10px black); 
	text-shadow: 0 0 10px black;
	transition: all 0.2s ease-out 0s;
}

.top-text:hover{
	text-shadow: 0 0 10px white;
    filter: drop-shadow(0 0 20px black); 
	transition: all 0.2s ease-in 0s;
	cursor:pointer;
}

#top-page{
	background-color:#242125;
	text-align:center;
	font-size:24px;
	color:#A08700;
}

#content-box{
	margin:20px;
	padding-bottom:50px;
}

#presentation{
	color:black;
	font-size:18px;
	height: auto;
	margin: 20px;
}

#show-events{
	position:relative;
	border:5px solid #F5F5F5;
	box-shadow:inset 0 0 5px black, 0 0 5px black;
    overflow: hidden;
	height:200px;
	border-radius:10px;
	width:100%;
}

#welcome-message{
	color:black;
	font-size:18px;
	padding:20px;
	text-align:center;
	margin: 0 auto;
}

#alert-messages{
	position : fixed;
    bottom : 0;
	left:0;
	padding:5px;
	border:1px solid black;
	background-color:#151515;
	color:#f5f5f5;
	width:100%;
	box-shadow: 0 0 5px black;
	z-index:10;
}

#slideshow-text{
	position: absolute;
	margin-top:70px;
	left: 40%;
	z-index:3;
	color:#2E2E2E;
	font-weight:bold;
	font-size:20px;
	text-shadow: 0 0 5px white;
    filter: drop-shadow(0 0 15px black); 
	transition: all 0.2s ease-out 0s;
	text-align:center;
}

#slideshow-image{
	max-width: 100%;
	width:100%;
	height:100%;
	position:absolute;
	z-index:2;
	border-radius:5px;
	opacity:0.5;
	transition: all 0.2s ease-out 0s;
}

#slideshow-image:hover, #slideshow-text:hover{
	transition: all 0.2s ease-in 0s;
}

.image-event{
	width:250px;
	margin:0 auto;
	display:inline-block;
	margin:10px;
}

.image-event img{
	box-shadow:0 0 10px black;
	transition: all 0.2s ease-out 0s;
	margin: 0 auto;
	position:relative;
	z-index:2;
	border-radius:5px;
}

.image-event p{
	position:relative;
	width:250px;
	height:100px;
	margin:0 auto;
	margin-top:-100px;
	z-index:5;
	color:white;
	background: rgba(129, 135, 184, .8);
	text-shadow:0 0 3px black;
	padding:10px;
	font-size:16px;
	border-bottom-left-radius:5px;
	border-bottom-right-radius:5px;
	opacity:0;
}

.image-event img:hover{
	transition: all 0.2s ease-in 0s;
}

.slideshow-arrow{
	opacity:0.75;
	transition: all 0.2s ease-out 0s;
}

.slideshow-arrow:hover{
	opacity:1;
	-moz-transform: scale(1.3);
	-webkit-transform: scale(1.3);
	transform: scale(1.3);
	transition: all 0.1s ease-in 0s;
	cursor:pointer;
}

.events{
	width:250px;
	height:300px;
	display:inline-block;
	box-shadow:0 0 10px black;
	border-radius:5px;
	margin:10px;
	transition: all 0.1s ease-out 0s;
	opacity:0.9;
}

.events:hover{
	cursor:pointer;
	-moz-transform: scale(1.05);
	-webkit-transform: scale(1.05);
	transform: scale(1.05);
	transition: all 0.1s ease-in 0s;
	opacity:1;
}

#event-description p{
	border-radius: 5px;
	color:#f5f5f5;
	height:30px;
	background-color:#151515;
	padding-top:3px;
}

#event-description{
	border:1px solid grey;
	border-top:none;
	margin-left:50px;
	margin-right:50px;
	border-radius: 5px;
	color:black;
	background-color:#f5f5f5;
	box-shadow: inset 0 0 15px grey;
	font-size:16px;
	display:block;
}
#event-description div{
	padding:20px;
	padding-top:10px;
}

.perso{
	display:inline-block;
	margin:50px;
	margin-bottom:50px;
	height:400px;
	width:300px;
    vertical-align:top;
}

.perso-img{
	box-shadow: 0 0 5px black;
	border-radius: 50%;
	height:200px;
	width:200px;
	margin:0 auto;
}

.perso-img div{
	font-size:18px;
	font-weight:bold;
}

.perso-hover{
	background-color:#f5f5f5;
	opacity:0.8;
	width:200px;
	height:200px;
	border-radius:50%;
	position:relative;
	z-index:5;
	border:1px solid black;
	margin-top:-200px;
	text-align:center;
	padding-top:90px;
	opacity:0;
}

.member-role{
	margin-top:10px;
	font-size:24px;
	font-weight:bold;
}