/*###########################################################\
#                                                            # 
#  Stylesheet behorende bij http://www.facilities.jamick.nl  #
#                                                            #
#                        !!ALGEMEEN!!                        #
#                                                            #
\###########################################################*/

/* reset */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4,
h5, h6, p, pre, a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike,
strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol,
ul, li, fieldset, form, label, legend, table, caption, tbody,
tfoot, thead, tr, th, td { 
margin:0;
padding:0;
}
*{
	box-sizing:border-box;
	font-family:arial;
	font-size:11px;
}
h1, h2, h3{	
	margin:15px 0;
	font-family:bankgothic, arial;
}
h1{
	font-size:80px;
}
h2{
	font-size:21px;
}
h3{
	font-size:16px;
}
.name{
	font-size:75px;
	color:#d9d9d9;
}
/* instellingen header */
.row-slogan{
	width:100%;
	height:65px;
	background-color:#F55E52;
	text-align:center;
}
#logo-l, #logo-r{
	display:none;
}
#logo-bl img{
	width:25%;
	margin-top:10px;
	margin-bottom:-20px;
}
#slogan-img img{
	width:100%;
}
/* einde header */
.item{
	width:400px;
	color:#fff;
	padding-top:15px;
}
#wide1, #wide2{
	display:none;
}
/* instellingen footer */
footer{
	width:100%;
	background-color:#333;
	display:none;
}
#footer{
	padding:25px;
}
#one, #two, #three {
	width:60%;
}
/* einde instellingen footer */
/*************************** Fluid grid ************************************/
/************************* Voor smartphones ********************************/
.col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12 {
	width:100%;
	/*border:1px dotted grey;*/
}
/*************************Voor tablets: ************************************/
@media only screen and (min-width: 600px){
	*{
		font-size:12px;
	}
	h1{
		font-size:100px;
	}
	h2{
		font-size:30px;
	}
	h3{
		font-size:25px;
	}
	/* instellingen header */
	.row-slogan{
		height:75px;
	}
	#logo-l, #logo-r{
		display:block;
		height:73px;		
	}
	#logo-l img, #logo-r img{
		height:73px;
		margin-top:-15px;
		margin-left:-35px;
	}
	#logo-r img{
		float:right;
		margin-right:-15px;
	}
	#slogan-img img{
	}
	#logo-bl{
		display:none;
	}
	/* einde instellingen header */	
	/* instellingen social buttons */
	.social-bar{
		margin-left:-60px;
		margin-top:25px;
		transition: margin-left 1s;
	}
	.social-bar:hover{
		margin-left:-20px;
	}
	.button img{
		width:50px;
		border-radius:5px;
	}
	#punaise{
		position:absolute;
		margin-top:25px;
		margin-left:-15px;
		z-index:-1;
	}
	#wide1, #wide2{
		display:block;		
	}
	/* einde social buttons */
	#slider{
		margin-top:75px;
	}
	footer{		
		clear: both;
		position:fixed;
		bottom:0;
		display:flex;
		justify-content:space-around;
	}
	#one, #two, #three {
		margin:0px;
		padding:10px;
		width:40%;
		display:block;
		margin-left:auto;
		margin-right:auto;
	}	
	.col-tab-1 {width: 8.33%;}
	.col-tab-2 {width: 16.66%;}
	.col-tab-3 {width: 25%;}
	.col-tab-4 {width: 33.33%;}
	.col-tab-5 {width: 41.66%;}
	.col-tab-6 {width: 50%;}
	.col-tab-7 {width: 58.33%;}
	.col-tab-8 {width: 66.66%;}
	.col-tab-9 {width: 75%;}
	.col-tab-10 {width: 83.33%;}
	.col-tab-11 {width: 91.66%;}
	.col-tab-12 {width: 100%;}
}
.row {
}
.row::after {
content: "";
clear: both;
display: block;
}
.col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12 {
float: left;
padding:15px;
position:relative;
}
/************************ Voor desktops ************************************/
@media only screen and (min-width: 992px){
		
	*{
		font-size:14px;
	}
	h1{
		font-size:150px;
	}
	h2{
		font-size:40px;
	}
	h3{
		font-size:25px;
	}
	.row-slogan{
		height:100px;
	}
	#slogan-img img{
		width:100%;
		margin-bottom:-10px;
	}
	#logo-l img, #logo-r img{
		height:100px;
	}
	#logo-l img{
		float:left;
		margin-left:-15px;
	}
	#one, #two, #three {
		width:20%;
	}
	.name{
		font-size:150px;
		margin-top:-15px;
	}
	article{
		margin-top:0px;
	}
	.col-1 {width: 8.33%;}
	.col-2 {width: 16.66%;}
	.col-3 {width: 25%;}
	.col-4 {width: 33.33%;}
	.col-5 {width: 41.66%;}
	.col-6 {width: 50%;}
	.col-7 {width: 58.33%;}
	.col-8 {width: 66.66%;}
	.col-9 {width: 75%;}
	.col-10 {width: 83.33%;}
	.col-11 {width: 91.66%;}
	.col-12 {width: 100%;}
}
/*************************Einde fluid grid ********************************/