/*
 * algemeen
 */
body{
	background-color:#f1f1f1;
	font-family: 'Open Sans', sans-serif;
}
a, .animo{
	-webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

/*
 * navigatie
 */
.navbar-nav>li>a{
	color:#000;
	font-size:18px;
	font-family:"Oswald", sans-serif;
	font-weight:400;
}
.navbar-nav>li>a span{
	color:#ff0000;
}

/*
 * landing
 */
#landing{
	float:left;
	width:100%;
	height:100vh;
	background: url(../img/landing.jpg) no-repeat center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
    position:relative;
    background-attachment:fixed;
}
#logo{
	position:absolute;
	top:30px;
	right:30px;
}
#logo img{
	float:right;
	max-width:100%;
}
#info{
	display:inline-block;
	float:right;
	width:100%;
	color:#000;
	text-align:right;
	margin:5px 5px 0 0;
	font-size:24px;
	color:#000;
	font-family: 'Calligraffitti', cursive;
}
#info a{
	color:#f03955;
}
#info a:hover{
	text-decoration:none;
}
#go{
	position:absolute;
	height:30px;
	background-color:#111;
	left:0;
	right:0;
	bottom:0;
}
#go #go-soundboard{
	position:absolute;
	bottom:30px;
	left:50%;
	margin-left:-30px;
	z-index:2;
}
#go #go-contact{
	position:absolute;
	bottom:30px;
	left:50%;
	margin-left:-170px;
	z-index:1;
}

/*
 * klankbord
 */
#soundboard{
	padding:90px 0;
	float:left;
	width:100%;
   	background-color:#111;
}
#logo-klankbord{
	float:left;
	width:100%;
	padding:0 0 30px 0;
	text-align:center;
}
#logo-klankbord img{
	display:inline-block;
}
.toets a{
	font-family: 'Calligraffitti', cursive;
	background-color:rgba(255,255,255,1);
	color:#f03955;
	text-align:center;
	width:100%;
	height:150px;
	float:left;
	display:table;
	font-size:22px;
	padding:15px;
	margin-bottom:30px;
	background-image: url('../img/bg-toets.png');
	background-repeat:no-repeat;
	background-position:-180px -80px;
	border-top-left-radius:20px;
	border-top-right-radius:20px;
	border-bottom-right-radius:20px;
}
.toets a span{
	display:table-cell;
	vertical-align:middle;
}
.toets a svg{
	color:#ccc;
	position:absolute;
	font-size:100px;
	left:50%;
	margin-left:-45px;
	color:rgba(240,57,85,0);
}
.toets a:hover{
	text-decoration:none;
	background-color:rgba(255,255,255,1);
	color:#f03955;
}
.toets a:focus{
	text-decoration:none;
	background-color:rgba(240,57,85,1);
	color:#fff;
	border-color:#f03955;
}
.toets a:hover svg{
	color:rgba(240,57,85,0.3);
}
.toets a:focus svg{
	color:#fff;
}

/*
 * contact
 */
#contact{
	float:left;
	width:100%;
	background: url(../img/bg-klankbord.jpg) no-repeat top center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
    background-attachment:fixed;
    position:relative;
}
#contact-layer{
	position:absolute;
	top:0;
	left:0;
	right:0;
	bottom:0;
	background-color:rgba(255,255,255,0);
}
#contact-info{
	position:absolute;
	top:50%;
	margin-top:-100px;
	left:50%;
	width:300px;
	margin-left:-150px;
	text-align:center;
	font-size:16px;
}
#contact-info a{
	font-family: 'Calligraffitti', cursive;
	color:#F03955;
	font-size:20px;
	padding:5px 10px;
	display:inline-block;
}
#contact-info a:hover{
	text-decoration:none;
	color:#000;
}
#contact-info img{
	width:100%;
}
.social svg{
	font-size:30px;
}

/*
 * copy
 */
#to-top{
	float:left;
	width:100%;
	background-color:#F03955;
	height:10px;
	position:relative;
	margin-top:-10px;
}
#to-top a{
	position:absolute;
	right:30px;
	bottom:0;
}
#to-top a img{
	width:150px;
}
#copy{
	width:300px;
	color:#000;
	position:absolute;
	bottom:50px;
	left:50%;
	text-align:center;
	margin-left:-150px;
}
#copy a{
	color:#000;
}
#copy a:hover,
#copy a:active,
#copy a:focus{
	text-decoration:none;
}
.copy{
	float:left;
	width:100%;
}
.idel{
	float:left;
	width:100%;
}
.idel img{
	height:70px;
}