@import "root.css";

/*
* Misc
*/
	* {
		font-family: 'Lens Grotesk';
		font-weight: var(--demiBold);
	}
	u {
		font-weight: 100;
	}
    p {
        margin:0;
    }
	.error {
		/*font-size: 2em;*/
		color: var(--error);
	}
	.container {
		/*border-left: 1px solid #f00;*/
		/*border-right: 1px solid #f00;*/
		max-width: 1500px;
	}
	.disabled {
		opacity: 0.5;
		cursor: not-allowed;
	}
	.container--inverted {
		background-color: var(--primary-dark);
		color: var(--primary);
	}

	a, .nav-link {
		color: var(--primary-dark);
		text-decoration: none;
	}
	a:hover, .nav-link:hover, .nav-link:focus {
		color: var(--primary-dark);
		text-decoration: underline;
	}
	.paragraph p {
	    font-weight: 100;
        line-height: 25px;
        font-size: 21px;
	}
	/* .paragraph p strong { font-weight:100; } */
	.paragraph p em {
	    font-weight:100;
	}
	
	.img-fluid {
		width: 100%;
	}
	.invalid-video {
		color: var(--secondary-dark);
		text-align: center;
		font-style: italic;
	}
	.container--inverted .invalid-video, .container--inverted a {
		color: var(--primary);
	}

	/* This should be in the Bootstrap CDN? */
	.embed-responsive {
		position: relative;
		display: block;
		width: 100%;
		padding: 0;
		overflow: hidden;
	}
	.embed-responsive .embed-responsive-item, .embed-responsive iframe, .embed-responsive embed, .embed-responsive object, .embed-responsive video {
		position: absolute;
		top: 0;
		bottom: 0;
		left: 0;
		width: 100%;
		height: 100%;
		border: 0;
	}
	.embed-responsive::before {
		display: block;
		content: "";
	}
	.embed-responsive-16by9::before {
		padding-top: 56.25%;
	}

	/* Related link */
		.related-link {
			display: flex;
			margin: 30px auto;
			width: 42%;
			max-width: 390px;
			text-align: center;
			font-size: 1.7em;
		}
			.related-link-text {
				float: left;
				font-weight: 140;
				padding-top: 3px;
				flex-grow: 1;
			}
			.related-link:hover .related-link-text {
				text-decoration: underline;
			}
			.arrow-holder {
				float: left;
			}
				.font-arrow {
					width: 30px;
					height: auto;
				}
				.project-container .font-arrow {
					filter: invert();
				}
				.font-arrow_right { transform: rotate(180deg); }
	
/*
* Header and navigation
*/
	#main-navigation {
		padding: 0;
		/*z-index: 10000000;*/
		background-color:var(--primary);
	}
		.container--inverted #main-navigation {
			background-color: var(--secondary);
		}
		#logo-image {
			display: block;
			margin-top:-5px;
			margin-left:20px;
			height:30px;
		}
		#logo:hover, #logo:focus { text-decoration:none; }
		.container--inverted #logo-image { filter: invert(100%) }
		#toggle-navbar {
			display: none;
		}
		.nav-link--header {
			color: var(--primary-dark);
			/* text-transform: uppercase; */
			font-weight: 120;
			/*var(--demiBold);*/
			font-size:18px;
			line-height: 21px;
			padding:24px 0;
		}
		#navbar__spacer {
			display: none;
		}
		.navbar-expand-lg .navbar-nav .nav-link--header {
			padding-left: 1rem;
		}
			.header-link--selected, .nav-link--header:hover {
				text-decoration: underline;
			}
			#nav-link--about {
				margin-right:15px;
			}
			#shopping-cart-icon {
				font-size: 3em;
			}
		.container--inverted .nav-link--header { color: var(--primary); }

	#main-container {
		min-height: 88.5vh;
		padding-left: 0;
		padding-right: 0;
		/* border-left:1px solid #f0f;
		border-right:1px solid #f0f; */
	}
/*
* Homepage
*/
	/*
	#homepage__container {
		position: relative;
		top:0;
		left: 0;
		width: 100%;
		height: 100%;
		overflow: hidden;
	} */
	
	#homepage__header {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		background: var(--primary);
		z-index: 1000;
	}
	
	#homepage__carousel {
		position: fixed;
		top: 0;
		left: 0;
		right:0;
		height: 100vh;
		width: 100%;
		margin:0 auto;
		z-index: 1;
		padding: 0;
		overflow: hidden;
		margin: 0;
	}
		#homepage-carousel__images {
			position: absolute;
			height: 100%;
			max-width: 100%;
		}
			.image--carousel {
				display: block;
				position: absolute;
				top: 0;
				left: 0;
				opacity: 0;
				width: 100%;
				height: 100%;
				object-fit: cover;
				object-position: 50% 50%;
				background-size: cover;
				background-position: center;
				background-repeat: no-repeat;
				transition: opacity 0.3s linear;
				-webkit-transition: opacity 0.3s linear;
				-moz-transition: opacity 0.3s linear;
				-ms-transition: opacity 0.3s linear;
				-o-transition: opacity 0.3s linear;
			}
			.image--carousel.active { opacity: 1; }

		#carousel-navigation {
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
		}
			.carousel-nav__button {
				position: absolute;
				top: 0;
				height: 100%;
				width: 35%;
				border: none;
				background: transparent;
				opacity: 1;
				font-size: 100px;
				line-height: 140px;
				color: var(--primary);
				transition: opacity 0.3s linear;
				-webkit-transition: opacity 0.3s linear;
				-moz-transition: opacity 0.3s linear;
				-ms-transition: opacity 0.3s linear;
				-o-transition: opacity 0.3s linear;
			}
			.carousel-nav__button:hover {
				opacity: 1;
				cursor: pointer;
			}
			#arrow-left {
				left: 0;
				text-align: left;
				padding-left:20px;
			}
			#arrow-right {
				right: 0;
				text-align: right;
				padding-right:20px;
			}
			.carousel-arrow {
				width: 70px;
			}
				#arrow-left .carousel-arrow {
					transform: rotate(180deg);
				}

	#homepage__content {
		position: relative;
		z-index: 2;
		width: 100%;
		height: auto;
		margin-top:70px;
		min-height:100vh;
	}
		#homepage__grid {
			margin-top: 100vh;
			min-height: 100vh;
			background-color: var(--primary);
		}
			#homepage__grid #main-container {
				min-height: calc(100vh - 50px);
			}
			#homepage__grid #filters {
				padding-top: 30px;
			}
		#homepage__footer {
			z-index: 1000;
			position: fixed;
			bottom: 0;
			left: 0;
			width: 100%;
			padding: 10px 0;
			background: var(--primary);
			transition: bottom 0.3s linear;
		}

/*
* Works page
*/
	#main-container.main-container--works {
		width: 100%;
		max-width: 100%;
		padding:0 25px;
	}
		#works-container {
			max-width: 100%;
		}
	#filters {
	}
		.container--inverted .nav-link--filter, .nav-link--filter {
			padding: 8px 5px 4px 5px;
			color: #999999;
			font-size:0.75em;
			background: transparent;
			border: none;
			
			/* font-size:16px; */
			line-height: 19px;
		}
		.filter-link--selected, .nav-link--filter:hover, .nav-link--filter:focus {
			text-decoration: none;
			color: var(--primary-dark);
			font-weight: var(--bold);
		}
		.container--inverted .filter-link--selected, .container--inverted .nav-link--filter:hover {
			color: var(--primary);
		}
		
	.project {
		padding: 0;
		overflow: hidden;
	}
		.image-container {
			width: 100%;
			height: 100%;
			z-index: 1;
			/* background-color: var(--secondary-dark); */
			
		}
			.project-img {
				width: 100%;
				height: auto;
				display:block;
			}
				.project-img .img-fluid {
				    display:block;
				    float:left;
				    width: 100%;
                    height: 100%;
					object-fit: cover;
					object-position: 50% 50%;
					/*max-height:218px;*/
				}
			.project-img--static {display: block;}
			.project-img--dynamic {display: none;}

			.project:hover .project-img--static {display: none;}
			.project:hover .project-img--dynamic {display: block;}
			
		.project-name-container {
			display: flex;
			float: left;
			width: 100%;
			visibility:hidden;
			/* height: auto; */
			margin-top: -100px;
			background: #ffffffaa;
			z-index: 2;
			padding: 0px 15px;
			align-items: center;
			opacity: 0;
			transition: opacity 0.3s linear;
			display: none;
		}
	
		.project:hover .project-name-container {
			opacity: 1;
		}
			.project-name {
				margin-top: 10px;
				color: var(--primary-dark);
				font-weight: var(--medium);
				font-size:18px;
				line-height: 28px;
			}
			.project-name:hover {
				text-decoration: underline;
			}
/*
* Single Project papge
*/
	
	.project-container {
		padding:0;
		max-width: 100%;
	}
		#title-image-container {
			height: 75vh;
			width: 100%;
			padding: 0;
			margin: 0;
			overflow:hidden;
		}
		    #title-image {
		        width: 100%;
				height:100%;
				object-fit: cover;
				object-position: center;
		    }
		#project-info {
			padding: 60px 10px 25px 10px;
		}
			#project-title, #project-title p {
				font-size: 70px;
				font-weight: 110;
				line-height: 84px;
			}
			#project-description {
			    margin-top:30px;
			}
			#project-description p,
			#project-description h6 {
				font-weight:100;
				line-height: 25px;
				font-size: 21px;
			 }

			#project-filters {
			    margin-top: 14px;
			}
				.project-filter {
					float: left;
					width: 100%;
					text-align: right;
					text-transform: uppercase;
					font-weight: var(--light);
					font-size:1em;
					line-height: 25px;
				}
		#read-story-link {
			color: var(--primary-dark);
			font-size:26px;
			line-height: 36px;
			margin-top: 70px;
			margin-bottom:100px;
			font-weight: var(--bold);
		}

		.container--block {
			margin-top: 20px;
		}
			.image_text--right {
				flex-flow: row-reverse;
			}
			.col--paragraph {
				display: flex;
				align-items: center;
				align-content: center;
			}
			.paragraph {
				/*font-weight: 600;*/
			}

		#contact-info {
			background: var(--primary);
			color: var(--primary-dark);
			padding:300px 0;
		}
			.ci-heading {
				float: left;
				width: 100%;
				text-align: center;
			}
			.ci-h2 {
				margin-top: -75px;
				font-size: 80px;
				font-weight: 120;
				line-height: 84px;
			}
			.ci-h3 {
				font-size: 1.05em;
				font-weight: 140;
				line-height: 25px;
			}
			.ci-h3:hover {
				text-decoration: underline;
				cursor: pointer;
			}

	.project--related {
		overflow: initial;
		height: calc(100%/4);
		padding-left:10px!important;
		padding-right:10px!important;
		overflow: visible;
	}
	.project--related .project-name-container{
		background: transparent;
		padding-left: 0;
		opacity: 1;
		height:auto;
		margin-top:3px;
		visibility: visible;
		display: flex;
	}
	.related-projects-container {
	}
		.related-heading {
			/* margin-bottom: 30px; */
			padding-top: 30px;
			font-weight: 120;
			font-size:45px;
			line-height: 43px;
		}
		.project--related .project-name {
			line-height: 25px;
			margin-top: 0;
			font-weight:120;
		}

/*
* Stories
*/
	#stories-wrapper {
		background-color: var(--primary-dark);
	}
	#main-container.main-container--stories {
		width: calc(100% - 720px);
		max-width: 1300px;
		min-width: 940px;
	}
	#sotries-container {
		padding-bottom: 185px;
	}
		.container--sotries {
			max-width: 940px;
		}
			.story {
				margin-top:120px;
    		    color:var(--primary);
			}
			.story:hover {
				color:var(--primary);
				text-decoration: none;
			}
			.story:hover .story-link { text-decoration: underline; }
			    .story-image-container {
			        
			    }
				.story-image-container .img-fluid, .story-image-container video {
					float:left;
					width:100%;
					height: 100%;
					object-fit: cover;
					object-position: center;
				}
				.story-info {
					display: flex;
					flex-flow: column;
					/*padding-left: 50px;*/
					line-height: 20px;
					/* background-color: #0ff; */
				}
					.story-date-wrapper {
					}
					.story-info-wrapper {
						flex-grow: 2;
					}
					.story-link-wrapper {
					}
					.story-date {
						font-size: 1em;
						font-weight: var(--light);
					}
					.story-title {
						/*font-size: 2.2em;*/
						font-size:3.0em;
						line-height:1em;
						font-weight: 120;
						margin-bottom:15px;
						margin-top:10px;
					}
					    .story-title p {
					        font-weight:120;
					    }
					.story-description {
						overflow: hidden;
						text-overflow: ellipsis;
					}
						.story-description p {
							font-size:1em;
							line-height:1.3em;
							/*font-size: 1em;*/
							/*line-height: 19px;*/
							overflow:hidden;
							font-weight: 90;
							margin-top: -2px;

							display: -webkit-box !important;
							-webkit-line-clamp: initial;
							-webkit-box-orient: vertical;
							white-space: normal;
						}
					.story-link {
						float: left;
						line-height: 10px;
						font-weight: var(--light);
						/* background-color: #f00; */
						/* padding-top: 10px; */
					}
/*
* Single Story page
*/
	#main-container.main-container--single-story {
		width: calc(100% - 720px);
		max-width: 1100px;
		min-width: 940px;
		padding-top: 130px;
		padding-left:0;
		padding-right: 0;
	}
	#single-story-container {
		max-width: 100%;
		padding-top: 100px;
		padding: 0;
	}
		#single-story-container .container--block .col {
    	    padding:0;
    	}
		
   /* 	#single-story-container .container--block .paragraph p {*/
   /* 	    font-weight: var(--light);*/
			/*line-height: 27px;*/
			/*font-size: 21px;*/
   /* 	}*/
        #story-navigation {
        }
    	#story-title {
		    font-size: 3.8em;
            font-weight: 120;
            line-height: 69px;
            margin-bottom: 10px;
    	}
    	    #story-title.story-formatted-title p {
				line-height: 67px;
				font-weight: 120;
			}
		#story-subtitle {
    		font-size: 1.5em;	
    		width: 90%;
    		font-weight: 90;
		    line-height: 1.3em;
    		margin-bottom: 20px;
    	}
			#story-subtitle p {
				font-weight: 90;
		    	line-height: 1.3em;
			}
    	#story-information {
    		font-size: 0.8em;
    	}
    		.info-row {
    			float: left;
    			width: 100%;
				font-weight: var(--light);
				line-height: 16px;
    		}
			.story-link--navigation {
				color: var(--primary);
				line-height: 16px;
				text-transform: uppercase;
			}
			.story-link--navigation:hover { color: var(--primary); }
    
    	.stories-blocks {
    		margin-top: 120px;
    	}
    		#single-story-container .image--single {
    			width: 66%;
    			float: right;
    			margin: 10px 0;
    		}
    
    	#story-carousel {
    		height: auto;
    		margin:  100px 0;
    		width: 100%;
    		overflow: hidden;
    	}
    		#carousel-inner {
    			width: 100%;
    			height: 100%;
				margin-left: 40%;
    			white-space: nowrap;
    			transform: translateX(0px);
				cursor: grab;
    		}
    				.carousel__image {
						width: 600px;
    				  	display: inline-block;
    				  	background-size: cover;
    					background-position: center;
    					background-color: #cccccc;
    					opacity: 1;
    					margin-left:10px;
    					object-fit: cover;
				        object-position: 50% 50%;
    					transition: opacity 0.3s linear;
    					-webkit-transition: opacity 0.3s linear;
    					-moz-transition: opacity 0.3s linear;
    					-ms-transition: opacity 0.3s linear;
    					-o-transition: opacity 0.3s linear;
    				}
					.carousel__image#image__0 {
						margin-left: 0px;
					}
    				.carousel__image.displayed {
    					opacity: 1;
    				}
    				.animate {
    					transition: all .5s ease-out;
    				}
    				
    	#see-project-link {
    		color: var(--primary);
    		line-height: 36px;
    		padding-top: 100px;
    		padding-bottom: 160px;
    		font-size:26px;
    	}
	#related-stories-wrapper {
		max-width: 100%;
	}
    	.related-stories-container {
    		
    		padding-top:30px;
    		padding-bottom:40px;
    	}
    	    .related-stories-container .related-heading {
    	        
    	        margin-left:-10px;
    	        margin-bottom:20px;
    	        
    	    }
    		.story--related {
    			color: var(--primary);
    		}
    		.story--related.px-2 {
    			padding-right: 50px!important;
    			padding-left:5px;
    		}
    		.story--related:hover {
				color:var(--primary);
				text-decoration: none;
			}
			.story--related:hover .read-more {
				text-decoration: underline;
			}
    			.container--story-info {
    				min-height:190px;
    				padding: 0;
    				overflow:hidden;
    			}
    				.related-stories-container .story-date {
    				    display:none;
    				}
    				.related-stories-container .story-title {
    					font-size: 1.90em;
						font-weight: 120;
						line-height:35px;
    				}
    				.related-stories-container .story-title p {
    				    font-weight: 120;
    				    line-height:35px;
    				}
    				.related-stories-container .story-subtitle {
    					max-height:78px;
    					overflow:hidden;
    					padding-right:20px;
						font-size: 1em;
    				}
						.related-stories-container .story-subtitle p {
							font-weight: var(--light);
						}
    				.related-stories-container .read-more {
    					font-size: 1em;
						font-weight: var(--medium);
    				}
/*
* Studio page
*/
    .container#container-studio {
        max-width:1490px;
    }
	#studio-main-paragraph {
		font-size: 50px;
		line-height: 60px;
		margin-bottom: 105px;
		margin-top: 90px;
	}
	#studio-main-paragraph h2 {
	    font-weight: 110;
		font-size: 48px;
		line-height: 60px;
		/*margin-bottom:105px*/
	}
	#studio-main-paragraph h3 {
		font-size: 35px;
		font-weight: 110 ;
	}
	#studio-main-paragraph b,
	#studio-main-paragraph a
	/* #studio-main-paragraph strong */
	{ font-weight:110;}
	#studio-main-paragraph * {
		font-weight: 100;
   		font-size: 30px;
		line-height: 35px;
		color: var(--primary-dark);
	}
    #studio-main-paragraph h5, #studio-main-paragraph h5 a {font-size: 20px;}
    
	#heading--team, .heading--studio {
		font-size: 70px;
		font-weight: 110;
		line-height: 88px;
		margin-bottom:25px;
	}
	.colleague {
		height: auto;
		margin-bottom: 50px;
		padding:0px 10px;
		/* border:1px solid #0f0 */
	}
		.colleague-image {
			float: left;
			width: 100%;
			height: auto;
			background-color: var(--secondary-dark);
		}
		.colleague-info {
			float: left;
			width: 100%;
			background: var(--primary);
			margin-top: 20px;
			display: flex;
			flex-flow: column;
		}
			.colleague-name {
				font-weight: var(--demiBold);
				line-height: 25px;
				font-size:21px;
				margin-bottom:0;
				text-transform:uppercase;
			}
			.colleague-title, .colleague-link {
				font-weight: var(--light);
				font-size: 20px;
				line-height: 25px;
			}
			
	#expandables-wrapper { background:#000;}
	.container#expandables {
		width: calc(100% - 40px);
		max-width: 1600px;
	}
		.studio-section {
			padding-top: 100px;
			width: 100%;
			max-width: 100%;
			padding-left: 0;
			padding-right: 0;
			margin-left: 0;
    		margin-right: 0;
		}
		.studio-section .col-lg-6 {
			padding:0;
		}
		
		#what-we-do {
			padding-top: 80px;
		}
		#what-we-did {
			padding-top:80px;
		}
		#where-we-are {
			padding-bottom:75px;
		}
			.studio-section__heading {
				float: left;
				font-size: 48px;
				/*margin: 10px 0;*/
				font-weight: 110;
				line-height: 84px;
			}

			.studio-section__content {
				font-weight: var(--demiBold);
				line-height: 50px;
				margin-top:1px;
				padding-left: 10px;
			}
			/*#what-we-did .studio-section__content { margin-top:15px; }*/
			#where-we-are .studio-section__content { line-height: normal; }
				.expandable {
					margin-top: 7.5px;
					height: 40px;
					width: 70%;
					overflow: hidden;
					float: left;
				}
				#what-we-did .expandable {
					width:50%;
					margin-right:20%;
				}
				.expandable.expanded {
					height: auto;	
				}
					.expandable__title {
						cursor: pointer;
						font-size: 1.5em;
						height: 30px;
						font-weight: var(--medium);
						line-height: 50px;
					}
				.expandable.expanded .expandable__title, .expandable__title:hover{
					text-decoration: underline;
				}

					.expandable__content {
						line-height: 24px;
						font-weight:80;
						font-size:18px;
						padding-bottom:5px;
						padding-top:10px;
					}
						.expandable__content * {font-weight: var(--fw-lightest);}
						.expandable__content a {
							color: var(--primary);
						}
						.expandable__content a:hover, .expandable__content a:focus {
							color: var(--primary);
						}
						#where-we-are .studio-section__content {
							margin-top:28px;
						}
						#where-we-are .studio-section__content {
        				    margin-top:29px;
        				    font-weight:80;
        				    font-size:18px;
        				    line-height:24px;
        				}
						#where-we-are .studio-section__content p {
							font-weight: 80;
						}
        	#heading--kind-words {
        			text-align: center;
        			margin:370px 0 200px;
        			font-size: 100px;
        			font-weight: 90;
        		}
        		#container--testimonials {
        			width: 70%;
        		}
        			.testimonials__btn {
        				float: left;
        				width: 100%;
        				height: 65%;
        				color:#7D7D7D;
        			}
        				.testimonials__btn img {
        					height: 35px;
        				}
        		#testimonials__carousel-container { overflow: hidden; }
        			#testimonials__carousel {
        				width: auto;
        				display: flex;
        				width: 1000%;
        				transition: margin-left 0.3s linear;
        				-webkit-transition: margin-left 0.3s linear;
        				-moz-transition: margin-left 0.3s linear;
        				-ms-transition: margin-left 0.3s linear;
        				-o-transition: margin-left 0.3s linear;
        			}
        				.testimonial {
        					margin:0 10px;
        					display: flex;
        					flex-flow: column;
        					text-align: center;
        					transition: opacity 0.3s linear;
        					-webkit-transition: opacity 0.3s linear;
        					-moz-transition: opacity 0.3s linear;
        					-ms-transition: opacity 0.3s linear;
        					-o-transition: opacity 0.3s linear;
        				}
        					.testimonial__text * {
        						font-size: 48px;
        						font-weight: 152;
        						line-height: 60px;
        					}
        					.testimonial__team {
        						font-weight: 100;
        						line-height: 25px;
        						font-size: 1.2em;
        						margin: 33px 0;
        						text-align: center;
        					}
/* Shop */
	#main-products {
		width: 100%;
		max-width: 100%;
		padding:0 25px;
	}
	/*Filters & collections*/
		#collection-filter-container {
			height: 0;
			overflow: hidden;	
		}
			#collections-carret {
				width: 10px;
				margin-left: 10px;
			}

	.collection-info {
		margin: 0px 0;
		overflow: hidden;
		height: 0;
	}
		.collection-title {
			font-size: 70px;
			font-weight: 110;
			line-height: 84px;
			margin-bottom: 20px;
		}
		.collection-description p {
			font-weight:100;
			line-height: 25px;
			font-size: 21px;
			width: 80;
		}

	#products-grid {
	}
		#product-row {
			margin: 0;
		}
		.product {
			display: flex;
			flex-flow: column;
			cursor: pointer;
		}
			.product-image-container {
				background-color: var(--secondary-light);
				flex-grow:3;
				padding: 20px;
			}
				.product-image-container img {
					width: 100%;
					height: 100%;
					object-fit: contain;
					object-position: center;
					/* width: auto; */
					margin: 0 auto;
				}

			.product-info {
				padding:18px 0 50px 0;
			}
				.product-name {
					font-weight: 120;
					font-size: 1.3em;
					margin: 0;
				}
				.product-price {
					font-weight: 90;
				}
	
/* Single Product page */
	.container#main-product { padding: 0 20px; }

	#product-navigation {
		margin-bottom:10px;
	}
		.product-nav-filter { color:#999999; }
		.product-nav-filter:hover { color: var(--primary-dark);}
		.product-nav-spacer { margin:0 1em;}

	#product-images-container {
		background: #0f0;
		display: flex;
		flex-flow: column;
	}
		#product-image {
			height: 970px;
			padding:100px 120px;
			background-color: var(--secondary-light);
		}
			#product-image img {
				display: block;
				width: 100%;
				height: 100%;
				object-fit: contain;
				object-position: center;
				/* width: auto; */
				margin: 0 auto;
			}
		#product-image-gallery {
			height: 190px;
			padding:10px 0;
			overflow: hidden;
		}
			#product-images__container {
				/* width: 1000px; */
				transition: margin-left 0.3s linear;
				-webkit-transition: margin-left 0.3s linear;
				-moz-transition: margin-left 0.3s linear;
				-ms-transition: margin-left 0.3s linear;
				-o-transition: margin-left 0.3s linear;
			}
				.product-gallery__image {
					height:180px;
					margin:10px;
				}
		#product-gallery-navigation {
			margin-top: 10px;
			display: flex;
			justify-content: space-between;
		}
			.btn-arrow {
				filter: invert();
				height: 30px;
			}
			#arrorw-prev .btn-arrow {
				transform: rotate(180deg);
			}
	#product-information {

	}
		#product-title {
			margin-top: 100px;
			font-size: 45px;
			line-height: 62px;
			font-weight: 120;
		}
		#product-price {
			font-size: 21px;
			line-height: 25px;
			font-weight: 90;
		}
		#product-description {
			margin-top:60px
		}
			#product-description p,
			#product-description h6
			{
				font-size: 18px;
				font-weight:100;
				line-height: 24px;
			}
		
		#product-collections {
			height: auto;
			margin-top: 16px;
		}
			.product-collection {
				margin:10px 0;
				overflow: hidden;
			}
				.pc__title {
					font-weight: 110;
					cursor: pointer;
				}
					.pc__caret {
						float: right;
						width:30px;
						height: 30px;
						margin:5px 10px 0 0;
					}
						.pc_caret--down { transform: rotate(-90deg); }
						.pc_caret--up { transform: rotate(90deg); }
				.pc__info {
					height: 0;
					display: flex;
					flex-flow: column;
				}
					.pc__description {
						padding:10px 0;
					}
					.pc__description p {
						font-size: 18px;
						font-weight: 100;
						line-height: 24px;
					}
					.pc__link {
						font-size: 24px;
						font-weight: 100;
						padding:16px 0;
					}


		#quantity-container {
			display: flex;
			margin:20px 0;
		}
			#quantity-label {
				font-size: 22px;
				line-height: 33px;
				font-weight: 100;
				padding-right: 10px;
				padding-top: 10px;
			}
			#quantity {
				border:1px solid var(--secondary-light);
				display: flex;
				padding:10px
			}

				#quantity-input {
					width:auto;
					min-width: 40px;
					padding:5px 10px;
					border: none;
					text-align: center;
					font-weight: 100;
				}
				.btn--quantity {
					width: 32px;
					height: 32px;
					font-size: 20px;
					font-weight: 100;
					padding: 0;
					background-color: var(--secondary-light);
					border-radius: 100%;
				}
		#shop-button-container {
			display: flex;
			column-gap: 1em;
		}
			.btn-shop-main {
				float: left;
				width: 100%;
				padding: 20px 0;
				font-size: 0.8em;
				font-weight: 100;
				border-radius: 0;
			}
			#btn--add-to-cart {
				background: var(--primary-dark);
				color: var(--primary);
			}
			#btn--show-cart {
				background: var(--secondary-light);
				color: var(--primary-dark);
			}
		#related-products {
			margin-top: 100px;
		}
			#related-products__heading {
				margin-bottom: 40px;
			}
/* Privacy Policy page */
	#heading--privacy {
		font-size: 70px;
		font-weight: 110;
		line-height: 84px;
		margin:75px 0;
		text-transform: uppercase;
	}
	.container--privacy-policy {
		/*width: 80%;*/
	}
		.container--privacy-policy * {
			font-weight:100;
			line-height: 25px;
			font-size: 21px;
		}

/* Cookie consent */
	#cookie-consent {
		position: fixed;
		bottom:10px;
		left: 0;
    	right: 0;
		width: 85%;
		height: auto;
		padding: 10px 30px;
		margin: 0 auto;
		background:var(--primary);
		z-index: 100000;
		display: flex;
		flex-grow: 1;
		justify-content: space-between;
	}
		#consent-text {
			padding-top:10px;
			width: 65%;
			padding-left: 10px;
		}
			#consent-text * {
				font-size: 14px;
				font-weight: 90;
			}
			#consent-text a { font-size: 0.9em;}
		#consent-buttons {
			display: flex;
		}	
			.consent-button {
				background-color:var(--primary);
				color:var(--primary-dark);
				border:none;
				text-transform: uppercase;
				font-size: 14px;
			}
			#allow-cookies {
				background-color:var(--primary-dark);
				color:var(--primary);
				padding:10px 40px;
			}
			#no-cookies {
				text-decoration: underline;
				padding: 10px 30px;
			}
			#dismiss-cookies {}
				#dismiss-consent {
					width: 12px;
					height: 12px;
				}
/*
*	Email page
*/
	.email-container {
		max-width: 900px;
	}
		#email-header {
			margin-top: 150px;
		}

		#email-content {
			margin-top: 50px;
		}
			#email-subject {
				font-size: 2em;
			}
			#email-body {
				font-size: 1.5em;
				padding-bottom: 50px;
			}
/*
* Footer
*/
	#footer {
		display: flex;
		width: 100%;
		padding: 20px 0;
	}
	#homepage__footer #footer { padding: 0; }

		.footer-col {
		    font-size:0.7em;
			padding-left:10px;
			font-weight: var(--light);
			line-height: 17px;
		}
		.footer-col.copyright {
			padding-right:20px;

		}
			.link-footer {
				color: var(--primary-dark);
				text-decoration: none;
				padding: 0 10px;
				font-weight: var(--light);
			}
			.link-footer:hover {
				text-decoration: underline;
			}

			.container--inverted .link-footer { color: var(--primary); }

	#main-container {
		width:100%;
		max-width: 100%;
		padding-left: 20px;
		padding-right: 20px;
	}
	
	#main-container .container {
		padding-left:0;
		margin-left: 0;
		padding-right: 0;
		margin-right: 0;
		max-width:100%;
	}
	#single-story-container .container--block .row {
		width: 100%;
		margin-left: 0px;
	}

/*
* Error pages
*/
    #error-container {
		text-align:center;
		padding-top:21%;
		color:var(--primary-dark);
		font-family:"Lens Grotesk";
	}
		#error-code {
			font-weight: 140;
			font-size:9em;
			line-height: 1em;
		}
		#error-message {
			width:70%;
			margin-left:15%;
			font-weight: 90;
		}
		#error-button {
			padding:20px 75px;
			margin-top: 75px;
			color:var(--primary);
			background-color:var(--primary-dark);
			border:none;
			font-size: 0.9em;
		}