@font-face {
    font-family: univers;
    src: url(font/UniversLTStd.otf);
}

@font-face {
    font-family: 'tof-reg';
    src: url(font/tof/ObliqueFunctionVarVF.ttf) format("truetype-variations");
}

@font-face {
    font-family: 'eva';
    src: url(font/Eva-Regular_13.otf);
}

@font-face {
    font-family: 'textecourant';
    src: url(font/TexteCourante-formalized.otf);
}

@font-face {
    font-family: 'MTsharp';
    src: url(font/MT/mt-sharp-text.otf);
}

@font-face {
    font-family: 'MTcongoth';
    src: url(font/MT/mt-condensed-gothic-sans.otf);
}

@font-face {
    font-family: 'MTnomoregrids';
    src: url(font/MT/MTnomoregrids-condensed.otf);
}

@font-face {
    font-family: 'MTconnomoregrids';
    src: url(font/MT/MTnomoregrids-condensed.otf);
}

@font-face {
    font-family: 'MTthreestripes';
    src: url(font/MT/MTThreeStripes-regular.otf);
}

html {
       overflow-y: scroll;
}

body {
	margin:0;
	padding:0;
	height: 100%;
	width: 100%;
    max-width: 2000px;
    margin: auto;
	font-family: univers, times, sans-serif;
	font-size: 12px;
}

body img {
	width: 100%;
}

a {
	color: black;
	text-decoration: none;
	text-align: center;
    cursor: pointer;
}

a:visited {
	font-style: oblique;
}

a:hover{
	font-style: oblique;
}

a:active{
	font-style: oblique;
}

#header{
	float: none;
	position: absolute;
	width: 200px;
	height: 0px;
	margin-left: calc(50% - (200px / 2));
    clear: both;
}

#nav {
	width: 100%;
	position: fixed;
	padding-top: 5px;
    clear: both;
    height: 25px;
}


#nav1, #nav2, #nav3, #nav4, #nav5 {
	width: calc((100% / 5) - 20px);
	float: left;
	padding: 10px;
	padding-top: 5px;
	text-align: center;
}

#logo {
    width: 170px;
}

#container {
	width:100%;
    max-width: 2000px;
    margin: auto;
	position: absolute;
	height: 100%;
    overflow: hidden;
}

#columns {
	top: 35px;
	height: 100%;
	float: left;
	position: absolute;
    overflow: hidden;
}

/*#col-1{
	width: calc((100% / 5) - 20px);
	height: calc(100% - 20px);
	float: left;
	overflow: scroll;
	padding: 10px;
	padding-top: 0px;
}*/



#col-1 {
    display: inline;
    width: calc(((100% / 5) * 4) - 20px);
	height: 100%;
	float: left;
    overflow: scroll;
	padding: 0px 10px 0px 10px;
}

#col-2, #col-3, #col-4, #wineanddine {
	display: none;
	width: calc(((100% / 5) * 4) - 20px);
	height: 98%;
	float: left;
    overflow: scroll;
	padding: 0px 10px 0px 10px;
}

#col-5{
	width: calc((100% / 5) - 20px);
	height: 100%;
	float: right;
	padding: 0px 10px 0px 10px;
    overflow: scroll;
}

::-webkit-scrollbar {
    -webkit-appearance: none;
    width: 1px;
}


::-webkit-scrollbar-thumb {
    border-radius: 1px;
    background-color: rgba(0,0,0,.5);
    -webkit-box-shadow: 0 0 1px rgba(255,255,255,.5);
}

/*
#img1, #img2, #img3, #img4, #img5, #img6, #img7{
	height: auto;
	float: left;
	display: none;
	overflow: scroll;
	position: absolute;
	margin: auto;

}

*/

h1 {
	font-size: 12px;
	font-weight: normal;
	text-align: justify;
}

h1:after{
	content: "";
	width: 100%;
	display: inline-block;
}

h2{
	font-size: 12px;
	font-weight: normal;
	text-align: justify;
}

h2:after{
	content: "";
	width: 100%;
	display: inline-block;
}

.text{
    width: 550px;
}

.list {
	width: calc((100% / 3) - 20px);
	height: inherit;
	float: left;
	overflow: scroll;
	padding: 10px;
	padding-top: 90px;
}

.content {
	width: calc(((100% / 3) * 2) - 20px);
	height: inherit;
	float: right;
	overflow: scroll;
	padding: 10px;
	padding-top: 0px;
}

#graphiccontent0, #graphiccontent1, #graphiccontent2, #graphiccontent3, #graphiccontent4, #graphiccontent5, #graphiccontent6, #typecontent1, #typecontent2, #typecontent3, #typecontent4, #typecontent5, #othercontent1, #othercontent2, #othercontent3, #othercontent4, #othercontent5, #wineanddine {
	display: none;
}

#graphiccontent1, #typecontent1, #othercontent1 {
	display: none;
}
    
ul {
    list-style-type:circle;
    margin-left: -30px;
}

#tof-reg-editable1 {
    font-family: 'tof-reg', univers;
    font-variation-settings: "slnt" 50, "wght" 0;
    font-size: 8vw;
    transition: font-variation-settings 0.7s ease;
    text-transform: lowercase;
}

#tof-reg-editable1:hover, #tof-reg-editable1:active {
  font-variation-settings: "slnt" 0, "wght" 50;
  outline: none;
}

#tof-reg-editable2 {
    font-family: 'tof-reg', univers;
    font-variation-settings: "slnt" 0, "wght" 25;
    font-size: 1.2vw;
    transition: font-variation-settings 0.7s ease;
    text-transform: lowercase;
}

#tof-reg-editable2:hover, #tof-reg-editable2:active  {
  font-variation-settings: "slnt" 50, "wght" 0;
  outline: none;
}

/*#tof-dis-editable {
    font-family: 'tof-reg', univers;
    font-variation-settings: "slnt" 50, "wght" 0;
    font-size: 60pt;
    outline: 0px solid transparent;
    transition: font-variation-settings 0.7s ease;
    text-transform: lowercase;
}

#tof-dis-editable:hover {
  font-variation-settings: "slnt" 0, "wght" 50;
}*/

#MTsharp-editable {
    font-family: 'MTsharp', univers;
    font-size: 100px;
    line-height: 75px;
    margin-top: 0px;
    outline: 0px solid transparent;
    
}

#MTconnomoregrids-editable {
    font-family: 'MTconnomoregrids', univers;
    font-size: 100px;
    line-height: 75px;
    margin-top: -20px;
    text-transform: lowercase;
    outline: 0px solid transparent;
}

#MTcongoth-editable {
    font-family: 'MTcongoth', univers;
    font-size: 100px;
    
    margin-top: 25px;
    outline: 0px solid transparent;
    
}

#MTthreestripes-editable {
    font-family: 'MTthreestripes', univers;
    font-size: 100px;
    
    margin-top: 0px;
    text-transform: lowercase;
    outline: 0px solid transparent;
}

#eva-editable {
    font-family: 'eva', univers;
    font-size: 100pt;
    margin-top: 0px;
/*    -webkit-font-feature-settings: "liga" 1, "ss01" 1, "ordn" 1, "init" 1, "isol" 1, "medi" 1, "fina" 1, "calt" 1, "onum" 1, "sups" 1;
    -moz-font-feature-settings: "liga" 1, "ss01" 1, "ordn" 1, "init" 1, "isol" 1, "medi" 1, "fina" 1, "calt" 1, "onum" 1, "sups" 1;
    -ms-font-feature-settings: "liga" 1, "ss01" 1, "ordn" 1, "init" 1, "isol" 1, "medi" 1, "fina" 1, "calt" 1, "onum" 1, "sups" 1;
    font-feature-settings: "liga" 1, "ss01" 1, "ordn" 1, "init" 1, "isol" 1, "medi" 1, "fina" 1, "calt" 1, "onum" 1, "sups" 1;*/

}

#textecourant-editable {
    font-family: 'textecourant', univers;
    line-height: 80%;
    font-size: 10vw;
    margin-top: 40px;
    color: #ED1C25;
}

#textecourant-editable-small {
    font-family: 'textecourant', univers;
    font-size: 2.3vw;
    line-height: 100%;
    margin-top: -30px;
}

/*landingpage*/

#MTsharp-editable-land {
    font-family: 'MTsharp', univers;
    font-size: 10vw;
    line-height: 75px;
    margin-top: 20px;
    text-align: center;
    outline: 0px solid transparent;
    
}

#MTconnomoregrids-editable-land {
    font-family: 'MTconnomoregrids', univers;
    font-size: 10vw;
    line-height: 30px;
    margin-top: -60px;
    text-transform: lowercase;
    text-align: center;
    outline: 0px solid transparent;
}

#MTcongoth-editable-land {
    font-family: 'MTcongoth', univers;
    font-size: 10vw;
    text-align: center;
    
    margin-top: -70px;
    outline: 0px solid transparent;
    
}

#MTthreestripes-editable-land {
    font-family: 'MTthreestripes', univers;
    font-size: 10vw;
    text-align: center;
    
    margin-top: -100px;
    text-transform: lowercase;
    outline: 0px solid transparent;
}


#eva-editable-land {
    font-family: 'eva', univers;
    font-size: 10vw;
    margin-top: 0px;
    -webkit-font-feature-settings: "liga" 1, "ss01" 1, "ordn" 1, "init" 1, "isol" 1, "medi" 1, "fina" 1, "calt" 1, "onum" 1, "sups" 1;
    -moz-font-feature-settings: "liga" 1, "ss01" 1, "ordn" 1, "init" 1, "isol" 1, "medi" 1, "fina" 1, "calt" 1, "onum" 1, "sups" 1;
    -ms-font-feature-settings: "liga" 1, "ss01" 1, "ordn" 1, "init" 1, "isol" 1, "medi" 1, "fina" 1, "calt" 1, "onum" 1, "sups" 1;
    font-feature-settings: "liga" 1, "ss01" 1, "ordn" 1, "init" 1, "isol" 1, "medi" 1, "fina" 1, "calt" 1, "onum" 1, "sups" 1;
    text-transform: uppercase;
    text-align: center;

}

#textecourant-editable-land {
    font-family: 'textecourant', univers;
    font-size: 10vw;
    margin-top: -60px;
    text-align: center;
}

.evaimg{
    width: 70%;
}

.dayimg{
    width: 40%;
}

.woordbadpubimg{
    width: 32%;
}

.iwzlogo{
    width: 49%;
}

.woordbadimg{
    width: 75%;
}


@media only screen and (max-width: 950px) {
    /* For mobile phones: */
	
#header{
    position: absolute;
    top: 0;
    clear: both;
    top: 150px;
}
    
#nav {
    position: fixed;
    clear: both;
    width: 100%;
    padding-top: 25px;
    display: block;
}

#nav1 {
	width: 100%;
	display: block;
	padding: 10px;
	padding-top: 5px;
	text-align: center;
}

#nav2, #nav3, #nav4, #nav5 {
	width: calc((100% / 4) - 20px);
	float: left;
	padding: 10px;
	padding-top: 5px;
	text-align: center;
}

#logo {
    width: 60vw;
}
  
.list {
	padding-top: 0px;
}
   
#columns {
	bottom: 0;
	height: calt(100% - 20px);
    width: 100%;
	float: left;
	position: absolute;
	overflow: hidden;
}

#col-1 {
	width: 95%;
    height: 100%;
	padding-top: 45vw;
    height: 100%;
    font-size: 10p;
    overflow: scroll;
}

   
#col-2, #col-3, #col-4 {
	width: 95%;
    height: 100%;
    padding-top: 45vw;
	font-size: 10p;
    overflow: visible;
    display: none;
}
    
#wineanddine {
	width: calc(((100% / 5) * 2) - 40px);
    height: auto;
	font-size: 10p;
    padding-top: 45vw;
    margin-left: auto;
    margin-right: auto;
    overflow: visible;
    display: none;
}
        
    
#col-5 {
	width: 60%;
    height: 100%;
	font-size: 10p;
    margin-top: 45vw;
    margin-left: auto;
    margin-right: auto;
    overflow: scroll;
    display: none;
}

.text {
    width: auto;
}

    
#tof-reg-editable1 {
    font-size: 10vw;
}    
    
#tof-reg-editable2 {
    font-size: 2vw;
}    
    
#textecourant-editable {
    font-size: 12vw;
    margin-top: 10px;
} 
    
#textecourant-editable-small {
    font-size: 3vw;
}



#MTsharp-editable-land {
    font-family: 'MTsharp', univers;
    font-size: 20vw;
    line-height: 75px;
    margin-top: 0px;
    text-align: center;
    outline: 0px solid transparent;
    
}

#MTconnomoregrids-editable-land {
    font-family: 'MTconnomoregrids', univers;
    font-size: 20vw;
    line-height: 30px;
    margin-top: -30px;
    text-transform: lowercase;
    text-align: center;
    outline: 0px solid transparent;
}

#MTcongoth-editable-land {
    font-family: 'MTcongoth', univers;
    font-size: 20vw;
    text-align: center;
    
    margin-top: -10px;
    outline: 0px solid transparent;
    
}

#MTthreestripes-editable-land {
    font-family: 'MTthreestripes', univers;
    font-size: 20vw;
    text-align: center;
    
    margin-top: -30px;
    text-transform: lowercase;
    outline: 0px solid transparent;
}

#textecourant-editable-land {
    font-family: 'textecourant', univers;
    font-size: 20vw;
    margin-top: -30px;
    text-align: center;
}
    
}



@media only screen and (max-width: 640px) {
    /* For mobile phones: */

#logo {
    width: 90vw;
    display: block;
}

#col-1 {
	width: 95%;
	padding-top: 65vw;
    overflow: auto;
}
   
#col-2, #col-3, #col-4 {
	width: 90%;
    padding-top: 65vw;
    height: 98%;    
    display: none;
    overflow: scroll;
}

.list {
	width: calc((100% / 3) - 40px);
	height: inherit;
	float: left;
	overflow: auto;
	padding: 10px;
	padding-top: 0px;
    white-space: normal;
}

.evaimg {
    width: 100%;
}

#wineanddine {
	width: calc(((100% / 5) * 2) - 40px);
    height: auto;
	font-size: 10p;
    padding-top: 65vw;
    margin-left: auto;
    margin-right: auto;
    overflow: visible;
    display: none;
}
        
    
#col-5 {
	width: 60%;
    height: 100%;
	font-size: 10p;
    margin-top: 65vw;
    margin-left: auto;
    margin-right: auto;
    overflow: scroll;
    display: none;
    float: right;
}
    
#MTsharp-editable {
    font-family: 'MTsharp', univers;
    font-size: 10vw;
    line-height: 7vw;
    margin-top: 0px;
    outline: 0px solid transparent;
    
}

#MTconnomoregrids-editable {
    font-family: 'MTconnomoregrids', univers;
    font-size: 10vw;
    line-height: 4vw;
    margin-top: -20px;
    text-transform: lowercase;
    outline: 0px solid transparent;
}

#MTcongoth-editable {
    font-family: 'MTcongoth', univers;
    font-size: 10vw; 
    margin-top: 7vw;
    outline: 0px solid transparent;
    
}

#MTthreestripes-editable {
    font-family: 'MTthreestripes', univers;
    font-size: 10vw;
    margin-top: 0px;
    text-transform: lowercase;
    outline: 0px solid transparent;
}

#tof-reg-editable1 {
    font-size: 10vw;
}    
    
#tof-reg-editable2 {
    font-size: 2.8vw;
}    
    
.text{
    width: auto;
}
    

#img1, #img2, #img3, #img4, #img5, #img6, #img7 {
    position: fixed;
    top: 40px;
}
    
#MTsharp-editable-land {
    font-family: 'MTsharp', univers;
    font-size: 20vw;
    line-height: 75px;
    margin-top: 0px;
    text-align: center;
    outline: 0px solid transparent;
    
}

#MTconnomoregrids-editable-land {
    font-family: 'MTconnomoregrids', univers;
    font-size: 20vw;
    line-height: 30px;
    margin-top: -30px;
    text-transform: lowercase;
    text-align: center;
    outline: 0px solid transparent;
}

#MTcongoth-editable-land {
    font-family: 'MTcongoth', univers;
    font-size: 20vw;
    text-align: center;
    
    margin-top: -10px;
    outline: 0px solid transparent;
    
}

#MTthreestripes-editable-land {
    font-family: 'MTthreestripes', univers;
    font-size: 20vw;
    text-align: center;
    
    margin-top: -30px;
    text-transform: lowercase;
    outline: 0px solid transparent;
}

#textecourant-editable-land {
    font-family: 'textecourant', univers;
    font-size: 20vw;
    margin-top: -30px;
    text-align: center;
}

.landimg {
    width: 100%;
    display: block;
    margin-right: auto;
    margin-left: auto;
}
.woordbadpubimg{
    width: 70%;
}

.dayimg{
    width: 47%;
}

.iwzlogo{
    width: 98%;
}

.woordbadimg{
    width: 98%;
}

}