@charset "UTF-8";

/* Bootstrap Skitter Document */

/* FONTS */

@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i,800,800i');

/* DEFAULT */

* {text-shadow:none;}

html {-webkit-font-smoothing: antialiased;text-shadow: 1px 1px 1px rgba(0,0,0,0.004);}

body {color:#000; font-family: 'Open Sans', sans-serif!important; background-color:#1e5031;}

.ui-content img {max-width:100%;height:auto;}

ul {padding-left:16px;margin-top:0;}
ol {padding-left:16px;margin-top:0;}

p {font-weight:400; margin: 0 0 15px; line-height:1.4;font-size:18px!important;}

a {color:#1e5031;text-decoration:none;font-weight: 700;}

a:hover, a:focus, a:visited {color:inherit;text-decoration:none;font-style: inherit;}

hr {margin:10px 0!important;width:100%!important; border-top: 1px solid #000000;}

img {max-width:100%;height:auto; border-radius:5px;}

/* KOPPEN */

.head {
font-size: 45px;
line-height: 1.1;
font-weight: 900;
margin-top: 0px;
margin-bottom: 10px;
text-align: left;
color: #1e5031;
text-transform:none;
}

h2 {font-size:39px; 
    line-height: 1.1;
	margin-bottom:0px;
	margin-top:0px;
	font-weight:normal;
    text-align: left;
    color:#1e5031;
}

h3 {
line-height: 1.1;
font-size: 20px;
margin-top: 0px;
color: #8b1b6d;
font-weight: bold;
margin-bottom: 0px;
text-transform:uppercase;
}

ul.menu {
    display: block;
	padding-left:0;
	font-size:14px;
	margin:20px 0;
}
ul.menu li:first-child {width:25%;}
ul.menu li {
    display: inline-block;
    width: 25%;
    vertical-align: top;
    margin: 0 0px;
}

/*  PADDING MARGINS   */

.txt-circle {
  width: 260px;
  height: 260px;
  padding: 40px 30px 30px;
  border-radius: 50%;
  font-size: 24px;
  color: #fff;
  text-align: center;
  background: #36772f;
  border: solid 10px #fff;
  margin-top: -340px;
  margin-left: 20px;
  position: absolute;
  right: 20px;
}

.text-center {text-align: center!important;}
.margin-0 {margin-bottom:0px;}

/* PANELS */

.btn-pk {padding: 8px;
color: #fff!important;
font-size: 28px;
border-radius: 5px;
font-weight: normal;
background-color: #1e5031;
}

.btn:hover {color: #fff!important;}

.text-box {
  margin-left: 15%;
  margin-right: 15%;
  margin-top: -380px;
  padding: 20px;
  z-index: 200;
  position: relative;
}

.panel-body {
    border-radius: 10px;	
}


/* TXT KLEUREN OVERRIDE*/

.txt-groen {color:#1e5031;}
.txt-wit {color:#fff!important;}
.txt-zwart {color:#000000!important;}

/* BACKGROUND-KLEUREN OVERRIDE*/

.bg-roze, .bg-paars {border-radius:5px;}

.bg-wit  {background-color:#ffffff;}
.bg-zwart {background-color:#000000;}
.bg-blauw {background-color: #302683;margin-bottom: 15px;}
.bg-groen {background-color: #1e5031;margin-bottom: 15px;}

/* INHOUD */


.img-mousse {
  float: right;
  width: 110px;
  position: absolute;
  right: 110px;
  top: 60px;
  z-index: 20;
}

.logo-top {display: block;
margin-left: auto;
margin-right: auto;}

/* MEDIA QUERIES */


/* Desktop  */
@media only screen and (min-width: 960px) and (max-width: 1199px) {
	
}

/* Tablet  */
@media (max-width: 959px) and (min-width: 769px) {
    
}

/* Mobile Modes */
@media only screen and (max-width: 768px){

p {font-weight:400; margin: 0 0 15px; line-height:1.4;font-size:16px!important;}

.img-mousse {
  float: right;
  width: 80px;
  position: absolute;
  right: 6px;
  top: -10px;
}
    
.txt-circle {
  width: 180px;
  height: 180px;
  border-radius: 50%;
  font-size: 22px;
  color: #fff;
  text-align: center;
  background: #36772f;
  border: solid 6px #fff;
  margin-top: -290px;
  margin-left: 20px;
  position: absolute;
  right: 10px;
}

.btn-pk {font-size: 20px;color:#fff;background-color: #36772f;display: block ruby;}    
    
h1 {
    font-size: 22px!important;line-height: 1.2;
}

.border-groen {border: 2px solid #01a451;margin-bottom: -15px;}
.border-geel {border: 2px solid #fdc332;margin-bottom: 15px;margin-top: -40px;z-index: 100;position: relative;}

h2 {font-size:22px;margin-bottom:0px;}
    
h3 {font-size: 20px;}
    
.text-box {margin-left: 0%;
    margin-right: 0%;
    margin-top:15px;}    

.panel-body {
    border-radius: 5px;	
}

@media only screen and (max-width: 480px) {
	p {font-size:14px!important;}
	ul.menu li, ul.menu li:first-child {
		width: 48%;
		margin:1%;
	}
	ul.menu li img {
		width: 100%;
	}
	ul.menu li:first-child img {
		width: 80%;
	}
	.text-box {
        margin-left: 5%;
        margin-right: 5%;
        margin-top: -40px;
    }
    
  .txt-circle {
  width: 130px;
  height: 130px;
  border-radius: 50%;
  font-size: 12px;
  margin-top: -230px;
  margin-left: 20px;
  position: absolute;
  right: 10px;
  line-height: 1.2;
  padding: 25px 20px 30px !important;
}
    .img-mousse {
        top: -40px;
    }
	
}