@charset "utf-8";
/* CSS Document */
@import url('https://fonts.googleapis.com/css2?family=Lato:wght@400;700&display=swap');


/* ============================================================	*/ 
/* ========	UNDO CODES		  	===============================	*/
/* ============================================================	*/ 

a { text-decoration:none }
ul, ul li { list-style:none;}
h1,h2,h3,h4,h5,h6 { font-size:12px;margin-bottom:10px; }
body,html,h1,h2,h3,h4,h5,h6,form,p,blockquote,fieldset,input {margin:0; padding:0;}
a img, a:visited img { border:none }
address { font-style:normal }

/* ============================================================	*/ 
/* ========	HTML STANDAARDEN  	===============================	*/
/* ============================================================	*/ 

html {
	height:100%;
	width:100%;
	overflow-y: scroll; 
	box-sizing: border-box;
	}
*, *:before, *:after {
  box-sizing: inherit;
}
body {
	margin:0 0 0 0;
	width:100%;
	height:100%;
	text-align:center;
	font-size:14px;
	background-color:#f5f5f5;
	}
body, table, th, td, p, li, input, textarea, select {font-family: 'Lato', 'Arial';line-height:1.4;}	
figure {display:block;padding:0;margin:0;}
a 		{}
a:hover {}

p 		{margin-bottom:10px;}


header {
	margin-bottom:30px;
	text-align:center;
	background-color:#a1cf2e;
	border-top:25px solid #fff;
	-webkit-box-shadow: 0 0 20px 0 rgba(0,0,0,.7);
		box-shadow: 0 0 20px 0 rgba(0,0,0,.7);
}
header .logo {padding:3px;}
header .gradient { 
	padding:3px 0;
background: -webkit-linear-gradient(left, rgba(102,102,102,1) 0%, rgba(216,216,216,1) 40%, rgba(216,216,216,1) 50%, rgba(102,102,102,1) 100%);
background: linear-gradient(to right, rgba(102,102,102,1) 0%, rgba(216,216,216,1) 40%, rgba(216,216,216,1) 50%, rgba(102,102,102,1) 100%); 
}
header .gradient  .txt {
	padding:8px;background-color:#fff;
}
.wrapper{overflow:hidden; max-width: 990px;height:90%;margin: 0 auto;text-align: left;box-shadow:0 0 20px 2px rgba(0,0,0,.5);}

nav {position:absolute;
	left:0;
	top:0;
	bottom:0;
	width:200px;height:100%;background:rgba(0,0,0,.05);border-top-right-radius: 20px;
padding: 20px 0 0 0;}
nav ul {overflow:hidden;margin-left:-10px;margin-bottom:10px;}
nav li {margin-right:20px;}
nav a,
nav h3 {color:#333;margin-bottom:15px;padding-left:20px;}
nav h3 a {padding-left:0;}
nav .shadow {
	display:block;
	margin-bottom:8px;
	border:2px solid #fff;
	border-left:0;
	padding:6px 6px 6px 30px;
	font-size:12px;
	color:#333;
	background: -webkit-linear-gradient(left, rgba(220,220,220,1) 0%, rgba(255,255,255,1) 100%);
	background: -o-linear-gradient(left, rgba(220,220,220,1) 0%, rgba(255,255,255,1) 100%);
	background: linear-gradient(to right, rgba(220,220,220,1) 0%, rgba(255,255,255,1) 100%);
	-webkit-box-shadow: -10px 3px 5px 0 rgba(0,0,0,.5);
	box-shadow: -10px 3px 5px 0 rgba(0,0,0,.5);
}
nav .shadow:hover {
	box-shadow: none;
}


.main {
	position: relative;
	padding:10px;
	height:100%;
}
h2 {font-size:20px;margin-bottom:1em;font-weight:normal;color:#a1cf2e;font-family: 'Lato', 'Arial';}
h3 {font-size:20px;margin-bottom:1em;font-weight:normal;color:#a1cf2e;font-family: 'Lato', 'Arial';}
h4 {font-size:18px;margin-bottom:1em;font-weight:normal;color:#a1cf2e;font-family: 'Lato', 'Arial';}
p {
	font-family: 'Lato', 'Arial';
	font-size: 14px;
	font-weight: 400;
}
ul {margin:0 0 20px 0;padding:0;}
li {margin:0;padding:0;}


.content {
	background-color:#fff;
	padding:20px;
	border-radius:4px;
	width:calc(100% - 250px);
	margin-left:230px;
	-webkit-box-shadow: 0 5px 10px 0 rgba(0,0,0,.5);
	box-shadow: 0 5px 10px 0 rgba(0,0,0,.5);
}
.content li {position:relative;margin-left:10px;}
.content li:before {content:'- ';position:absolute;top:0;left:-10px;}

footer {background-color:#455560;color:#fff;}
footer .max-width {padding:20px;max-width: 990px;margin: 0 auto;text-align: left;display:flex;}
footer .col {width: 33.333%;display:inline-block;padding:10px;}
footer a {color:#fff;text-decoration: underline;}
footer figure img {width:100%;max-width:90%;display:block;}