/* CSS definition file: FietsRepa's - BikeReps Contactform */

@import "https://fonts.googleapis.com/css?family=Margarine";

/*styling open close button*/
.nav-burger {
	display:inline;
	position:absolute;
	right:6px;
	top:10px;
	z-index:999;
	font-size:30px;
}
.nav-burger a {
	text-decoration:none;
}
.btn-open:after {
	color:#000099;
	content:"\2630";
	font-family:"Margarine";
	transition-property:all .2s linear 0s;
	-moz-transition:all .2s linear 0s;
	-webkit-transition:all .2s linear 0s;
	-o-transition:all .2s linear 0s;
}
.btn-open:hover:after {
	color:#10aaff;
}
.btn-close:after {
	color:#a8a7ac;
	content:"\00d7";
	font-family:"Margarine";
	font-size: 48px;
	transition-property:all .2s linear 0s;
	-moz-transition:all .2s linear 0s;
	-webkit-transition:all .2s linear 0s;
	-o-transition:all .2s linear 0s;
}
.btn-close:hover:after {
	color: #a8a7ac;
}
.navigation {
	display:none;
	position:fixed;
	top:6px;
	height:70%;
	width:100%;
	background:#666;
	overflow:auto;
	z-index:110;
	filter: alpha(opacity=60);
	-moz-opacity: 0.95;
 	opacity: 0.95;
    cursor: pointer;
}
.navigation table {
  height: 40%;
  width: 100%;
  margin-top: 20%;
}
.navigation tr {
  padding-top: 5%;
  height: 10%;
}
.navigation td {
  position: relative;
  height: 20%;
  width: 100%;
  padding: 0 20px;
  overflow: hidden;
  white-space: nowrap;
  font-size: 2em;
  -webkit-transition-property: right;
  -moz-transition-property: right;
  -o-transition-property: right;
  transition-property: right;
  -webkit-transition-duration: 0.5s;
  -moz-transition-duration: 0.5s;
  -o-transition-duration: 0.5s;
  transition-duration: 0.5s;
}
.navigation td.home a {
  background:#BDB76B;
  color:#eee;
}
.navigation td.zorg a {
  background:#cca;
  color:#009;
}
.navigation td a {
  font-size: 36px;
  font-weight: 50;
  font-style: normal;
  text-decoration: none;
  text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.3);
  padding: 4px 20px;
  display: block;
}

@media only screen and (max-width: 800px) {
    /* For mobile phones: */
	.navigation td a {font-size: 24px;}
	.overlay .closebtn {font-size:30px; top:5px; right:15px;}
}
@media screen and (max-height: 450px) {
	.overlay .closebtn {font-size:20px; top:5px; right:15px;}


