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

	:root {
		--space-small: 5px;
		--space-medium: 15px;
		--space-large: 25px;
		--space-xl: 75px;
		--space-xxl: 150px;
		--space-xxxl: 250px;
	}
}

@media screen and (max-width:  1400px){
	.cursor.mega>div {
		transform: translateX(-50%) scale(0.85);
	    left: 37%;
	    max-width: 400px;
	    bottom: 12%;

	}

	.cursor.mega {
		width: 90vw;
		height: 90vw;
	}

	.grid-columns-2.align-center .text-block {
		padding: 0px;
	}


	.grid-columns-2 .slogan {
		font-size: 125px;
	}

	.hero img {
		right: -20%;
	}
}

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


	:root {
		--container-min-width:  100%;
		--container-max-width:  100%;

		--space-small: 5px;
		--space-medium: 10px;
		--space-large: 15px;
		--space-xl: 25px;
		--space-xxl: 5vw;
		--space-xxxl: 10vw;
	}

	.grid-columns-2.no-padding {
		grid-template-columns: 1fr;
	}
	.grid-split-sticky .grid-columns-2 {
		grid-template-columns: 1fr;
	}

	.hero .slogan.slogan-abs.animate-up.in-view {
	    transform: translate(0px,0px);
	}
	.hero .slogan.slogan-abs.animate-up {
	    transform: translate(0px,100px);
	}

	header {
		padding-left: var(--space-large);
		padding-right: var(--space-large);
	}

	.grid-columns-4 {
		grid-template-columns: 1fr 1fr;
	}

	.cover-duo {
		display: block;
	}
	.cover-duo .img-frame {
	    width: 45%;
	    min-width: 0px;
		position: absolute;
		right: 0%;
		bottom: 5%;
	}

	.cover-duo .img-macbook {

		width: 75%;
	}

	.cover-duo .coverPic {
		width: 70%;
		max-width: 70%;
	}

	.usps {
		margin-left: var(--space-xxxl);
	}

	.grid-split-sticky.sticky-evenly {
		grid-template-columns: 1fr;
	}

	.grid-split-sticky.sticky-evenly>.sticky {
		display: none;
	}

}


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

	.img-iphone .content {
		max-width: 30vw;
	}



	.sticky .text-block {
		max-width: 50vw;
	}


	header{
		position: relative;
	}

	header .space-between {
		justify-content: center;
	}

	#mobile-menu {
		display: block;
		position: fixed;
		left: 0px;
		bottom: 0px;
		width: 100%;
		padding: var(--space-medium);
		display: flex;
		justify-content: space-between;
		align-items: center;
		xxtext-shadow: 0px 0px 3px black;
		z-index: 200;
    	background: var(--dark-blue);
		transform: translateY(100%);
		transition: .5s;
	}

		/*div#mobile-menu:after {
		    content: '';
		    height: 0px;
		    width: 100%;
		    position: absolute;
		    bottom: 0;
		    left: 0;
		    z-index: -1;
		   	box-shadow: 0px 0px 75px 75px rgb(0 30 43 / 65%), 0px 0px 25px 25px rgb(0 30 43 / 25%);
		}*/

		#mobile-menu img {
			width: 50px;
		}



		#mobile-menu .hamburger {
			border-radius: 50%;
			border: 3px solid white;
			width: 50px;
			height: 50px;
			display: flex;
			justify-content: center;
			align-items: center;
			text-align: center;
			font-size: 10px;
			
		}

		.factory main, .publishers main {
			margin-bottom: 80px;
		}

		.home #mobile-menu .hamburger, .home #mobile-menu {
			display: none;
		}

	.factory-home header + main, .publishers-home header + main {
		overflow: initial;
	}


	.scrollHeader #mobile-menu{
		transform: translateY(0%);
		transition: .5s;
	}

	header, .scrollHeader header {
		padding-top: var(--space-xl);
    	padding-bottom: var(--space-xl);
    	padding-left: var(--space-large);
    	padding-right: var(--space-large);
	}

	#mobile-menu .logo span {
		font-size: 10px;
	}

	header .logo img, .scrollHeader header .logo img {
   	 	width: 100%;
    	height: auto;
   	 	transition: .5s;
	}

	#hamburger{
		display: block;
	}

	header nav {
		position: fixed;
		bottom: 0%;
		height: max-content;
		right: var(--space-medium);
		flex-direction: column-reverse;
		display: flex;
		padding-bottom: calc(80px + var(--space-medium));
		width: max-content;
    	align-items: flex-end;
	}

		header nav a, header nav>span {
	    background: #00000038;
	    color: white;
	    border-radius: 25px;
	    xxborder: 3px solid white;
	    margin: 0px;
	    width: max-content;
	    margin-bottom: var(--space-medium);
	    font-size: 10px !important;
	    text-align: center;
	    transform: translateX(calc(100% + var(--space-xl)));
	    transition-duration: .25s;
	    transition-delay: calc(.1s * var(--index));
	    xxbox-shadow: 1px 1px 3px 0px rgb(0 30 43 / 25%), inset 0px 0px 3px 0px rgb(0 30 43 / 25%);
	    xxtext-shadow: 0px 0px 3px black;
    	line-height: 50px;
    	padding: 0px 12.5px;
    	opacity: 1 !important;
    	background: var(--dark-blue);
	}

		/*header nav a:after {
			content: '';
		    height: 0px;
		    width: 100%;
		    position: absolute;
		    bottom: 50%;
		    left: 50%;
		    z-index: -1;
		    transform: translate(-50%);
		   	box-shadow: 0px 0px 15px 15px rgb(0 30 43 / 25%);
		}*/

	.menu-open header nav a, .menu-open header nav>span{
		transform: translateX(0%);
		transition-duration: .25s;
	}

	header + main {
		padding-top: 0px !important;
	}

		.hero .container {
		grid-template-columns: 1fr;
	}

	.hero .container>div:last-child {
		position: absolute;
	    width: 100%;
	    height: 100%;
	    left: 0%;
	   	top: 0px;
		overflow: hidden;
	}

	.hero .container>div {
		justify-content: center;
	}

	.hero .container>div {
		align-items: flex-end;
	}


	.usps {
	    position: absolute;
	    top: 50%;
	    transform: translate(-50%,-50%);
	    z-index: 900;
	    height: 50px;
	    margin: 0;
	}

	.scrollHeader .grid-split-sticky>.sticky {
		top: var(--space-large);
	}

	.single-right {
		align-items: flex-end;
	}

	.single-right>div {
		transform: none;
	}

	.slogan {

    	width: auto;
    	word-break: break-word;
	}

}


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

	#review {
		--height: 100vh !important;
	}

	.slogan, .slogan.slogan-light {
		font-size: 75px;
		font-size: calc(40px + 0.5vw);
	}

	.img-iphone .content {
		max-width: 75%;
	}

	.grid-columns-2, .grid-columns-3{
		grid-template-columns: 1fr;
		text-align: center;
	}


	.color-absolute {
		width: 100vw;
	}

	.text-block {
		font-size: 15px;
	}


	#main-cursor {
		display: none !important;
	}

	.cursor.mega {
    	width: 85vh;
    	height: 85vh;
	}

	.cursor.mega>div {
	    left: 50%;
	    top: 50%;
	    max-width: 100vw;
	    width: 100vw;
	    bottom: auto;
	    transform: translate(-50%,-50%) scale(0.85);
	}

	.cursor>div {
		left: 50%;
	    top: 50%;
	}

	

	.grid-columns-2.align-center .text-block a {
		display: none;
	}

	.grid-columns-2.align-center .img-macbook {
		max-width: 50vw;
	}

	.grid-columns-2.align-center>div {
		justify-content: center;
		align-items: center;
		text-align: center;
	}

	.grid-columns-2.no-padding>div {
		margin-bottom:  var(--space-xxxl);
	}

	.grid-columns-2.align-center>div:last-child {
		padding-top: 0px;
	}


	.publishers-home main, .factory-home main {
		padding-bottom: var(--space-xxxl);
	}


}

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

	.btn:after {
	    left: -9px;
	    top: -5px;
	}

	.usps {
		top: 45%;
	}

	.publishers-home header, .publishers-home.scrollHeader header, .factory-home header, .factory-home.scrollHeader header {
		background: transparent;
		border: 0px !important;
	}

	.hero img {
		display: none;
	}

	.btn:after {
		padding-left: 13px;
	}

	.hero {
		overflow-x: hidden;
    	margin-top: calc(var(--header-height) * -1);
	}

	.hero .container {
		min-height: calc( var(--header-height) + 70vh );
	}

	.popup.open {
	    transform: translate(-50%,-50%) scale(1);
	    transition: .5s;
	    width: 100vw;
	    height: 100vh;
	    border-radius: 0px;
	}

	.dismiss.fixed {
		right: 0;
		top: 0;
	}


	form {
	    max-width: 90vw;
	}

	

	.hero .slogan.slogan-abs{
		font-size: calc(50px + 4vw);
		left: var(--space-xxl);
		bottom: var(--space-xxl);
	}

/*	.hero .container>div:last-child:after{
		    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background: transparent;
	background: radial-gradient(circle, rgba(0,30,43,0) 0%, rgba(0,0,0,1) 100%);
	}
*/
	.grid-split-sticky {
    	grid-template-columns: 1fr;
	}
	.sticky .text-block {
		max-width: 100%;
	}

	.grid-split-sticky .sticky {
		position: relative;
		top:  auto;
    	padding-top: var(--space-xxl);
	}

	.grid-split-sticky .grid-columns-2 {
		margin-left: var(--space-xxxl);
		margin-right: var(--space-xxxl);
	}

	.blocks-abs>div:before {
    	right: calc(var(--space-xxxl) * -1);
	}

	.grid-columns-4 {
    	grid-template-columns: 1fr;
	}

	.product-small {
		padding-left:  var(--space-xxxl);
		margin-left:  var(--space-xxxl);
		padding-right:  var(--space-xxxl);
		margin-right:  var(--space-xxxl);
	}


	#home {
		grid-template-columns:  1fr;
		grid-template-rows: 1fr 1fr;
	}

	#home>div>div {
		height: 50vh;
    	width: calc(100% - var(--space-xxxl) );
    	padding-top: var(--space-large);
    	padding-bottom: var(--space-large);
	}

	#home .logo {
		transform: scale(0.65);
	}

	#home .usps  {
		width: 100vw;
	}

	#home .usps p {
		animation: animate3 var( --speed) linear infinite;
    	animation-delay: calc( var( --speed) / var(--aantal) * var(--idd) * -1 );
	}

	@keyframes animate3 {
		0% {
		    opacity: 1;
		}
		2.5% {
			opacity: 0.25;
		}
		12.5% {
		    opacity: 0;
		}
		87.5% {
		    opacity: 0;
		}
		97.5% {
			opacity: 0.25;
		}
		100% {
		    opacity: 1;
		}
	}

}