@font-face {
     font-family: 'gtf_adieu_triallight_slanted';
     src: url('gtfadieutrial-lightslanted-webfont.woff2') format('woff2'),
          url('gtfadieutrial-lightslanted-webfont.woff') format('woff');
     font-weight: normal;
     font-style: normal;
 }

@media screen {
svg {
 width: calc(100vw - 40px);
 margin-left: 20px;
 margin-right: 20px;
 padding-bottom: 5px;
}

text {
 font-family: gtf_adieu_triallight_slanted;}

body, html {
 background-color: white;
 margin: 0;
 padding: 0;}

header {
 z-index: 1300;}

nav {
 font-family: helvetica;
 font-size: 36px;
 font-weight: 200;
 padding-top: 10px;
 padding-left: 20px;
 padding-right: 20px;}

h1 {
 font-family: gtf_adieu_triallight_slanted;
 font-weight: 200;
 font-size: 54px;
 line-height: 1.1;
 margin: 0 0 20px 0;
 padding: 0;}

h2 {
 font-weight: 200;
 font-size: 36px;
 font-family: gtf_adieu_triallight_slanted;
 line-height: 1.1;
 padding-top: 0px;
 margin-top: 20px;}

h3 {
 font-weight: 200;
 font-size: 24px;
 font-family: gtf_adieu_triallight_slanted;
 line-height: 1.2;
 padding-top: 30px;}

h4 {
 font-weight: 200;
 font-size: 18px;
 font-family: gtf_adieu_triallight_slanted;
}

p {
 font-family: helvetica;
 font-size: 18px;
 font-weight: 200;
 line-height: 1.5;}

a {
 color: black;
 text-decoration: none; /* no underline */}

a:hover {
 text-decoration: underline;}

table {
 width: 100%;
 border-collapse: collapse;}

th {
   font-size: 24px;
   font-family: helvetica;
   font-weight: 200;
   text-align: left;}

td {
 padding-top: 15px;
 padding-bottom: 15px;
 padding-right: 20px;
 font-size: 24px;
 font-family: helvetica;
 font-weight: 200;
 text-align: left;
 line-height: 1.2;
 border-bottom: 1px solid black;
 vertical-align: top;
}

tr {
 border-left: none;
 border-right: none;
 border-bottom: 1px solid black;}

img {
 position: absolute;}

video {
 object-fit: cover;
 width: 100vw;
 height: 100vh;
 position: fixed;
 top: 0;
 left: 0;
 z-index: 300;}

button { background-color: black;
 color: white;
 border: none;
 font-size: 36px;
 font-weight: 200;
 padding: 0px 20px 5px 20px;
 border-radius: 2px;
 border: 1px solid black;
cursor: pointer;}

button:hover{
 background: white;
 color: black;}

*.topnav-left, .topnav-right {
 float: left;
 width: 50%;
}

.achtergrond-zwart {
 margin: 0 0 0 0;
 background-color: black;
}
.header-expo {
 height: 300px;
 width: 100vw;
 position: absolute;

}
.topnav-right {
 text-align: right;}

.klok {
   position: absolute;
   width: 100vw;
   padding-bottom: 10px;
   text-align: center;
   bottom: 0;
   z-index: 10;
   display: flex;
   justify-content: center;
   align-items: flex-end;}

.klok2 {
 float: left;
 width: 50%;
 border-top: 1px solid black;
 padding-top: 30px;
 }

.row {
 width: calc(100vw - 40px);
}

.column {
 float: left;}

.left {
 width: calc(50vh - 60px);
 margin-right: 20px;
 }

.right {
 width: calc(50vw - 60px);
 margin-right: 20px;
 margin-left: 10px;}

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

.p-excerpt {
 padding-left: 100px;
 padding-top: 20px;
 padding-bottom: 20px;
 font-family: gtf_adieu_triallight_slanted;}

.a-expo {
 color: white;
}

.h1-links, .h1-rechts {
 font-family: helvetica;
 float: left;
 width: calc(50vw - 20px);
 font-size: 36px;
 padding-top: 20px;
 padding-bottom: 5px;
 border-bottom: 1px solid;
}

.h1-rechts {
 text-align: right;}

.quote {
 margin-left: 0px;
 margin-right: 0px;
 margin-top: -2%;
}

.artikel {
 border-top: 1px solid black;
 margin-bottom: 100px;
 margin-left: 20px;
 margin-right: 20px;
}

.h1-links-bron, .h1-rechts-bron {
 font-family: helvetica;
 float: left;
 width: calc(50vw - 20px);
 font-size: 36px;
 padding-top: 20px;
 padding-bottom: 50px;
 border-top: 1px solid;}

.h1-rechts-bron {
 text-align: right;}

.artikel-quote-bron{
 margin-left: 20px;
 margin-right: 20px;
}

.source, .source-1 {
 border-top: 1px solid;
 padding-top: 10px;
 font-size: 12px;
 margin-top: 0px;
}


.expo-print {
 float: left;
 width: calc(50vw - 20px);
 text-align: right;
 border-top: 1px solid;
   padding-top: 30px;
 margin-bottom: 30px;}

.about-print {
 padding-bottom: 120px;
 margin-left: 20px;
 margin-right: 20px;
}

.printme {
 	display: none;}

.td-titel {
 font-family: gtf_adieu_triallight_slanted;}

 .read-more {
   margin-left: 0px;
   margin-right: 0px;
   padding-top: 10px;
   padding-bottom: 60px;
   border-top: 1px solid black;
 }

 .previous, .next {
   font-family: helvetica;
   font-size: 36px;
   font-weight: 200;
   float: left;
   text-align: left;
   width: 50%;
   padding-top: 20px;
   padding-bottom: 50px;
    border-top: 1px solid;}
 .previous span, .next span{
 	height: 36px;
 	padding: 0 10px 0 10px;
 	display: table-cell;
     	vertical-align: middle;}
 .previous img, .next img{
 	position: relative;
 	height: 36px;
 	}
 .next {
 	 float: right;
  	text-align: right;}

   .previous span:hover, .next span:hover {
     text-decoration: underline;
   }

.geen-margin {margin-left: 0px;
 margin-right: 0px;
}

#print-button {
 width: calc(100vw - 40px);
 text-align: center;
}

#home-expo {
 margin: 0 0 0 0;
 background-color: black;}

#logo {border-bottom: 1px solid black;
 width: calc(100vw - 40px);
 position: relative;
 margin-left: 20px;
margin-right: 20px;
margin-top: 10px;
padding-bottom: 10px;}

#logo-wit {border-bottom: 1px solid black;
 filter: invert(100%);
 width: calc(100vw - 40px);
 position: relative;
 margin-left: 20px;
margin-right: 20px;
margin-top: 10px;
padding-bottom: 10px;}

#expo-uitleg {
 padding-left: 20px;
 padding-right: 20px;
 padding-top: 50vh;
 padding-bottom: 200px;
 background-color: pink;}

#h3-eerste-regel {padding-top: 0px;}

#introductie-about {
 height: calc(100vh - 230px);
 padding-left: 20px;
 padding-right: 20px;
 display: flex;
 justify-content: center;
 align-items: flex-end;}

#introduction-about {
 margin-left: 20px;
 margin-right: 20px;
 margin-top: 120px;
 margin-bottom: 60px;
}

#intro-1, #intro-2 {
 float: left;
 width: calc(50vw - 40px);
 font-size: 24px;
 padding-top: 0px;
}

#intro-1 {
 margin-right: 20px;}

#intro-2 {
 margin-left: 20px;
 margin-bottom: 120px;}

#artikelen-about {
 width: calc(100vw - 40px);
 margin-left: 20px;
 margin-right: 20px;
 margin-bottom: 120px;}

#artikel-titel {
 margin-top: 25vh;
 margin-bottom: 12.5vh;}

#artikel-titel-wit {
   margin-top: 200px;
   margin-bottom: 12.5vh;
   filter: invert(100%);}


#a-active {
 text-decoration: underline;}


 #plaatjes-groep-home {
   margin: 20px 20px 20px 20px;
   z-index: 1200;
   position: absolute;
   border: 1px solid pink;}

#expo-uitleg-admiration-aw {
 background-color: #f43635;
 position: absolute;
 width: calc(100vw - 40px);
 margin-top: 100vh;
 padding-left: 20px;
 padding-right: 20px;
 z-index: 400;
}

#demo {
 text-align: center;
 font-style: italic;}

 #marlene-d-01 {
   width: 20vw;
   margin-left: 50vw;
   margin-top: 5vh;
 }

 #jamie-h-01 {
   width: 10vw;
   margin-left: 70vw;
   margin-top: 70vh;
   margin-bottom: 20px;
 }

 #liu-x-01 {
   width: 35vw;
   margin-left: 5vw;
   margin-top: 30vh;
 }

 #jamie-h-02 {
   width: 10vw;
   margin-left: 0vw;
   margin-top: 15vh;}

 #michael-b-01 {
   width: 20vw;
   margin-left: calc(80vw - 40px);
   margin-top: 30vh;}

 #mamaqueen-01 {
   width: 12.5vw;
   margin-left: 0vw;
   margin-top: 50vh;
 z-index: 400;}

 #rik-v-01 {
   width: 20vw;
   margin-left: 50vw;
   margin-top: 40vh;
 z-index: 400;}


 #myBtn {
 width: 200px;
 font-size: 18px;
 padding: 10px;
 border: none;
 background: white;
 color: black;
 cursor: pointer;
}

#myBtn:hover {
 background: #ddd;
 color: black;}

#expo-quote-admiration-aw {
 margin-top: 110px;
 margin-bottom: 60px;
}

#expo-source {
 float: left;
 width: calc(100vw - 40px);
 margin-bottom: 0px;
}



 .floating1 {
   animation-name: floating;
   animation-duration: 3s;
   animation-iteration-count: infinite;
   animation-timing-function: ease-in-out;}

 .floating2 {
   animation-name: floating;
   animation-duration: 4s;
   animation-iteration-count: infinite;
   animation-timing-function: ease-in-out;}

 @keyframes floating {
   0% { transform: translate(0,  0px); }
   50%  { transform: translate(0, 15px); }
   100%   { transform: translate(0, -0px); }}


}

@media screen and (min-width: 890px) and (max-width: 1115px) {
 h1 {
   font-size: 48px;}
}

@media screen and (max-width: 890px) {
 header {
   padding-top: 5px;
   height: 25vh;}

 nav {
   padding-left: 20px;}

 h1 {
   font-size: 36px;}

 .h1-links, .h1-rechts {
   font-size: 24px;}

 #introductie-about {
     height: 75vh;}
 }

 @media screen and (max-width: 600px) {
   .column, .column-right, .column-left{
   width: calc(100vw - 40px);}

   #intro-1, #intro-2 {
   float: none;
   width: calc(100vw - 40px);
   margin-left: 0px;
   margin-right: 0px; 
   }


   .right {
     margin-left: 0px;
     margin-right: 0px;
   }


   #artikel-titel {
     margin-top: 50vh;
     margin-bottom: 0;
     margin-left: 0;
     margin-right: 0;}

   #p-excerpt {
     padding-left: 50px;}
 }





 @media print {
 	.no-printme, button  {
 		display: none;}

 	.printme  {
 		display: block;}

   @page {
       size: 297mm 420mm;
       margin: 0 0 0 0;}

   @page article {
       size: 210mm 297mm;}

   img {
       width: 100%;
       height: 100%;
       padding: 0 0 0 0;
       margin: 0 0 0 0;
       vertical-align: middle;}
}