/*====================================
  +++ MEDIA QUERIES +++
  ====================================*/

@media screen and (min-width: 22.5em) { /* 360px */

	#overlay nav[role="navigation"] > ul > li{
		font-size: 1.5em;
	}

}

@media screen and (min-width: 25em) { /* 400px */

	header[role="banner"] nav[role="navigation"] > ul{
		width: 87.5%;
	}

	header[role="banner"] nav[role="navigation"] > ul > li:nth-child(n+4){
		display: -webkit-flex;
		display: flex;
	}

	header[role="banner"] nav[role="navigation"] > ul > li:nth-child(n+6){
		display: none;
	}

	#menu-icon {
		width: 5.0625rem;
	}

	#overlay nav[role="navigation"] > ul > li{
		font-size: 1.75em;
	}

}

@media screen and (min-width: 31.25em) { /* 500px */

	.modal-content {
		top: auto;
		transform: none;
		padding-bottom: 0;
	}

}

@media screen and (min-width: 37.5em) { /* 600px */

	body {
		padding: 1.125em 2.625em 5.25em;
	}

	* + * {
		margin-top: 1.3125em;
	}

	.tabs{
		margin-top: 2.625em;
	}

	*[role="tabpanel"]{
		padding: 1.3125em;
	}

	.full-width {
		margin-left: 2.625em;
		margin-right: 2.625em;
	}

	body:not(.single-post):not(.single-project):not(.home):not(.single-material) section + section,
	body:not(.single-post):not(.single-project):not(.page-template-home-test):not(.single-material) section + section,
	section + section.wrapper,
	article + section {
		margin-top: 1.96875em;
	    padding-top: 3.28125em;
	}

	figure + section {
	    margin-top: 3.28125em;
	}

	.page-template-contact .column-50 + .column-50,
	.page-template-contact-test .column-50 + .column-50{
		margin-top: 3.28125em;
	}

	.gutter {
		margin: 1.3125em -1.3125em -1.3125em;
	}

	.gutter > * {
		padding: 1.3125em !important;
	}

	.gallery.grid figcaption {
		top: 1.3125em;
	    left: 1.3125em;
	    bottom: 1.3125em;
	    right: 1.3125em;
	}

	.page-template-designers .grid > * {
		-webkit-flex: 0 0 50%;
		flex: 0 0 50%;
		width: 50%;
	}

	.feed > * + *{
		margin-top: 2.625em;
	}

	header[role="banner"]{
		-webkit-justify-content: space-between;
		justify-content: space-between;
		-webkit-align-items: center;
		align-items: center;
	}

	#search{
		display: block;
		position: static;
	}

	input[type="search"]{
		width: auto;
		font-size: 0.875em;
		border-right: 1px solid #fff;
		border-bottom: 1px solid #bbb;
	    color: #111;
	}

	input[type="search"]:focus{
		color: #111;
		border: 1px solid #111;
	}

	input[type="search"]::-webkit-input-placeholder { /* Chrome/Opera/Safari */
	  color: #999;
	}

	input[type="search"]::-moz-placeholder { /* Firefox 19+ */
	  color: #999;
	}

	input[type="search"]:-ms-input-placeholder { /* IE 10+ */
	  color: #999;
	}

	input[type="search"]:-moz-placeholder { /* Firefox 18- */
	  color: #999;
	}

	input[type="search"]:focus::-webkit-input-placeholder { /* Chrome/Opera/Safari */
	  color: #fff;
	}

	input[type="search"]:focus::-moz-placeholder { /* Firefox 19+ */
	  color: #fff;
	}

	input[type="search"]:focus:-ms-input-placeholder { /* IE 10+ */
	  color: #fff;
	}

	input[type="search"]:focus:-moz-placeholder { /* Firefox 18- */
	  color: #fff;
	}

	form[role="search"] input[type="submit"]:hover,
	form[role="search"] input[type="submit"]:focus{
		background-color: #111;
		color: #fff;
	}

	fieldset + input[type="submit"],
	input[type="button"] {
		margin-top: 1.3125em;
	}

	header[role="banner"] nav[role="navigation"] > ul{
		width: 100%;
		justify-content: space-between;
	}

	header[role="banner"] nav[role="navigation"] > ul > li:nth-child(n+4){
		display: -webkit-flex;
		display: flex;
	}

	#menu-main-menu-1 a{
		padding: 0.25em 2.625rem;
	}

	#overlay .sub-menu {
		margin: 0 2.625rem 1.3125em;
	}

	.modal-toggle {
		left: 50%;
		transform: translateX(-50%);
		width: auto;
	}

	main{
		margin-top: 3.9375em;
	}

	article * + figure,
	article * + figure,
	.single-post article figure,
	.single-project article figure {
		margin-top: 3.9375em;
	}

	.single-post article figure.text-columns,
	.single-project article figure.text-columns {
		margin-top: 2.4375em;
	}

	article header{
		margin-bottom: 1.3125em;
	}

	.single-team article header{
		margin-bottom: 1.96875em;
	}

	article * + header{
		margin-top: 2.625em;
	}

	article footer {
		margin-top: 5.90625em;
	}

	footer[role="contentinfo"],
	section footer {
		margin-top: 5.25em;
	    padding-top: 2.625em;
	}

	h1{
		font-size: 1.5em;
	}

	.subheading {
		font-size: 1.125em;
	}

	h2{
		font-size: 1.3125em;
	}

	.grid h2,
	.grid h3,
	.feed h2,
	.feed h3,
	footer figcaption {
		font-size: 0.875em;
	}

	.grid h2,
	.grid h3{
		margin-top: 0.65625em;
	}

	.tabs h2,
	.tabs h3{
		font-size: 0.875em;
	}

	.text-columns > h2,
	.text-columns > h3{
		font-size: 0.875em;
	}

	.role{
		font-size: 0.875em;
	}

	header .role{
		font-size: 1.125em;
	}

	p{
		font-size: 0.875em;
	}

	.meta{
		font-size: 0.75em;
	}

	.single-text-column p,
	.single-post article article section:first-of-type .text-columns:first-of-type p:first-of-type,
	.single-project article article section:first-of-type .text-columns:first-of-type p:first-of-type{
		font-size: 1.125em;
	}

	.meta-type,
	label,
	fieldset + input[type="submit"],
	input[type="button"] {
		font-size: 0.75em;
	}

	.meta-value{
		font-size: 0.875em;
	}

/* SINGLE-PRODUCT */

	.palette > *{
		width: 20%;
	}

	.label{
		font-size: 0.75em;
	}

/* HOME */

	.call-to-action > * + *{
		margin-left: 0.65625em;
		padding-left: 0.65625em;
	}

/* ABOUT */

	.page-template-about .text-columns,
	.page-template-about-test .text-columns{
		margin-bottom: 1.325em;
	}

	.page-template-about section:first-of-type p:first-of-type,
	.page-template-about-test section:first-of-type p:first-of-type {
		font-size: 1.125em;
	}

}

@media screen and (min-width: 56.25em) { /* 900px */

	header[role="banner"].scrolled {
		height: 3em;
	}

	.scrolled .main-logo svg {
		-webkit-transform: scale3d(0.70,0.70,70) translateY(1.6em);;
		-ms-transform: scale3d(0.70,0.70,70) translateY(1.6em);;
		transform: scale3d(0.70,0.70,70) translateY(1.6em);;
	}

	body {
		padding: 3.9375em 2.625em 5.25em;
	}

	.modal-content {
		padding-top: 1.5em;
		padding-right: 1.5em;
		padding-bottom: 1.5em;
		padding-left: calc(50% + 3em);
	}

	.grid > *,
	.page-template-designers .grid > * {
		-webkit-flex: 0 0 33.3333%;
		flex: 0 0 33.3333%;
		width: 33.3333%;
	}

	.home .grid > *,
	.page-template-home-test .grid > *,
	.page-template-design-junction .grid > *,
	.page-template-projects .grid > *,
	.page-template-spaces .grid > *,
	.page-template-projects-test .grid > *,
	.page-template-team .grid > *,
	.page-template-contact .grid > *,
	.page-template-contact-test .grid > *,
	.blog .grid > *,
	.feed .flex > *,
	.related-projects .grid > *  {
		-webkit-flex: 0 0 50%;
		flex: 0 0 50%;
		width: 50%;
	}

	.columns{
		display: -webkit-flex;
		display: flex;
		margin: 0 -2.625em;
		text-align: left;
	}

	.home .columns,
	.page-template-home-test .columns,
	.page-template-contact .columns {
		margin: 2.625em -2.625em 0;
	}

	.single-product .columns{
		-webkit-flex-direction: row;
		flex-direction: row;
	}

	.single .columns,
	.page-template-about .columns{
		text-align: left;
	}

	.columns > *{
		margin-top: 0;
		padding: 0 2.625em;
	}

	.column-25{
		width: 25%;
	}

	.column-33{
		width: 33.3333%;
	}

	.column-31{
		width: 31.25%;
	}

	.column-37-5{
		width: 37.5%;
	}

	.column-50{
		width: 50%;
	}

	.column-62-5{
		width: 62.5%;
	}

	.column-68{
		width: 68.75%;
	}

	.column-75{
		width: 75%;
	}

	.page-template-contact .column-50 + .column-50 {
		margin-top: 0;
	}

	.article-content{
		display: block;
		max-width: none;
	}

	.feed .article-content{
		display: -webkit-flex;
		display: flex;
	}

	header[role="banner"]{
		position: fixed;
		height: 6em;
		padding: 1.125em 2.625em;
	}

	.text-columns,
	.nf-form-cont {
		max-width: 33.75em;
	}

	.text-columns{
		margin-top: 1.5em;
	}

	h2 + .text-columns {
		margin-top: 1.21875em;
	}

	.single-designer article figcaption{
		display: block;
	}

	.feed .flex{
		-webkit-flex-direction: row;
		flex-direction: row;
		margin: 0 -1.3125em;
	}

	.feed .flex > *{
		padding: 0 1.3125em;
	}

	.feed h2,
	.feed h3{
		margin-top: 0;
	}

/* SINGLE-PRODUCT */

	.palette > *{
		width: 25%;
	}

	#product-details {
		margin-top: 0;
	}

	.single .breadcrumbs{
		display: -webkit-flex;
		display: flex;
	}

}

@media screen and (min-width: 75em) { /* 1200px */

/* GLOBAL */

	* + * {
		margin-top: 1.5em;
	}

	footer .modal-toggle {
		display: block;
		bottom: 0;
		width: auto;
		background: #111;
		border: 0;
		border-top-left-radius: 3px;
		border-top-right-radius: 3px;
	}

	footer .modal-toggle:hover,
	footer .modal-toggle:focus {
		border: 0;
	}

	body {
		padding: 4.5em 3em 6em;
	}

	.full-width {
		margin-left: 3em;
		margin-right: 3em;
	}

	header[role="banner"] nav[role="navigation"] > ul > li{
		display: block;
	}

	.main-logo svg {
		height: 2.25em;
	}

	.wrapper{
		display: inline-block;
		width: 67.50em;
	}

	.wrapper-medium {
		display: inline-block;
		width: 55em;
	}

	.notice .wrapper {
		width: 50.625em;
	}

	.gutter {
		margin: 1.5em -1.5em -1.5em;
	}

	.grid > *,
	.page-template-designers .grid > * {
		-webkit-flex: 0 0 25%;
		flex: 0 0 25%;
		width: 25%;
	}

	.gutter > *,
	.page-template-designers .gutter > * {
		padding: 1.5em !important;
	}

	.home .grid > *,
	.page-template-home-test .grid > *,
	.page-template-design-junction .grid > *,
	.page-template-team .grid > *,
	.page-template-contact .grid > * ,
	.page-template-contact-test .grid > * {
		-webkit-flex: 0 0 33.3333%;
		flex: 0 0 33.3333%;
		width: 33.3333%;
	}

	.page-template-fabrics .grid > * {
		-webkit-flex: 0 0 12.5%;
		flex: 0 0 12.5%;
		width: 12.5%;
	}

	.gallery.grid figcaption {
		top: 1.5em;
		left: 1.5em;
		bottom: 1.5em;
		right: 1.5em;
	}

	.columns{
		margin: 0 -3em;
	}

	.home .columns,
	.page-template-home-test .columns,
	.page-template-contact .columns,
	.page-template-contact-test .columns{
		margin: 3em -3em 0;
	}

	.columns > *{
		padding: 0 3em;
	}

	.page-template-about .text-columns,
	.page-template-about-test .text-columns{
		margin-bottom: 1.5em;
	}

	.feed > * + *{
		margin-top: 3em;
	}

	.feed .flex{
		margin: 0 -1.5em;
	}

	.feed .flex > *{
		padding: 0 1.5em;
	}

	.tabs{
		margin-top: 3em;
	}

	*[role="tab"]{
		padding: 1.125em;
	}

	*[role="tabpanel"]{
		padding: 1.5em;
	}

	.tabs h2,
	.tabs h3{
		margin-bottom: 0.75em;
		font-size: 0.875em;
	}

	header[role="banner"] nav[role="navigation"]{
		display: block;
		position: static;
		background: none;
	}

	header[role="banner"] nav[role="navigation"] > ul{
		width: auto;
	}

	header[role="banner"] nav[role="navigation"] > ul > li{
		font-weight: 500;
		text-transform: uppercase;
		letter-spacing: 0.1em;
	}

	header[role="banner"] nav[role="navigation"] > ul > li:nth-child(n+4){
		display: -webkit-flex;
		display: flex;
	}

	header[role="banner"] .menu-item span:before,
	header[role="banner"] #menu-item-42 span:before,
	header[role="banner"] #menu-item-43 span:before,
	header[role="banner"] #menu-item-44 span:before,
	header[role="banner"] #menu-item-46 span:before,
	header[role="banner"] #menu-item-47 span:before,
	header[role="banner"] #menu-item-48 span:before,
	header[role="banner"] #menu-item-49 span:before{
		content: "";
	}

	nav a{
		-webkit-flex-shrink: 0;
		flex-shrink: 0;
		padding: 0.75em 1.125em;
		color: #111;
	}

	header[role="banner"] nav[role="navigation"] > ul > li a:hover,
	header[role="banner"] nav[role="navigation"] > ul > li a:focus{
		background: none;
		color: #999;
	}

	#menu-icon {
	    display: none;
	}

	header[role="banner"] nav .sub-menu{
		display: flex;
		margin-top: -1px;
	}

	header[role="banner"]{
		height: 6em;
	    padding: 0.75em 3em;
	}

	header[role="banner"].scrolled {
		height: 3em;
	}

	.main-logo svg {
	    height: 3.75em;
	}

	.scrolled .main-logo svg {
		-webkit-transform: scale3d(0.70,0.70,70) translateY(1.6em);;
		-ms-transform: scale3d(0.70,0.70,70) translateY(1.6em);;
		transform: scale3d(0.70,0.70,70) translateY(1.6em);;
	}

	main{
		margin-top: 4.5em;
	}

	article * + figure,
	article * + figure,
	.single-post article figure,
	.single-project article figure {
		margin-top: 4.5em;
	}

	.single-post article figure.text-columns,
	.single-project article figure.text-columns {
		margin-top: 3em;
	}

	article header{
		margin-bottom: 1.5em;
	}

	.single-team article header{
		margin-bottom: 2.25em;
	}

	article * + header{
		margin-top: 3em;
	}

	.single-product article {
		display: -webkit-flex;
		display: flex;
	}

	article footer {
		margin-top: 6.75em;
	}

	body:not(.single-post):not(.single-project):not(.home):not(.single-material) section + section,
	body:not(.single-post):not(.single-project):not(.page-template-home-test):not(.single-material) section + section,
	section + section.wrapper,
	article + section {
		margin-top: 2.25em;
	    padding-top: 3.75em;
	}

	figure + section {
	    margin-top: 3.75em;
	}

	.full-width{
		margin-left: -3em;
		margin-right: -3em;
	}

	h1 {
		font-size: 1.75em;
	}

	h2{
		font-size: 1.3125em;
	}

	.grid h2,
	.grid h3,
	.feed h2,
	.feed h3,
	footer figcaption {
		font-size: 0.875em;
	}

	.grid h2,
	.grid h3{
		margin-top: 0.75em;
	}

	p{
		font-size: 0.875em;
	}

	section footer p {
		font-size: 1.125em;
	}

	.role{
		font-size: 0.875em;
	}

	header .role{
		font-size: 1.125em;
	}

	.feed p{
		font-size: 0.875em;
	}

	.single-text-column p,
	.single-post article section:first-of-type .text-columns:first-of-type p:first-of-type,
	.single-project article section:first-of-type .text-columns:first-of-type p:first-of-type,
	.single-material article section:first-of-type .text-columns:first-of-type p:first-of-type {
		font-size: 1.125em;
	}

	.small-print{
		font-size: 0.75em;
	}

	fieldset + input[type="submit"],
	input[type="button"] {
		margin-top: 1.5em;
	}

/* HOME */

	.call-to-action{
		position: absolute;
	    bottom: 1.5em;
	    left: calc(66.6666% + 2.25em);
	}

	.call-to-action > * + *{
		margin-left: 0.75em;
		padding-left: 0.75em;
	}

	.home .mc4wp-form {
		display: block;
	}

/* ABOUT */

	.page-template-about section:first-of-type p:first-of-type,
	.page-template-about-test section:first-of-type p:first-of-type{
		font-size: 1.125em;
	}

/* SINGLE-PRODUCT */

	.palette > *{
		width: 20%;
	}

}

@media screen and (min-width: 112.5em) { /* 1800px */

	body{
		font-size: 1.125em;
	}

}
