
@font-face {
    font-family: 'lemonmilk-bold';
    src: url('../fonts/lemonmilk-bold-webfont.woff2') format('woff2'),
         url('../fonts/lemonmilk-bold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'lemonmilk-regular';
    src: url('../fonts/lemonmilk-regular-webfont.woff2') format('woff2'),
         url('../fonts/lemonmilk-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;}

@font-face {
    font-family: 'gidole-regular';
    src: url('../fonts/gidole-regular-webfont.woff2') format('woff2'),
         url('../fonts/gidole-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;}



.container{width: 978px;
	margin-left:auto;
	margin-right:auto;
	font-family: 'lemonmilk-bold';}

.clearfix:after {
   content: "";
   display: table;
   clear: both;
}




.billboard{
	background-color: #000;}

.about{background-color: #fff;}


.dropDown{margin-left: auto;
		margin-right: auto;
	}

.feature{background-color: #000;
clear: both;}

 header{
	background-color: #000;
	position: fixed;
	left: 0px;
	top:0px;
	width:100%;}

.title{color:#a8a8a8;}

nav a{color:  #a8a8a8;
		text-decoration:none;
	
	opacity:1;
		-webkit-transition: opacity 1500ms, color 1500ms;
		-moz-transition: opacity 1500ms, color 1500ms;
		-o-transition: opacity 1500ms, color 1500ms;
		transition: opacity 1500ms, color 1500ms;}


nav a:hover{ color: #fff;

		  opacity:1;
		  -webkit-transition: opacity 250ms, color 250ms;
		  -moz-transition: opacity 250ms, color 250ms;
		  -o-transition: opacity 250ms, color 250ms;
		  transition: opacity 250ms, color 250ms;}


header h1{
	font-family: lemonmilk-bold;
	float:left;
	color: #fff;}

h2{font-family: lemonmilk-bold;
color:#000;
font-size: 36px;}

p{font-family: gidole-regular;}


.bigYellowBox{background-color: #f9b85f;}

.smallBlueBox{background-color: #1d3362;}

.smallRedBox{background-color: #f15851;}

.largeWhiteBox{background-color: #ebe3de;}

.smallYellowBox{background-color: #f9b85f;}

.largeBlueBox{background-color:#1d3362;}

.longRedBox{background-color: #f15851;}

.smallWhiteBox{background-color: #ebe3de;}

.largeRedBox{background-color: #f15851;}

.mediumBlueBox{background-color: #1d3362;}

.mediumYellowBox{background-color: #f9b85f;}

.mediumWhiteBox{background-color: #ebe3de;}




.red:hover{ background-color: #f15851;

  opacity:1;
  -webkit-transition: opacity 250ms, color 250ms;
  -moz-transition: opacity 250ms, color 250ms;
  -o-transition: opacity 250ms, color 250ms;
  transition: opacity 250ms, color 250ms;}

 .yellow:hover{ background-color: #f9b85f;

  opacity:1;
  -webkit-transition: opacity 250ms, color 250ms;
  -moz-transition: opacity 250ms, color 250ms;
  -o-transition: opacity 250ms, color 250ms;
  transition: opacity 250ms, color 250ms;}

.blue:hover{ background-color: #1d3362;

  opacity:1;
  -webkit-transition: opacity 250ms, color 250ms;
  -moz-transition: opacity 250ms, color 250ms;
  -o-transition: opacity 250ms, color 250ms;
  transition: opacity 250ms, color 250ms;}





.artist a{text-decoration:none;
  color:#000;

  opacity:1;
  -webkit-transition: opacity 1500ms, color 1500ms;
  -moz-transition: opacity 1500ms, color 1500ms;
  -o-transition: opacity 1500ms, color 1500ms;
  transition: opacity 1500ms, color 1500ms;}

.artist a:hover{ color: #a8a8a8;

  opacity:1;
  -webkit-transition: opacity 250ms, color 250ms;
  -moz-transition: opacity 250ms, color 250ms;
  -o-transition: opacity 250ms, color 250ms;
  transition: opacity 250ms, color 250ms;}




  .galleryImage{
	opacity: 1;
  -webkit-transition: opacity 1000ms, color 1000ms;
  -moz-transition: opacity 1000ms, color 1000ms;
  -o-transition: opacity 1000ms, color 1000ms;
  transition: opacity 1000ms, color 1000ms;}
.galleryImage:hover{
	opacity:.5;
  -webkit-transition: opacity 1000ms, color 1000ms;
  -moz-transition: opacity 1000ms, color 1000ms;
  -o-transition: opacity 1000ms, color 1000ms;
  transition: opacity 1000ms, color 1000ms;}

  .galleryImageMobile{
	opacity: 1;
  -webkit-transition: opacity 1000ms, color 1000ms;
  -moz-transition: opacity 1000ms, color 1000ms;
  -o-transition: opacity 1000ms, color 1000ms;
  transition: opacity 1000ms, color 1000ms;}

  .galleryImageMobile:hover{
	opacity: .5;
  -webkit-transition: opacity 1000ms, color 1000ms;
  -moz-transition: opacity 1000ms, color 1000ms;
  -o-transition: opacity 1000ms, color 1000ms;
  transition: opacity 1000ms, color 1000ms;}






.footer{clear: both;
background-color: #000;
/*height: 300px;*/}

.footer h4{color: #a8a8a8;
margin-bottom: 15px;}

.footer li{font-family: gidole-regular;
font-size: 12px;
line-height: 20px;}

li a{text-decoration:none;
  color:#a8a8a8;

  opacity:1;
  -webkit-transition: opacity 1500ms, color 1500ms;
  -moz-transition: opacity 1500ms, color 1500ms;
  -o-transition: opacity 1500ms, color 1500ms;
  transition: opacity 1500ms, color 1500ms;}

li a:hover{ color: #fff;

  opacity:1;
  -webkit-transition: opacity 250ms, color 250ms;
  -moz-transition: opacity 250ms, color 250ms;
  -o-transition: opacity 250ms, color 250ms;
  transition: opacity 250ms, color 250ms;}



/* MOBILE STYLES ////////////////////////////////////////////////////////////////////////////////////////////////*/
@media only screen and (max-width: 767px){
	body{
		padding-top:40px;
	}

	.container{
		width:87.5%; /* 280 pixels at a 320 pixel screen width (iPhone 3 / 4 / 5) */
	}

header{
		height: 40px;
	}

	header a{
		text-decoration: none;
		font-size: 16px;
		line-height: 40px;
	}

	nav{
		display: none;
		position: absolute;
		top:40px;
		left:0px;
		width:100%;
		background-color: rgba(0,0,0,.5)
	}

	nav a{
		font-size: 12px;
		display: block;
		height:40px;
		background-color: rgba(0,0,0,.25);
		border-bottom: 1px solid black;
		text-align: center;
		line-height: 40px;}


	.navButton{background-image:url(../images/Nav_Square.png);
		display: block;
		position: absolute;
		top:0px;
		right:0px;
		width:40px;
		height:40px;
		margin-bottom: 5px;}







.billboard{
	background-color: #000;
	/*margin-bottom: 35.7142857142857%;*/}

.headerPartTwo{display: none;}

.headerPartOne{
padding-top: 04.1666666666667%;}
.bigYellowBox{padding-top: 44.6428571428571%;
width: 100%;
margin-bottom: 7.1428571428571%}

.smallBlueBox{padding-top: 26.0714285714286%;
width: 19.6428571428571%;
margin-bottom: 7.1428571428571%;
float: left;}

.smallRedBox{clear: both;
padding-top: 43.5714285714286%;
width: 19.6428571428571%;
float: left;}

.largeWhiteBox{padding-top: 59.2857142857143%;
width: 73.2142857142857%;
margin-left: 26.7857142857143%;
margin-bottom: 7.1428571428571%;
}

.smallYellowBox{padding-top: 10.3571428571429%;
width: 73.2142857142857%;
margin-left: 26.7857142857143%;
margin-bottom: 7.1428571428571%}







.dropDown{margin-left: auto;
	margin-right: auto;
}

.dropDown h2{margin-bottom: 7.1428571428571%;
padding-top:21.4285714285714%;}


.titleArea{
	height:90px;
	background-color:#000;
	margin-bottom: 20px;
	/*border-top: 5px solid black;*/
}

.titleArea h1{font-size: 12px;
	float:left;
	padding-top: 40px;
	color: #fff;
	margin-left: 20px;
}

.arrow{margin-right: 30px;
	width:30px;
	height:30px;
	background-color:#fff;
	display:block;
	float:right;
	padding-top: 30px;
	background-clip: content-box;
	transition: 0.3s;
}


#content1{margin-bottom: 54px;
	/*background-color:#0000FF;*/
}

#content1 p{margin-left: 20px;
	font-size: 14px;
margin-bottom: 10px;
width:280px;
}

#content2 {margin-bottom: 54px;
	background-color:/*#000*/;

}

#content2 h3{margin-left: 20px;
	font-size: 20px;
	padding-top: 20px;
margin-bottom: 10px;}

#content2 p{
	font-size: 14px;
width:280px;
margin-left: 20px;
margin-bottom: 10px;}


#content3{margin-bottom: 54px;
	/*background-color:#FF0000;*/
}

#content3 p{margin-left: 20px;
	font-size: 14px;
margin-bottom: 10px;
width:280px;
/*margin-left: 30px;*/}






.artists h2{padding-top: 21.4285714285714%;
margin-bottom: 7.1428571428571%;
float: left;}

.artist a{margin-bottom: 35.7142857142857%;}

.artists p{font-family: 'lemonmilk-regular';
	font-size: 14px;
padding-top: 5px;}

.artistImage{
	display: block;
	width:46.4285714285714%;
	padding-top:46.4285714285714%;
	background-color: #ccc;
	margin-bottom: 19.6428571428571%;
/*	margin-right: 7.1428571428571%;
	margin-left: 7.1428571428571%;*/

}

.artist a:hover{opacity: .5;
  -webkit-transition: opacity 1000ms, color 1000ms;
  -moz-transition: opacity 1000ms, color 1000ms;
  -o-transition: opacity 1000ms, color 1000ms;
  transition: opacity 1000ms, color 1000ms;
}

.artist{float: left;
width: 100%;}



.first{background-image:url(../images/mobile/Theo_van_Doesburg_tn.jpg);
	float: left;
box-shadow: 5px 10px 18px #888888;
background-size: 100%;
margin-right: 7.1428571428571%;
opacity: 1;
  -webkit-transition: opacity 1000ms, color 1000ms;
  -moz-transition: opacity 1000ms, color 1000ms;
  -o-transition: opacity 1000ms, color 1000ms;
  transition: opacity 1000ms, color 1000ms;}

.second{background-image:url(../images/mobile/Piet_Mondrian_tn.jpg); 
	float: right;
box-shadow: 5px 10px 18px #888888;
background-size: 100%;
margin-left: 7.1428571428571%;

opacity: 1;
  -webkit-transition: opacity 1000ms, color 1000ms;
  -moz-transition: opacity 1000ms, color 1000ms;
  -o-transition: opacity 1000ms, color 1000ms;
  transition: opacity 1000ms, color 1000ms;}

.third{background-image:url(../images/mobile/Bart_van_der_Leck_tn.jpg);
float: left; 
box-shadow: 5px 10px 18px #888888;
background-size: 100%;
margin-right: 7.1428571428571%;

opacity: 1;
  -webkit-transition: opacity 1000ms, color 1000ms;
  -moz-transition: opacity 1000ms, color 1000ms;
  -o-transition: opacity 1000ms, color 1000ms;
  transition: opacity 1000ms, color 1000ms;}

.fourth{background-image:url(../images/mobile/Friedrich_Vordemberge_Gildewart_tn.jpg);
float: right; 
margin-right: 0px;
box-shadow: 5px 10px 18px #888888;
background-size: 100%;
margin-left: 7.1428571428571%;

opacity: 1;
  -webkit-transition: opacity 1000ms, color 1000ms;
  -moz-transition: opacity 1000ms, color 1000ms;
  -o-transition: opacity 1000ms, color 1000ms;
  transition: opacity 1000ms, color 1000ms;
}

.name {padding-top: 19.6428571428571%;}





.feature p{font-family: 'lemonmilk-regular';
	font-size: 24px;
color: #fff;
text-align: center;
margin-bottom: 7.1428571428571%;}
.feature h3{color: #fff;
text-align: center;
font-family: gidole-regular;
padding-bottom: 19.6428571428571%;}

.featureAreaGraphic{width: 50%;
margin-left: auto;
margin-right: auto;
padding-top: 19.6428571428571%;
margin-bottom: 19.6428571428571%;}



.gallery h2{padding-top: 21.4285714285714%;
margin-bottom: 7.1428571428571%;}
.galleryPartTwo {display: none;}
.galleryImageMobile{display: block;
}

.galleryImage{display: block;}


.imageOne{background-image:url(../images/mobile/Composition_with_Grid_1_tn.jpg);
padding-top: 45%;
width: 100%;
margin-bottom: 7.1428571428571%;
box-shadow: 5px 10px 18px #888888;
background-size: 100%;
}

.imageTwo{background-image:url(../images/mobile/Red_and_Blue_Chair_tn.jpg);
padding-top: 26.0714285714286%;
width: 35.7142857142857%;
background-color: #1d3362;
margin-bottom: 7.1428571428571%;
float: left;
box-shadow: 5px 10px 18px #888888; 
background-size: 100%;}

.imageThree{background-image:url(../images/mobile/Composition_in_Gray_tn.jpg);
	clear: both;
padding-top: 43.9285714285714%;
width: 35.7142857142857%;
background-color: #f15851;
float: left;
box-shadow: 5px 10px 18px #888888;
background-size: 100%;}

.imageFour{background-image:url(../images/mobile/Composition_in_colour_A_tn.jpg);
	padding-top: 59.2857142857143%;
width: 56.7857142857143%;
background-color: #ebe3de;
margin-left: 42.8571428571429%;
margin-bottom: 7.1428571428571%;
box-shadow: 5px 10px 18px #888888;
background-size: 100%;}

.imageFive{background-image:url(../images/mobile/Rastercompositie_9_tn.jpg);
	padding-top: 10.7142857142857%;
width: 56.7857142857143%;
background-color: #f9b85f;
margin-left: 42.8571428571429%;
margin-bottom: 7.1428571428571%;
box-shadow: 5px 10px 18px #888888;
background-size: 100%;}

.imageSixMobile{background-image:url(../images/mobile/Composition_with_Female_Figure_tn.jpg);
padding-top: 70.7142857142857%;
width:39.2857142857143%;
background-color:#1d3362;
float: left;
margin-bottom: 7.1428571428571%;
margin-right: 0px;
box-shadow: 5px 10px 18px #888888;
background-size: 100%;}

.imageSevenMobile{background-image:url(../images/mobile/Composition_No4_tn.jpg);
	padding-top: 30.7142857142857%;
width: 100%;
background-color: #f15851;
float: right;
margin-left: 7.1428571428571%;
margin-bottom: 7.1428571428571%;
margin-right: 0px;box-shadow: 5px 10px 18px #888888;
background-size: 100%;}

.imageNineMobile{background-image:url(../images/mobile/Hotel_Particulier_tn.jpg);
	padding-top: 38.5714285714286%;
width: 53.571428571428%;
background-color: #ebe3de;
float: left;
margin-left: 7.1428571428571%;
box-shadow: 5px 10px 18px #888888;
background-size: 100%;
margin-bottom: 21.4285714285714%;}


.imageEightMobile{ background-image:url(../images/mobile/Compositie_tn.jpg);
	padding-top: 23.2142857142857%;
width: 53.5714285714286%;
background-color: #1d3362;
clear: right;
float: right;
margin-right: 0px; 
margin-bottom: 7.1428571428571%;
box-shadow: 5px 10px 18px #888888;
background-size: 100%;}

.imageTwelveMobile{background-image:url(../images/mobile/Composition_B_tn.jpg);
	padding-top: 12.8571428571429%;
width: 53.571428571428%;
background-color: #ebe3de;

float: left;
margin-right: 0px;
margin-left: 7.1428571428571%; 
box-shadow: 5px 10px 18px #888888;
background-size: 100%;}

.imageTenMobile{background-image:url(../images/mobile/Composition_with_Red_Blue_and_Yellow_tn.jpg);
	padding-top: 38.5714285714286%;
width: 39.2857142857143%;
background-color: #f15851;
margin-bottom: 7.1428571428571%;
clear: both;
float: left;
box-shadow: 5px 10px 18px #888888;
background-size: 100%;}

.imageElevenMobile{background-image:url(../images/mobile/Weissenhof_Estate_tn.jpg);
	padding-top: 20.3571428571429%;
width: 53.571428571428%;
background-color: #f9b85f;
float: right;
margin-bottom: 7.1428571428571%;
margin-right: 0px;
box-shadow: 5px 10px 18px #888888;
background-size: 100%;}







.footer{
	clear: both;
background-color: #000;}

.footer h5{font-size: 14px;
color: #a8a8a8;
margin-bottom: 15px;}

.one{text-align: center;
padding-top: 19.6428571428571%;
margin-bottom:19.6428571428571%;
color: #fff;}

.two{text-align: center;
margin-bottom:19.6428571428571%;}

.three{text-align: center;
padding-bottom:55px;}





}

/* TABLET STYLES ////////////////////////////////////////////////////////////////////////////////////////////////*/
@media only screen and (min-width: 768px) and (max-width: 1024px){
	body{
		padding-top:50px;
	}

	.container{
		width:93.75%; /* 720 pixels at a 768 pixel screen width (iPads) */
	}

	header{
		height: 50px;
	}

	header a{
		text-decoration: none;
		font-size: 20px;
		line-height: 50px;
	}

	nav{
		float:right;
		/*padding-top:23px;*/
	}

	nav a{
		font-size: 12px;
		float:left;
		margin-left:3.125vw;}
		

	
	


	.navButton{
		display: none;
	}

.headerPartTwo{
padding-top: 3.3333333333333%;}
.largeBlueBox{padding-top: 46.8055555555556%;
width:31.1111111111111%;
float: left;
margin-bottom: 3.3333333333333%;}

.longRedBox{padding-top: 17.9166666666667%;
width: 65.5555555555556%;
float: right;
margin-left: 3.3333333333333%;
margin-bottom: 3.3333333333333%;}

.smallWhiteBox{padding-top: 25.5555555555556%;
width: 22.5%;
float: left;
margin-left: 3.3333333333333%;}

.largeRedBox{padding-top: 40.8333333333333%;
width: 39.7222222222222%;
margin-bottom: 3.3333333333333%;
clear: both;
float: left;}

.mediumBlueBox{padding-top: 25.5555555555556%;
width: 39.7222222222222%;
clear: right;
float: right;}

.mediumYellowBox{padding-top: 22.5%;
width:56.9444444444444%;
float: right;
margin-bottom: 3.3333333333333%;}

.mediumWhiteBox{padding-top: 14.5833333333333%;
width: 56.9444444444444%;
clear: right;
float: right;
}




.dropDown{margin-left: auto;
	margin-right: auto;
}

.dropDown h2{margin-bottom: 3.3333333333333%;
padding-top:11.1111111111111%;}
.content{
	/*height:306px;*/
}

.titleArea{
	height:90px;
	background-color:#000;
	margin-bottom: 30px;
	/*border-top: 5px solid black;*/
}

.titleArea h1{font-size: 20px;
	float:left;
	padding-top: 37px;
	color: #fff;
	margin-left: 30px;
}

.arrow{margin-right: 30px;
	width:30px;
	height:30px;
	background-color:#fff;
	display:block;
	float:right;
	padding-top: 30px;
	background-clip: content-box;
	transition: 0.3s;
}


#content1{margin-bottom: 54px;
	/*background-color:#0000FF;*/
}

#content1 p{
	font-size: 20px;
margin-bottom: 10px;
width:600px;
margin-left: 24px;}

#content2 {margin-bottom: 54px;
	background-color:/*#000*/;

}

#content2 h3{margin-left: 24px;
	font-size: 20px;
	padding-top: 38px;
margin-bottom: 15px;}

#content2 p{
	font-size: 20px;
margin-bottom: 10px;
width:600px;
margin-left: 24px;}


#content3{margin-bottom: 54px;
}

#content3 p{
	font-size: 20px;
margin-bottom: 10px;
width:600px;
margin-left: 24px;}








.artists h2{padding-top: 11.1111111111111%;
margin-bottom: 3.3333333333333%;
}

.artist a{font-size: 16px;
}
.artists p{font-family: 'lemonmilk-regular';
	font-size: 12px;
padding-top: 0.6944444444444%;
}

.artistImage{
	display: block;
	width: 100%;
	padding-top: 100%;
	background-color: #ccc;
	margin-bottom: 8.6111111111111%;
	margin-right: 3.3333333333333%;
}

.artist{float: left;
width: 22.5%;
margin-right: 3.3333333333333%;
margin-bottom: 11.1111111111111%;}

.artist a:hover{opacity: .5;
  -webkit-transition: opacity 1000ms, color 1000ms;
  -moz-transition: opacity 1000ms, color 1000ms;
  -o-transition: opacity 1000ms, color 1000ms;
  transition: opacity 1000ms, color 1000ms;
}

.first{background-image:url(../images/tablet/Theo_van_Doesburg_tn.jpg);
box-shadow: 5px 10px 18px #888888;
background-size: 100%;
opacity: 1;
  -webkit-transition: opacity 1000ms, color 1000ms;
  -moz-transition: opacity 1000ms, color 1000ms;
  -o-transition: opacity 1000ms, color 1000ms;
  transition: opacity 1000ms, color 1000ms;}

.second{background-image:url(../images/tablet/Piet_Mondrian_tn.jpg); 
box-shadow: 5px 10px 18px #888888;
background-size: 100%;
opacity: 1;
  -webkit-transition: opacity 1000ms, color 1000ms;
  -moz-transition: opacity 1000ms, color 1000ms;
  -o-transition: opacity 1000ms, color 1000ms;
  transition: opacity 1000ms, color 1000ms;}

.third{background-image:url(../images/tablet/Bart_van_der_Leck_tn.jpg); 
box-shadow: 5px 10px 18px #888888;
background-size: 100%;
opacity: 1;
  -webkit-transition: opacity 1000ms, color 1000ms;
  -moz-transition: opacity 1000ms, color 1000ms;
  -o-transition: opacity 1000ms, color 1000ms;
  transition: opacity 1000ms, color 1000ms;}

.fourth{background-image:url(../images/tablet/Friedrich_Vordemberge_Gildewart_tn.jpg); 
margin-right: 0px;
box-shadow: 5px 10px 18px #888888;
background-size: 100%;
opacity: 1;
  -webkit-transition: opacity 1000ms, color 1000ms;
  -moz-transition: opacity 1000ms, color 1000ms;
  -o-transition: opacity 1000ms, color 1000ms;
  transition: opacity 1000ms, color 1000ms;}

.friedrich {margin-right: 0px;}






.featureAreaGraphic{/*margin-right: 3.0674846625767%;
width: 29.5833333333333%;*/
padding-top: 8.6111111111111%;
margin-bottom: 8.6111111111111%;
float: left;}
.feature p{font-family: 'lemonmilk-regular';
	font-size: 30px;
	line-height: 40px;
}
.quote{margin-left: 38px;
	padding-top: 11.6666666666667%;
float: left;}
.feature p{color: #fff;
font-size: 20px}
.feature h3{font-family: gidole-regular;
	color: #fff;
float: right;
padding-top: 3.3333333333333%;
margin-right: 5.2777777777778%;
margin-bottom: 8.6111111111111%;}

.headerPartOne {display: none;}

.smallBlueBox{height: 87px;
width: 100px;
margin-bottom: 30px;
float: left;}

.smallRedBox{clear: both;
height: 146px;
width: 100px;
float: left;}

.largeWhiteBox{height: 198px;
width: 124px;
margin-left: 124px;
margin-bottom: 30px;
}

.smallYellowBox{height: 35px;
width: 124px;
margin-left: 124px;}





.gallery h2{padding-top: 11.1111111111111%;
margin-bottom: 3.3333333333333%;}
.galleryPartTwoMobile {display: none;}
.galleryImage{
	display: block;}
.galleryPartOne{width: 39.7222222222222%;
	float: left;
	margin-right: 3.3333333333333%;
/*	height: 52.0833333333333%;*/
	/*width:286px;
	height:375px;*/}
.galleryPartTwo{width:56.9444444444444%;
	float: left;
	margin-bottom: 60px;
	/*height:height: 52.0833333333333%;
	width: 410px;
	height: 375px;
*/}

.imageOne{background-image:url(../images/tablet/Composition_with_Grid_1_tn.jpg);
padding-top: 45.1048951048951%;
width: 100%;
margin-bottom: 8.041958041958%;
box-shadow: 5px 10px 18px #888888;
background-size: 100%;
}

.imageTwo{background-image:url(../images/tablet/Red_and_Blue_Chair_tn.jpg);
	padding-top: 26.2237762237762%;
width: 34.965034965035%;
background-color: #1d3362;
margin-bottom: 8.3916083916084%;
float: left;
box-shadow: 5px 10px 18px #888888; 
background-size: 100%;}

.imageThree{background-image:url(../images/tablet/Composition_in_Gray_tn.jpg);
	clear: both;
padding-top: 43.7062937062937%;
width: 34.965034965035%;
background-color: #f15851;
float: left;
box-shadow: 5px 10px 18px #888888;
background-size: 100%;}

.imageFour{background-image:url(../images/tablet/Composition_in_colour_A_tn.jpg);
	padding-top: 59.7902097902098%;
width: 56.6433566433566%;
background-color: #ebe3de;
margin-left:43.3566433566434%;
margin-bottom: 8.3916083916084%;
box-shadow: 5px 10px 18px #888888;
background-size: 100%;}

.imageFive{background-image:url(../images/tablet/Rastercompositie_9_tn.jpg);
	padding-top: 10.1398601398601%;
width: 56.6433566433566%;
background-color: #f9b85f;
margin-left: 43.3566433566434%;
margin-bottom: 8.3916083916084%;
box-shadow: 5px 10px 18px #888888;
background-size: 100%;}

.imageSix{background-image:url(../images/tablet/Composition_with_Female_Figure_tn.jpg);
padding-top: 46.5853658536585%;
width:24.390243902439%;
background-color:#1d3362;
float: left;
margin-bottom: 6.0975609756098%;
margin-right: 0px;
box-shadow: 5px 10px 18px #888888;
background-size: 100%;}

.imageSeven{background-image:url(../images/tablet/Composition_No4_tn.jpg);
	padding-top:17.0731707317073%;
width: 69.7560975609756%;
background-color: #f15851;
float: right;
margin-left: 5.8536585365854%;
margin-bottom: 5.8536585365854%;
margin-right: 0px;box-shadow: 5px 10px 18px #888888;
background-size: 100%;}

.imageNine{background-image:url(../images/tablet/Hotel_Particulier_tn.jpg);
	padding-top:  23.6585365853659%;
width: 24.390243902439%;
background-color: #ebe3de;
float: left;
margin-left: 5.8536585365854%;
box-shadow: 5px 10px 18px #888888;
background-size: 100%;}

.imageTen{background-image:url(../images/tablet/Composition_with_Red_Blue_and_Yellow_tn.jpg);
	padding-top: 39.0243902439024%;
width: 39.5121951219512%;
background-color: #f15851;
margin-bottom: 5.8536585365854%;
clear: both;
float: left;
box-shadow: 5px 10px 18px #888888;
background-size: 100%;}

.imageEight{ background-image:url(../images/tablet/Compositie_tn.jpg);
	padding-top: 23.6585365853659%;
width: 41.9512195121951%;
background-color: #1d3362;
clear: right;
float: right;
margin-right: 0px;
box-shadow: 5px 10px 18px #888888;
background-size: 100%;}

.imageEleven{background-image:url(../images/tablet/Weissenhof_Estate_tn.jpg);
	padding-top: 19.5121951219512%;
width: 54.6341463414634%;
background-color: #f9b85f;
float: right;
margin-bottom: 5.8536585365854%;
margin-right: 0px;
box-shadow: 5px 10px 18px #888888;
background-size: 100%;}

.imageTwelve{background-image:url(../images/tablet/Composition_B_tn.jpg);
	padding-top: 13.6585365853659%;
width: 54.6341463414634%;
background-color: #ebe3de;
clear: right;
float: right;
margin-right: 0px;
box-shadow: 5px 10px 18px #888888;
background-size: 100%;}


.fContainer{
		display: flex;
	}

	.list{
		width:31.1111111111%;
	
	}

	.one, .three{
		margin-right:3.3333333333333%;
		margin-left: 3.3333333333333%;
	}

	.two ul, .three ul{
		float:left;
		padding-bottom: 84px;}

	.two ul{margin-right: 8.6111111111111%;}

	.three ul{margin-right:8.6111111111111%;}

.two{margin-right: 4.1666666666667%;}



.footer {background-color: #000;}

.footer h5{color: #a8a8a8;
	font-size: 14px;
	margin-bottom: 2.0833333333333%;
padding-top: 54px;}



}

/* DESKTOP STYLES ////////////////////////////////////////////////////////////////////////////////////////////////*/
@media only screen and (min-width: 1025px){

body{
		padding-top:60px;
	}
.container{/*width:95.5%;*/
		width:978px;}
header{
		height: 60px;
		margin-bottom: 30px;
	}

	header a{
		text-decoration: none;
		font-size: 24px;
		line-height: 60px;
	}	

nav{
		float:right;

	}
		

	nav a{
		font-size: 16px;
		float:left;
		margin-left: 30px;}
	


	.navButton{display: none;}

	.billboard{
		background-color: #000;
		height:600px;}
		
	.headerPartOne{float: left;
	padding-top: 30px;}
	.headerPartTwo{float: left;
	margin-left: 30px;
	padding-top: 30px;}

	.bigYellowBox{height: 176px;
	width: 390px;
	margin-bottom: 30px;}

	.smallBlueBox{height: 102px;
	width: 138px;
	margin-bottom: 30px;
	float: left;}

	.smallRedBox{clear: both;
	height: 172px;
	width: 138px;
	float: left;}

	.largeWhiteBox{height: 233px;
	width: 222px;
	margin-left: 168px;
	margin-bottom: 30px;
	}

	.smallYellowBox{height: 41px;
	width: 222px;
	margin-left: 168px;
	margin-bottom: 30px;}

	.largeBlueBox{height: 262px;
	width:138px;
	float: left;
	margin-bottom: 30px;}

	.longRedBox{height: 100px;
	width: 390px;
	float: right;
	margin-left: 30px;
	margin-bottom: 30px;}

	.smallWhiteBox{height: 132px;
	width: 138px;
	float: left;
	margin-left: 30px;}

	.largeRedBox{height: 218px;
	width: 222px;
	margin-bottom: 30px;
	clear: both;
	float: left;}

	.mediumBlueBox{height: 132px;
	width: 222px;
	clear: right;
	float: right;}

	.mediumYellowBox{height: 115px;
	width: 306px;
	float: right;
	margin-bottom: 30px;
	}

	.mediumWhiteBox{height: 73px;
	width: 306px;
	clear: right;
	float: right;
	}


	.dropDown h2{padding-top: 10.2249488752556%;
		margin-bottom: 3.0674846625767%;}


	.titleArea{
		height:90px;
		background-color:#000;
		margin-bottom: 30px;
	}

	.titleArea h1{font-size: 25px;
		float:left;
		padding-top: 40px;
		color: #fff;
		margin-left: 30px;
	}

	.arrow{margin-right: 30px;
		width:30px;
		height:30px;
		background-color:#fff;
		display:block;
		float:right;
		padding-top: 30px;
		background-clip: content-box;
		transition: 0.3s;
	}



	#content1{margin-bottom: 54px;
		/*background-color:#0000FF;*/
	}

	#content1 p{
		font-size: 20px;
	margin-bottom: 10px;
	width:918px;
	margin-left: 30px;}

	#content2 {margin-bottom: 54px;
		background-color:/*#000*/;

	}

	#content2 h3{margin-left: 30px;
		font-size: 24px;
		padding-top: 54px;
	margin-bottom: 20px;}

	#content2 p{
		font-size: 20px;
	margin-bottom: 10px;
	width:918px;
	margin-left: 30px;}


	#content3{margin-bottom: 54px;
		/*background-color:#FF0000;*/
	}

	#content3 p{
		font-size: 20px;
	margin-bottom: 10px;
	width:918px;
	margin-left: 30px;}





	.artists h2{padding-top: 10.2249488752556%;
	margin-bottom: 3.0674846625767%;}

	.artist a{font-size: 20px;}
	.artists p{font-family: 'lemonmilk-regular';
		font-size: 14px;
	padding-top: 5px;
	margin-bottom: 10.2249488752556%;}

	.artistImage{
		display: block;
		width:222px;
		height:222px;
		background-color: #ccc;
		margin-bottom: 30px;
		margin-right: 30px;}


	.artist{float: left;
	width: 222px;
	margin-right: 30px;
	margin-bottom: 10.2249488752556%;}

	.artist a:hover{opacity: .5;
  -webkit-transition: opacity 1000ms, color 1000ms;
  -moz-transition: opacity 1000ms, color 1000ms;
  -o-transition: opacity 1000ms, color 1000ms;
  transition: opacity 1000ms, color 1000ms;
}


	.first{background-image:url(../images/desktop/Theo_van_Doesburg_tn.jpg);
	box-shadow: 5px 10px 18px #888888;
	background-size: 100%;
opacity: 1;
  -webkit-transition: opacity 1000ms, color 1000ms;
  -moz-transition: opacity 1000ms, color 1000ms;
  -o-transition: opacity 1000ms, color 1000ms;
  transition: opacity 1000ms, color 1000ms;}

	.second{background-image:url(../images/desktop/Piet_Mondrian_tn.jpg); 
	box-shadow: 5px 10px 18px #888888;
	background-size: 100%;
opacity: 1;
  -webkit-transition: opacity 1000ms, color 1000ms;
  -moz-transition: opacity 1000ms, color 1000ms;
  -o-transition: opacity 1000ms, color 1000ms;
  transition: opacity 1000ms, color 1000ms;}

	.third{background-image:url(../images/desktop/Bart_van_der_Leck_tn.jpg); 
	box-shadow: 5px 10px 18px #888888;
	background-size: 100%;
opacity: 1;
  -webkit-transition: opacity 1000ms, color 1000ms;
  -moz-transition: opacity 1000ms, color 1000ms;
  -o-transition: opacity 1000ms, color 1000ms;
  transition: opacity 1000ms, color 1000ms;}

	.fourth{background-image:url(../images/desktop/Friedrich_Vordemberge_Gildewart_tn.jpg); 
	margin-right: 0px;
	box-shadow: 5px 10px 18px #888888;
	background-size: 100%;
opacity: 1;
  -webkit-transition: opacity 1000ms, color 1000ms;
  -moz-transition: opacity 1000ms, color 1000ms;
  -o-transition: opacity 1000ms, color 1000ms;
  transition: opacity 1000ms, color 1000ms;}

	.friedrich {margin-right: 0px;}



	
	.featureAreaGraphic{margin-right: 3.0674846625767%;}
	.quote{width: 57.0552147239264%;
		padding-top: 138px;}
	.feature p{font-family: 'lemonmilk-regular';
		font-size: 30px;
		line-height: 40px;
	}
	.featureAreaGraphic{padding-top: 84px;
		margin-bottom: 84px;
	float: left;}
	.quote{float: left;
	width: 558px;}
	.feature p{color: #fff;}
	.feature h3{font-family: gidole-regular;
		color: #fff;
	float: right;
	padding-top: 30px;}




	.galleryPartTwoMobile {display: none;}
	.gallery h2{padding-top: 10.2249488752556%;
		margin-bottom: 3.0674846625767%;}
	.galleryPartOne{float: left;
	padding-top: 30px;
	margin-bottom: 84px;}
	.galleryPartTwo{float: left;
	padding-top: 30px;
	margin-bottom: 10.2249488752556%;}

	.galleryImage{/*opacity: 1;*/
		display: block;
		background-color: #ccc;
		margin-bottom: 15px;
		margin-right: 30px;

  /*-webkit-transition: opacity 1000ms, color 1000ms;
  -moz-transition: opacity 1000ms, color 1000ms;
  -o-transition: opacity 1000ms, color 1000ms;
  transition: opacity 1000ms, color 1000ms;*/}

	/*.galleryImage:hover{
	opacity:.5;
  -webkit-transition: opacity 1000ms, color 1000ms;
  -moz-transition: opacity 1000ms, color 1000ms;
  -o-transition: opacity 1000ms, color 1000ms;
  transition: opacity 1000ms, color 1000ms;}*/

	.imageOne{background-image:url(../images/desktop/Composition_with_Grid_1_tn.jpg);
	height: 176px;
	width: 390px;
	margin-bottom: 30px;
	box-shadow: 5px 10px 18px #888888;
	background-size: 100%;}

	.imageTwo{background-image:url(../images/desktop/Red_and_Blue_Chair_tn.jpg);
		height: 102px;
	width: 138px;
	background-color: #1d3362;
	margin-bottom: 30px;
	float: left;
	box-shadow: 5px 10px 18px #888888; 
	background-size: 100%;}

	.imageThree{background-image:url(../images/desktop/Composition_in_Gray_tn.jpg);
		clear: both;
	height: 172px;
	width: 138px;
	background-color: #f15851;
	float: left;
	box-shadow: 5px 10px 18px #888888;
	background-size: 100%;}

	.imageFour{background-image:url(../images/desktop/Composition_in_colour_A_tn.jpg);
		height: 233px;
	width: 222px;
	background-color: #ebe3de;
	margin-left: 168px;
	margin-bottom: 30px;
	box-shadow: 5px 10px 18px #888888;
	background-size: 100%;}

	.imageFive{background-image:url(../images/desktop/Rastercompositie_9_tn.jpg);
		height: 41px;
	width: 222px;
	background-color: #f9b85f;
	margin-left: 168px;
	margin-bottom: 30px;
	box-shadow: 5px 10px 18px #888888;
	background-size: 100%;}

	.imageSix{background-image:url(../images/desktop/Composition_with_Female_Figure_tn.jpg);
	height: 262px;
	width:138px;
	background-color:#1d3362;
	float: left;
	margin-bottom: 30px;
	margin-right: 0px;
	box-shadow: 5px 10px 18px #888888;
	background-size: 100%;}

	.imageSeven{background-image:url(../images/desktop/Composition_No4_tn.jpg);
		height: 100px;
	width: 390px;
	background-color: #f15851;
	float: right;
	margin-left: 30px;
	margin-bottom: 30px;
	margin-right: 0px;box-shadow: 5px 10px 18px #888888;
	background-size: 100%;}

	.imageNine{background-image:url(../images/desktop/Hotel_Particulier_tn.jpg);
		height: 132px;
	width: 138px;
	background-color: #ebe3de;
	float: left;
	margin-left: 30px;
	box-shadow: 5px 10px 18px #888888;
	background-size: 100%;}

	.imageTen{background-image:url(../images/desktop/Composition_with_Red_Blue_and_Yellow_tn.jpg);
		height: 218px;
	width: 222px;
	background-color: #f15851;
	margin-bottom: 30px;
	clear: both;
	float: left;
	box-shadow: 5px 10px 18px #888888;
	background-size: 100%;}

	.imageEight{ background-image:url(../images/desktop/Compositie_tn.jpg);
		height: 132px;
	width: 222px;
	background-color: #1d3362;
	clear: right;
	float: right;
	margin-right: 0px;
	box-shadow: 5px 10px 18px #888888;
	background-size: 100%;}

	.imageEleven{background-image:url(../images/desktop/Weissenhof_Estate_tn.jpg);
		height: 115px;
	width: 306px;
	background-color: #f9b85f;
	float: right;
	margin-bottom: 30px;
	margin-right: 0px;
	box-shadow: 5px 10px 18px #888888;
	background-size: 100%;}

	.imageTwelve{background-image:url(../images/desktop/Composition_B_tn.jpg);
		height: 73px;
	width: 306px;
	background-color: #ebe3de;
	clear: right;
	float: right;
	margin-right: 0px;
	box-shadow: 5px 10px 18px #888888;
	background-size: 100%;}




	.fContainer{
		display: flex;}

	.footer h5{color: #fff;
	font-size: 14px;
	margin-bottom: 15px;
	padding-top: 54px;}

	.list{
		width:31.1111111111%;}

	.one, .three{
		margin-right:3.3333333333333%;
		margin-left: 3.3333333333333%;}

	.two ul, .three ul{
		float:left;
		padding-bottom: 84px;}

	.two ul{margin-right: 54px;}

	.three ul{margin-right: 54px;}

	.two{margin-right: 30px;}


	.footer h5{color: #a8a8a8;
	font-size: 14px;
	margin-bottom: 15px;
	padding-top: 54px;}







}
