body { 
		background-color: #fff;
		color:#121212;
		font:calc(10px + 0.4vw)/1.5 'Space Mono',Menlo,'Open sans',Arial,Helvetica;
		overflow-x:hidden;
		width:100%;
	}
	
	body.gen {
		background-color:#232834;
	}


	html, body {
		min-height:100%;
		margin:0;
		padding:0;
	}


	section,
	body > div {
		clear:both;
		float:left;
		width:100%;
	}





/* navigation --------------------------------------------------------------------------------------------------------------------------------- */

	nav	{
		background-color:#fff;
		border: none;
		clear:both;
		color:#000;
		display:block;
		float:left;
		margin-bottom:0px;
		padding:0px;
		/*position:fixed;
		text-align: left;
		z-index: 999;*/
		width:100%;
	}

	nav button > span,
	nav div,
	nav .dropdown.open > ul.dropdown-menu li a {
		text-decoration: none;
	}

	nav button {
		background: none;
		border: none;
		margin-right:15px;
		width:40px;
		z-index:100;
	}

	nav #top {
		display:-webkit-flex;
		display:flex;
		-webkit-justify-content: space-between;
		justify-content: space-between;
		-webkit-align-items:center;
		align-items:center;
	}

	nav #top > * {
		width: 100%;
	}

	nav #top h1,
	nav #top h2,
	nav #top ul {
		color:#383838;
		font-size: 1em;
		font-weight:bold;
		letter-spacing:1px;
	}

	nav #top h1,
	nav #top h2,
	nav #page-title {
		margin:auto auto auto 0px;
		width: auto;
	}
	
	nav .header {
		display:flex;
		display:-webkit-flex;
		flex-direction:column;
		-webkit-flex-direction:column;
	}
	
	nav .prop-header {
		font-weight: 400;
		text-align: center;
		text-transform: uppercase;
		white-space: pre;	
	}

	
	nav li.logo {
		flex: 1;
	}
	
	nav #svgl-logo-godmachine {
		fill:#000;
		position: relative;
	}

	nav .header-icons > li:not(.logo) svg {
		fill:#000;
		height:30px;
		margin:0px 10px;
	}
	
	nav ul,
	nav > ul > li {
		display: -webkit-flex;
		display: flex;
	}
,
	nav > ul li * {
		display: inline-block;
	}

	nav #top ul,
	nav > ul li > a,
	footer * {
		font-family:'Space Mono',Menlo,'Open sans',Arial,Helvetica;
	}

	nav #top ul {
		align-items: center;
		-webkit-align-items: center;
		justify-content:space-evenly;
		-webkit-justify-content:space-evenly;
		
		list-style:none;
		margin:auto auto 15px 0px;
		padding: 0px 3vw;
		text-transform:uppercase;
		width: 100%;
	}

	nav > .dropdown {
		background-color:#fff;
		display:none;
		height:100%;
		margin:0;
		padding: 0;
		position:fixed;
		/*text-align:center;
		top: 0px;*/
		width:100%;
	}

	nav > ul.dropdown li {
		background:#fff;
		background-size: 23px;
		border-radius:4px;
		margin-bottom:2px;
		color: #333;
		position: relative;
		width:100%;
		
		transition: all .5s;
		-webkit-transition: all .5s;
	}


	nav > ul li * {
		-webkit-align-items: center;
		align-items: center;
		-webkit-justify-content: center;
		justify-content: center;
		height: 100%;
	}

	nav > ul li > a {
		color: inherit;
		font-size: 1.8em;
		letter-spacing: 2px;
		padding:0.5em 10px;
	}
		
	nav > ul li:not(.break):hover {
		/*background-color:#f1efeb;*/
		color:#6e6859;
		text-decoration:none;
	}	
	
	nav > .dropdown,
	nav > ul > li {
		-webkit-flex-direction: column;
		flex-direction: column;
	}

	


	nav > .dropdown {
		opacity: 0;
		-webkit-opacity: 0;
		-o-opacity: 0;
		height: calc(100vh - 64px);
		left:101vw;
		padding: 2em 4em 7em 4em;
		pointer-events: none;
		top:79px;
		z-index:-1;
	}

	nav > .dropdown.on {
		pointer-events: auto;
		z-index:99;
	}
	
		
	nav > ul > li {
		-webkit-flex-direction: column;
		flex-direction: column;
	}	
	
	
	nav li.break {
		border-top:1px solid #ddd; 
		margin-top:3vw; 
		padding-top:1vw;
	}
	
	nav svg.shopping_cart {
		fill:#222;
	}
	
	
	
	body#home #nav-portfolio::first-letter,
	body#portfolio #nav-portfolio::first-letter,
	body#collections #nav-collections::first-letter,
	body#about #nav-about::first-letter,
	body#commission #nav-commission::first-letter {
		color:#FF49B4;
		font-weight:bold;
	}
	
	
	
	body#home #nav-portfolio,
	body#portfolio #nav-portfolio,
	body#collections #nav-collections,
	body#about #nav-about,
	body#commission #nav-commission {
		background-color: #fef3ff;
		border-radius:3px;
	}
	
	
	
	#secondary-nav {
		margin-bottom: 15px;
		padding-left: 2.5vw;
	}		


			
	#secondary-nav,
	#secondary-nav li {
		float:left;
		list-style-type:none;
		text-align:left;
		width:auto;
	}
	
	
	#secondary-nav li:not(:last-of-type) {
		margin-right:2vw;
	}
	
	
	#secondary-nav a {
		border-bottom: 1px solid transparent;
		font-size: calc(1.1rem + 0.3vw);
		letter-spacing: .07vw;
		/*text-transform: uppercase;*/
		transition: all .3s;
		-webkit-transition: all .3s;
	}
	

	#secondary-nav a:hover {
		border-color: #0daa98;
	}
	

	


	h1 {
		font-size:2.25em;
		letter-spacing: 0.1vw;
	}
	
	
	h2 {
		font-size:calc(10px + 0.8vw);
		margin-bottom:3vw;
	}
		
		
	h1, h2, h3 {
		margin-bottom: 2vw;
		margin-top: 0px;
	}

	picture,
	picture img {
		object-fit: cover;
		width: 100%;
	}

	picture {
		display:flex;
		display:-webkit-flex;
		height:100%;
	}



	
	@keyframes dropdown_on_mobile {
		to {
			-webkit-transform:translateX(-101vw);
			transform:translateX(-101vw);
			-webkit-opacity: 1;
			opacity: 1;
		}
	}



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

		nav .prop-header {
			font-size: 1vw;
			letter-spacing: 1.35vw;
			padding: 1vw 0px 1vw 15px;
		}

		nav #svgl-logo-godmachine {
			height:32px;
			margin:15px auto 10px 0px;
			max-width: 670px;
		}

		nav #nav-mnu {
			display:none;
		}
		
		nav #top ul li:not(.logo) {
			font-weight:normal;
			list-style:none;
			margin: 0px 10px;
			padding-left:0px;
		}
		
		body.gen > section:first-of-type {
			display: flex;
			display: -webkit-flex;
			flex-direction:column;
			-webkit-flex-direction:column;
			
			margin-left:auto;
			margin-right:auto;
			padding-top: 3vw;
		}
		
		body.gen > section:first-of-type > * {
			margin-left: auto;
			margin-right: auto;
		}
		
		body.gen > section:first-of-type h1 {
			color: #ffffff;
			font-size: calc(2em + 1vw);
			margin-bottom: calc(15px + 2vw);
		}
		
		body.gen > section:first-of-type h1,
		body.gen > section:first-of-type #intro {
			padding-left: calc(45px + 1vw);
		}
	}



	@media screen and (max-width:991px) {
		
		nav,
		nav li.logo,
		nav li.shop,
		nav > .dropdown,
		nav > ul.dropdown li.social,
		nav > ul.dropdown li a {
			display: flex;
			display: -webkit-flex;
		}
		
		nav {
			flex-direction: column;
			-webkit-flex-direction: column;
			background-color:#fff;
		}
		

		nav #top ul {
			padding-right:10px;
		}			
		
		nav #top ul li:not(.logo, .shop) {
			display: none;
		}
			
		
		nav #top .prop-header {
			background-color: #242833;
			color: #fff;
			font-size: 1.15rem;
			letter-spacing: normal;
			padding: 15px 5px;
		}
	
		
		nav #top li.logo > a {
			padding:0px 15px;
		}
	
		
		nav #top #svgl-logo-godmachine {
			width:100%;
		}


		nav h1 {
			padding-left:10px;
			padding-right:10px;
			letter-spacing:3px;
		}
		
		nav #top ul {
			align-items: center;
			-webkit-align-items: center;
			margin: 10px 0px 0px 0px;
		}
		
		nav #top button {
			margin-right:0px;
		}
		
		nav #top button,
		nav li.shop {
			width:40px;			
		}

		nav .nav-icon {
			margin: 0px;
			width: 25px;
		}

		nav .nav-icon:after, 
		nav .nav-icon:before, 
		nav .nav-icon div {
		  background-color: #484848;
		  content: '';
		  display: block;
		  height: 2px;
		  margin: 7px 0;
		  transition: all .2s ease-in-out;
		}

		body.open .nav-icon:before {
		  transform: translateY(9px) rotate(45deg);
		}

		body.open .nav-icon:after {
		  transform: translateY(-9px) rotate(-45deg);
		  box-shadow:none;
		}

		body.open .nav-icon div {
		  transform: scale(0);
		}


		nav > .dropdown.on {
			-webkit-animation: dropdown_on_mobile 0.7s cubic-bezier(0.5, 0, 0, 1) forwards;
			animation: dropdown_on_mobile 0.7s cubic-bezier(0.5, 0, 0, 1) forwards;
			right:0px;
			opacity: 1;
			overflow-y:scroll;
			padding: 30px 20px 5em 20px;
			top: 64px;
			width: 101vw;
		}
		
		nav > ul.dropdown li {
			margin: 10px 0px 10px 0px;
		}

		nav > ul.dropdown li a {
			align-items: center;
			-webkit-align-items: center;
			justify-content: space-between;
			-webkit-justify-content: space-between;
		}

		nav > ul.dropdown li:not(.social) a:after {
			background: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='15' height='10' viewBox='0 0 15 10'><g fill-rule='evenodd'><path fill='%23000000' d='M8.537.808a.5.5 0 01.817-.162l4 4a.5.5 0 010 .708l-4 4a.5.5 0 11-.708-.708L11.793 5.5H1a.5.5 0 010-1h10.793L8.646 1.354a.5.5 0 01-.109-.546z'/></g></svg>");
			background-repeat: no-repeat;
			background-position: center;
			background-size: contain;
			content: ' ';
			float: right;
			height: 25px;
			width: 20px;
		}
		
		nav > ul li > a {
			font-size:1.8rem;
			letter-spacing: normal;
			padding: 0px;
			text-transform: uppercase;
		}
		
		
		nav > ul.dropdown li.social {
			flex-direction:row;
			-webkit-flex-direction:row;
			justify-content: space-evenly;
			-webkit-justify-content: space-evenly;
			margin-top:auto;
		}		
		
		nav > ul.dropdown li.social svg {
			height:30px;
			margin:auto;
		}
				
		
		
		nav #top h1, 
		nav #top h2, 
		nav #top ul {
			font-size: 	0.85em;
		}
		
		nav #secondary-nav {
			display:none;
		}
		
		
		nav + section {
			margin-top:64px;
		}



		.btn {
			font-size: 1.4rem;
			margin-top:20px;
			padding-left: 6vw;
			padding-right: 6vw;
		}

		a.btn {
			font-weight: 600;
		}
		
		

		h3 {
			font-size:1.8rem;
			letter-spacing:3px;
		}

	}