<style>
   
	.navmobil {display: none;}
	
  	#navigationcontainer
{	
	position:fixed;
	left: 0px;
    top: 0px;
	line-height:0;
	display: block;
	background-color:#FFFFFF;
	width: 100%;
	height: 77px;
	margin: 0 auto;
	z-index:9999;
}

	#headerbackground {display: none;}
	
/* header */

	#headerwrapper 
{
    position: relative;
    top: 0px;
    margin: 0 auto;
    width:100%;
	z-index: 10;
}

	#header
{
    position: relative;
    top:76px;
    width: 97%;
	height: 72px;
	line-height:0;
	display: flex;
    flex-flow: row nowrap;
    justify-content: space-between;
	margin: 0 auto;
	padding: 0;
	z-index: 8888;
}

	#header-left
{
    order: 1;
    position: relative;
    top:3px;
    width: 113px;
	height: 72px;
	line-height:0;
	display: inline-table;
	padding: 0;
	z-index: 8899;
}

	#header-center
{
    order: 4;
    position: relative;
    top:3px;
	height: 72px;
	line-height:0;
	display: inline-table;
	padding: 0 10px;
	z-index: 8899;
}

	#header-leftredrule,
	#header-rightredrule
{
    flex: 1 1 auto;
    border-bottom:1px dotted #d23e44;
    border-left: 1px dotted #d23e44;
    border-right: 1px dotted #d23e44;
    position: relative;
    top:35px;
	height: 8px;
	line-height:0;
	display: inline-block;
	padding: 0;
	z-index: 0;
}

	#header-leftredrule 
{
	order: 2;
	padding-right: 20px;
}

	#header-rightredrule 
{
	order: 4;
}

	#header-right
{
    order: 7;
    position: relative;
    top:3px;
    width: 136px;
	height: 72px;
	line-height:0;
	display: inline-table;
	padding: 0;
	z-index: 8899;
}

/* end header */

	#secondrulescroll
{	
	position: relative;
  	top: 82px;
  	left: 50%;
  	border-top:1px dotted #000;
  	color:#fff;
  	background-color: none;
  	width: 98%;
  	margin-left: -49%;
  	height:1px;
  	z-index: 10;
}

/* Tertiary Menu */

    #tertiary-banner-container 
{
    order: 1;
    position: relative;
    width: 100%;
    height: calc((100vh - 1vw) - 338px);
    background-color: #000;
    overflow: hidden;
    z-index: 1;
}

    #tertiary-banner-container:after 
{
        content: "";
        background-image: url('../images/tb-down.svg');
        background-position: center 27%;
        background-size: 50% auto;
        background-repeat: no-repeat;
        text-align: center;
        position: absolute;
        bottom: -40px;
        left: 50%;
        transform: translateX(-50%);
        width: 80px;
        height: 80px;
        border: 1px solid #fff;
        border-radius: 50%;
        background-color: #fff;
        z-index: 25;
}

    .tertiary-banner 
{
    position: absolute;
    display: flex;
    flex-flow: column nowrap;
    justify-content: center;
    align-items: center;
    height: 100%;
    box-sizing: border-box;
    overflow: visible;
    background-color: #272727;
    background-size: cover;
    background-position: center;
}

    .tb-left
{
    width: 33.3333%;
    left: 0;
    z-index: 0;
    border-right: 2px solid #fff;
}

    .tb-center
{
    width: 33.3333%;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1;
    border-left: 1px solid #fff;
    border-right: 1px solid #fff;
}

    .tb-right
{
    width: 33.3333%;
    right: 0;
    z-index: 0;
    border-left: 2px solid #fff;
}

    .tb-center:before,
    .tb-center:after {
        content: "";
        background-image: url('../images/tb-x.svg');
        background-position: center;
        background-size: 50% auto;
        background-repeat: no-repeat;
        font-weight: bold;
        color: #272727;
        text-align: center;
        font-size: 44px;
        line-height: 76px;
        position: absolute;
        top: 50%;
        transform: translateY(-50%) rotate(0deg);
        width: 80px;
        height: 80px;
        border: 1px solid #fff;
        border-radius: 50%;
        background-color: #fff;
        z-index: 25;
    }
    
    .tb-center:before {
        left: -43px;
        animation: tb-plus-rotate 8s 0.5s ease forwards infinite;
    }
    
    .tb-center:after {
        right: -43px;
        animation: tb-plus-rotate 8s 1.5s ease forwards infinite;
    }
    
    span.tertiary {
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        font-weight: 900;
        font-size: 30px;
        color: #fff;
        white-space: nowrap;
        -webkit-transition: 300ms;
        transition: 300ms;
        z-index: 20;
    }
    
    .tertiary-banner:hover .tertiary {
        border-bottom: 1px solid #fff;
        padding: 9px 0 8px;
        -webkit-transition: 300ms;
        transition: 300ms;
    }

    @keyframes tb-plus-rotate {
		
		0% {transform: translateY(-50%) rotate(0deg);}
		20% {transform: translateY(-50%) rotate(0deg);}
		25% {transform: translateY(-50%) rotate(45deg);}
		45% {transform: translateY(-50%) rotate(45deg);}
		50% {transform: translateY(-50%) rotate(90deg);}
		70% {transform: translateY(-50%) rotate(90deg);}
		75% {transform: translateY(-50%) rotate(135deg);}
		95% {transform: translateY(-50%) rotate(135deg);}
		100% {transform: translateY(-50%) rotate(180deg);}
	}
	
	@-webkit-keyframes tb-plus-rotate {
		
		0% {transform: translateY(-50%) rotate(0deg);}
		20% {transform: translateY(-50%) rotate(0deg);}
		25% {transform: translateY(-50%) rotate(45deg);}
		45% {transform: translateY(-50%) rotate(45deg);}
		50% {transform: translateY(-50%) rotate(90deg);}
		70% {transform: translateY(-50%) rotate(90deg);}
		75% {transform: translateY(-50%) rotate(135deg);}
		95% {transform: translateY(-50%) rotate(135deg);}
		100% {transform: translateY(-50%) rotate(180deg);}
	}
	
	.tb-tint-l,
	.tb-tint-c,
	.tb-tint-r {
	    position: absolute;
	    left: 0;
	    top: 0;
	    width: 100%;
	    height: 100%;
	    opacity: .3;
	    background-color: #272727;
	    z-index: 10;
	}
	
	.tb-tint-l {
	    opacity: .7;
	    background-color: #2c3886;
	    display: none;
	}
	
	.tb-tint-c {
	    opacity: .7;
	    background-color: #f00000;
	}
	
	.tb-tint-r {
	    opacity: .7;
	    background-color: #272727;
	}
	
	.tb-img {
	    position: absolute;
	    left: 0;
	    top: 0;
	    width: 100%;
	    height: 100%;
	    background-repeat: no-repeat;
	    background-position: center;
	    animation: tb-fade-in-out;
	    animation-duration: 8s;
	    animation-iteration-count: infinite;
	    animation-timing-function: ease-in-out;
	    animation-fill-mode: forwards;
	    background-color: #fff;
	    opacity: 0;
	}
	
	.tb-img-l1 {
	    background-image: url('../images/utrecht-logo-blu-1.jpg');
	    background-size: cover;
	    animation-delay: 0s;
	    z-index: 1;
	}
	
	.tb-img-l2 {
	    background-image: url('../images/pt_symbol_diagram-blu-1.png');
	    background-size: cover;
	    animation-delay: 2s;
	    z-index: 2;
	}
	
	.tb-img-l3 {
	    background-image: url('../images/climatecharge_symbol_diagram-blu-1.png');
	    background-size: cover;
	    animation-delay: 4s;
	    z-index: 3;
	}
	
	.tb-img-l4 {
	    background-image: url('../images/as_leadimage_new_persp2-blu-1.jpg');
	    background-size: cover;
	    animation-delay: 6s;
	    z-index: 4;
	}
	
	.tb-img-c1 {
	    background-image: url('../images/gq-lanz-drk.jpg');
	    background-size: 100% auto;
	    background-color: #393939;
	    animation-delay: 0.5s;
	    z-index: 1;
	}
	
	.tb-img-c2 {
	    background-image: url('../images/details-jake-1.jpg');
	    background-size: cover;
	    animation-delay: 2.5s;
	    background-color: #393939;
	    z-index: 2;
	}
	
	.tb-img-c3 {
	    background-image: url('../featured/images/skulpturen-type_1818.jpg');
	    background-size: cover;
	    background-color: #393939;
	    animation-delay: 4.5s;
	    z-index: 3;
	}
	
	.tb-img-c4 {
	    background-image: url('../images/surface-1-drk.jpg');
	    background-size: 100% auto;
	    background-color: #393939;
	    animation-delay: 6.5s;
	    z-index: 4;
	}
	
	.tb-img-r1 {
	    background-image: url('../images/gaffeur-sample-8-2.png');
	    background-size: cover;
	    animation-delay: 1s;
	    z-index: 1;
	}
	
	.tb-img-r2 {
	    background-image: url('../newsam/images/keyglyphs.png');
	    background-size: cover;
	    animation-delay: 3s;
	    z-index: 2;
	}
	
	.tb-img-r3 {
	    background-image: url('../images/Typonym_samples_85.png');
	    background-size: cover;
	    animation-delay: 5s;
	    z-index: 3;
	}
	
	.tb-img-r4 {
	    background-image: url('../images/Marsam-deck_100924-6.png');
	    background-size: cover;
	    animation-delay: 7s;
	    z-index: 4;
	}
	
	
	 @-webkit-keyframes tb-fade-in-out {
		0% {opacity:0;}
		1% {z-index: 5;}
		10% {opacity:1;}
		25% {opacity:1;}
		30% {opacity:0;}
		31% {z-index: 0;}
		100% {opacity:0;}
	}
	 @keyframes tb-fade-in-out {
		0% {opacity:0;}
		1% {z-index: 5;}
		10% {opacity:1;}
		25% {opacity:1;}
		30% {opacity:0;}
		31% {z-index: 0;}
		100% {opacity:0;}
	}
	
	

/* main content */

	#wrapper 
{
    position: relative;
    top: 0px;
    margin: 0 auto;
    width:100%;
	z-index: 3;
}

	#pagetitle-home 
{
    position: relative;
    width: 98%;
    height: 183px;
    line-height: 0;
    display: flex;
    flex-flow: column nowrap;
    justify-content: center;
    margin: 76px auto 0;
    padding: 0;
    z-index: 0;
    border-bottom: 1px dotted #272727;
}

	#pagetitle-home:after 
{
	content: "";
	background-image: url('https://evanonearth.net/featured/images/downarrw-272727.svg');
	background-size: 12px, auto;
	background-position:  50% center;
	background-repeat: no-repeat;
	position: absolute;
	left: 0;
	bottom: -8px;
	width: 100%;
	height: 15px;
}

/* GQ ARTS BANNER */

	#gqarts1Vid,
	#gqarts2Vid 
{
	position: absolute;
}
	#gqarts1Vid
{
	width: 100%;
	height: 100%;
	object-fit: cover;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

	#gqarts2Vid
{
	display: none;
}

@media (orientation: portrait) {
	#gqarts1Vid {
		height: 100%;
    	width: auto;
    }
}

/* TTHC BANNER */

	#tthc-banner 
{
	opacity: 0;
}

/* BANNER */

	.imgbanner 
{
	overflow: hidden;
}

	.banner-project 
{
    order: 1;
    position: relative;
    width: 100%;
    height: calc((100vh - 1vw) - 338px);
    min-height: 28vw;
}

	.reveal-cont-banner
{
	position: relative;
	display: table;
    width: 100%;
    height: 100%;
    margin: 38px auto 0;
    z-index: 0;
}

	.reveal-cont-banner:before,
	.reveal-cont-banner.banner-top:before 
{
	content: "";
	position: absolute;
	top: -19px;
	left: 1vw;
	width: 98vw;
	height: 1px;
	border-top: 1px dotted #272727;
}

	.reveal-cont-banner:after 
{
	content: "";
	background-image: url('https://evanonearth.net/featured/images/downarrw-272727.svg');
	background-size: 12px, auto;
	background-position:  50% center;
	background-repeat: no-repeat;
	position: absolute;
	left: 0;
	top: -26px;
	width: 100%;
	height: 15px;
}

	.banner-top
{
	margin: 1vw auto 0;
}

	.reveal-cont-banner.banner-top:before,
	.reveal-cont-banner.banner-top:after 
{
	display: none;
}

	.banner-head,
	.banner-headline
{
	position: absolute;
    display: block;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-family: 'Heldane Text Medium','Scotch Roman','Source Serif Pro', serif;
    font-weight: 400;
    font-size: 24px;
    font-style: normal;
    Line-height: 1;
    letter-spacing: .1px;
    text-align: center;
    color: #272727;
}

	span.banner-italmarkers 
{
	font-size: 25px;
	letter-spacing: -1.5px; 
}

	.banner-head
{
	color: #fff;
	padding: 0;
    z-index: 10;
}

	.banner-head a
{
	display: block;
	padding: 54px 0;
	color: #fff;
    text-decoration: none !important;
}

	#gaffeur-banner .banner-head a
{
	color: #000;
}

	.banner-headline 
{
    color: #272727;
    padding: 54px 0;
    z-index: 0; 
}

	.headline-undertint
{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 115%;
    height: 43px;
    box-sizing: border-box;
    border-radius: 5px;
    z-index: -5;
}

    .banner-video-cont-a 
{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    height: auto;
}

   #TyponymVid1, #TyponymVid2 
{
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: auto;
    transform: translate(-50%, -50%);
}

@media (max-aspect-ratio: 399/300) {
    .banner-video-cont-a {
        width: auto;
        height: 100%;
    }
    #TyponymVid1, #TyponymVid2 {
        width: auto;
        height: 100%;
    }
}

    .undertint-proelior-brand
{
	background: rgba(53, 28, 237, 0.85);
    opacity: .8;
}

	.undertint-typonym-brand
{
	background: #f00002;
	opacity: .8;
}

	.undertint-pt-print
{
	background: rgba(129, 123, 111, 0.74);
}

	.undertint-gq-moty
{
	background-color: rgba(201, 35, 35, 0.76);
}

	.undertint-gq-012020
{
	background: linear-gradient(to right bottom, rgba(181, 148, 81, 0.76) 0%, rgba(124, 98, 27, 0.76) 100%);
}

	.undertint-pt
{
	background: rgba(53, 28, 237, 0.85);
}

	.undertint-gaffeur
{
	background: rgba(249, 201, 37, 0.85);
}

	.banner-head:after,
	.banner-headline:after
{
	content: "";
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    width: 36px;
    height: 9px;
    box-sizing: border-box;
}

	.banner-head:after
{
	border-top: 3px solid #fff;
}

	.banner-headline:after
{
	background-image: url('https://evanonearth.net/images/fwrdarrw-cc3333.svg'); 
	background-size: 80% auto;
	background-position: center 400%;
	background-repeat: no-repeat;
	border-top: 3px solid #272727;
}

	.banner-1-tint, .banner-2-tint, .banner-3-tint, .banner-4-tint, .banner-5-tint, .banner-6-tint
{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #888888;
    opacity: .2;
	z-index: 7;
}

    .banner-5-tint
{
    background-color: #f99d3e;
    opacity: .1;
}

    .banner-2-tint a 
{
    position: absolute;
    width: 100%;
    height: 100%;
}

	.banner-1-tint,
	.banner-3-tint,
	.banner-4-tint,
	.banner-6-tint
{
	display: none;
}

	.imgBNRA.imgbanner
{
    background-size: cover;
    background-position: center 79%;
    background-repeat: no-repeat;
    background-color: #272727;
    position: absolute;
    width: 100%;
    height: 100%;
    -webkit-transition: .8s;
    -moz-transition: .8s;
    transition: .8s;
    z-index: 5;
}

	.imgBNRB.imgbanner
{
    background-size: cover;
    background-position: center 20%;
    background-repeat: no-repeat;
    background-color: #272727;
    position: absolute;
    width: 100%;
    height: 100%;
    -webkit-transition: .8s;
    -moz-transition: .8s;
    transition: .8s;
    z-index: 5;
} 

	.imgBNRC.imgbanner
{
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-color: #272727;
    position: absolute;
    width: 100%;
    height: 100%;
    -webkit-transition: .8s;
    -moz-transition: .8s;
    transition: .8s;
    z-index: 5;
} 

	.imgBNRD.imgbanner
{
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-color: #272727;
    position: absolute;
    width: 100%;
    height: 100%;
    -webkit-transition: .8s;
    -moz-transition: .8s;
    transition: .8s;
    z-index: 5;
} 

	.imgBNRE.imgbanner
{
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-color: #272727;
    position: absolute;
    width: 100%;
    height: 100%;
    -webkit-transition: .8s;
    -moz-transition: .8s;
    transition: .8s;
    z-index: 5;
} 

	.imgBNRF.imgbanner
{
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-color: #272727;
    position: absolute;
    width: 100%;
    height: 100%;
    -webkit-transition: .8s;
    -moz-transition: .8s;
    transition: .8s;
    z-index: 5;
} 

	.imgbanner a
{
	display: block;
	width: 100%;
	height: 100%;
}

	.banner-arrow
{
	background-image: url('https://evanonearth.net/images/fwrdarrw-cc3333.svg');
    background-size: 80% auto;
    background-position: center -400%;
    background-repeat: no-repeat;
    position: absolute;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 36px;
    height: 36px;	 
}

	.oneline 
{
	top: calc(50% + 56px);
}

	.twoline 
{
	top: calc(50% + 69px);
}

	#banner-clickfield,
	#banner-clickfield-a,
	#banner-clickfield-b,
	#banner-clickfield-c,
	#banner-clickfield-d,
	#banner-clickfield-e,
	#banner-clickfield-f  
{
	display: none !important;
}

	.banner-arrow-hover 
{
    background-position: center;
    -webkit-transition: 1s ease-in .2s;
    -moz-transition: 1s ease-in .2s;
    transition: 1s ease-in .2s;
}

	.banner-head:hover
{
    opacity: 0;
    cursor: pointer;
     -webkit-transition: 500ms;
	-moz-transition: 500ms;
	transition: 500ms;
}

	.banner-head:hover ~ .imgbanner 
{
    /* background-position: center 400%;*/
    opacity: 0;
}

	.banner-head:hover ~ .banner-2-tint 
{
    opacity: 0;
    -webkit-transition: 500ms;
	-moz-transition: 500ms;
	transition: 500ms;
}

	.imgbanner:hover ~ .imgbanner
{
    opacity: 1;
}

	.imgbanner:hover ~ .featframe-left,
	.imgbanner:hover ~ .featframe-right 
{
    opacity: 0;
    -webkit-transition: 500ms;
	-moz-transition: 500ms;
	transition: 500ms;
}

	.banner-head:hover ~ .forward-arrow
{
    background-position: center 50%;
    opacity: 1;
    -webkit-transition: 800ms ease .5s;
    -moz-transition: 800ms ease .5s;
    transition: 800ms ease .5s;
}

	.bannerrule 
{
	position: absolute;
	top: 1vw;
	height: calc(100% - 2vw);
	width: 13px;
	border-top: 1px dotted #fff;
	border-bottom: 1px dotted #fff;
}

	.brl 
{
	left: 1%;
	border-left: 1px dotted #fff;
}

	.brr 
{
	right: 1%;
	border-right: 1px dotted #fff;
}

/* MAIN GRID */

	#maingrid
{
	position: relative;
	line-height: 0;
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	overflow: hidden;
	/* padding: 1vw 0px 0px 0px;*/
	width: 98%;
    height: 352vw;
	margin: 0 auto;   
	z-index: -3;
}

	.imgmaingrid 
{
    position: relative;
    width: 48.8vw;
    height: 43.5vw;
}

	.imgmaingrid-a,
	.imgmaingrid-b
	
{
    position: absolute;
    width: 100%;
    background-color: transparent;
    background-color: rgba(0,0,0,0);
    -webkit-transition: .8s;
    -moz-transition: .8s;
    transition: .8s;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;   
}

	.imgmaingrid-a 
{
	background-position: center top;
    background-repeat: no-repeat;
    background-size: 94% auto;
    height: 94%;
    top: 50%;
    transform: translateY(-50%); 
}

	.imgmaingrid-b 
{
    display: table;
    height: 100%;
    border-left: 3px solid #595959;
    border-right: 3px solid #595959;
}

	.imgmaingrid-a 
{
	
    opacity: 1;
    z-index: 2;
}

	.imgmaingrid-b 
{
    opacity: 0;
    z-index: 0;
}

/*
	.imgmaingrid-b:before, .imgmaingrid-b:after
{
	content: "";
	position: absolute; 
}

	.imgmaingrid-b:before
{
	top: 0;
	left: 0;
	width: 100%;
	height: 3px;
	background-color: #595959;	
}

	.imgmaingrid-b:after
{
	bottom: 0;
	left: 0;
	width: 100%;
	height: 3px;
	background-color: #595959;
}
*/

	.imgmaingrid-mbl-a, .imgmaingrid-mbl-b 
{
	display: none !important;
}

	.main-blank 
{
	position: absolute;
    top: 2.5%;
    left: 2.5%;
    width: 95%;
    height: 95%;
    background-color: #e8e6e5;
}

	.feat-headline 
{
	position: relative;
	display: table-cell;
	vertical-align: middle;
	left: 0;
	width: 100%;
	font-family: 'Heldane Text Medium','Scotch Roman','Source Serif Pro', serif;
    font-weight: 400;
    font-size: 19px;
    font-style: normal;
    Line-height: 20px;
    letter-spacing: .1px;
    text-align: center;
    color: #272727; 
}

	span.italmarkers 
{
	font-size: 16px;
	letter-spacing: -1.5px; 
}

	.feat-slug,
	.banner-slug 
{ 
	background-size: auto 100%;
	background-position: center;
	background-repeat: no-repeat;
	position: absolute;
	height: 28px;
}

	.feat-slug
{ 
	top: 75%;
	left: 0;
	width: 100%;
}

	.banner-slug 
{ 
	top: calc(50% - 44px);
    left: 50%;
    transform: translate(-50%,-50%);
    border-bottom: 1px dotted #272727;;
}

	.dig-website
{
	background-image: url('https://evanonearth.net/images/featured-slug-website.svg');
}

	.public-art
{
	background-image: url('https://evanonearth.net/images/featured-slug-publicart.svg');
}

	.public-art-banner
{
	background-image: url('https://evanonearth.net/featured/images/pagetitle_publicart-0718.svg');
	width: 62px;
	background-position: -23px center;
}

	.dig-website-banner
{
	background-image: url('https://evanonearth.net/images/featured-slug-website-2.svg');
	background-size: auto 113%;
	width: 175px;
}

	.brand-dev-banner
{
	background-image: url('https://evanonearth.net/images/featured-slug-brand-dev-2.svg');
	background-size: auto 113%;
	width: 123px;
}

	.brand-print-banner
{
	background-image: url('https://evanonearth.net/images/featured-slug-brand-print-2.svg');
	background-size: auto 113%;
	width: 82px;
}

	.edit-banner
{
	background-image: url('https://evanonearth.net/images/featured-slug-editorial-2.svg');
	background-size: auto 113%;
	background-position: 49% center;
	width: 54px;
}

	.typography-banner
{
	background-image: url('https://evanonearth.net/images/featured-slug-banner-typography.svg');
	background-size: auto 113%;
	width: 72px;
}

	.editorial
{
	background-image: url('https://evanonearth.net/images/featured-slug-editorial.svg');
}

	.edit-fashion
{
	background-image: url('https://evanonearth.net/images/featured-slug-fashion.svg');
}

	.edit-format
{
	background-image: url('https://evanonearth.net/images/featured-slug-edit-format.svg');
}

	.brand-dev
{
	background-image: url('https://evanonearth.net/images/featured-slug-brand-dev.svg');
}

	.brand-print
{
	background-image: url('https://evanonearth.net/images/featured-slug-brand-print.svg');
}

	.typography
{
	background-image: url('https://evanonearth.net/images/featured-slug-typography.svg');
}

	.forward-arrow 
{ 
	background-image: url('https://evanonearth.net/images/fwrdarrw-cc3333.svg');
	background-size: 100% auto;
	background-position: center -50%;
	background-repeat: no-repeat;
	position: absolute;
	top: calc(75% + 18px);
	left: 50%;
	transform: translateX(-50%);
	width: 30px;
	height: 55px;
	opacity: 0;
}

/* REMOVE ITEMS */

	.imgB1.imgmaingrid,
	.imgB2.imgmaingrid,
	.imgB3.imgmaingrid,
	.imgB4.imgmaingrid,
	.imgB5.imgmaingrid,
	.imgB6.imgmaingrid {display: none;}

/* SHOW ON LOAD FIX */
/*
	.reveal-cont-1, .reveal-cont-2, .reveal-cont-3 
{
	opacity: 1 !important;
	margin-top: 0 !important;
	animation: none !important;
}

@media (min-height: 800px) {
	.reveal-cont-4, .reveal-cont-5, .reveal-cont-6 {
		opacity: 1 !important;
		margin-top: 0 !important;
		animation: none !important;
	}
} 

@media (min-height: 1240px) {
	.reveal-cont-7, .reveal-cont-8, .reveal-cont-9 {
		opacity: 1 !important;
		margin-top: 0 !important;
		animation: none !important;
	}
} 

@media (min-height: 1660px) {
	.reveal-cont-10, .reveal-cont-11, .reveal-cont-12 {
		opacity: 1 !important;
		margin-top: 0 !important;
		animation: none !important;
	}
} 
@media (min-height: 2100px) {
	.reveal-cont-13, .reveal-cont-14, .reveal-cont-15, .reveal-cont-16  {
		opacity: 1 !important;
		margin-top: 0 !important;
		animation: none !important;
	}
} 
*/


	#lowergrid 
{
    position: relative;
    line-height: 0;
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    overflow: auto;
    padding: 6px 0px 0px 0px;
    width: 98%;
    max-width: 1413px;
    height: 33vw;
    max-height: 476px;
    margin: 0 auto;

}

/*
	#lowergrid
{
	position: relative;
	line-height: 0;
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	overflow: auto;
	padding: 6px 0px 0px 0px;
	width: 1413px;
	height: 476px;
	margin: 0 auto;   
}
*/

	#lowergrid-mobile 
{
	display: none;
}

	.thumbs 
{
    position: relative;
    width: 16vw;
    max-width: 228px;
    height: 16vw;
    max-height: 228px;
    z-index: 0;
}

	.thumbs-alt .ttl-content 
{
    position: relative;
    width: 80%;
    height: 20px;
    margin: -12px auto 0;
    text-align: center;
    font-size: 13px;
    font-family: "Heldane Text Medium","Chronicle","Georgia", serif;
    color: #272727;
    line-height: 1.1;
}

	.thumbs-alt .ttl-content:after 
{
	content: "";
    position: absolute;
    left: 0;
    bottom: -15px;
    height: 1px;
    width: 100%;
    border-top: 1px dotted red;
}

	#bottomnavwrapper
{
	position: relative;
	background-color: #fff;
	line-height:0;
	display: block;
	width: 100%;
	height: 140px;
	margin: 0 auto;
}

	#bottomnavwrapper-mbl 
{
	display: none;
}

	#bottomnav
{
	position: relative;
	line-height:0;
	display: block;
	width: 98%;
	max-width: 1413px;
	height: 140px;
	margin: 0 auto;
}

	#bottomrule 
{
    position: relative;
    top: 8px;
    line-height: 0;
    display: block;
    width: 100%;
    height: 17px;
    margin: 0 auto;
    border-top: 3px solid #595959;
}

	#mailto, #aboutme, #impressum 
{
	background-size: auto 14px;
    background-repeat: no-repeat;
	position: absolute;
    top: 40px;
    left: 50%;
	line-height:0;
	display: block;
	transform: translateX(-50%);
	background-color:#ffffff;
}

	#mailto
{
    background-image: url(../images/email.svg);
    background-position: center;
	width: 160px;
	height: 28px;
}

	#mailto:hover 
{
	border-bottom: 1px dotted #272727;
	webkit-transition: 300ms;
    -moz-transition: 300ms;
    -o-transition: 300ms;
	transition: 300ms;
}

	#aboutme
{
    background-image: url(../images/about.svg);
    background-position: left center;
    width: 78px;
    height: 28px;
    margin-left: 194px;
}

	#aboutme:hover 
{
	border-bottom: 1px dotted #272727;
	webkit-transition: 300ms;
    -moz-transition: 300ms;
    -o-transition: 300ms;
	transition: 300ms;
}

	#aboutme:after  
{
	content: "";
    background-image: url(../images/rightarrw-272727.svg);
    background-size: auto 9px;
    background-position: center;
    background-repeat: no-repeat;
    position: absolute;
    left: -24px;
    top: -1px;
    width: 28px;
    height: 28px
}

	#impressum 
{
    background-image: url(../images/impressum.svg);
    background-position: right center;
    width: 73px;
    height: 28px;
    margin-left: -190px;
}

	#impressum:hover 
{
	border-bottom: 1px dotted #272727;
	webkit-transition: 300ms;
    -moz-transition: 300ms;
    -o-transition: 300ms;
	transition: 300ms;
}

	#impressum:after  
{
	content: "";
    background-image: url(../images/leftarrw-272727.svg);
    background-size: auto 9px;
    background-position: center;
    background-repeat: no-repeat;
    position: absolute;
    right: -24px;
    top: -1px;
    width: 28px;
    height: 28px
}

	#credit
{
	font-family: 'Neuface', 'Scotch', Georgia, serif;
	font-weight: 300;
	font-size: 8px;
	text-align: center;
	color: #272727;
	position: relative;
    top: 60px;
	line-height:0;
	display: block;
	height: 30px;
	margin: 0 auto;
	background-color:#FFFFFF;
}

/* Responsive Banner Loads */


/* Media Queries */

    @media (min-aspect-ratio: 16/10) and (orientation: portrait) {
        #tertiary-banner-container {
            height: 40vw;
        }
    }

	@media (min-width: 1400px) and (max-width: 1899px) {
		.img15 {
			display: none;
		}
	}

	@media (min-width: 1400px) {
		#pagetitle-home {	
			width: 98%;
		}
		#maingrid {
			width: 98%;
    		height: 147vw;
		}
		.imgmaingrid {
			width: 32.4vw;
			height: 29vw;
		}
	
		/* SHOW ON LOAD FIX */
		/*
				.reveal-cont-1, .reveal-cont-2 
			{
				opacity: 1 !important;
				margin-top: 0 !important;
				animation: none !important;
			}

			@media (min-height: 800px) {
				.reveal-cont-3, .reveal-cont-4 {
					opacity: 1 !important;
					margin-top: 0 !important;
					animation: none !important;
				}
			} 

			@media (min-height: 1240px) {
				.reveal-cont-5, .reveal-cont-6 {
					opacity: 1 !important;
					margin-top: 0 !important;
					animation: none !important;
				}
			} 

			@media (min-height: 1660px) {
				.reveal-cont-7, .reveal-cont-8 {
					opacity: 1 !important;
					margin-top: 0 !important;
					animation: none !important;
				}
			} 
			@media (min-height: 2100px) {
				.reveal-cont-9, .reveal-cont-10 {
					opacity: 1 !important;
					margin-top: 0 !important;
					animation: none !important;
				}
			} 
			@media (min-height: 2500px) {
				.reveal-cont-11, .reveal-cont-12 {
					opacity: 1 !important;
					margin-top: 0 !important;
					animation: none !important;
				}
			}
			@media (min-height: 2900px) {
				.reveal-cont-13, .reveal-cont-14, .reveal-cont-15, .reveal-cont-16 {
					opacity: 1 !important;
					margin-top: 0 !important;
					animation: none !important;
				}
			}  
			*/
	}
	
	@media (min-width: 1441px) {
		#lowergrid {
			max-width: none;
			height: auto;
			max-height: none;
			margin: 0 auto 20px;
		}
		.thumbs {
			width: 7.88vw;
			max-width: none;
			height: 7.8vw;
			max-height: none;
		}
		.thumbs-alt .ttl-content {
			font-size: .45vw;
		}
		#bottomnav {
			max-width: none;
		}
	}
	
	@media (min-width: 1900px) {
		#maingrid {
			width: 98%;
    		height: 88.3vw;
		}
		.imgmaingrid {
			width: 24.3vw;
    		height: 21.8vw;
		}
	}
	
	@media (max-width: 1050px) {
		#headerwrapper, #pagetitle-home {
			width: 95%;
		}
		#header, #secondrulescroll {
			width: 100%;
		}
		#secondrulescroll {
			margin-left: -50%;
		}
		.reveal-cont-banner:before {
			left: 2.5vw;
			width: 95vw;
		}
		#maingrid {
			width: 95%;
			height: 348vw;
			margin: 0 auto;
			z-index: -3;
		}
		.imgmaingrid {
			width: 46.9vw;
			height: 42.4vw;
		}
	}
		
		/* SHOW ON LOAD FIX */
		/*
				.reveal-cont-1, .reveal-cont-2, .reveal-cont-3, .reveal-cont-4 
			{
				opacity: 1 !important;
				margin-top: 0 !important;
				animation: none !important;
			}

			@media (min-height: 800px) {
				.reveal-cont-5, .reveal-cont-6, .reveal-cont-7, .reveal-cont-8 {
					opacity: 1 !important;
					margin-top: 0 !important;
					animation: none !important;
				}
			} 

			@media (min-height: 1240px) {
				.reveal-cont-9, .reveal-cont-10, .reveal-cont-11, .reveal-cont-12 {
					opacity: 1 !important;
					margin-top: 0 !important;
					animation: none !important;
				}
			}
			@media (min-height: 1660px) {
				.reveal-cont-13, .reveal-cont-14, .reveal-cont-15, .reveal-cont-16 {
					opacity: 1 !important;
					margin-top: 0 !important;
					animation: none !important;
				}
			}
			*/ 
	}
	

</style>
