/*
* Skeleton V1.2
* Copyright 2011, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 6/20/2012
*/


/* Table of Contents
==================================================
    #Base 960 Grid
    #Tablet (Portrait)
    #Mobile (Portrait)
    #Mobile (Landscape)
    #Clearing */



/* #Base 960 Grid
================================================== */

  
	#adresblokmobile { display:none; }
	#logomobiel { display:none; }
	.menu-blok { margin-bottom:50px; display:inherit; }
	.adresmobiel { display:none; }
	.menu-blok-mobiel { display: none; }

	.triocontainer, .duocontainer, .triocontainer2 { clear:both; width:715px; padding-bottom:30px; }

	.trioeerste 		{ border-left: 1px solid #cccce4; border-right:1px solid #cccce4; 	width:199px; float:left; padding:10px 10px 0px 20px; margin-right:10px; }	
	.trio 			{ border-right:1px solid #cccce4; 								  	width:209px; float:left; padding:10px 10px 0px 10px; margin-right:10px; } 
	.triolaatste	{ border-right:1px solid #cccce4; 							 	  	width:209px; float:left; padding:10px 10px 0px 10px;}

	.duoeerste 		{ border-right:1px solid #cccce4; 				width:337px; float:left; padding:10px 10px 0px 0px; margin-right:10px; }	
	.duolaatste		{ width:337px; float:right; padding:10px 10px 0px 0px;}

	.trioeerste2 	{ min-height:135px; background-color:#e6e7e8;			 	width:191px; float:left; padding:20px 20px 0px 20px; margin-right:10px; }
	.trio2 			{ min-height:135px; background-color:#e6e7e8;			  	width:191px; float:left; padding:20px 20px 0px 20px; margin-right:10px; } 
	.triolaatste2	{ min-height:135px; background-color:#e6e7e8;		 	  	width:191px; float:left; padding:20px 20px 0px 20px; }
#jeroenborst
{
font-size:15px;
background-image:url('/core/groenbg.png');
background-repeat:repeat;
padding:65px 35px 25px 35px;
font-weight:300;
-webkit-border-bottom-left-radius: 5px;
-moz-border-radius-bottomleft: 10px;
border-bottom-left-radius: 5px;
-webkit-border-bottom-right-radius: 5px;
-moz-border-radius-bottomright: 10px;
border-bottom-right-radius: 5px;
}
#jeroenborst p
{
margin-top:20px;
margin-bottom:20px;
}


/* #Tablet (Portrait)
================================================== */

    /* Note: Design for a width of 768px */

    @media only screen and (min-width: 768px) and (max-width: 959px) {

		.menu-blok { margin-bottom:50px; display:inherit; }
		#adresblokmobile { display:none; }
		#logomobiel { display:none; }		
		.adresmobiel { display:none; }
		.menu-blok-mobiel { display: none; }

	.triocontainer, .duocontainer, .triocontainer2 { clear:both; width:715px; padding-bottom:30px;}

	.trioeerste 		{ border-left: 1px solid #cccce4; border-right:1px solid #cccce4; 	width:199px; float:left; padding:10px 10px 0px 20px; margin-right:10px; }	
	.trio 			{ border-right:1px solid #cccce4; 								  	width:209px; float:left; padding:10px 10px 0px 10px; margin-right:10px; } 
	.triolaatste	{ border-right:1px solid #cccce4; 							 	  	width:209px; float:left; padding:10px 10px 0px 10px;}

	.duoeerste 		{ border-right:1px solid #cccce4; 				width:337px; float:left; padding:10px 10px 0px 0px; margin-right:10px; }	
	.duolaatste		{ width:337px; float:right; padding:10px 10px 0px 0px;}

	.trioeerste2 	{ min-height:135px; background-color:#e6e7e8;			 	width:191px; float:left; padding:20px 20px 0px 20px; margin-right:10px; }
	.trio2 			{ min-height:135px; background-color:#e6e7e8;			  	width:191px; float:left; padding:20px 20px 0px 20px; margin-right:10px; } 
	.triolaatste2	{ min-height:135px; background-color:#e6e7e8;		 	  	width:191px; float:left; padding:20px 20px 0px 20px; }
#jeroenborst
{
font-size:15px;
background-image:url('/core/groenbg.png');
background-repeat:repeat;
padding:65px 35px 25px 35px;
font-weight:300;
-webkit-border-bottom-left-radius: 5px;
-moz-border-radius-bottomleft: 10px;
border-bottom-left-radius: 5px;
-webkit-border-bottom-right-radius: 5px;
-moz-border-radius-bottomright: 10px;
border-bottom-right-radius: 5px;
}
#jeroenborst p
{
margin-top:20px;
margin-bottom:20px;
}

	
    }


/*  #Mobile (Portrait)
================================================== */

    /* Note: Design for a width of 320px */

    @media only screen and (max-width: 767px) {

		#capslider, #kader, #verborgen1, #verborgen2 { display:none; }
		#adresblokwide { display:none; }
		#adresblokmobile { display:block; }
		.adres { display:none; }
		.adresmobiel { display:inherit; }	
		#logo { display:none; }		
		#logomobiel {display:block; margin-bottom:15px;}
		#logomobiel img { height: auto; max-width: 300px; margin-top:5px; }
		.menu-blok-mobiel { display: inherit; }
		.menu-blok { display: none; }
		.trio { border:0px; float:none; width:300px; padding:5px; } 
		.trioeerste, .duoeerste { border:0px; float:none; width:300px; padding:5px; }
		.triolaatste, .duolaatste { border:0px; float:none; width:300px; padding:5px; }	
		.triocontainer, .duocontainer { width:310px; }

#jeroenborst
{
font-size:15px;
background-image:url('/core/groenbg.png');
background-repeat:repeat;
padding:65px 15px 25px 15px;
font-weight:300;
-webkit-border-bottom-left-radius: 5px;
-moz-border-radius-bottomleft: 10px;
border-bottom-left-radius: 5px;
-webkit-border-bottom-right-radius: 5px;
-moz-border-radius-bottomright: 10px;
border-bottom-right-radius: 5px;
}
#jeroenborst p
{
margin-top:20px;
margin-bottom:20px;
}

		
 }


/* #Mobile (Landscape)
================================================== */

    /* Note: Design for a width of 480px */

    @media only screen and (min-width: 480px) and (max-width: 767px) {

		
		#capslider, #kader, #verborgen1, #verborgen2 { display:none; }
		#menu-blok { margin-bottom:10px; }
		#adresblokwide { display:none; }
		#adresblokmobile { display:block; }
		#logo { display:none; }		
		#logomobiel {display:block; margin-bottom:15px;}
		#logomobiel img {  height: auto; max-width: 300px; margin-top:5px; }
		.adres { display:none; }		
		.adresmobiel { display:inherit; }	
		.menu-blok-mobiel { display: inherit; }
		.menu-blok { display: none; }
		.trio { border:0px; float:none; width:420px; padding:5px; } 
		.trioeerste, .duaeerste { border:0px; float:none; width:420px; padding:5px; }
		.triolaatste, .duolaatste { border:0px; float:none; width:420px; padding:5px; }		
		.triocontainer, .duocontainer { width:410px;}
#jeroenborst
{
font-size:15px;
background-image:url('/core/groenbg.png');
background-repeat:repeat;
padding:65px 15px 25px 15px;
font-weight:300;
-webkit-border-bottom-left-radius: 5px;
-moz-border-radius-bottomleft: 10px;
border-bottom-left-radius: 5px;
-webkit-border-bottom-right-radius: 5px;
-moz-border-radius-bottomright: 10px;
border-bottom-right-radius: 5px;
}
#jeroenborst p
{
margin-top:20px;
margin-bottom:20px;
}


		}

/* #Clearing
================================================== */

    /* Self Clearing Goodness */
    .container:after { content: "\0020"; display: block; height: 0; clear: both; visibility: hidden; }

    /* Use clearfix class on parent to clear nested columns,
    or wrap each row of columns in a <div class="row"> */
    .clearfix:before,
    .clearfix:after,
    .row:before,
    .row:after {
      content: '\0020';
      display: block;
      overflow: hidden;
      visibility: hidden;
      width: 0;
      height: 0; }
    .row:after,
    .clearfix:after {
      clear: both; }
    .row,
    .clearfix {
      zoom: 1; }

    /* You can also use a <br class="clear" /> to clear columns */
    .clear {
      clear: both;
      display: block;
      overflow: hidden;
      visibility: hidden;
      width: 0;
      height: 0;
    }
