@charset "UTF-8";
/* CSS Document */

body {
	background-color: #F0E8DF;
	margin:0;
	}

text {
	color: #272727;
}

#footerbottom {
    clear: both;
    position: relative;
	text-align: center;
	width: 100%;
	margin-top: 20pt;
	margin-bottom: 20pt;
}

#footerbottom b {
	font-family: realist, sans-serif;
	font-size: 2vw;
	font-weight: 600;
	font-style: normal;
	text-align: center;
}


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

/* Phone */

	#menypc {
		display: none;
	}
#arrow2
	{
		display: none;
	}
	
/* hamburger */

/*
 * Made by Erik Terwan
 * 24th of November 2015
 * MIT License
 *
 *
 * If you are thinking of using this in
 * production code, beware of the browser
 * prefixes.
 */

body
{
  margin: 0;
  padding: 0;
  
  /* make it look decent enough */
}

#navigation {
	 position: -webkit-sticky; /* Safari */
  	position: fixed;
  	top: 0;
	z-index: 10000;
}


#menuToggle
{
  display: block;
  position: fixed;
  top: 50px;
  left: 900px;
  z-index: 1000;
  
  -webkit-user-select: none;
  user-select: none;
}

#menuToggle a
{
  text-decoration: none;
  color: #232323;
  
  transition: color 0.3s ease;
}


#menuToggle a:hover
{
  color: #868182;
}

#menuToggle ul {
	background-color: #868182;
	list-style: none;font-family: realist, sans-serif;
	font-size: 60px;
	font-style: normal;
}

#menuToggle li {
	color: #F0E8DF;
}

#menuToggle input
{
  display: block;
  width: 40px;
  height: 32px;
  position: absolute;
  top: -7px;
  left: -5px;
  cursor: pointer;
  
  opacity: 0; /* hide this */
  z-index: 2; /* and place it over the hamburger */
  
  -webkit-touch-callout: none;
}

/*
 * Just a quick hamburger
 */
#menuToggle span
{
  display: block;
  width: 38px;
  height: 7px;
  margin-bottom: 5px;
  position: relative;
  
  background: #272727;
  border-radius: 3px;
  
  z-index: 1;
  
  transform-origin: 1px 1px;
  
  transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
              background 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
              opacity 0.55s ease;
}

#menuToggle span:first-child
{
  transform-origin: 0% 0%;
}

#menuToggle span:nth-last-child(2)
{
  transform-origin: 0% 100%;
}

/* 
 * Transform all the slices of hamburger
 * into a crossmark.
 */
#menuToggle input:checked ~ span
{
  opacity: 1;
  transform: rotate(45deg) translate(-2px, -1px);
  background: #232323;
}

/*
 * But let's hide the middle one.
 */
#menuToggle input:checked ~ span:nth-last-child(3)
{
  opacity: 0;
  transform: rotate(0deg) scale(0.2, 0.2);
}

/*
 * Ohyeah and the last one should go the other direction
 */
#menuToggle input:checked ~ span:nth-last-child(2)
{
  transform: rotate(-45deg) translate(0, -1px);
}

/*
 * Make this absolute positioned
 * at the top left of the screen
 */
#menu
{
  position: absolute;
  width: 100vw;
  margin: -100px 0 0 -900px; 
 padding:10vw 0;
  
  background: #ededed;
  list-style-type: none;
  -webkit-font-smoothing: antialiased;
  /* to stop flickering of text in safari */
  
  transform-origin: 0% 0%;
  transform: translate(100%, 0);
  
  transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);
}

#menu li
{
  padding: 10px 0;
  font-size: 50px;
	font-weight: 600;
	text-align: center;
}

/*
 * And let's slide it in from the left
 */
#menuToggle input:checked ~ ul
{
  transform: none;
}




#all {
	position: absolute;
	display: table;
	width: 100%;
	height: 100%;
}

	
#gdh2{
	position: relative;
	width: 100%;
	height: 100vh;
	height: calc(var(--vh, 1vh) * 100);
}

#gdh2blue {
	background-color: #D9DAD6;
	float: left;
    width: 70%;
    height:50%;
	position: relative;
	display: flex;
  	align-items: center;
}

#gdh2blue t {
	font-family: realist, sans-serif;
	font-size: 60px;
	font-style: normal;
	margin-left: 10%;
	margin-top: 20pt;
}

#letters {
	float: left;
    width: 100%;
    height:50%;
	position: absolute;
}

#lettersg {
	float: left;
    width: 50%;
    height:120%;
	overflow: hidden;
	position: relative;
}

#title {
	position: absolute;
	height: 10%;
	width: 500pt;
	top:23%;
	left:10%;
	text-align: left;
	
}

#title t {
	font-family: realist, sans-serif;
	font-size: 40pt;
	font-weight: 600;
	font-style: normal;
	
}
 
#lettersg img {
	float: right;
	top:0;
}

#lettersd {
	float: right;
    width: 40%;
    height:90%;
	bottom:0;
	right: 0;
	overflow: hidden;
	position: absolute;
}

#lettersd img {
	float: left;
	top:0;
}

#footer {
	float: right;
    width: 100%;
    height:40%;
	bottom:0;
	position: absolute;
}

#gdh2grey {
	position: absolute;
	height: 50%;
	width: 100%;
	bottom: 0;
	display: flex;
  	align-items: center;
	background-color: #868182;
}

#arrow2phone {
	position: absolute;
	width: 40vw;
	left:50pt;
}

#lettersh {
	position: absolute;
	height: 90%;
	width: 44%;
	right: 0;
	bottom:0;
	overflow: hidden;
}

#lettersh img {
	float: left;
	top:0;
} 
	
	

/* POP ART */

#popart {
	position: relative;
	width: 100%;
	height: 800pt;
	}

#popartblue {
	background-color: #D9DAD6;
    position: relative;
	width: 40%;
	height: 20%;
    align-items: center;
	}
#poparttitle {
	position: absolute;
	left:25%;
	top:25%;
	width: 120%;
	
	}

t {
	font-family: ambroise-std, serif;
	position: relative;
	font-size: 70pt;
	font-style: normal;
	margin:0;
	}


h1 {
	font-family: realist, sans-serif;
	position: relative;
	font-size: 40pt;
	font-style: normal;
	margin:0;
	}

h2 {
	font-family: realist, sans-serif;
	position: relative;
	font-size: 20pt;
	font-style: normal;
	float:left;
	margin: 0;
	line-height: 0;
}

#poparttext{
	position: relative;
	float: left;
	left:10%;
	width: 80%;
	margin-top: 10%;
	clear:both;
}

b {
	font-family: realist, sans-serif;
	position: relative;
	font-size: 20pt;
	font-weight: 500;
	font-style: normal;
}

#pictures {
	position: relative;
	width: 100%;
	height: 1800pt;
	clear:both;
}

#pictureblue {
	position: relative;
	width: 65%;
	height: 70%;
	margin-left:auto; 
	margin-right:0;
	background-color: #D9DAD6;
}

#arttitle {
	position: absolute;
	right:38%;
	top:5%;
	width: 100%;
}

#images {
	display: block;
	position: absolute;
  	top: 12%;
	height: 70%;
	width: 80%;
	margin-left: 10%;
  	margin-right: 10%;
	z-index: 4;
}

#img1 {
	position: relative;
	width: 45%;
	height: 23%;
	float: left;
}

#img1img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: left;
	margin-right: 3%;
}


#img1txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}

#img2 {
	position: relative;
	width: 45%;
	height: 23%;
	float: right;
}


#img2img {
 	position: relative;
	width: 100%;
	height: 250pt;
	float: left;
	margin-right: 3%;
}



#img2txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}

#img3 {
	position: relative;
	width: 45%;
	height: 23%;
	float: left;
	top:20%;
}


#img3img {
 	position: relative;
	width: 100%;
	height: 250pt;
	float: left;
	margin-right: 3%;
}



#img3txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}


#img4 {
	position: relative;
	width: 45%;
	height: 23%;
	float: right;
	top:20%;
}


#img4img {
	position: relative;
	width: 100%;
	height: 250pt;
	float: left;
	margin-right: 3%;
}


#img4txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}


#img5 {
	position: relative;
	width: 45%;
	height: 23%;
	float: left;
	top:40%;
}


#img5img {
	position: relative;
	width: 100%;
	height: 250pt;
	float: left;
	margin-right: 3%;
}



#img5txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}

#img6 {
	position: relative;
	width: 45%;
	height: 23%;
	float: right;
	top:40%;
}


#img6img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#img6img img{
	position:absolute; bottom:0
}

#img6txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}


h3 {font-family: realist, sans-serif;
	position: relative;
	font-size: 20pt;
	font-style: normal;
	float:left;
	margin-top: 4%;
	line-height: 1;
	}


#art {
	position: relative;
	width: 100%;
	height: 2200pt;
	background-color: #D9DAD6;
	}


#artwhite {
	background-color: #F0E8DF;
	position: relative;
	width: 65%;
	height: 27%;
	top:5%;
	margin-left:auto; 
	margin-right:0;
} 

#artgrey {
	background-color: #F0E8DF;
	position: relative;
	width: 65%;
	height: 24%;
	top:24%;
	margin-left:0; 
	margin-right:auto;
}


#artisttitle {
	position: absolute;
	right:10%;
	top:5%;
	width: 130%;
}

#artists {
	display: block;
	position: absolute;
  	top: 12%;
	width: 80%;
	height: 80%;
	margin-left: 10%;
  	margin-right: 10%;
	z-index: 4;
}


#art1{
	position: relative;
	width: 100%;
	height: 25%;
	float: left;
	top:0;
}

#art1img {
	position: relative;
	width: 45%;
	height: 300pt;
	float: left;
	top:0;
	margin-right: 3%;
	overflow: hidden;
}

#art2{
	position: relative;
	width: 100%;
	height: 28%;
	float: left;
	padding-top:25%;
}

#art2img {
	position: relative;
	width: 45%;
	height: 300pt;
	float: left;
	top:0;
	margin-right: 3%;
	overflow: hidden;

}

#art3{
	position: relative;
	width: 100%;
	height: auto;
	float: left;
	padding-top:28%;
}

#art3img {
	position: relative;
	width: 45%;
	height: 300pt;
	float: left;
	top:0;
	margin-right: 3%;
	overflow: hidden;
}

.text {
	position: relative;
	height: 100%;
}

.text h3 {
	position: relative;
	width: 50%;
	margin-bottom: 3%;
	font-size: 25pt;
	margin-top: -2px;
	float: left;
}

#events {
	position: relative;
	width: 100%;
	height: 700pt;
}

#eventsblue {
	background-color: #D9DAD6;
	position: relative;
	width: 30%;
	height: 100%;
	top:0;
	margin-left:0; 
	margin-right:auto;
}

#eventsblue h1 {
	top:5%;
	left:33%;
}

#eventsgrey{
	background-color: #D9DAD6;
	position: relative;
	width: 30%;
	height: 50%;
	bottom:50%;
	margin-left:auto; 
	margin-right:0;
}

#list {
	display: block;
	position: absolute;
  	top:190pt;
	width: 80%;
	height: 65%;
	margin-left: 10%;
  	margin-right: 10%;
	z-index: 4;
}
ul {
	list-style-image:url("letters/liststyle.svg");
}

li {
	margin: 0 0 15pt 0;
}

li b { 
		position: relative;
  		left: 15px;
		top:5pt;
	}


/* swiss */



#swiss {
	position: relative;
	width: 100%;
	height: 800pt;
	}

#swissblue {
	background-color: #D9DAD6;
    position: relative;
	width: 40%;
	height: 19%;
    align-items: center;
	}

#swisstitle {
	position: absolute;
	left:25%;
	top:25%;
	width: 120%;
	}


#swisstext{
	position: relative;
	float: left;
	left:10%;
	width: 80%;
	margin-top: 10%;
	margin-bottom: 10%;
	clear:both;
}

	


#swisspictures {
	position: relative;
	width: 100%;
	height: 1950pt;
	clear:both;
}

#swisspictureblue {
	position: relative;
	width: 65%;
	height: 70%;
	margin-left:auto; 
	margin-right:0;
	background-color: #D9DAD6;
}

#swissarttitle {
	position: absolute;
	right:38%;
	top:5%;
	width: 100%;
}

#swissimages {
	display: block;
	position: absolute;
  	top: 19%;
	height: 70%;
	width: 80%;
	margin-left: 10%;
  	margin-right: 10%;
	z-index: 4;
}

#swissimg1 {
	position: relative;
	width: 45%;
	height: 23%;
	float: left;
}


#swissimg1img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#swissimg1img img{
	position:absolute; bottom:0;
}

#swissimg1txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}

#swissimg2 {
	position: relative;
	width: 45%;
	height: 23%;
	float: right;
}


#swissimg2img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#swissimg2img img{
	position:absolute; bottom:0
}

#swissimg2txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}

#swissimg3 {
	position: relative;
	width: 45%;
	height: 23%;
	float: left;
	top:20%;
}


#swissimg3img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#swissimg3img img{
	position:absolute; bottom:0
}

#swissimg3txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}



#swissimg4 {
	position: relative;
	width: 45%;
	height: 23%;
	float: right;
	top:20%;
}


#swissimg4img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#swissimg4img img{
	position:absolute; bottom:0
}

#swissimg4txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}



#swissimg5 {
	position: relative;
	width: 45%;
	height: 23%;
	float: left;
	top:40%;
}


#swissimg5img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#swissimg5img img{
	position:absolute; bottom:0
}

#swissimg5txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}

#swissimg6 {
	position: relative;
	width: 45%;
	height: 23%;
	float: right;
	top:40%;
}


#swissimg6img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#swissimg6img img{
	position:absolute; bottom:0
}

#swissimg6txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}




#swissart {
	position: relative;
	width: 100%;
	height: 2400pt;
	background-color: #D9DAD6;
	}


#swissartwhite {
	background-color: #F0E8DF;
	position: relative;
	width: 65%;
	height: 27%;
	top:5%;
	margin-left:auto; 
	margin-right:0;
} 

#swissartgrey {
	background-color: #F0E8DF;
	position: relative;
	width: 65%;
	height: 24%;
	top:24%;
	margin-left:0; 
	margin-right:auto;
}


#swissartisttitle {
	position: absolute;
	right:10%;
	top:5%;
	width: 130%;
}

#swissartists {
	display: block;
	position: absolute;
  	top: 12%;
	width: 80%;
	height: 80%;
	margin-left: 10%;
  	margin-right: 10%;
	z-index: 4;
}


#swissart1{
	position: relative;
	width: 100%;
	height: 25%;
	float: left;
	top:0;
}

#swissart1img {
	position: relative;
	width: 45%;
	height: 300pt;
	float: left;
	top:0;
	padding-bottom: 3pt;
	margin-right: 3%;
	overflow: hidden;
}

#swissart2{
	position: relative;
	width: 100%;
	height: 28%;
	float: left;
	padding-top:30%;
}

#swissart2img {
	position: relative;
	width: 45%;
	height: 300pt;
	float: left;
	top:0;
	margin-right: 3%;
	overflow: hidden;

}

#swissart3{
	position: relative;
	width: 100%;
	height: auto;
	float: left;
	padding-top:35%;
}

#swissart3img {
	position: relative;
	width: 45%;
	height: 300pt;
	float: left;
	top:0;
	margin-right: 3%;
	overflow: hidden;
	
}


#swissevents {
	position: relative;
	width: 100%;
	height: 700pt;
}

#swisseventsblue {
	background-color: #D9DAD6;
	position: relative;
	width: 30%;
	height: 100%;
	top:0;
	margin-left:0; 
	margin-right:auto;
}

#swisseventsblue h1 {
	top:5%;
	left:33%;
}

#swisseventsgrey{
	background-color: #D9DAD6;
	position: relative;
	width: 30%;
	height: 50%;
	bottom:50%;
	margin-left:auto; 
	margin-right:0;
}

#swisslist {
	display: block;
	position: absolute;
  	bottom:0;
	width: 80%;
	height: 65%;
	margin-left: 10%;
  	margin-right: 10%;
	top: 28%;
	z-index: 4;
}


/* psychedelic */



#psychedelic {
	position: relative;
	width: 100%;
	height: 1000pt;
	}

#psychedelicblue {
	background-color: #D9DAD6;
    position: relative;
	width: 40%;
	height: 35%;
    align-items: center;
	}

#psychedelictitle {
	position: absolute;
	left:25%;
	top:25%;
	width: 180%;
	}


#psychedelictext{
	position: relative;
	float: left;
	left:10%;
	width: 80%;
	margin-top: 7%;
	clear:both;
}



#psychedelicpictures {
	position: relative;
	width: 100%;
	height: 2050pt;
	clear:both;
}

#psychedelicpictureblue {
	position: relative;
	width: 65%;
	height: 70%;
	margin-left:auto; 
	margin-right:0;
	background-color: #D9DAD6;
}

#psychedelicarttitle {
	position: absolute;
	right:38%;
	top:5%;
	width: 100%;
}

#psychedelicimages {
	display: block;
	position: absolute;
  	top: 18%;
	height: 70%;
	width: 80%;
	margin-left: 10%;
  	margin-right: 10%;
	z-index: 4;
}

#psychedelicimg1 {
	position: relative;
	width: 45%;
	height: 23%;
	float: left;
}


#psychedelicimg1img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#psychedelicimg1img img{
	position:absolute; bottom:0;
}

#psychedelicimg1txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}

#psychedelicimg2 {
	position: relative;
	width: 45%;
	height: 23%;
	float: right;
}


#psychedelicimg2img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#psychedelicimg2img img{
	position:absolute; bottom:0
}

#psychedelicimg2txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}

#psychedelicimg3 {
	position: relative;
	width: 45%;
	height: 23%;
	float: left;
	top:20%;
}


#psychedelicimg3img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#psychedelicimg3img img{
	position:absolute; bottom:0
}

#psychedelicimg3txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}



#psychedelicimg4 {
	position: relative;
	width: 45%;
	height: 23%;
	float: right;
	top:20%;
}


#psychedelicimg4img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#psychedelicimg4img img{
	position:absolute; bottom:0
}

#psychedelicimg4txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}


#psychedelicimg5 {
	position: relative;
	width: 45%;
	height: 23%;
	float: left;
	top:40%;
}


#psychedelicimg5img {
  position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#psychedelicimg5img img{
	position:absolute; bottom:0
}

#psychedelicimg5txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}

#psychedelicimg6 {
	position: relative;
	width: 45%;
	height: 23%;
	float: right;
	top:40%;
}


#psychedelicimg6img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#psychedelicimg6img img{
	position:absolute; bottom:0
}

#psychedelicimg6txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}




#psychedelicart {
	position: relative;
	width: 100%;
	height: 2800pt;
	background-color: #D9DAD6;
	}


#psychedelicartwhite {
	background-color: #F0E8DF;
	position: relative;
	width: 65%;
	height: 27%;
	top:5%;
	margin-left:auto; 
	margin-right:0;
} 

#psychedelicartgrey {
	background-color: #F0E8DF;
	position: relative;
	width: 65%;
	height: 24%;
	top:24%;
	margin-left:0; 
	margin-right:auto;
}


#psychedelicartisttitle {
	position: absolute;
	right:10%;
	top:5%;
	width: 130%;
}

#psychedelicartists {
	display: block;
	position: absolute;
  	top: 11%;
	width: 80%;
	height: 80%;
	margin-left: 10%;
  	margin-right: 10%;
	z-index: 4;
}


#psychedelicart1{
	position: relative;
	width: 100%;
	height: 30%;
	float: left;
	top:0;
}

#psychedelicart1img {
	position: relative;
	width: 45%;
	height: 300pt;
	float: left;
	top:0;
	padding-bottom: 3pt;
	margin-right: 3%;
	overflow: hidden;
	
}

#psychedelicart2{
	position: relative;
	width: 100%;
	height: 30%;
	float: left;
	padding-top:35%;
}

#psychedelicart2img {
	position: relative;
	width: 45%;
	height: 300pt;
	float: left;
	top:0;
	margin-right: 3%;
	overflow: hidden;

}

#psychedelicart3{
	position: relative;
	width: 100%;
	height: auto;
	float: left;
	padding-top:40%;
}

#psychedelicart3img {
	position: relative;
	width: 45%;
	height: 300pt;
	float: left;
	top:0;
	margin-right: 3%;
	overflow: hidden;

}



#psychedelicevents {
	position: relative;
	width: 100%;
	height: 700pt;
}

#psychedeliceventsblue {
	background-color: #D9DAD6;
	position: relative;
	width: 30%;
	height: 100%;
	top:0;
	margin-left:0; 
	margin-right:auto;
}

#psychedeliceventsblue h1 {
	top:5%;
	left:33%;
}

#psychedeliceventsgrey{
	background-color: #D9DAD6;
	position: relative;
	width: 30%;
	height: 50%;
	bottom:50%;
	margin-left:auto; 
	margin-right:0;
}

#psychedeliclist {
	display: block;
	position: absolute;
  	bottom:0;
	width: 80%;
	height: 65%;
	margin-left: 10%;
  	margin-right: 10%;
	top:190pt;
	z-index: 4;
}




/* grafitti */



#graffiti {
	position: relative;
	width: 100%;
	height: 1000pt;
	}

#graffitiblue {
	background-color: #D9DAD6;
    position: relative;
	width: 40%;
	height: 35%;
    align-items: center;
	}

#graffitititle {
	position: absolute;
	left:25%;
	top:25%;
	width: 180%;
	}

#graffitititle h2{
	top:100pt;
}


#graffititext{
	position: relative;
	float: left;
	left:10%;
	width: 80%;
	margin-top: 9%;
	clear:both;
}



#graffitipictures {
	position: relative;
	width: 100%;
	height: 1950pt;
	clear:both;
}

#graffitipictureblue {
	position: relative;
	width: 65%;
	height: 70%;
	margin-left:auto; 
	margin-right:0;
	background-color: #D9DAD6;
}

#graffitiarttitle {
	position: absolute;
	right:38%;
	top:5%;
	width: 100%;
}

#graffitiimages {
	display: block;
	position: absolute;
  	top: 19%;
	height: 70%;
	width: 80%;
	margin-left: 10%;
  	margin-right: 10%;
	z-index: 4;
}

#graffitiimg1 {
	position: relative;
	width: 45%;
	height: 23%;
	float: left;
}


#graffitiimg1img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#graffitiimg1img img{
	position:absolute; bottom:0;
}

#graffitiimg1txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}

#graffitiimg2 {
	position: relative;
	width: 45%;
	height: 23%;
	float: right;
}


#graffitiimg2img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#graffitiimg2img img{
	position:absolute; bottom:0
}

#graffitiimg2txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}

#graffitiimg3 {
	position: relative;
	width: 45%;
	height: 23%;
	float: left;
	top:20%;
}


#graffitiimg3img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#graffitiimg3img img{
	position:absolute; bottom:0
}

#graffitiimg3txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}



#graffitiimg4 {
	position: relative;
	width: 45%;
	height: 23%;
	float: right;
	top:20%;
}


#graffitiimg4img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#graffitiimg4img img{
	position:absolute; bottom:0
}

#graffitiimg4txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}


#graffitiimg5 {
	position: relative;
	width: 45%;
	height: 23%;
	float: left;
	top:40%;
}


#graffitiimg5img {
  position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#graffitiimg5img img{
	position:absolute; bottom:0
}

#graffitiimg5txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}

#graffitiimg6 {
	position: relative;
	width: 45%;
	height: 23%;
	float: right;
	top:40%;
}


#graffitiimg6img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#graffitiimg6img img{
	position:absolute; bottom:0
}

#graffitiimg6txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}




#graffitiart {
	position: relative;
	width: 100%;
	height: 2400pt;
	background-color: #D9DAD6;
	}


#graffitiartwhite {
	background-color: #F0E8DF;
	position: relative;
	width: 65%;
	height: 27%;
	top:5%;
	margin-left:auto; 
	margin-right:0;
} 

#graffitiartgrey {
	background-color: #F0E8DF;
	position: relative;
	width: 65%;
	height: 24%;
	top:24%;
	margin-left:0; 
	margin-right:auto;
}


#graffitiartisttitle {
	position: absolute;
	right:10%;
	top:5%;
	width: 130%;
}

#graffitiartists {
	display: block;
	position: absolute;
  	top: 12%;
	width: 80%;
	height: 80%;
	margin-left: 10%;
  	margin-right: 10%;
	z-index: 4;
}


#graffitiart1{
	position: relative;
	width: 100%;
	height: 30%;
	float: left;
	top:0;
}

#graffitiart1img {
	position: relative;
	width: 45%;
	height: 300pt;
	float: left;
	top:0;
	padding-bottom: 3pt;
	margin-right: 3%;
	overflow: hidden;
	
}

#graffitiart2{
	position: relative;
	width: 100%;
	height: 40vh;
	float: left;
	padding-top:40%;
}

#graffitiart2img {
	position: relative;
	width: 45%;
	height: 300pt;
	float: left;
	top:0;
	margin-right: 3%;
	overflow: hidden;
}

#graffitiart3{
	position: relative;
	width: 100%;
	height: auto;
	float: left;
	padding-top:23%;
}

#graffitiart3img {
	position: relative;
	width: 45%;
	height: 300pt;
	float: left;
	top:0;
	margin-right: 3%;
	overflow: hidden;
	
}



#graffitievents {
	position: relative;
	width: 100%;
	height: 700pt;
}

#graffitieventsblue {
	background-color: #D9DAD6;
	position: relative;
	width: 30%;
	height: 100%;
	top:0;
	margin-left:0; 
	margin-right:auto;
}

#graffitieventsblue h1 {
	top:5%;
	left:33%;
}

#graffitieventsgrey{
	background-color: #D9DAD6;
	position: relative;
	width: 30%;
	height: 50%;
	bottom:50%;
	margin-left:auto; 
	margin-right:0;
}

#graffitilist {
	display: block;
	position: absolute;
  	bottom:0;
	width: 80%;
	height: 65%;
	margin-left: 10%;
  	margin-right: 10%;
	top:190pt;
	z-index: 4;
}





/* punk */



#punk {
	position: relative;
	width: 100%;
	height: 1200pt;
	}

#punkblue {
	background-color: #D9DAD6;
    position: relative;
	width: 40%;
	height: 30%;
    align-items: center;
	}

#punktitle {
	position: absolute;
	left:25%;
	top:25%;
	width: 180%;
	}
#punktitle h2{
	top:100pt;
}


#punktext{
	position: relative;
	float: left;
	left:10%;
	width: 80%;
	margin-top: 8%;
	clear:both;
}



#punkpictures {
	position: relative;
	width: 100%;
	height: 1950pt;
	clear:both;
}

#punkpictureblue {
	position: relative;
	width: 65%;
	height: 70%;
	margin-left:auto; 
	margin-right:0;
	background-color: #D9DAD6;
}

#punkarttitle {
	position: absolute;
	right:38%;
	top:5%;
	width: 100%;
}

#punkimages {
	display: block;
	position: absolute;
  	top: 19%;
	height: 70%;
	width: 80%;
	margin-left: 10%;
  	margin-right: 10%;
	z-index: 4;
}

#punkimg1 {
	position: relative;
	width: 45%;
	height: 23%;
	float: left;
}


#punkimg1img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#punkimg1img img{
	position:absolute; bottom:0;
}

#punkimg1txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}

#punkimg2 {
	position: relative;
	width: 45%;
	height: 23%;
	float: right;
}


#punkimg2img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#punkimg2img img{
	position:absolute; bottom:0
}

#punkimg2txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}

#punkimg3 {
	position: relative;
	width: 45%;
	height: 23%;
	float: left;
	top:20%;
}


#punkimg3img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#punkimg3img img{
	position:absolute; bottom:0
}

#punkpunkimg3txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}



#punkimg4 {
	position: relative;
	width: 45%;
	height: 23%;
	float: right;
	top:20%;
}


#punkimg4img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#punkimg4img img{
	position:absolute; bottom:0
}

#punkimg4txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}


#punkimg5 {
	position: relative;
	width: 45%;
	height: 23%;
	float: left;
	top:40%;
}


#punkimg5img {
  position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#punkimg5img img{
	position:absolute; bottom:0
}

#punkimg5txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}

#punkimg6 {
	position: relative;
	width: 45%;
	height: 23%;
	float: right;
	top:40%;
}


#punkimg6img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#punkimg6img img{
	position:absolute; bottom:0
}

#punkimg6txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}




#punkart {
	position: relative;
	width: 100%;
	height: 2100pt;
	background-color: #D9DAD6;
	}


#punkartwhite {
	background-color: #F0E8DF;
	position: relative;
	width: 65%;
	height: 27%;
	top:5%;
	margin-left:auto; 
	margin-right:0;
} 

#punkartgrey {
	background-color: #F0E8DF;
	position: relative;
	width: 65%;
	height: 24%;
	top:24%;
	margin-left:0; 
	margin-right:auto;
}


#punkartisttitle {
	position: absolute;
	right:10%;
	top:5%;
	width: 130%;
}

#punkartists {
	display: block;
	position: absolute;
  	top: 12%;
	width: 80%;
	height: 80%;
	margin-left: 10%;
  	margin-right: 10%;
	z-index: 4;
}


#punkart1{
	position: relative;
	width: 100%;
	height: 30%;
	float: left;
	top:0;
}

#punkart1img {
	position: relative;
	width: 45%;
	height: 300pt;
	float: left;
	top:0;
	padding-bottom: 3pt;
	margin-right: 3%;
	overflow: hidden;
	
}

#punkart2{
	position: relative;
	width: 100%;
	height: 30%;
	float: left;
	padding-top:20%;
}

#punkart2img {
	position: relative;
	width: 45%;
	height: 300pt;
	float: left;
	top:0;
	margin-right: 3%;
	overflow: hidden;
	
}

#punkart3{
	position: relative;
	width: 100%;
	height: auto;
	float: left;
	padding-top:25%;
}

#punkart3img {
	position: relative;
	width: 45%;
	height: 300pt;
	float: left;
	top:0;
	margin-right: 3%;
	overflow: hidden;
	
}



#punkevents {
	position: relative;
	width: 100%;
	height: 750pt;
}

#punkeventsblue {
	background-color: #D9DAD6;
	position: relative;
	width: 30%;
	height: 100%;
	top:0;
	margin-left:0; 
	margin-right:auto;
}

#punkeventsblue h1 {
	top:5%;
	left:33%;
}

#punkeventsgrey{
	background-color: #D9DAD6;
	position: relative;
	width: 30%;
	height: 50%;
	bottom:50%;
	margin-left:auto; 
	margin-right:0;
}

#punklist {
	display: block;
	position: absolute;
  	bottom:0;
	top:190pt;
	width: 80%;
	height: 65%;
	margin-left: 10%;
  	margin-right: 10%;
	z-index: 4;
}
	
}















/* pc */

 
@media only screen and (min-width: 1200px)  {
   


#navigation, #menuToggle, #checkbox, #menu, #arrow2phone {
		display: none !important;
	}

/* headde pc */
	
	
	#menypc {
		background-color: #272727;
		width: 100%;
		height: 5vw;
		margin-top: 0px;
		position: fixed;
  		top: 0;
		z-index: 10000;
		align-content: center;
	}
	
	#footerbottom {
    clear: both;
    position: relative;
	text-align: center;
	width: 100%;
	margin-top: 20pt;
	margin-bottom: 20pt;
}

#footerbottom b {
	font-family: realist, sans-serif;
	font-size: 2vw;
	font-weight: 600;
	font-style: normal;
	text-align: center;
}
	
	#navindexpc {
		height: auto;
		width: 100%;
		margin-left: auto;
		margin-right: auto;
		text-align: center;
		align-content: center;
		position: absolute;
  		left: 50%;
  		top: 50%;
  		transform: translate(-50%, -50%);
	}
	
	#navindexpc a {
		font-family: realist, sans-serif;
		margin-left: 4%;
		margin-right: 4%;
		font-weight: 600;
		font-size: 1.5vw;
		text-decoration: none;
		color: #F0E8DF  ;
	}
	
	#navindexpc a:hover{
		color: #868182;
	}


#all {
	position: absolute;
	display: table;
	width: 100%;
	height: 100%;
}

#gdh2{
	position: relative;
	width: 100%;
	height: 100vh;
	height: calc(var(--vh, 1vh) * 100);
	overflow: hidden;
}

#gdh2blue {
	background-color: #D9DAD6;
	float: left;
    width: 40%;
    height:40%;
	position: relative;
	display: flex;
  	align-items: center;
}

#gdh2blue t {
	font-family: realist, sans-serif;
	font-size: 60px;
	font-style: normal;
	margin-left: 10%;
	margin-top: 20pt;
	position: absolute;
	
}

#letters {
	float: left;
    width: 100%;
    height:50%;
	position: absolute;
}

#lettersg {
	float: left;
    width: 20%;
    height:130%;
	top:75pt;
	overflow: hidden;
	position: relative;
	z-index: 100;
}

#title {
	position: absolute;
	height: 10%;
	width: 60%;
	top:34%;
	text-align: left;
	align-content: center;
  	left: 46%;
  	transform: translate(-50%, -50%);
	
}

#title t {
	font-family: realist, sans-serif;
	font-size: 5vw;
	font-weight: 600;
	font-style: normal;
	
}

#lettersg img {
	float: right;
	top:0;
}

#lettersd {
	float: right;
    width: 25%;
    height:90%;
	bottom:0;
	top:30%;
	right: -35pt;
	overflow: hidden;
	position: absolute;
}

#lettersd img {
	float: left;
	top:0;
}

#footer {
	float: right;
    width: 100%;
    height:70%;
	bottom:0;
	position: absolute;
}

#gdh2grey {
	position: absolute;
	height: 50%;
	width: 100%;
	bottom: 0;
	display: flex;
  	align-items: center;
	background-color: #868182;
}

#arrow2 {
	position: absolute;
	width: 35vw;
 	margin-left: 32.5vw;
	top:100pt;
}
	

	
#lettersh {
	position: absolute;
	height: 60%;
	width: 34%;
	right: 0pt;
	bottom:-65pt;
	overflow: hidden;
}

#lettersh img {
	float: left;
	top:0;
}


/* POP ART */

#popart {
	position: relative;
	width: 100%;
	height: 500pt;
	}

#popartblue {
	background-color: #D9DAD6;
    position: relative;
	width: 30%;
	height: 17vw;
    align-items: center;
	}
#poparttitle {
	position: absolute;
	left:25%;
	top:23%;
	width: 120%;
	}

t {
	font-family: ambroise-std, serif;
	position: relative;
	font-size: 6vw;
	font-style: normal;
	margin:0;
	left: 20%;
	}


h1 {
	font-family: realist, sans-serif;
	position: relative;
	font-size: 4vw;
	font-style: normal;
	margin:0;
	}

h2 {
	font-family: realist, sans-serif;
	position: absolute;
	font-size: 2vw;
	font-style: normal;
	float:left;
	left: 20%;
	bottom: -3pt;
	margin: 0;
	line-height: 0;
}

#poparttext{
	position: relative;
	float: left;
	margin-left: 15%;
	margin-right: 15%;
	width: 70%;
	margin-top: 40pt;
	margin-bottom: 80pt;
	clear:both;
}

b {
	font-family: realist, sans-serif;
	position: relative;
	font-size: 17pt;
	font-weight: 500;
	font-style: normal;
}

#pictures {
	position: relative;
	width: 100%;
	height: 150vw;
}

#pictureblue {
	position: relative;
	width: 65vw;
	height: 90vw;
	margin-left:auto; 
	margin-right:0;
	background-color: #D9DAD6;
}

#arttitle {
	position: absolute;
	top:5vw;
	left: -31%;
	width: 100%;
}

#images {
	display: block;
	position: absolute;
  	top: 15vw;
	height: 70vw;
	width: 70%;
	margin-left: 15%;
  	margin-right: 15%;
	z-index: 4;
}

#img1 {
	position: relative;
	width: 35%;
	height: 13%;
	float: left;
}


#img1img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#img1img img{
	position:absolute; 
	bottom:0;
	left: 4pt;
	width: 100%;
	height: auto;
}

#img1txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}


#img2 {
	position: relative;
	width: 35%;
	height: 13%;
	float: right;
}


#img2img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#img2img img{
	position:absolute; 
	bottom:0;
	left: 4pt;
	width: 100%;
	height: auto;
}

#img2txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}	
	
#img3 {
	position: relative;
	width: 35%;
	height: 13%;
	float: left;
	padding-top:40%;
}


#img3img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#img3img img{
	position:absolute; 
	bottom:0;
	left: 4pt;
	width: 100%;
	height: auto;
}

#img3txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}


#img4 {
	position: relative;
	width: 35%;
	height: 13%;
	float:right;
	padding-top:40%;
}


#img4img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#img4img img{
	position:absolute; 
	bottom:0;
	left: 4pt;
	width: 100%;
	height: auto;
}

#img4txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}



#img5 {
	position: relative;
	width: 35%;
	height: 13%;
	float:left;
	padding-top:55%;
}


#img5img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#img5img img{
	position:absolute; 
	bottom:0;
	left: 4pt;
	width: 100%;
	height: auto;
}

#img5txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}


#img6 {
	position: relative;
	width: 35%;
	height: 13%;
	float:right;
	padding-top:55%;
}


#img6img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#img6img img{
	position:absolute; 
	bottom:0;
	left: 4pt;
	width: 100%;
	height: auto;
}

#img6txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}


h3 {font-family: realist, sans-serif;
	position: relative;
	font-size: 1.5vw;
	font-style: normal;
	float:left;
	margin-top: 4%;
	line-height: 1;
	}


#art {
	position: relative;
	width: 100%;
	height: 1800pt;
	background-color: #D9DAD6;
	}


#artwhite {
	background-color: #F0E8DF;
	position: relative;
	width: 65%;
	height: 30%;
	top:5%;
	margin-left:auto; 
	margin-right:0;
} 

#artgrey {
	background-color: #F0E8DF;
	position: relative;
	width: 65%;
	height: 24%;
	top:24%;
	margin-left:0; 
	margin-right:auto;
}


#artisttitle {
	position: absolute;
	right:1%;
	top:5%;
	width: 130%;
}

#artists {
	display: block;
	position: absolute;
  	top: 12%;
	width: 70%;
	height: 80%;
	margin-left: 15%;
  	margin-right: 15%;
	z-index: 4;
}


#art1{
	position: relative;
	width: 100%;
	height: 25%;
	float: left;
	top:0;
}

#art1img {
	position: relative;
	width: 35%;
	height: 350pt;
	float: left;
	top:0;
	margin-right: 3%;
	margin-bottom: 10pt;
	overflow: hidden;
	
}
	
#art1img img{
		height: 100%;
		object-fit: cover;
	}
	


#art2{
	position: relative;
	width: 100%;
	height: 28%;
	float: left;
	padding-top:22vh;
}

#art2img {
	position: relative;
	width: 35%;
	height: 350pt;
	float: left;
	top:0;
	margin-right: 3%;
	overflow: hidden;
	
}

#art2img img{
		height: 100%;
		object-fit: cover;
	}
		
	
#art3{
	position: relative;
	width: 100%;
	height: auto;
	float: left;
	padding-top:22vh;
}

#art3img {
	position: relative;
	width: 35%;
	height: 350pt;
	float: left;
	top:0;
	margin-right: 3%;
	overflow: hidden;
	
}

	#art3img img{
		height: 100%;
		object-fit: cover;
	}
	
.text {
	position: relative;
	height: 100%;
}

.text h3 {
	position: relative;
	width: 60%;
	margin-bottom: 3%;
	font-size: 25pt;
	margin-top: -2px;
	float: left;
}

	

#events {
	position: relative;
	width: 100%;
	height: 600pt;
}

#eventsblue {
	background-color: #D9DAD6;
	position: relative;
	width: 30%;
	height: 100%;
	top:0;
	margin-left:0; 
	margin-right:auto;
}

#eventsblue h1 {
	top:5%;
	left:50%;
}

#eventsgrey{
	background-color: #D9DAD6;
	position: relative;
	width: 30%;
	height: 50%;
	bottom:50%;
	margin-left:auto; 
	margin-right:0;
}

#list {
	display: block;
	position: absolute;
  	top:170pt;
	width: 70%;
	height: 65%;
	margin-left: 15%;
  	margin-right: 15%;
	z-index: 4;
}
ul {
	list-style-image:url("letters/liststyle.svg");
}

li {
	margin: 0 0 15pt 0;
}

li b { 
		position: relative;
  		left: 15px;
		top:5pt;
	}


/* swiss */



#swiss {
	position: relative;
	width: 100%;
	height: 50vw;
	}

#swissblue {
	background-color: #D9DAD6;
    position: relative;
	width: 35%;
	height: 17vw;
    align-items: center;
	}

#swisstitle {
	position: absolute;
	left:7%;
	top:25%;
	width: 180%;
	}


#swisstext{
	position: relative;
	float: left;
	margin-left: 15%;
	margin-right: 15%;
	width: 70%;
	margin-top: 80pt;
	margin-bottom: 80pt;
	clear:both;
}



#swisspictures {
	position: relative;
	width: 100%;
	height: 180vw;
	clear:both;
}

#swisspictureblue {
	position: relative;
	width: 65%;
	height: 70%;
	margin-left:auto; 
	margin-right:0;
	background-color: #D9DAD6;
}

#swissarttitle {
	position: absolute;
	right:32%;
	top:5%;
	width: 100%;
}

#swissimages {
	display: block;
	position: absolute;
  	top: 30vw;
	height: 70vw;
	width: 70%;
	margin-left: 15%;
  	margin-right: 15%;
	z-index: 4;
}

#swissimg1 {
	position: relative;
	width: 35%;
	height: 13%;
	float: left;
}


#swissimg1img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#swissimg1img img{
	position:absolute; 
	bottom:0;
	left: 4pt;
}

#swissimg1txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}

#swissimg2 {
	position: relative;
	width: 35%;
	height: 13%;
	float: right;
}


#swissimg2img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#swissimg2img img{
	position:absolute; 
	bottom:0;
	left: 4pt;
}

#swissimg2txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}

#swissimg3 {
	position: relative;
	width: 35%;
	height: 13%;
	float: left;
	padding-top:60%;
}


#swissimg3img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#swissimg3img img{
	position:absolute; 
	bottom:0;
	left: 4pt;
}

#swissimg3txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}



#swissimg4 {
	position: relative;
	width: 35%;
	height: 13%;
	float: right;
	padding-top:60%;
}


#swissimg4img {
    position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#swissimg4img img{
	position:absolute; 
	bottom:0;
	left: 4pt;
}

#swissimg4txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}



#swissimg5 {
position: relative;
	width: 35%;
	height: 13%;
	float: left;
	padding-top:60%;
}


#swissimg5img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#swissimg5img img{
	position:absolute; 
	bottom:0;
	left: 4pt;
}

#swissimg5txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}

#swissimg6 {
position: relative;
	width: 35%;
	height: 13%;
	float: right;
	padding-top:60%;
}


#swissimg6img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#swissimg6img img{
	position:absolute; 
	bottom:0;
	left: 4pt;
}

#swissimg6txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}




#swissart {
	position: relative;
	width: 100%;
	height: 1800pt;
	background-color: #D9DAD6;
	}


#swissartwhite {
	background-color: #F0E8DF;
	position: relative;
	width: 65%;
	height: 27%;
	top:5%;
	margin-left:auto; 
	margin-right:0;
} 

#swissartgrey {
	background-color: #F0E8DF;
	position: relative;
	width: 65%;
	height: 24%;
	top:24%;
	margin-left:0; 
	margin-right:auto;
}


#swissartisttitle {
	position: absolute;
	right:1%;
	top:5%;
	width: 130%;
}

#swissartists {
	display: block;
	position: absolute;
  	top: 12%;
	width: 70%;
	height: 80%;
	margin-left: 15%;
  	margin-right: 15%;
	z-index: 4;
}


#swissart1{
	position: relative;
	width: 100%;
	height: 25%;
	float: left;
	top:0;
}

#swissart1img {
	position: relative;
	width: 35%;
	height: 350pt;
	float: left;
	top:0;
	margin-right: 3%;
	margin-bottom: 10pt;
	overflow: hidden;

}
	
	#swissart1img img{
		height: 100%;
		object-fit: cover;
	}

#swissart2{
	position: relative;
	width: 100%;
	height: 28%;
	float: left;
	padding-top:22vh;
}

#swissart2img {
	position: relative;
	width: 35%;
	height: 350pt;
	float: left;
	top:0;
	margin-right: 3%;
	margin-bottom: 10pt;
	overflow: hidden;
	
}
	
		#swissart2img img{
		width: 100%;
		object-fit: cover;
	}

	

#swissart3{
	position: relative;
	width: 100%;
	height: auto;
	float: left;
	padding-top:22vh;
}

#swissart3img {
	position: relative;
	width: 35%;
	height: 350pt;
	float: left;
	top:0;
	margin-right: 3%;
	overflow: hidden;
	
}

		#swissart3img img{
		width: 100%;
		object-fit: cover;
	}


#swissevents {
	position: relative;
	width: 100%;
	height: 600pt;
}

#swisseventsblue {
	background-color: #D9DAD6;
	position: relative;
	width: 30%;
	height: 100%;
	top:0;
	margin-left:0; 
	margin-right:auto;
}

#swisseventsblue h1 {
	top:5%;
	left:49%;
}

#swisseventsgrey{
	background-color: #D9DAD6;
	position: relative;
	width: 30%;
	height: 50%;
	bottom:50%;
	margin-left:auto; 
	margin-right:0;
}

#swisslist {
	display: block;
	position: absolute;
  	bottom:0;
	width: 70%;
	height: 65%;
	margin-left: 15%;
  	margin-right: 15%;
	top: 28%;
	z-index: 4;
}


/* psychedelic */



#psychedelic {
	position: relative;
	width: 100%;
	height: 650pt;
	}

#psychedelicblue {
	background-color: #D9DAD6;
    position: relative;
	width: 40%;
	height: 17vw;
    align-items: center;
	}

#psychedelictitle {
	position: absolute;
	left:2%;
	top:25%;
	width: 180%;
	}


#psychedelictext{
	position: relative;
	float: left;
	left:15%;
	right: 15%;
	width: 70%;
	margin-top: 80pt;
	clear:both;
}



#psychedelicpictures {
	position: relative;
	width: 100%;
	height: 180vw;
}

#psychedelicpictureblue {
	position: relative;
	width: 65%;
	height: 70%;
	margin-left:auto; 
	margin-right:0;
	background-color: #D9DAD6;
}

#psychedelicarttitle {
	position: absolute;
	right:33%;
	top:5%;
	width: 100%;
}

#psychedelicimages {
	display: block;
	position: absolute;
  	top: 35vw;
	height: 70vw;
	width: 70%;
	margin-left: 15%;
  	margin-right: 15%;
	z-index: 4;
}

#psychedelicimg1 {
	position: relative;
	width: 35%;
	height: 13%;
	float: left;
}


#psychedelicimg1img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#psychedelicimg1img img{
	position:absolute; bottom:0;
}

#psychedelicimg1txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}

#psychedelicimg2 {
position: relative;
	width: 35%;
	height: 13%;
	float: right;
}


#psychedelicimg2img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#psychedelicimg2img img{
	position:absolute; bottom:0
}

#psychedelicimg2txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}

#psychedelicimg3 {
	position: relative;
	width: 35%;
	height: 13%;
	float: left;
	padding-top:60%;
}


#psychedelicimg3img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#psychedelicimg3img img{
	position:absolute; bottom:0
}

#psychedelicimg3txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}



#psychedelicimg4 {
	position: relative;
	width: 35%;
	height: 13%;
	float: right;
	padding-top:60%;
}


#psychedelicimg4img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#psychedelicimg4img img{
	position:absolute; 
	bottom:0;
}

#psychedelicimg4txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}


#psychedelicimg5 {
	position: relative;
	width: 35%;
	height: 13%;
	float: left;
	padding-top:60%;
}


#psychedelicimg5img {
  position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#psychedelicimg5img img{
	position:absolute; bottom:0
}

#psychedelicimg5txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}

#psychedelicimg6 {
	position: relative;
	width: 35%;
	height: 13%;
	float: right;
	padding-top:60%;
}


#psychedelicimg6img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#psychedelicimg6img img{
	position:absolute; bottom:0
}

#psychedelicimg6txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}




#psychedelicart {
	position: relative;
	width: 100%;
	height: 2000pt;
	background-color: #D9DAD6;
	}


#psychedelicartwhite {
	background-color: #F0E8DF;
	position: relative;
	width: 65%;
	height: 27%;
	top:5%;
	margin-left:auto; 
	margin-right:0;
} 

#psychedelicartgrey {
	background-color: #F0E8DF;
	position: relative;
	width: 65%;
	height: 24%;
	top:24%;
	margin-left:0; 
	margin-right:auto;
}


#psychedelicartisttitle {
	position: absolute;
	right:1%;
	top:5%;
	width: 130%;
}

#psychedelicartists {
	display: block;
	position: absolute;
  	top: 13%;
	width: 70%;
	height: 80%;
	margin-left: 15%;
  	margin-right: 15%;
	z-index: 4;
}


#psychedelicart1{
	position: relative;
	width: 100%;
	height: 30%;
	float: left;
	top:0;
}

#psychedelicart1img {
	position: relative;
	width: 35%;
	height: 350pt;
	float: left;
	top:0;
	margin-right: 3%;
	margin-bottom: 10pt;
	overflow: hidden;
	
}

	#psychedelicart1img img {
		width: auto;
	height: 100%;
	}
	
	

#psychedelicart2{
	position: relative;
	width: 100%;
	height: 30%;
	float: left;
	padding-top:22vh;
}

#psychedelicart2img {
	position: relative;
	width: 35%;
	height: 350pt;
	float: left;
	top:0;
	margin-right: 3%;
	margin-bottom: 10pt;
	overflow: hidden;
	
}

	#psychedelicart2img img{
		height: 100%;
		object-fit: cover;
	}
	
#psychedelicart3{
	position: relative;
	width: 100%;
	height: auto;
	float: left;
	padding-top:22vh;
}

#psychedelicart3img {
	position: relative;
	width: 35%;
	height: 350pt;
	float: left;
	top:0;
	margin-right: 3%;
	margin-bottom: 10pt;
	overflow: hidden;
	
}
	
	
	#psychedelicart3img img{
		width: 100%;
		object-fit: cover;
	}



#psychedelicevents {
	position: relative;
	width: 100%;
	height: 640pt;
}

#psychedeliceventsblue {
	background-color: #D9DAD6;
	position: relative;
	width: 30%;
	height: 100%;
	top:0;
	margin-left:0; 
	margin-right:auto;
}

#psychedeliceventsblue h1 {
	top:5%;
	left:50%;
}

#psychedeliceventsgrey{
	background-color: #D9DAD6;
	position: relative;
	width: 30%;
	height: 50%;
	bottom:50%;
	margin-left:auto; 
	margin-right:0;
}

#psychedeliclist {
	display: block;
	position: absolute;
  	bottom:0;
	width: 70%;
	height: 65%;
	margin-left: 15%;
  	margin-right: 15%;
	top:190pt;
	z-index: 4;
}




/* grafitti */



#graffiti {
	position: relative;
	width: 100%;
	height: 650pt;
	}

#graffitiblue {
	background-color: #D9DAD6;
    position: relative;
	width: 40%;
	height: 17vw;
    align-items: center;
	}

#graffitititle {
	position: absolute;
	left:-4%;
	top:25%;
	width: 200%;
	}


#graffititext{
	position: relative;
	float: left;
	margin-left: 15%;
	margin-right: 15%;
	width: 70%;
	margin-top: 80pt;
	clear:both;
}



#graffitipictures {
	position: relative;
	width: 100%;
	height: 160vw;
}

#graffitipictureblue {
	position: relative;
	width: 65%;
	height: 70%;
	margin-left:auto; 
	margin-right:0;
	background-color: #D9DAD6;
}

#graffitiarttitle {
	position: absolute;
	right:32%;
	top:5%;
	width: 100%;
}

#graffitiimages {
	display: block;
	position: absolute;
  	top: 37vw;
	height: 70vw;
	width: 70%;
	margin-left: 15%;
  	margin-right: 15%;
	z-index: 4;
}

#graffitiimg1 {
	position: relative;
	width: 35%;
	height: 13%;
	float: left;
	
}


#graffitiimg1img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
	
}

#graffitiimg1img img{
	position:absolute; bottom:0;
	left:5pt;
}

#graffitiimg1txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}

#graffitiimg2 {
	position: relative;
	width: 35%;
	height: 13%;
	float: right;
}


#graffitiimg2img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#graffitiimg2img img{
	position:absolute; bottom:0;
	left:5pt;
}

#graffitiimg2txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}

#graffitiimg3 {
	position: relative;
	width: 35%;
	height: 13%;
	float: left;
	top:43%;
}


#graffitiimg3img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#graffitiimg3img img{
	position:absolute; bottom:0;
	left:5pt;
}

#graffitiimg3txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}



#graffitiimg4 {
	position: relative;
	width: 35%;
	height: 13%;
	float: right;
	top:43%;
}


#graffitiimg4img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#graffitiimg4img img{
	position:absolute; bottom:0;
	left:5pt;
}

#graffitiimg4txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}


#graffitiimg5 {
	position: relative;
	width: 35%;
	height: 13%;
	float: left;
	top:88%;
}


#graffitiimg5img {
	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#graffitiimg5img img{
	position:absolute; bottom:0;
	left:5pt;
}

#graffitiimg5txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}

#graffitiimg6 {
	position: relative;
	width: 35%;
	height: 13%;
	float: right;
	top:88%;
}


#graffitiimg6img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#graffitiimg6img img{
	position:absolute; bottom:0;
	left:5pt;
}

#graffitiimg6txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}




#graffitiart {
	position: relative;
	width: 100%;
	height: 1800pt;
	background-color: #D9DAD6;
	}


#graffitiartwhite {
	background-color: #F0E8DF;
	position: relative;
	width: 65%;
	height: 27%;
	top:5%;
	margin-left:auto; 
	margin-right:0;
} 

#graffitiartgrey {
	background-color: #F0E8DF;
	position: relative;
	width: 65%;
	height: 24%;
	top:24%;
	margin-left:0; 
	margin-right:auto;
}


#graffitiartisttitle {
	position: absolute;
	right:1%;
	top:5%;
	width: 130%;
}

#graffitiartists {
	display: block;
	position: absolute;
  	top: 14%;
	width: 70%;
	height: 80%;
	margin-left: 15%;
  	margin-right: 15%;
	z-index: 4;
}


#graffitiart1{
	position: relative;
	width: 100%;
	height: 30%;
	float: left;
	top:0;
}

#graffitiart1img {
	position: relative;
	width: 35%;
	height: 350pt;
	float: left;
	top:0;
	margin-right: 3%;
	margin-bottom: 10pt;
	overflow: hidden;
	
}


	#graffitiart1img img{
		width: 100%;
		object-fit: cover;
	}
	
	

#graffitiart2{
	position: relative;
	width: 100%;
	height: 30%;
	float: left;
	padding-top:27vh;
}

#graffitiart2img {
	position: relative;
	width: 35%;
	height: 350pt;
	float: left;
	top:0;
	margin-right: 3%;
	margin-bottom: 10pt;
	overflow: hidden;
	
}
	

	#graffitiart2img img{
		height: 100%;
		object-fit: cover;
	}

#graffitiart3{
	position: relative;
	width: 100%;
	height: auto;
	float: left;
	padding-top:22vh;
}

#graffitiart3img {
	position: relative;
	width: 35%;
	height: 350pt;
	float: left;
	top:0;
	margin-right: 3%;
	margin-bottom: 10pt;
	overflow: hidden;
	
}
	
	
	#graffitiart3img img{
		width: 100%;
		object-fit: cover;
	}



#graffitievents {
	position: relative;
	width: 100%;
	height: 550pt;
}

#graffitieventsblue {
	background-color: #D9DAD6;
	position: relative;
	width: 30%;
	height: 100%;
	top:0;
	margin-left:0; 
	margin-right:auto;
}

#graffitieventsblue h1 {
	top:5%;
	left:50%;
}

#graffitieventsgrey{
	background-color: #D9DAD6;
	position: relative;
	width: 30%;
	height: 50%;
	bottom:50%;
	margin-left:auto; 
	margin-right:0;
}

#graffitilist {
	display: block;
	position: absolute;
  	bottom:0;
	width: 70%;
	height: 65%;
	margin-left: 15%;
  	margin-right: 15%;
	top:190pt;
	z-index: 4;
}





/* punk */



#punk {
position: relative;
	width: 100%;
	height: 650pt;
	}

#punkblue {
	background-color: #D9DAD6;
    position: relative;
	width: 40%;
	height: 17vw;
    align-items: center;
	}

#punktitle {
	position: absolute;
	left:-4%;
	top:25%;
	width: 200%;
	}



#punktext{
	position: relative;
	float: left;
	margin-left: 15%;
	margin-right: 15%;
	width: 70%;
	margin-top: 80pt;
	clear:both;
}



#punkpictures {
		position: relative;
	width: 100%;
	height: 140vw;
}

#punkpictureblue {
	position: relative;
	width: 65%;
	height: 70%;
	margin-left:auto; 
	margin-right:0;
	background-color: #D9DAD6;
}

#punkarttitle {
	position: absolute;
	right:31%;
	top:5%;
	width: 100%;
}

#punkimages {
	display: block;
	position: absolute;
  	top: 30vw;
	height: 80vw;
	width: 70%;
	margin-left: 15%;
  	margin-right: 15%;
	z-index: 4;
}

#punkimg1 {
	position: relative;
	width: 35%;
	height: 13%;
	float: left;
}


#punkimg1img {
    position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#punkimg1img img{
	position:absolute; bottom:0;
	left:10pt;
}

#punkimg1txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}

#punkimg2 {
	position: relative;
	width: 35%;
	height: 13%;
	float: right;
}


#punkimg2img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#punkimg2img img{
	position:absolute; bottom:0;
	left: 10pt;
}

#punkimg2txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}

#punkimg3 {
	position: relative;
	width: 35%;
	height: 13%;
	float: left;
	top:35%;
}


#punkimg3img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#punkimg3img img{
	position:absolute; bottom:0;
	left: 10pt;
}

#punkpunkimg3txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}



#punkimg4 {
	position: relative;
	width: 35%;
	height: 13%;
	float: right;
	top:35%;
}


#punkimg4img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#punkimg4img img{
	position:absolute; bottom:0;
	left: 10pt;
}

#punkimg4txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}


#punkimg5 {
	position: relative;
	width: 35%;
	height: 13%;
	float: left;
	top:60%;
}


#punkimg5img {
  position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#punkimg5img img{
	position:absolute; bottom:0;
	left: 10pt;
}

#punkimg5txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}

#punkimg6 {
	position: relative;
	width: 35%;
	height: 13%;
	float: right;
	top:60%;
}


#punkimg6img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#punkimg6img img{
	position:absolute; bottom:0;
	left: 10pt;
}

#punkimg6txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}




#punkart {
	position: relative;
	width: 100%;
	height: 1720pt;
	background-color: #D9DAD6;
	}


#punkartwhite {
	background-color: #F0E8DF;
	position: relative;
	width: 65%;
	height: 27%;
	top:5%;
	margin-left:auto; 
	margin-right:0;
} 

#punkartgrey {
	background-color: #F0E8DF;
	position: relative;
	width: 65%;
	height: 24%;
	top:24%;
	margin-left:0; 
	margin-right:auto;
}


#punkartisttitle {
	position: absolute;
	right:1%;
	top:5%;
	width: 130%;
}

#punkartists {
	display: block;
	position: absolute;
  	top: 15%;
	width: 70%;
	height: 80%;
	margin-left: 15%;
  	margin-right: 15%;
	z-index: 4;
}


#punkart1{
	position: relative;
	width: 100%;
	float: left;
	top:0;
}

#punkart1img {
	position: relative;
	width: 35%;
	height: 350pt;
	float: left;
	top:0;
	margin-right: 3%;
	margin-bottom: 10pt;
	overflow: hidden;

}
	
	
	#punkart1img img{
		width: 100%;
		object-fit: cover;
	}
	

#punkart2{
	position: relative;
	width: 100%;
	float: left;
	margin-top: 22vh;
}

#punkart2img {
		position: relative;
	width: 35%;
	height: 350pt;
	float: left;
	top:0;
	margin-right: 3%;
	margin-bottom: 10pt;
	overflow: hidden;

}

	
	#punkart2img img{
		width: 100%;
		object-fit: cover;
	}

	

#punkart3{
	position: relative;
	width: 100%;
	height: 100vh;
	float: left;
	margin-top: 22vh;
}

#punkart3img {
	position: relative;
	width: 35%;
	height: 350pt;
	float: left;
	top:0;
	margin-right: 3%;
	margin-bottom: 10pt;
	overflow: hidden;

}
 
	#punkart3img img{
		width: 100%;
		object-fit: cover;
	}



#punkevents {
	position: relative;
	width: 100%;
	height: 650pt;
}

#punkeventsblue {
	background-color: #D9DAD6;
	position: relative;
	width: 30%;
	height: 100%;
	top:0;
	margin-left:0; 
	margin-right:auto;
}

#punkeventsblue h1 {
	top:5%;
	left:50%;
}

#punkeventsgrey{
	background-color: #D9DAD6;
	position: relative;
	width: 30%;
	height: 50%;
	bottom:50%;
	margin-left:auto; 
	margin-right:0;
}

#punklist {
	display: block;
	position: absolute;
  	bottom:0;
	top:190pt;
	width: 70%;
	height: 65%;
	margin-left: 15%;
  	margin-right: 15%;
	z-index: 4;
}
	
}









/* tablet */

 
@media only screen and (max-width: 1200px) and (min-width: 1000px) {
   


#navigation, #menuToggle, #checkbox, #menu, #arrow2phone {
		display: none !important;
	}

/* headde pc */
	
	#footerbottom {
    clear: both;
    position: relative;
	text-align: center;
	width: 100vw;
	margin-top: 20pt;
	margin-bottom: 20pt;
}

#footerbottom b {
	font-family: realist, sans-serif;
	font-size: 2vw;
	font-weight: 600;
	font-style: normal;
	text-align: center;
}
	
	#menypc {
		background-color: #272727;
		width: 100%;
		height: 5vw;
		margin-top: 0px;
		position: fixed;
  		top: 0;
		z-index: 10000;
		align-content: center;
	}
	
	#navindexpc {
		height: auto;
		width: 100%;
		margin-left: auto;
		margin-right: auto;
		text-align: center;
		align-content: center;
		position: absolute;
  		left: 50%;
  		top: 50%;
  		transform: translate(-50%, -50%);
	}
	
	#navindexpc a {
		font-family: realist, sans-serif;
		margin-left: 4%;
		margin-right: 4%;
		font-weight: 600;
		font-size: 1.5vw;
		text-decoration: none;
		color: #F0E8DF  ;
	}
	
	#navindexpc a:hover{
		color: #868182;
	}


#all {
	position: absolute;
	display: table;
	width: 100%;
	height: 100%;
}

#gdh2{
	position: relative;
	width: 100%;
	height: 100vh;
	height: calc(var(--vh, 1vh) * 100);
	overflow: hidden;
}

#gdh2blue {
	background-color: #D9DAD6;
	float: left;
    width: 40%;
    height:40%;
	position: relative;
	display: flex;
  	align-items: center;
}

#gdh2blue t {
	font-family: realist, sans-serif;
	font-size: 60px;
	font-style: normal;
	margin-left: 10%;
	margin-top: 20pt;
	position: absolute;
	
}

#letters {
	float: left;
    width: 100%;
    height:50%;
	position: absolute;
}

#lettersg {
	float: left;
    width: 25%;
    height:130%;
	top:75pt;
	overflow: hidden;
	position: relative;
	z-index: 100;
}

#title {
	position: absolute;
	height: 10%;
	width: 60%;
	top:34%;
	text-align: left;
	align-content: center;
  	left: 46%;
  	transform: translate(-50%, -50%);
	
}

#title t {
	font-family: realist, sans-serif;
	font-size: 5vw;
	font-weight: 600;
	font-style: normal;
	
}

#lettersg img {
	float: right;
	top:0;
}

#lettersd {
	float: right;
    width: 25%;
    height:90%;
	bottom:0;
	top:30%;
	right: -35pt;
	overflow: hidden;
	position: absolute;
}

#lettersd img {
	float: left;
	top:0;
}

#footer {
	float: right;
    width: 100%;
    height:70%;
	bottom:0;
	position: absolute;
}

#gdh2grey {
	position: absolute;
	height: 50%;
	width: 100%;
	bottom: 0;
	display: flex;
  	align-items: center;
	background-color: #868182;
}

#arrow2 {
	position: absolute;
	width: 35vw;
 	margin-left: 32.5vw;
	top:100pt;

}

#lettersh {
	position: absolute;
	height: 60%;
	width: 34%;
	right: 0pt;
	bottom:-65pt;
	overflow: hidden;
}

#lettersh img {
	float: left;
	top:0;
}


/* POP ART */

#popart {
	position: relative;
	width: 100%;
	height: 550pt;
	}

#popartblue {
	background-color: #D9DAD6;
    position: relative;
	width: 30%;
	height: 17vw;
    align-items: center;
	}
#poparttitle {
	position: absolute;
	left:25%;
	top:23%;
	width: 120%;
	}

t {
	font-family: ambroise-std, serif;
	position: relative;
	font-size: 6vw;
	font-style: normal;
	margin:0;
	left: 20%;
	}


h1 {
	font-family: realist, sans-serif;
	position: relative;
	font-size: 4vw;
	font-style: normal;
	margin:0;
	}

h2 {
	font-family: realist, sans-serif;
	position: absolute;
	font-size: 2vw;
	font-style: normal;
	float:left;
	left: 20%;
	bottom: -3pt;
	margin: 0;
	line-height: 0;
}

#poparttext{
	position: relative;
	float: left;
	margin-left: 15%;
	margin-right: 15%;
	width: 70%;
	margin-top: 50pt;
	margin-bottom: 80pt;
	clear:both;
}

b {
	font-family: realist, sans-serif;
	position: relative;
	font-size: 17pt;
	font-weight: 500;
	font-style: normal;
}

#pictures {
	position: relative;
	width: 100%;
	height: 150vw;
}

#pictureblue {
	position: relative;
	width: 65vw;
	height: 90vw;
	margin-left:auto; 
	margin-right:0;
	background-color: #D9DAD6;
}

#arttitle {
	position: absolute;
	top:5vw;
	left: -31%;
	width: 100%;
}

#images {
	display: block;
	position: absolute;
  	top: 15vw;
	height: 70vw;
	width: 70%;
	margin-left: 15%;
  	margin-right: 15%;
	z-index: 4;
}

#img1 {
	position: relative;
	width: 35%;
	height: 13%;
	float: left;
}


#img1img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#img1img img{
	position:absolute; 
	bottom:0;
	left: 4pt;
	width: 100%;
	height: auto;
}

#img1txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}


#img2 {
	position: relative;
	width: 35%;
	height: 13%;
	float: right;
}


#img2img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#img2img img{
	position:absolute; 
	bottom:0;
	left: 4pt;
	width: 100%;
	height: auto;
}

#img2txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}	
	
#img3 {
	position: relative;
	width: 35%;
	height: 13%;
	float: left;
	padding-top:40%;
}


#img3img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#img3img img{
	position:absolute; 
	bottom:0;
	left: 4pt;
	width: 100%;
	height: auto;
}

#img3txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}


#img4 {
	position: relative;
	width: 35%;
	height: 13%;
	float:right;
	padding-top:40%;
}


#img4img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#img4img img{
	position:absolute; 
	bottom:0;
	left: 4pt;
	width: 100%;
	height: auto;
}

#img4txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}



#img5 {
	position: relative;
	width: 35%;
	height: 13%;
	float:left;
	padding-top:55%;
}


#img5img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#img5img img{
	position:absolute; 
	bottom:0;
	left: 4pt;
	width: 100%;
	height: auto;
}

#img5txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}


#img6 {
	position: relative;
	width: 35%;
	height: 13%;
	float:right;
	padding-top:55%;
}


#img6img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#img6img img{
	position:absolute; 
	bottom:0;
	left: 4pt;
	width: 100%;
	height: auto;
}

#img6txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}


h3 {font-family: realist, sans-serif;
	position: relative;
	font-size: 1.5vw;
	font-style: normal;
	float:left;
	margin-top: 4%;
	line-height: 1;
	}


#art {
	position: relative;
	width: 100%;
	height: 1700pt;
	background-color: #D9DAD6;
	}


#artwhite {
	background-color: #F0E8DF;
	position: relative;
	width: 65%;
	height: 27%;
	top:5%;
	margin-left:auto; 
	margin-right:0;
} 

#artgrey {
	background-color: #F0E8DF;
	position: relative;
	width: 65%;
	height: 24%;
	top:24%;
	margin-left:0; 
	margin-right:auto;
}


#artisttitle {
	position: absolute;
	right:1%;
	top:5%;
	width: 130%;
}

#artists {
	display: block;
	position: absolute;
  	top: 12%;
	width: 70%;
	height: 80%;
	margin-left: 15%;
  	margin-right: 15%;
	z-index: 4;
}


#art1{
	position: relative;
	width: 100%;
	height: 25%;
	float: left;
	top:0;
}

#art1img {
	position: relative;
	width: 35%;
	height: 350pt;
	float: left;
	top:0;
	margin-right: 3%;
	margin-bottom: 10pt;
	overflow: hidden;
	
}
	
#art1img img{
		height: 100%;
		object-fit: cover;
	}
	


#art2{
	position: relative;
	width: 100%;
	height: 28%;
	float: left;
	padding-top:24vh;
}

#art2img {
	position: relative;
	width: 35%;
	height: 350pt;
	float: left;
	top:0;
	margin-right: 3%;
	overflow: hidden;
	
}

#art2img img{
		height: 100%;
		object-fit: cover;
	}
		
	
#art3{
	position: relative;
	width: 100%;
	height: auto;
	float: left;
	padding-top:24vh;
}

#art3img {
	position: relative;
	width: 35%;
	height: 350pt;
	float: left;
	top:0;
	margin-right: 3%;
	overflow: hidden;
	
}

	#art3img img{
		height: 100%;
		object-fit: cover;
	}
	
.text {
	position: relative;
	height: 100%;
}

.text h3 {
	position: relative;
	width: 60%;
	margin-bottom: 3%;
	font-size: 25pt;
	margin-top: -2px;
	float: left;
}

	

#events {
	position: relative;
	width: 100%;
	height: 600pt;
}

#eventsblue {
	background-color: #D9DAD6;
	position: relative;
	width: 30%;
	height: 100%;
	top:0;
	margin-left:0; 
	margin-right:auto;
}

#eventsblue h1 {
	top:5%;
	left:50%;
}

#eventsgrey{
	background-color: #D9DAD6;
	position: relative;
	width: 30%;
	height: 50%;
	bottom:50%;
	margin-left:auto; 
	margin-right:0;
}

#list {
	display: block;
	position: absolute;
  	top:160pt;
	width: 70%;
	height: 65%;
	margin-left: 15%;
  	margin-right: 15%;
	z-index: 4;
}
ul {
	list-style-image:url("letters/liststyle.svg");
}

li {
	margin: 0 0 15pt 0;
}

li b { 
		position: relative;
  		left: 15px;
		top:5pt;
	}


/* swiss */



#swiss {
	position: relative;
	width: 100%;
	height: 70vw;
	}

#swissblue {
	background-color: #D9DAD6;
    position: relative;
	width: 35%;
	height: 17vw;
    align-items: center;
	}

#swisstitle {
	position: absolute;
	left:7%;
	top:25%;
	width: 180%;
	}


#swisstext{
	position: relative;
	float: left;
	margin-left: 15%;
	margin-right: 15%;
	width: 70%;
	margin-top: 80pt;
	margin-bottom: 80pt;
	clear:both;
}



#swisspictures {
	position: relative;
	width: 100%;
	height: 180vw;
	clear:both;
}

#swisspictureblue {
	position: relative;
	width: 65%;
	height: 70%;
	margin-left:auto; 
	margin-right:0;
	background-color: #D9DAD6;
}

#swissarttitle {
	position: absolute;
	right:32%;
	top:5%;
	width: 100%;
}

#swissimages {
	display: block;
	position: absolute;
  	top: 25vw;
	height: 70vw;
	width: 70%;
	margin-left: 15%;
  	margin-right: 15%;
	z-index: 4;
}

#swissimg1 {
	position: relative;
	width: 35%;
	height: 13%;
	float: left;
}


#swissimg1img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#swissimg1img img{
	position:absolute; 
	bottom:0;
	left: 4pt;
}

#swissimg1txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}

#swissimg2 {
	position: relative;
	width: 35%;
	height: 13%;
	float: right;
}


#swissimg2img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#swissimg2img img{
	position:absolute; 
	bottom:0;
	left: 4pt;
}

#swissimg2txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}

#swissimg3 {
	position: relative;
	width: 35%;
	height: 13%;
	float: left;
	padding-top:60%;
}


#swissimg3img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#swissimg3img img{
	position:absolute; 
	bottom:0;
	left: 4pt;
}

#swissimg3txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}



#swissimg4 {
	position: relative;
	width: 35%;
	height: 13%;
	float: right;
	padding-top:60%;
}


#swissimg4img {
    position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#swissimg4img img{
	position:absolute; 
	bottom:0;
	left: 4pt;
}

#swissimg4txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}



#swissimg5 {
position: relative;
	width: 35%;
	height: 13%;
	float: left;
	padding-top:60%;
}


#swissimg5img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#swissimg5img img{
	position:absolute; 
	bottom:0;
	left: 4pt;
}

#swissimg5txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}

#swissimg6 {
position: relative;
	width: 35%;
	height: 13%;
	float: right;
	padding-top:60%;
}


#swissimg6img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#swissimg6img img{
	position:absolute; 
	bottom:0;
	left: 4pt;
}

#swissimg6txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}




#swissart {
	position: relative;
	width: 100%;
	height: 1900pt;
	background-color: #D9DAD6;
	}


#swissartwhite {
	background-color: #F0E8DF;
	position: relative;
	width: 65%;
	height: 27%;
	top:5%;
	margin-left:auto; 
	margin-right:0;
} 

#swissartgrey {
	background-color: #F0E8DF;
	position: relative;
	width: 65%;
	height: 24%;
	top:24%;
	margin-left:0; 
	margin-right:auto;
}


#swissartisttitle {
	position: absolute;
	right:1%;
	top:5%;
	width: 130%;
}

#swissartists {
	display: block;
	position: absolute;
  	top: 12%;
	width: 70%;
	height: 80%;
	margin-left: 15%;
  	margin-right: 15%;
	z-index: 4;
}


#swissart1{
	position: relative;
	width: 100%;
	height: 25%;
	float: left;
	top:0;
}

#swissart1img {
	position: relative;
	width: 35%;
	height: 350pt;
	float: left;
	top:0;
	margin-right: 3%;
	margin-bottom: 10pt;
	overflow: hidden;
	
}
	
	#swissart1img img{
		height: 100%;
		object-fit: cover;
	}

#swissart2{
	position: relative;
	width: 100%;
	height: 28%;
	float: left;
	padding-top:24vh;
}

#swissart2img {
	position: relative;
	width: 35%;
	height: 350pt;
	float: left;
	top:0;
	margin-right: 3%;
	margin-bottom: 10pt;
	overflow: hidden;
	
}
	
		#swissart2img img{
		width: 100%;
		object-fit: cover;
	}

	

#swissart3{
	position: relative;
	width: 100%;
	height: auto;
	float: left;
	padding-top:24vh;
}

#swissart3img {
	position: relative;
	width: 35%;
	height: 350pt;
	float: left;
	top:0;
	margin-right: 3%;
	overflow: hidden;
	
}

		#swissart3img img{
		width: 100%;
		object-fit: cover;
	}


#swissevents {
	position: relative;
	width: 100%;
	height: 600pt;
}

#swisseventsblue {
	background-color: #D9DAD6;
	position: relative;
	width: 30%;
	height: 100%;
	top:0;
	margin-left:0; 
	margin-right:auto;
}

#swisseventsblue h1 {
	top:5%;
	left:49%;
}

#swisseventsgrey{
	background-color: #D9DAD6;
	position: relative;
	width: 30%;
	height: 50%;
	bottom:50%;
	margin-left:auto; 
	margin-right:0;
}

#swisslist {
	display: block;
	position: absolute;
  	bottom:0;
	width: 70%;
	height: 65%;
	margin-left: 15%;
  	margin-right: 15%;
	top: 28%;
	z-index: 4;
}


/* psychedelic */



#psychedelic {
	position: relative;
	width: 100%;
	height: 640pt;
	}

#psychedelicblue {
	background-color: #D9DAD6;
    position: relative;
	width: 40%;
	height: 17vw;
    align-items: center;
	}

#psychedelictitle {
	position: absolute;
	left:2%;
	top:25%;
	width: 180%;
	}


#psychedelictext{
	position: relative;
	float: left;
	left:15%;
	right: 15%;
	width: 70%;
	margin-top: 80pt;
	clear:both;
}



#psychedelicpictures {
	position: relative;
	width: 100%;
	height: 190vw;
}

#psychedelicpictureblue {
	position: relative;
	width: 65%;
	height: 70%;
	margin-left:auto; 
	margin-right:0;
	background-color: #D9DAD6;
}

#psychedelicarttitle {
	position: absolute;
	right:33%;
	top:5%;
	width: 100%;
}

#psychedelicimages {
	display: block;
	position: absolute;
  	top: 30vw;
	height: 70vw;
	width: 70%;
	margin-left: 15%;
  	margin-right: 15%;
	z-index: 4;
}

#psychedelicimg1 {
	position: relative;
	width: 35%;
	height: 13%;
	float: left;
}


#psychedelicimg1img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#psychedelicimg1img img{
	position:absolute; bottom:0;
}

#psychedelicimg1txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}

#psychedelicimg2 {
position: relative;
	width: 35%;
	height: 13%;
	float: right;
}


#psychedelicimg2img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#psychedelicimg2img img{
	position:absolute; bottom:0
}

#psychedelicimg2txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}

#psychedelicimg3 {
	position: relative;
	width: 35%;
	height: 13%;
	float: left;
	padding-top:60%;
}


#psychedelicimg3img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#psychedelicimg3img img{
	position:absolute; bottom:0
}

#psychedelicimg3txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}



#psychedelicimg4 {
	position: relative;
	width: 35%;
	height: 13%;
	float: right;
	padding-top:60%;
}


#psychedelicimg4img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#psychedelicimg4img img{
	position:absolute; 
	bottom:0;
}

#psychedelicimg4txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}


#psychedelicimg5 {
	position: relative;
	width: 35%;
	height: 13%;
	float: left;
	padding-top:60%;
}


#psychedelicimg5img {
  position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#psychedelicimg5img img{
	position:absolute; bottom:0
}

#psychedelicimg5txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}

#psychedelicimg6 {
	position: relative;
	width: 35%;
	height: 13%;
	float: right;
	padding-top:60%;
}


#psychedelicimg6img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#psychedelicimg6img img{
	position:absolute; bottom:0
}

#psychedelicimg6txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}




#psychedelicart {
	position: relative;
	width: 100%;
	height: 2000pt;
	background-color: #D9DAD6;
	}


#psychedelicartwhite {
	background-color: #F0E8DF;
	position: relative;
	width: 65%;
	height: 27%;
	top:3%;
	margin-left:auto; 
	margin-right:0;
} 

#psychedelicartgrey {
	background-color: #F0E8DF;
	position: relative;
	width: 65%;
	height: 24%;
	top:24%;
	margin-left:0; 
	margin-right:auto;
}


#psychedelicartisttitle {
	position: absolute;
	right:1%;
	top:5%;
	width: 130%;
}

#psychedelicartists {
	display: block;
	position: absolute;
  	top: 12%;
	width: 70%;
	height: 80%;
	margin-left: 15%;
  	margin-right: 15%;
	z-index: 4;
}


#psychedelicart1{
	position: relative;
	width: 100%;
	height: 30%;
	float: left;
	top:0;
}

#psychedelicart1img {
	position: relative;
	width: 35%;
	height: 350pt;
	float: left;
	top:0;
	margin-right: 3%;
	margin-bottom: 10pt;
	overflow: hidden;
	
}

	#psychedelicart1img img {
		width: auto;
	height: 100%;
	}
	
	

#psychedelicart2{
	position: relative;
	width: 100%;
	height: 30%;
	float: left;
	padding-top:24vh;
}

#psychedelicart2img {
	position: relative;
	width: 35%;
	height: 350pt;
	float: left;
	top:0;
	margin-right: 3%;
	margin-bottom: 10pt;
	overflow: hidden;
	
}

	#psychedelicart2img img{
		height: 100%;
		object-fit: cover;
	}
	
#psychedelicart3{
	position: relative;
	width: 100%;
	height: auto;
	float: left;
	padding-top:25vh;
}

#psychedelicart3img {
	position: relative;
	width: 35%;
	height: 350pt;
	float: left;
	top:0;
	margin-right: 3%;
	margin-bottom: 10pt;
	overflow: hidden;
	
}
	
	
	#psychedelicart3img img{
		width: 100%;
		object-fit: cover;
	}



#psychedelicevents {
	position: relative;
	width: 100%;
	height: 610pt;
}

#psychedeliceventsblue {
	background-color: #D9DAD6;
	position: relative;
	width: 30%;
	height: 100%;
	top:0;
	margin-left:0; 
	margin-right:auto;
}

#psychedeliceventsblue h1 {
	top:5%;
	left:50%;
}

#psychedeliceventsgrey{
	background-color: #D9DAD6;
	position: relative;
	width: 30%;
	height: 50%;
	bottom:50%;
	margin-left:auto; 
	margin-right:0;
}

#psychedeliclist {
	display: block;
	position: absolute;
  	bottom:0;
	width: 70%;
	height: 65%;
	margin-left: 15%;
  	margin-right: 15%;
	top:170pt;
	z-index: 4;
}




/* grafitti */



#graffiti {
	position: relative;
	width: 100%;
	height: 650pt;
	}

#graffitiblue {
	background-color: #D9DAD6;
    position: relative;
	width: 40%;
	height: 17vw;
    align-items: center;
	}

#graffitititle {
	position: absolute;
	left:-4%;
	top:25%;
	width: 200%;
	}


#graffititext{
	position: relative;
	float: left;
	margin-left: 15%;
	margin-right: 15%;
	width: 70%;
	margin-top: 80pt;
	clear:both;
}



#graffitipictures {
	position: relative;
	width: 100%;
	height: 160vw;
}

#graffitipictureblue {
	position: relative;
	width: 65%;
	height: 70%;
	margin-left:auto; 
	margin-right:0;
	background-color: #D9DAD6;
}

#graffitiarttitle {
	position: absolute;
	right:32%;
	top:5%;
	width: 100%;
}

#graffitiimages {
	display: block;
	position: absolute;
  	top: 30vw;
	height: 70vw;
	width: 70%;
	margin-left: 15%;
  	margin-right: 15%;
	z-index: 4;
}

#graffitiimg1 {
	position: relative;
	width: 35%;
	height: 13%;
	float: left;
	
}


#graffitiimg1img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
	
}

#graffitiimg1img img{
	position:absolute; bottom:0;
	left:5pt;
}

#graffitiimg1txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}

#graffitiimg2 {
	position: relative;
	width: 35%;
	height: 13%;
	float: right;
}


#graffitiimg2img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#graffitiimg2img img{
	position:absolute; bottom:0;
	left:5pt;
}

#graffitiimg2txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}

#graffitiimg3 {
	position: relative;
	width: 35%;
	height: 13%;
	float: left;
	top:43%;
}


#graffitiimg3img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#graffitiimg3img img{
	position:absolute; bottom:0;
	left:5pt;
}

#graffitiimg3txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}



#graffitiimg4 {
	position: relative;
	width: 35%;
	height: 13%;
	float: right;
	top:43%;
}


#graffitiimg4img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#graffitiimg4img img{
	position:absolute; bottom:0;
	left:5pt;
}

#graffitiimg4txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}


#graffitiimg5 {
	position: relative;
	width: 35%;
	height: 13%;
	float: left;
	top:88%;
}


#graffitiimg5img {
	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#graffitiimg5img img{
	position:absolute; bottom:0;
	left:5pt;
}

#graffitiimg5txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}

#graffitiimg6 {
	position: relative;
	width: 35%;
	height: 13%;
	float: right;
	top:88%;
}


#graffitiimg6img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#graffitiimg6img img{
	position:absolute; bottom:0;
	left:5pt;
}

#graffitiimg6txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}




#graffitiart {
	position: relative;
	width: 100%;
	height: 1900pt;
	background-color: #D9DAD6;
	}


#graffitiartwhite {
	background-color: #F0E8DF;
	position: relative;
	width: 65%;
	height: 27%;
	top:3%;
	margin-left:auto; 
	margin-right:0;
} 

#graffitiartgrey {
	background-color: #F0E8DF;
	position: relative;
	width: 65%;
	height: 24%;
	top:24%;
	margin-left:0; 
	margin-right:auto;
}


#graffitiartisttitle {
	position: absolute;
	right:1%;
	top:5%;
	width: 130%;
}

#graffitiartists {
	display: block;
	position: absolute;
  	top: 10%;
	width: 70%;
	height: 80%;
	margin-left: 15%;
  	margin-right: 15%;
	z-index: 4;
}


#graffitiart1{
	position: relative;
	width: 100%;
	float: left;
	top:0;
}

#graffitiart1img {
	position: relative;
	width: 35%;
	height: 350pt;
	float: left;
	top:0;
	margin-right: 3%;
	margin-bottom: 10pt;
	overflow: hidden;
	
}


	#graffitiart1img img{
		width: 100%;
		object-fit: cover;
	}
	
	

#graffitiart2{
	position: relative;
	width: 100%;
	float: left;
	padding-top:24vh;
}

#graffitiart2img {
	position: relative;
	width: 35%;
	height: 350pt;
	float: left;
	top:0;
	margin-right: 3%;
	margin-bottom: 10pt;
	overflow: hidden;
	
}
	

	#graffitiart2img img{
		height: 100%;
		object-fit: cover;
	}

#graffitiart3{
	position: relative;
	width: 100%;
	height: auto;
	float: left;
	padding-top:24vh;
}

#graffitiart3img {
	position: relative;
	width: 35%;
	height: 350pt;
	float: left;
	top:0;
	margin-right: 3%;
	margin-bottom: 10pt;
	overflow: hidden;
	
}
	
	
	#graffitiart3img img{
		width: 100%;
		object-fit: cover;
	}



#graffitievents {
	position: relative;
	width: 100%;
	height: 560pt;
}

#graffitieventsblue {
	background-color: #D9DAD6;
	position: relative;
	width: 30%;
	height: 100%;
	top:0;
	margin-left:0; 
	margin-right:auto;
}

#graffitieventsblue h1 {
	top:5%;
	left:50%;
}

#graffitieventsgrey{
	background-color: #D9DAD6;
	position: relative;
	width: 30%;
	height: 50%;
	bottom:50%;
	margin-left:auto; 
	margin-right:0;
}

#graffitilist {
	display: block;
	position: absolute;
  	bottom:0;
	width: 70%;
	height: 65%;
	margin-left: 15%;
  	margin-right: 15%;
	top:170pt;
	z-index: 4;
}





/* punk */



#punk {
position: relative;
	width: 100%;
	height: 700pt;
	}

#punkblue {
	background-color: #D9DAD6;
    position: relative;
	width: 40%;
	height: 17vw;
    align-items: center;
	}

#punktitle {
	position: absolute;
	left:-4%;
	top:25%;
	width: 200%;
	}



#punktext{
	position: relative;
	float: left;
	margin-left: 15%;
	margin-right: 15%;
	width: 70%;
	margin-top: 80pt;
	clear:both;
}



#punkpictures {
		position: relative;
	width: 100%;
	height: 140vw;
}

#punkpictureblue {
	position: relative;
	width: 65%;
	height: 70%;
	margin-left:auto; 
	margin-right:0;
	background-color: #D9DAD6;
}

#punkarttitle {
	position: absolute;
	right:31%;
	top:5%;
	width: 100%;
}

#punkimages {
	display: block;
	position: absolute;
  	top: 22vw;
	height: 80vw;
	width: 70%;
	margin-left: 15%;
  	margin-right: 15%;
	z-index: 4;
}

#punkimg1 {
	position: relative;
	width: 35%;
	height: 13%;
	float: left;
}


#punkimg1img {
    position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#punkimg1img img{
	position:absolute; bottom:0;
	left:10pt;
}

#punkimg1txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}

#punkimg2 {
	position: relative;
	width: 35%;
	height: 13%;
	float: right;
}


#punkimg2img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#punkimg2img img{
	position:absolute; bottom:0;
	left: 10pt;
}

#punkimg2txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}

#punkimg3 {
	position: relative;
	width: 35%;
	height: 13%;
	float: left;
	top:35%;
}


#punkimg3img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#punkimg3img img{
	position:absolute; bottom:0;
	left: 10pt;
}

#punkpunkimg3txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}



#punkimg4 {
	position: relative;
	width: 35%;
	height: 13%;
	float: right;
	top:35%;
}


#punkimg4img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#punkimg4img img{
	position:absolute; bottom:0;
	left: 10pt;
}

#punkimg4txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}


#punkimg5 {
	position: relative;
	width: 35%;
	height: 13%;
	float: left;
	top:60%;
}


#punkimg5img {
  position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#punkimg5img img{
	position:absolute; bottom:0;
	left: 10pt;
}

#punkimg5txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}

#punkimg6 {
	position: relative;
	width: 35%;
	height: 13%;
	float: right;
	top:60%;
}


#punkimg6img {
  	position: relative;
	width: 100%;
	height: 250pt;
	float: right;
	margin-right: 3%;
}

#punkimg6img img{
	position:absolute; bottom:0;
	left: 10pt;
}

#punkimg6txt {
	margin-top:3%;
	position: relative;
	height: 40%;
	clear: both;
}




#punkart {
	position: relative;
	width: 100%;
	height: 1700pt;
	background-color: #D9DAD6;
	}


#punkartwhite {
	background-color: #F0E8DF;
	position: relative;
	width: 65%;
	height: 27%;
	top:3%;
	margin-left:auto; 
	margin-right:0;
} 

#punkartgrey {
	background-color: #F0E8DF;
	position: relative;
	width: 65%;
	height: 24%;
	top:24%;
	margin-left:0; 
	margin-right:auto;
}


#punkartisttitle {
	position: absolute;
	right:1%;
	top:5%;
	width: 130%;
}

#punkartists {
	display: block;
	position: absolute;
  	top: 10%;
	width: 70%;
	height: 80%;
	margin-left: 15%;
  	margin-right: 15%;
	z-index: 4;
}


#punkart1{
	position: relative;
	width: 100%;
	float: left;
	top:0;
}

#punkart1img {
		position: relative;
	width: 35%;
	height: 350pt;
	float: left;
	top:0;
	margin-right: 3%;
	margin-bottom: 10pt;
	overflow: hidden;
	
}
	
	
	#punkart1img img{
		width: 100%;
		object-fit: cover;
	}
	

#punkart2{
	position: relative;
	width: 100%;
	float: left;
	padding-top:24vh;
}

#punkart2img {
		position: relative;
	width: 35%;
	height: 350pt;
	float: left;
	top:0;
	margin-right: 3%;
	margin-bottom: 10pt;
	overflow: hidden;
	
}

	
	#punkart2img img{
		width: 100%;
		object-fit: cover;
	}

	

#punkart3{
	position: relative;
	width: 100%;
	float: left;
	padding-top:24vh;
}

#punkart3img {
	position: relative;
	width: 35%;
	height: 350pt;
	float: left;
	top:0;
	margin-right: 3%;
	margin-bottom: 10pt;
	overflow: hidden;
	
}
 
	#punkart3img img{
		width: 100%;
		object-fit: cover;
	}



#punkevents {
	position: relative;
	width: 100%;
	height: 620pt;
}

#punkeventsblue {
	background-color: #D9DAD6;
	position: relative;
	width: 30%;
	height: 100%;
	top:0;
	margin-left:0; 
	margin-right:auto;
}

#punkeventsblue h1 {
	top:5%;
	left:50%;
}

#punkeventsgrey{
	background-color: #D9DAD6;
	position: relative;
	width: 30%;
	height: 50%;
	bottom:50%;
	margin-left:auto; 
	margin-right:0;
}

#punklist {
	display: block;
	position: absolute;
  	bottom:0;
	top:170pt;
	width: 70%;
	height: 65%;
	margin-left: 15%;
  	margin-right: 15%;
	z-index: 4;
}
	
}