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

/*-------------------- General --------------------*/

html,body {
	background-color: #e3ea9b;
	color: #777;
}

h1,h2,h3,h4,h5,.navbar-brand {
	font-family: Manaspace;
	color: #777;
	text-align: center;
}

h1.head {
	text-align: center;
	font-size: 1.5rem;
	margin-bottom: 1rem;
}

.bq {
	font-family: Manaspace;
	color: #007F7F;
}

img.logo {
	image-rendering: -moz-crisp-edges;
	image-rendering: -o-crisp-edges;
	image-rendering: -webkit-optimize-contrast;
	-ms-interpolation-mode: nearest-neighbor;
	image-rendering: pixelated;
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
	h1.head {
		text-align: right;
		font-size: 2.5rem;
		margin-bottom: 4rem;
	}
}

/*-------------------- Buttons --------------------*/ 

a,
a:active,
a:focus,
button,
button:active,
button:focus {
	border: 0;
	text-decoration: none;
}

.btn-bq, 
.btn-bq:focus,
.btn-bq:hover,
.btn-bq:active {
	border-radius: 0;
	background-color: #7A5209;
	color: #e3ea9b;
	font-family: Manaspace;
	margin-bottom: 0.5rem;
}

.btn-bq:last-child {
	margin-bottom: 0;
}

.btn-effect {
	transition-duration: 0.7s;
	margin-left: 2%;
	width: 96%;
}

.btn-effect:hover {
	width: 110%;
	margin-left: -5%;
}

.btn-effect:active {
	transition-duration: 0.4s;
	width: 90%;
	margin-left: 5%;
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
	.btn-bq, 
	.btn-bq:focus,
	.btn-bq:hover,
	.btn-bq:active {
		margin-bottom: 1.5rem;
	}

	.btn-bq:last-child {
		margin-bottom: 0;
	}
}

/*-------------------- Navbar and bottom bar --------------------*/

footer {
	z-index: 20;
	width: 100%;
	height: 7px;
	background-color: #d7a140;
}

.navbar {
	background-color: #dced33;
	border-bottom: 5px solid #d7a140;

	z-index: 20;
}

.navbar a#lang {
	color: #7A5209;
}

.navbar .navbar-brand {
	padding: 0;
	font-size: 1.5rem;
}

.navbar .navbar-brand:hover {
	color: #5e5e5e;
}

/*-------------------- Slide navbar --------------------*/

#navbar-links {
	position: fixed;
	right: 0;
	top: 40vh;
	z-index: 50;
}

#navbar-links ul li {
	margin-bottom: 2rem;
}

#navbar-links ul li a {
	color: #7A5209;
	padding-right: 1.5vw;
}

#navbar-links ul li.active a {
	color: #007F7F;
}

/*-------------------- Change slide arrows --------------------*/

.arrow {
	z-index: 10;

	font-size: 1.5rem;
}

.up-arrow {
	top: 4rem;
}

.down-arrow {
	bottom: 1rem;
}

.arrow span {
	transition-duration: 0.5s;
}
.arrow button:active span {
	transition-duration: 0.1s;
}

.arrow button,
.arrow button:hover,
.arrow button:focus,
.arrow button:active {
	color: #777;
}

.up-arrow button:hover span {
	top: -1rem;
}

.up-arrow button:active span {
	top: -10rem;
}

.down-arrow button:hover span {
	top: 1rem;
}

.down-arrow button:active span {
	top: 10rem;
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
	.arrow {
		font-size: 3rem;
	}

	.up-arrow {
		top: 4rem;;
	}
}

/*-------------------- Slides --------------------*/

.slide {
	min-height: 100vh;
	padding: 5rem 0;
}

.separator {
	margin-top: 3vh;
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
	.content {
		font-size: 1.2rem;
	}
}

/*-------------------- intro slide --------------------*/

#intro .logo {
	max-height: 30vh;
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
	#intro .logo {
		max-height: 100%;
	}
}

/*-------------------- func slide --------------------*/

#func table td:first-child {
	min-width: auto;
}
#func table td:last-child {
	text-align: right;
}

#func.slide {
	background-color: #BFE3ED;
}

#func .bq {
	color: #AD42DA;
}

/*-------------------- dl slide --------------------*/

#download td:first-child {
	padding-right: 1rem;
}

#download.slide {
	background-color: #F4C965;
}

#download .bq {
	color: black;
}

/*-------------------- contact slide --------------------*/

#contact .names {
	font-family: Manaspace;
	font-size: 1.5rem;
	margin-bottom: 0.5rem;
}

#contact #clem {
	color: #522066;
}

#contact  #gg {
	color: #AE1717;
}

#contact #gg {
	padding-bottom: 0.5rem;
}

#contact .oi {
	vertical-align: bottom;
}