/*
	Theme name: vandersalm2019
	Author: Renier Vermaak
	Author URI: http://www.reniervermaak.nl
	Version: 1.0
	Text Domain: vandersalm
*/

@import url("style-starter.css");
@import url("webfont/swis721/stylesheet.css");

html, body {
	font-family: 'Swis721 Cn BT', arial, sans-serif;
	height: 100%;
	font-weight: 100;
	max-height: 100vh;
}

html, body {
	overflow: hidden;
	color: #3F3F3B;
}

.ui-loader {
	display: none !important;
}

#main {
	opacity: 1;
	-webkit-transition: opacity 0.02s ease-in;
       -moz-transition: opacity 0.02s ease-in;
        -ms-transition: opacity 0.02s ease-in;
         -o-transition: opacity 0.02s ease-in;
            transition: opacity 0.02s ease-in;
}

span[class*=icon-] {
	 font-size: 1.2em;
	 vertical-align: middle;
}

body.loading #main {
	opacity: 0;
}

.entry-content {
	color: #3F3F3B;
	padding: 2.0em 1.0em;
}

.section.scrolling .entry-content {

}

#wpadminbar {
	overflow: hidden;
}

#page {
	position: relative;
	width: 100%;
	min-height: 100%;
}

#nav-header,
#nav-footer {
	position: fixed;
    z-index: 1000;
    width: 100%;
    top: 0;
    left: 0;
    background-color: #fff;
}
#nav-footer {
	top: auto;
	bottom: 0;
}

.project.active .section {
	
}

#fancybox-left-ico {
  left: -45px;
}
#fancybox-right-ico {
  right: -45px;
  left: auto;
}
.fancybox-nav span {
  visibility:visible;
}

#fancybox-left:hover span {
  left: -45px;
}
#fancybox-right:hover span {
  right: -45px;
}

body.admin-bar #nav-header {
	margin-top: 46px !important;
}

	#logo,
	#contact {
		float: left;
		display: block;
		box-sizing: border-box;
		height: 50px;
	}
		#logo a,
		#nav > a.toggleMenu {
			display: block;
			height: 20px;
			padding: 15px;
			color: #3F3F3B;
			background: transparent;
			text-decoration: none;
		}

	#nav,
	#projects {
		float: right;
		display: block;
		box-sizing: border-box;
		height: 50px;
	}	

		#nav-menu {
			display: block;
		    position: fixed;
		    top: 0;
		    right: 0;
		    width: 0;
		    height: 100vh;
		    background: #fff;
		    z-index: 1000;
		}
			body.menu-open #nav-menu {
				width: 100vw;
			}

		#nav > a.toggleMenu {
			position: relative;
		}
		#nav > a.toggleMenu img.close {
			opacity: 0;
			position: absolute;
			left: 50%;
			top: 50%;
			-webkit-transform: translate(-50%, -50%);
	         -moz-transform: translate(-50%, -50%);
	         -ms-transform: translate(-50%, -50%);
	         -o-transform: translate(-50%, -50%);
			transform: translate(-50%, -50%);
		}

		body.menu-open #nav > a.toggleMenu img.close {
			opacity: 1;
		}
		body.menu-open #nav > a.toggleMenu img.open {
			opacity: 0;
		}

	.footer a {
		height: 20px;
		padding: 15px;
		display: block;
		color: #3C3C3B;
	} 		

#main,
#nav-menu > div {
	position: relative;
	height: 100vh;
	padding-top: 50px;
	padding-bottom: 50px;
	box-sizing: border-box;
}
	#nav-menu > div > .menu {
		position: absolute;
		top: 50%;
		left: 50%;
		-webkit-transform: translate(0, -50%);
         -moz-transform: translate(0, -50%);
         -ms-transform: translate(0, -50%);
         -o-transform: translate(0, -50%);
		transform: translate(0, -50%);
	}
	body.menu-open #nav-menu > div > .menu {
		position: absolute;
		top: 50%;
		left: 50%;
		-webkit-transform: translate(-50%, -50%);
         -moz-transform: translate(-50%, -50%);
         -ms-transform: translate(-50%, -50%);
         -o-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
	}	

	#nav-menu ul.menu {
		font-size: 1.4em;
	}
		#nav-menu ul.menu li a {
			display: block;
			text-decoration: none;
			color: #3C3C3B;
			text-align: center;
			padding: 0.2em;
			text-transform: uppercase;
			margin: 0.5em 0;
		}

#nav-header a > img,
#nav-footer a > img {
	height: 20px;
}		

@media only screen and (max-height: 568px) {
	#main {
		height: 96vh;
	}
	body.post-type-archive-project #main ,
	body.page-template #main {
		height: 100vh;
	}	
}

#main #canvas {
	height: 100%;
	box-sizing: border-box;
	padding: 0;
}
body.post-type-archive-project #main #canvas {
	padding: 0;
}

.row-posts img {
	background: #efefef;
}

	body.single-post #main #canvas,
	body.archive #main #canvas,
	body.blog #main #canvas,
	body.archive #main #canvas,
	body.page #main #canvas {
/*		overflow-y: auto;*/
		overflow: hidden;
	}

	#main #canvas .canvas-wrapper {
		height: 100%;
		
		/* 
			1200 - 180 height = 100% 
			640 height = 62%
		*/
	}	

	body.page #main #canvas .canvas-wrapper {
		height: 100%;
	}

	#canvas .canvas-wrapper .projects {
		position: relative;
		width: 100%;
		height: 100%;
		/* transition: 600ms; */
		left: 0;
	}	

	#canvas .canvas-wrapper .projects .project {
		display: block;
		float: left;
		width: 33.33%;
		height: 100%;
		top: 0;
		left: 0;
	}

	#canvas .canvas-wrapper .section-wrapper {
		height: 100%;
		touch-action: none;
		transition: all 700ms ease 0s;
	    transform: translate3d(0px, 0, 0px);
	    /* margin-top: -700px; */
	    min-height: 100%;
	    overflow: hidden;
	}

/* --- project page --- */
.row.row-projects .column,
.row.row-posts .column {
	position: relative;
}
	.row.row-projects .column .column-inner,
	.row.row-posts .column .column-inner {
		position: relative;
		padding: 1em;
	}	

	.row.row-projects .column .column-inner a,
	.row.row-posts .column .column-inner a {
	    display: block;
	    width: 100%;
	    height: 100%;
	    box-sizing: border-box;
	    position: relative;
	}
		.row.row-projects .column .column-inner a img,
		.row.row-posts .column .column-inner a img {
			width: 100%;
			height: auto;
			display: block;
		}		

/* --- project slider (home) --- */
#project-gallery {
	overflow: hidden;
}

#project-gallery.single {
	overflow: hidden;
}

#project-gallery.single.single-page {
	overflow: hidden;
}

.canvas-wrapper .section,
.canvas-wrapper .section .section-inner,
#project-gallery,
#project-gallery .project,
#project-gallery .project-images,
#project-gallery .unslider,
#project-gallery .gallery,
#project-gallery .gallery ul {
	height: 100%;
	position: relative;
}		

.gallery-wrapper {
	height: 100%;
	touch-action: none;
	transition: all 700ms ease 0s;
    transform: translate3d(0px, 0px, 0px);
}

#project-gallery .unslider {
	z-index: 100;
}

#project-gallery .project-images {
	height: calc(100%);
}

#project-gallery .gallery {
	position: relative;
	height: 75%;
	top: 50%;
	-webkit-transform: translate(0,-50%);
       -moz-transform: translate(0,-50%);
        -ms-transform: translate(0,-50%);
         -o-transform: translate(0,-50%);
    transform: translate(0,-50%);
}

#project-gallery .gallery ul li {
	display: block;
	height: 100%;
	float: left;
	list-style-type: none;
}
	#project-gallery .slide-wrapper {
		position: relative;
		height: 100%;
		width: 100%;
		display: block;
		max-width: 100%; 
		margin: 0px auto;
		background-color: transparent;
	}

.projects-archive-wrapper,
.blog-archive-wrapper {
	position: relative;
	width: 100%;
	height: 100%;
	display: block;
	max-width: 100%; 
	margin: 0px auto;
	box-sizing: border-box;
	overflow-y: auto;
}
.blog-archive-wrapper .row.row-posts{
	margin-bottom: 2.0em 
}	

.blog-archive-wrapper a {
	color: #3C3C3B;
	text-decoration: none;
}
	.blog-archive-wrapper h2 {
		margin: 0;
		line-height: initial;
	}

.projects-archive-wrapper a {
	color: #3C3C3B;
	text-decoration: none;
}
.projects-archive-wrapper h2 {
	margin: 0.5em 0 5px 0;
}

.projects-archive-wrapper .entry-content a {
	color: #3C3C3B;
	text-decoration: underline;
}
.projects-archive-wrapper .entry-content h2 {
	margin: 0.5em 0 5px 0;
}

	.blog-archive-wrapper .row.row-posts .column .column-inner {
		padding: 0 1.0em 1.0em 1.0em;
		margin-bottom: 0em;
	}

		#project-gallery .slide-wrapper .slide-image {
			display: block;
			position: relative;
			height: 100%;
			width: 100%;
			margin: 0px auto;
		}

		.fake-anchor {
			cursor: pointer;
		}
			#project-gallery .slide-wrapper .slide-image .bg-loader img {
				display: block;
				position: absolute;
				top: 50%;
				left: 50%;
				width: 100%;
				height: 100%;
				-webkit-transform: translate(-50%,-50%);
			       -moz-transform: translate(-50%,-50%);
			        -ms-transform: translate(-50%,-50%);
			         -o-transform: translate(-50%,-50%);
				transform: translate(-50%,-50%);
			}

			#project-gallery .slide-wrapper .slide-image img {
				display: block;
				position: absolute;
				top: 50%;
				left: 50%;
				max-width: 100%;
				max-height: 100%;
				/*height: 100%;
				width: auto;*/
				-webkit-transform: translate(-50%,-50%);
			       -moz-transform: translate(-50%,-50%);
			        -ms-transform: translate(-50%,-50%);
			         -o-transform: translate(-50%,-50%);
				transform: translate(-50%,-50%);
			}

			#project-gallery .slide-wrapper .slide-title {
				position: absolute;
				top: 100%;
				padding: 1.0em 0.5em 0 0;
			}	

	.unslider-arrow,
	.projects-arrow {
		position: absolute;
	    width: 1px;
	    height: 100%;
	    top: 0;
	    cursor: pointer;
	}
	.unslider-arrow.prev,
	.projects-arrow.prev-project {
		left: 0;
	}
	.unslider-arrow.next,
	.projects-arrow.next-project {
		right: 0;
	}

.unslider-arrow.prev .arrow,
.projects-arrow.prev-project .arrow {
	display: block;
	position: absolute;
	left: 15px;
	top: 0px;
	height: 100%;
	width: 20px;
	background: transparent url(img/v-vorm-left-bg-v02.png) 50% no-repeat;
	background-size: 10px 10px;
}
.unslider-arrow.next .arrow,
.projects-arrow.next-project .arrow {
	display: block;
	position: absolute;
	right: 15px;
	top: 0px;
	height: 100%;
	width: 20px;
	background: transparent url(img/v-vorm-right-bg-v02.png) 50% no-repeat;
	background-size: 10px 10px;
}

@media all and (orientation:portrait) {
	/* Styles for portrait screen */
	.unslider-arrow.prev .arrow,
	.projects-arrow.prev-project .arrow {
		left: 0px;
	}
	.unslider-arrow.next .arrow,
	.projects-arrow.next-project .arrow {
		right: 0px;
	}	
}

.progress {
	position: absolute;
	width: 100%;
	height: 100%;
	background: transparent;
	z-index: 1;
	max-height: 75%;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%,-50%);
       -moz-transform: translate(-50%,-50%);
        -ms-transform: translate(-50%,-50%);
         -o-transform: translate(-50%,-50%);
	transform: translate(-50%,-50%);
}	
	.progress .progress-bar {
		position: absolute;
		width: 100%;
		height: 2px;
		top: 100%;
		margin-top: 1.5em;
		background: #ccc;
		left: 0;
	}
		.progress .progress-bar .progress-item {
			height: 2px;
			display: block;
			float: left;
		}
		.progress .progress-bar .progress-item.active {
			background: #3F3F3C;
		}

/* --- project intro --- */	
.project-intro {
	display: block;
	position: relative;
	width: 100%;
	height: 75%;
	margin: 0px auto;
	top: 50%;
	-webkit-transform: translate(0,-50%);
       -moz-transform: translate(0,-50%);
        -ms-transform: translate(0,-50%);
         -o-transform: translate(0,-50%);
	transform: translate(0,-50%);
}
.project-intro.loading,
.projects-archive-wrapper.loading {
	opacity: 0;
}

	.project-intro .images-wrapper {
		position: absolute;
		top: 50%;
		left: 50%;
		width: 100%;
		background-color: #f4f4f4;
		padding-bottom: 33.5%;
		overflow: visible;
		-webkit-transform: translate(-50%,-50%);
	       -moz-transform: translate(-50%,-50%);
	        -ms-transform: translate(-50%,-50%);
	         -o-transform: translate(-50%,-50%);
		transform: translate(-50%,-50%);
	}

	.project-intro .images-wrapper .image-devider {
		position: absolute;
		height: calc(100% + 2px);
		width: 100%;
		left: 0px;
		text-align: center;
		margin-top: -1px;
	}

	.project-intro .image-wrap {
		position: absolute;
		top: 0;
		left: 0;
		width: 50%;
		height: 100%;
	}
	.project-intro .image-wrap.image-wrap-2 {
		left: 50%;
	}	

	.project-intro .image-wrap .image-fill {
		display: block;
	    width: 100%;
	    height: 100%;
	    overflow: hidden;
	}
		.project-intro .image-wrap .image-fill img {
			display: block;
			width: 100%;
			height: auto;
		}

	.project-intro .project-title {
		position: absolute;
		left: 0;
		top: 100%;
		width: 100%;
		z-index: 1000;
	}
		.project-intro .project-title h1 {
			padding: 1.0em 0.5em;
		}
			.project-intro .project-title h1 .next-section {
				display: inline-block;
				float: right;
				position: relative;
				bottom: auto;
				left: auto;
				width: auto;
				text-align: initial;
			}

	@media all and (orientation:landscape) {
		/* Styles for portrait screen */
		.project-intro .images-wrapper {
			
		}	
	}	

#project-content.section .section-inner .entry-content {
	max-width: 600px;
	height: 100%;
	margin: 0px auto;
	padding: 2.0em;
	box-sizing: border-box;
	overflow: hidden;
}

.prev-section span.icon-v, 
.next-section span.icon-v {
	opacity: 0.1;
}
	.prev-section:hover span.icon-v, 
	.next-section:hover span.icon-v{
		opacity: 1;
	}

.next-section,
.prev-section {
	position: absolute;
    top: 0;
    left: 50%;
    width: 70%;
    height: 18%;
    text-align: center;
    z-index: 1001;
    -webkit-transform: translate(-50%, 0);
       -moz-transform: translate(-50%, 0);
        -ms-transform: translate(-50%, 0);
         -o-transform: translate(-50%, 0);
	transform: translate(-50%, 0);

}
	
	@media (orientation: portrait) {
		.prev-section {
			top: 35px;
		    height: 35px;
		}
	}
	@media (orientation: landscape) {
		.prev-section {
			top: 0px;
		    height: 35px;
		}
	}

	.next-section {
		position: fixed !important;
		top: auto;
		bottom: 0;
	    height: 18%;
	} 

	body.scrolled .next-section.scroll {
		display: none;
	}

	body.menu-open .next-section,
	body.menu-open .prev-section {
		display: none !important;
	}

.prev-section.hidden,
.next-section.hidden {
	display: none;
}    

.prev-section .arrow {
	display: block;
	position: absolute;
	left: 0;
	top: 15px;
	width: 100%;
	height: 20px;
	background: transparent url(img/v-vorm-up-bg-v02.png) 50% no-repeat;
	background-size: 10px 10px;
}
.next-section .arrow {
	display: block;
	position: absolute;
	left: 0;
	bottom: 15px;
	width: 100%;
	height: 20px;
	background: transparent url(img/v-vorm-down-bg-v02.png) 50% no-repeat;
	background-size: 10px 10px;
}

.icon-v {
	display: inline-block;
	width: 30px;
	height: 30px;
	background: transparent url(img/v-vorm-02.svg) 50% 0px no-repeat;
}	
	.icon-v.flip-vertical {
		-webkit-transform: rotate(-180deg);
		  -ff-transform: rotate(-180deg);
		  transform: rotate(-180deg);
	}	

.canvas-wrapper .container {
	max-width: 600px;
	margin: 0px auto;
	position: relative;
}
	.canvas-wrapper .container.progress {
		max-width: 600px;
		margin: 0px auto;
		position: absolute;
	}
	
body.page .canvas-wrapper .gallery .container,
body.single-post .canvas-wrapper .gallery .container {
	margin-top: 2.5em;
}

.canvas-wrapper .entry-container .container {
	max-width: none;
}

.canvas-wrapper {
	position: relative;
}
	body.single-project .canvas-wrapper,
	body.page-template-page-tmpl-sections .canvas-wrapper,
	body.home .canvas-wrapper {
		position: initial;
	}

	.calcultator {
		position: absolute; width: 100%; height: 75%; top: 50%; left: 0; 
		z-index: -1;
		-webkit-transform: translate(0,-50%);
	       -moz-transform: translate(0,-50%);
	        -ms-transform: translate(0,-50%);
	         -o-transform: translate(0,-50%);
	    transform: translate(0, -50%);     
	}

.canvas-wrapper .page-calc-wrapper {
	position: absolute;
    width: 100%;
    height: 75%;
    left: 50%;
    top: 50%;
    max-width: 100%;
    overflow-y: visible;
    z-index: -1;
    -webkit-transform: translate(-50%,-50%);
       -moz-transform: translate(-50%,-50%);
        -ms-transform: translate(-50%,-50%);
         -o-transform: translate(-50%,-50%);
    transform: translate(-50%, -50%);
}
	.canvas-wrapper .page-calc-wrapper .calc-wrap {
		position: relative;
	    height: 100%;
	    width: 100%;
	    display: block;
	    max-width: 100%;
	    margin: 0px auto;
	    opacity: 0.2;
	}
		.canvas-wrapper .page-calc-wrapper .calc-wrap img {
			display: block;
		    position: absolute;
		    top: 50%;
		    left: 50%;
		    max-width: 100%;
		    max-height: 100%;
			-webkit-transform: translate(-50%,-50%);
		       -moz-transform: translate(-50%,-50%);
		        -ms-transform: translate(-50%,-50%);
		         -o-transform: translate(-50%,-50%);
		    transform: translate(-50%,-50%);		         
		}

.canvas-wrapper .container.featured-image {
	margin-bottom: 1.0em;
}

.featured-image img {
	display: block;
	width: 100%;
	height: auto;
}

.featured-images {
	margin-bottom: 1.0em;
}

.shape-post {
	display: block;
	position: absolute;
	top: -1px;
	left: 0;
	height: 50%;
	width: 100%;
	box-sizing: border-box;
	background: url(img/shape-posts.png) top right no-repeat;
	background-size: contain;
}

.fancybox-navigation .fancybox-button {
	background: none;
}

.arrow-left {
	background: url(img/v-vorm-left-fb.png) 50% no-repeat;
	background-size: 50%;
}
.arrow-right {
	background: url(img/v-vorm-right-fb.png) 50% no-repeat;
	background-size: 50%;
}

.unslider-arrow.next,
.projects-arrow.next-project {
	left: auto;
	right: 0px;
	cursor: url(img/v-vorm-right-v05@18.png) 20 14, auto;
	cursor: -webkit-image-set(url(img/v-vorm-right-v05@18.png) 1x, url(img/v-vorm-right-v05@36.png) 2x), auto;
}

.unslider .unslider-nav {
	opacity: 0;
	position: absolute;
	z-index: -1;
}

.entry-content figure.wp-block-image {
	margin: 0;
}

.slide-image img.landscape {
	width: 100%;
}
.slide-image img.portrait {
	height: 100%;
}
@media only screen and (orientation: landscape) and (max-width: 600px) {
	.slide-image img.landscape {
		width: auto;
	}
	.slide-image img.portrait {
		height: auto;
	}
}

@media only screen and (min-width: 400px) {
	.row.row-projects .column.column-sm-50 {
		width: 50%;
	}
}

@media only screen and (min-width: 600px) {
	.row.row-projects .column.column-md-33 {
		width: 50%;
	}

	.next-section,
	.prev-section {
		position: absolute;
	    top: 0;
	    left: 50%;
	    width: 70%;
	    height: 18%;
	    text-align: center;
	    z-index: 1001;
	    -webkit-transform: translate(-50%, 0);
	       -moz-transform: translate(-50%, 0);
	        -ms-transform: translate(-50%, 0);
	         -o-transform: translate(-50%, 0);
		transform: translate(-50%, 0);
	}
	.next-section {
		top: auto;
		bottom: 0;
	}
}	

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

	.entry-content {
		padding: 0;
	}	
	/*body.page-id-36 .canvas-wrapper .container .entry-content,
	body.page-id-1574 .canvas-wrapper .container .entry-content {
		position: absolute;
		width: 100%;
		top: 50%;
		left: 0;
		transform: translate(0, -50%);
	}*/

	.row .column.column-10 {
		width: 10%;
	}
	.row .column.column-20 {
		width: 20%;
	}
	.row .column.column-25 {
		width: 25%;
	}
	.row .column.column-30 {
		width: 30%;
	}
	.row .column.column-33 {
		width: 33.33%;
	}
	.row.row-projects .column.column-33,
	.row.row-posts .column.column-33 {
		width: 32.6%;
		float: none;
		display: inline-block;
		vertical-align: top;
	}
	.row .column.column-45 {
		width: 45%;
	}
	.row .column.column-50 {
		width: 50%;
	}
	.row.row-posts .column.column-50 {
		width: 49.4%;
		float: none;
		vertical-align: bottom;
		display: inline-block;
	}
	.blog-archive-wrapper .row.row-posts .column .column-inner {
		padding: 0 1.0em 0 0;
		margin-bottom: 0
	}
		.blog-archive-wrapper .row.row-posts .column.column-title .column-inner {
			padding: 0 0 0 0;
			text-align: right;
		}

	.row .column.column-55 {
		width: 55%;
	}
	.row .column.column-66 {
		width: 66.66%;
	}
	.row .column.column-70 {
		width: 70%;
	}
	.row .column.column-75 {
		width: 75%;
	}
	.row .column.column-80 {
		width: 80%;
	}	

	.blog-archive-wrapper .row.row-posts .column .column-inner {
		margin-bottom: 2.0em;
	}
}	

@media only screen and (min-width: 600px) and (orientation: portrait) {
	#logo,
	#contact,
	#nav,
	#projects {
		height: 70px;
	}
		#logo a,
		#nav > a.toggleMenu,
		#contact a,
		#projects a {
			height: 20px;
			padding: 25px;
		}

			#logo a img,
			#nav > a.toggleMenu img,
			#contact a img,
			#projects a img {
				height: 20px;
			}	

	#main,
	#nav-menu .menu-mainmenu-container {
		padding-top: 70px;
		padding-bottom: 70px;
	}		
}	

@media (hover: none) {
    #project-content.section .section-inner .entry-content {
		overflow: auto;
	}

	.scrollable {
		overflow-y: unset !important;
	}
	body.single-project .scrollable {
		overflow-y: hidden;
	}
}

/* mobile */
@media (hover: none) and (max-width: 600px) {
	.progress .progress-bar {
		top: 100%;
		margin-top: 1.0em;
	}

	body {
		background: #fff;
	}
	html {
		background: #cbcbcb;
	}
}

/* mouse, touch pad */
@media (hover: hover) and (pointer: fine) {
    /* ... */
    .next-section, .prev-section {
    	height: 18%;
    }
    .next-section.intro {
    	height: 34%;
    }
}

@media only screen and (min-width: 768px) and (orientation:landscape) {
	.prev-section {
		cursor: url(img/v-vorm-up-v05@18.png) 14 20, auto;
    	cursor: -webkit-image-set(url(img/v-vorm-up-v05@18.png) 1x, url(img/v-vorm-up-v05@36.png) 2x), auto;
    }
    .next-section {
    	cursor: url(img/v-vorm-down-v05@18.png) 14 20, auto;
    	cursor: -webkit-image-set(url(img/v-vorm-down-v05@18.png) 1x, url(img/v-vorm-down-v05@36.png) 2x), auto;
    }

    .unslider-arrow.prev .arrow {
		display: block;
    	position: absolute;
    	left: 25px;
    	top: 0px;
    	height: 100%;
		width: 20px;
		background: transparent url(img/v-vorm-left-bg-v02.png) 50% no-repeat;
		background-size: 10px 10px;
    }
    .unslider-arrow.next .arrow {
		display: block;
    	position: absolute;
    	right: 25px;
    	top: 0px;
    	height: 100%;
		width: 20px;
		background: transparent url(img/v-vorm-right-bg-v02.png) 50% no-repeat;
		background-size: 10px 10px;
    }

	.unslider-arrow,
	.projects-arrow {
		width: 22%;
		left: 0px;
    	cursor: url(img/v-vorm-left-v05@18.png) 20 14, auto;
    	cursor: -webkit-image-set(url(img/v-vorm-left-v05@18.png) 1x, url(img/v-vorm-left-v05@36.png) 2x), auto;
	}
	.unslider-arrow.next,
	.projects-arrow.next-project {
		left: auto;
		right: 0px;
    	cursor: url(img/v-vorm-right-v05@18.png) 20 14, auto;
    	cursor: -webkit-image-set(url(img/v-vorm-right-v05@18.png) 1x, url(img/v-vorm-right-v05@36.png) 2x), auto;
	}

	.projects-arrow .arrow {
		display: block;
		position: absolute;
		left: 20px;
		top: 0;
		width: 20px;
		height: 100%;
		background: transparent url(img/v-vorm-left-bg-v02.png) 0px 50% no-repeat;
		background-size: 10px 10px;
	}
	.projects-arrow.next-project .arrow {
		left: auto;
		right: 25px;
		width: 20px;
		background: transparent url(img/v-vorm-right-bg-v02.png) 0px 50% no-repeat;
		background-size: 10px 10px;
	}
	.projects-arrow.prev-project .arrow {
		left: 25px;
		width: 20px;
		background: transparent url(img/v-vorm-left-bg-v02.png) 0px 50% no-repeat;
		background-size: 10px 10px;
	}
}	

@media only screen and (min-width: 782px) {
	body.admin-bar #nav-header {
		margin-top: 32px !important;
	}
	body.admin-bar #main {
		height: calc(100vh - 32px);
	}
}


@media only screen and (min-width: 1024px) {
	#logo,
	#contact,
	#nav,
	#projects {
		height: 70px;
	}
		#logo a,
		#nav > a.toggleMenu,
		#contact a,
		#projects a {
			height: 20px;
			padding: 25px;
		}

			#logo a img,
			#nav > a.toggleMenu img,
			#contact a img,
			#projects a img {
				height: 20px;
			}	

	#project-gallery .slide-wrapper,
	#page-gallery .slide-wrapper,
	.projects-archive-wrapper,
	#project-intro .project-intro {
		max-width: calc(100vw - 45%); 
	}

	#main,
	#nav-menu .menu-mainmenu-container {
		padding-top: 70px;
		padding-bottom: 70px;
	}

	#nav-header,
	#nav-footer {
	    height: 70px;
	}

	.projects-archive-wrapper {
	}	

	/*#project-gallery .slide-wrapper .slide-image img {
		min-height: 100%;
	}*/

	.prev-section .arrow {
		top: 25px;
	}
	.next-section .arrow {
		bottom: 25px;
	}
}

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

	#nav-header,
	#nav-footer {
	    height: 125px;
	}

	#main,
	#nav-menu .menu-mainmenu-container {
		padding-top: 125px;
		padding-bottom: 125px;
	}

	#logo,
	#contact,
	#nav,
	#projects {
		height: 125px;
	}
		#logo a,
		#nav > a.toggleMenu,
		#contact a,
		#projects a {
			height: 25px;
			padding: 50px;
		}

			#logo a img,
			#nav > a.toggleMenu img,
			#contact a img,
			#projects a img {
				height: 25px;
			}	

	#main,
	#nav-menu .menu-mainmenu-container {
		padding-top: 125px;
		padding-bottom: 125px;
	}

	.unslider-arrow,
	.projects-arrow {
		width: 22%;
		left: 0px;
    	cursor: url(img/v-vorm-left-v05@25.png) 25 18, auto;
    	cursor: -webkit-image-set(url(img/v-vorm-left-v05@25.png) 1x, url(img/v-vorm-left-v05@50.png) 2x), auto;
	}
	.unslider-arrow.next,
	.projects-arrow.next-project {
		left: auto;
		right: 0px;
    	cursor: url(img/v-vorm-right-v05@25.png) 25 18, auto;
    	cursor: -webkit-image-set(url(img/v-vorm-right-v05@25.png) 1x, url(img/v-vorm-right-v05@50.png) 2x), auto;
	}

	.prev-section {
    	cursor: url(img/v-vorm-up-v05@25.png) 18 25, auto;
    	cursor: -webkit-image-set(url(img/v-vorm-up-v05@25.png) 1x, url(img/v-vorm-up-v05@50.png) 2x), auto;
    }
    .next-section {
    	cursor: url(img/v-vorm-down-v05@25.png) 18 25, auto;
    	cursor: -webkit-image-set(url(img/v-vorm-down-v05@25.png) 1x, url(img/v-vorm-down-v05@50.png) 2x), auto;
    }

	.prev-section .arrow {
    	top: 50px;
    	height: 25px;
		background-size: 25px 25px;
    }
    .next-section .arrow {
    	bottom: 50px;
    	height: 25px;
		background-size: 25px 25px;
    }

    .unslider-arrow.prev .arrow,
    .projects-arrow.prev-project .arrow {
		left: 50px;
		width: 25px;
		background-size: 25px 25px;
    }
    .unslider-arrow.next .arrow,
    .projects-arrow.next-project .arrow {
		right: 50px;
    	width: 25px;
		background-size: 25px 25px;
    }
}

@media only screen and (min-width: 1500px) { 
	.row.row-projects .column .column-inner,
	.row.row-posts .column .column-inner {
		position: relative;
		padding: 1.5em;
	}
}