@CHARSET "ISO-8859-1";
/* Reset CSS
 * --------------------------------------- */
body,div,dl,dt,dd,ol,li,h1,h2,h3,h4,h5,h6,pre,
form,fieldset,input,textarea,p,blockquote,th,td {
    padding: 0;
    margin: 0;
}
a{
	text-decoration:none;
	color:#0091FF;
}
table {
    border-spacing: 0;
}
fieldset,img {
    border: 0;
}
address,caption,cite,code,dfn,em,strong,th,var {
    font-weight: normal;
    font-style: normal;
}
strong{
	font-weight: bold;
}

caption,th {
    text-align: left;

}
h1,h2,h3,h4,h5,h6 {
    font-weight: normal;
    font-size: 100%;
    margin:0;
    padding:0;
    color:#444;
}
q:before,q:after {
    content:'';
}
abbr,acronym { border: 0;
}


/* Custom CSS
 * --------------------------------------- */
body{
	font-family: arial,helvetica;
	color: #fff;
	background-color: rgb(10, 21, 72);
}
#bg{
	position:absolute; 
	height:1200px; 
	width:1200px; 
	top:50vh; 
	opacity: 20%; 
	margin-left:-600px; 
	left:50vw; 
	margin-top:-600px; 
	color:white; 
	background-image: url('imgs/Asset 12.svg'); 
	background-repeat:no-repeat;
	
}

	
	h1{
		font-size: 4em;
		font-family: 'Roboto', sans-serif;
		font-weight:700;
		text-align: left;
		color: #fff;
		margin:0;
		padding:40px 0 0 0;
	}
	.intro p{
		color: #fff;
		padding:40px 0 0 0;
	}
	
.citaat{
	font-size:1.1em;
	font-style: italic;
	margin-left:50px;
	color:aquamarine;
	text-align: left;
	font-family: 'Raleway', sans-serif;
		}
.name{
	float:right; margin-right:100px;opacity:0.5;
}

.schoolztoolskop{
		margin:0 auto;  width:700px; 
}

.statementtext{
	float:left; margin-left:10px; padding-top:5px; color:rgba(0,44,120,1);font-size:1.3em;
}
.greytext{
	color:#CBCBCB; text-align: left; font-size: 1.3em;
}
.blauwkop{
	color:#0091FF; text-align: left;font-size: 1.3em;margin-top:15px;
}
.list{
	color:#CBCBCB; margin-top:20px; text-align: left;font-size: 1.1em;
}
.pg1, .pg4{	margin-top:-120px;}
.pg2, .pg3{	margin-top:-80px;}

.gtp1{	margin-top:60px;}
.gtp2{	margin-top:20px;}
.gtp3{	margin-top:20px;}
.gtp4{	margin-top:30px;}

/*tablet portrait*/

@media  (min-width: 768px)   and (max-width: 1024px) and (orientation:portrait){
	
.schoolztoolskop{width:75%;}
#bg{display:none;}
.pg1{	margin-top:-175px;}
.pg2{	margin-top:-165px;}
.pg3{	margin-top:-185px;}
.pg4{	margin-top:-260px;}
	
.gtp1{	margin-top:25px;}
.gtp2{	margin-top:10px;}
.gtp3{	margin-top:10px;}
.gtp4{	margin-top:15px;}
	
	
	
	
}
/*tablet landscape*/
@media (min-width: 768px)   and (max-width: 1024px) and (orientation:landscape) {
	
	#bg{display:none;}
	.schoolztoolskop{  width:80%;}
	.pg1{	margin-top:-40px;}
	.pg3{	margin-top:-100px;}
	.pg4{margin-top:-160px;}
	
}
/*phone landscape*/
@media (min-width: 481px)   and (max-width: 767px) and (orientation:landscape)  {
	#bg{display:none;}
	
.schoolztoolskop{width:85%; }
.statementtext{	float:left; margin-left:10px; padding-top:5px; color:rgba(0,44,120,1);font-size:1em;}
.greytext{	color:#CBCBCB; text-align: left; font-size: 1em;}
.blauwkop{	color:#0091FF; text-align: left;font-size: 1em;margin-top:15px;}
.list{	color:#CBCBCB; margin-top:20px; text-align: left;font-size: .9em;}
h1{
		font-size: 2em;
		font-family: 'Roboto', sans-serif;
		font-weight:700;
		text-align: left;
		color: #fff;
		margin:0;
		padding:0;
}
	
.pg1{	margin-top:-15px;}
.pg2{	margin-top:0px;}
.pg3{	margin-top:0px;}
.pg4{	margin-top:-50px;}
	
.gtp1{	margin-top:25px;}
.gtp2{	margin-top:10px;}
.gtp3{	margin-top:10px;}
.gtp4{	margin-top:15px;}
	
	.fp-controlArrow.fp-prev {
		top:90%;
     /*border-width: 38.5px 34px 38.5px 0;*/
	 border-width: 20px  20px 20px 0;
   
}
.fp-controlArrow.fp-next {
	top:90%;
      border-width: 20px 0 20px 20px;
   
}
	.citaat{
		float:left;
	font-size:.8em;
	font-style: italic;
	margin-left:0px;
	color:aquamarine;
	text-align: left;
	font-family: 'Raleway', sans-serif;
		}
.name{
	float:right; margin-right:0;opacity:0.5; font-size: .8em;
}
	
}
/*phone*/
@media only screen and (max-width:480px) {
	#bg{
		position:absolute; 
	height:200px; 
	width:200px; 
	top:50%; 
	opacity: 20%; 
	margin-left:-100px; 
	left:50%; 
	margin-top:-100px; 
	color:white; 
	background-image: url('imgs/Asset 12.svg'); 
	background-repeat:no-repeat;
		display:none;
	}
	
	.schoolztoolskop{
		  width:95%; 
}

.statementtext{
	float:left; margin-left:10px; padding-top:5px; color:rgba(0,44,120,1);font-size:1em;
}
.greytext{
	color:#CBCBCB; text-align: left; font-size: 1em;
}
.blauwkop{
	color:#0091FF; text-align: left;font-size: 1em;margin-top:15px;
}
.list{
	color:#CBCBCB; margin-top:20px; text-align: left;font-size: .9em;
}
	h1{
		font-size: 2em;
		font-family: 'Roboto', sans-serif;
		font-weight:700;
		text-align: left;
		color: #fff;
		margin:0;
		padding:0;
	}
	
.pg1{	margin-top:-65px;}
.pg2{	margin-top:-80px;}
.pg3{	margin-top:-105px;}
.pg4{	margin-top:-120px;}
	
.gtp1{	margin-top:30px;}
.gtp2{	margin-top:20px;}
.gtp3{	margin-top:20px;}
.gtp4{	margin-top:30px;}
	
	.fp-controlArrow.fp-prev {
		top:90%;
    left: 15px;
    width: 0;
    /*border-width: 38.5px 34px 38.5px 0;*/
	 border-width: 20px  20px 20px 0;
    border-color: transparent #efefef transparent transparent;
}
.fp-controlArrow.fp-next {
	top:90%;
    right: 15px;
    border-width: 20px 0 20px 20px;
    border-color: transparent transparent transparent #efefef;
}
	.citaat{
	font-size:.8em;
	font-style: italic;
	margin-left:0px;
	color:aquamarine;
	text-align: left;
	font-family: 'Raleway', sans-serif;
		}
.name{
	float:right; margin-right:0;opacity:0.5; font-size: .8em;
}
}



