/*
Theme Name: Studio Prineas
Author: Kat Clark 
Author URI: https://hello-developers.com/
Description: Bespoke Theme for Architect Prineas - designed by K&Co
Version: 1.0
Text Domain: studioprineas
*/

/* FONTS */
@font-face {
	font-family:'MessinaSansWeb';
	src: url('fonts/MessinaSansWeb-Book.eot'); /* IE9 Compat Modes */
	src: url('fonts/MessinaSansWeb-Book.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		url('fonts/MessinaSansWeb-Book.woff2') format('woff2'), /* Super Modern Browsers */
		url('fonts/MessinaSansWeb-Book.woff') format('woff'); /* Pretty Modern Browsers */
	font-weight: 400;
	font-style: normal;
	font-stretch: normal;
	unicode-range: U+000D-FB04;
}
@font-face {
	font-family:'MessinaSerifWeb';
	src: url('fonts/MessinaSerifWeb-SemiBold.eot'); /* IE9 Compat Modes */
	src: url('fonts/MessinaSerifWeb-SemiBold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		url('fonts/MessinaSerifWeb-SemiBold.woff2') format('woff2'), /* Super Modern Browsers */
		url('fonts/MessinaSerifWeb-SemiBold.woff') format('woff'); /* Pretty Modern Browsers */
	font-weight: 600;
	font-style: normal;
	font-stretch: normal;
	unicode-range: U+000D-FB04;
}

html, body { font-family: MessinaSansWeb, sans-serif; font-size: 15px; line-height: 1.35; letter-spacing: -0.2px; color: #000000; -webkit-transition: background-color 0.5s; /* Safari */ transition: background-color 0.5s; height: 100%;/*  position: relative; */ }

/* TEXT */
p, ul, h1, h2, h3, h4, h5 { margin: 0 0 1.35em 0; }
a { color: #808080; text-decoration: none; -webkit-transition: all 0.5s; /* Safari */ transition: all 0.5s; }
a:hover, a:active { color: #000; }
a.nail { display: block; min-width: 100%; }
a.nail img { display: block; margin: 0 auto; width: 100%; }
a.nail:hover img, a.nail:active img { opacity: 0.5 !important;  }
.page-title, .journal-title { font-size: 48px; text-align: center; font-family: MessinaSerifWeb; text-align: center; margin-bottom: 2.7em; }
.site-title a, .page-title a, .journal-title a { color: #000; }
small { font-size: 10px; letter-spacing: 0.1px; }

/* EFFECTS */
.ridge { position: fixed; margin: auto; top: 0; left: 0; right: 0; bottom: 0; z-index: 1000; -webkit-transition: opacity 1s; transition: opacity 1s; pointer-events: none; opacity: 0; }
#over { width: 6.5vw; height: auto; }
#easy { width: 100%; height: 50px; line-height: 50px; }
.lazy { min-width: 100%; }
.js .lazy, .js .imgs-lazy img { visibility: hidden; }

/* LOADER */
.js .home.construction { background-color: #fcf0eb; }
.js #rooftop, .js #roof, .js #floorplans, .js #building, .js #foundations { -webkit-transition: opacity 1s; transition: opacity 1s; }
.js .home.construction #rooftop, .js .home.construction #roof, .js .home.construction #floorplans, .js .home.construction #building, .js .home.construction #foundations { opacity: 0; }

/* NAV */
ul.menu { margin-bottom: 1em; }
ul.menu a { text-decoration: none; }
ul.menu li.current-menu-item a, 
ul.menu li.current-page-ancestor a,
ul.menu li.current_page_parent a,
ul.menu li.current-cat a,
ul.menu li.current-year a { color: #000; }
#floorplans { margin-top: 2vw; position: fixed; }
#inspection-checklist { position: fixed; z-index: 500; margin-bottom: 2vw; }
#floorplans ul, #inspection-checklist ul { margin-left: 2vw; }

/* BODY */
#truss { padding: 170px 0; }
#building { min-height: 100%; margin-bottom: -300px; padding-bottom: 300px; }
.storey-post { width: 18.75%; } /* gutters */
.beam { width: 62.5%; margin: 0 auto; } /* main column */
.blush { background-color: #fcf0eb; }
.window { padding: 170px 0; width: 100%; }
.window p { font-family: MessinaSerifWeb; font-size: 48px; line-height: 1.25; text-align: center; }

/* HEADER */
#roof { margin-top: 2vw; min-height: 30px; position: fixed; }
body.logged-in #roof { top: 32px; }
#roof .site-title { margin-right: 2vw; }

/* FOOTER */
#foundations { height: 300px; position: relative; z-index: 900; }
.still-plate { bottom: 2vw; margin-left: 2vw; min-height: 116px; }
#drain-tiles { display: none; }
#footing { bottom: 2vw; }
#footing h3 { margin: 0; }
input, input[type="email"], input[type="text"], input[type="submit"] { background-color: transparent; border: 0; border-bottom: 1px solid #555; width: 100%; display: block; font-family: MessinaSansWeb, sans-serif; text-align: left; font-size: 15px; line-height: 1.35; letter-spacing: -0.2px; color: #000; padding: 0; margin: 0 0 4px 0; -webkit-appearance: none; -moz-appearance: none; appearance: none; -webkit-border-radius:0; border-radius:0; }
input[type="submit"] { border: 0; color: #555; cursor: pointer; }
#mce-responses { margin: 0.5em 0; }
#mc_embed_signup { margin-top: -4px; }

/* MOBILE NAV */
#hamburger { position: absolute; top: 0; right: 8vw; bottom: 0; margin: auto; width: 20px; height: 20px; z-index: 1000; display: none; }
#hamburger .patty, #hamburger .patty:before, #hamburger .patty:after { background-color: #000; display: block; position: absolute; left: 0; top: 0; width: 100%; height: 1px; -webkit-transition: all 0.5s; transition: all 0.5s; }
#hamburger .patty { background-color: transparent; }
#hamburger .patty { margin-top: 10px; }
#hamburger .patty:before { content: ''; top: -4px; }
#hamburger .patty:after { content: ''; top: 4px; }
#hamburger.close .patty:before { top: 0 !important; -ms-transform: rotate(45deg); /* IE 9 */ -webkit-transform: rotate(45deg); /* Safari */ transform: rotate(45deg); }
#hamburger.close .patty:after { top: 0 !important; right: 0; -ms-transform: rotate(-45deg); /* IE 9 */ -webkit-transform: rotate(-45deg); /* Safari */ transform: rotate(-45deg); } 

/* FRONT PAGE */
.structural { padding: 2vw 0; }
body.home .structural,
.single-project .structural { display: flex; align-content: center; align-items: center; min-height: 100vh; justify-content: space-between; }
body.home #truss { padding: 0; }
body.home #drain-tiles { display: block; }
body.home #concrete-slab { display: none; }
body.home .large_text { max-width: 80%; }

/* PROJECTS */
#library { display: flex; align-items: flex-start; justify-content: space-between; flex-wrap: wrap; }
#library .project { flex: 1 1 auto; max-width: 45%; width: 45%; margin-bottom: 3vw; }
#library.back-shelf .project { max-width: 30%; width: 30%; margin-bottom: 1.5vw; }
.project h2 { margin: 0.8em 0; }

/* SINGLE PROJECT */
body.single-project #truss { padding: 0; }
body.single-project h1 { margin: 0; }
.structural.large_text { min-height: 0; }
#stud img { display: block; margin-top: 100px; }
.structural img { height: auto !important; }

/* .beam.splinter { padding: 2vw 0; } */
#plaque { padding: 170px 0; margin-top: 170px; }
#quote p { font-family: MessinaSerifWeb; font-size: 1.5em; letter-spacing: 0.4px; }

/* CONTACT */
body.page-id-10 #truss { padding-top: 2vw; }

/* JOURNAL */
.blog #foundations, .archive #foundations { background-color: #fff; }
.journal-title { margin-bottom: 0.70em; }
#plank { font-family: MessinaSerifWeb; text-align: center; letter-spacing: 0.4px; font-size: 1.5em; margin-bottom: 2.6em; }
#plank li { display: inline-block; }
#plank li:before { content: ' • '; font-family: MessinaSerifWeb; font-size: 1.7em; display: inline-block; line-height: 0.6; vertical-align: text-top; padding: 0 10px 0 5px; }
#plank li:first-child:before { content: ' '; }
.joist { margin-bottom: 40px; float: left; }
.joist:nth-child(2n) { float: right; }
.joist img { margin-bottom: 26px; display: block; }
.joist h2, .single-post h1 { font-size: 1.5em; font-family: MessinaSerifWeb; letter-spacing: 0.4px; padding-right: 50px; margin-bottom: 20px;  }
.single-post h1 { margin-bottom: 60px; }
.post-categories { margin: 0; }
.post-categories li a { color: #000; }
.grid-sizer,
.grid-item { width: 45%; }
.gutter-sizer { width: 10%; }
.pagination { text-align: center; width: 100%; overflow: hidden; }
.blog #plank a { color: #000; }
.blog #plank a:hover { color: #555; }
#sb_instagram { margin: 80px auto 180px; }
#sb_instagram.sbi_col_3 #sbi_images .sbi_item { width: 30%; flex: 0 0 30%; }
#sb_instagram.sbi_col_3 #sbi_images { display: flex; align-content: center; align-items: center; justify-content: space-between; }
#sb_instagram .sbi_photo { height: 0 !important; padding-bottom: 100%; }

/* SINGLE POST */
.single-post #foundations { background-color: #fff; }
#kitchen .left, #kitchen .right { width: 45%; }
.single-post #meta { margin-top: 60px; font-size: 0.7em; }
.single-post #meta #share { display: inline-block; }
.single-post #meta .socializer { min-height: 0; display: inline-block;  }
.single-post #meta .sr-text-in { margin: 0; }
.single-post #meta .sr-text-in a { font-size: 10px; line-height: 15px; padding: 0; height: auto; color: #808080 !important; background-color: transparent !important; }
.single-post #meta .sr-text-in a:hover { color: #000 !important; opacity: 1 !important; }
.single-post #meta .sr-text-in:before { content: ' • '; font-family: MessinaSerifWeb; font-size: 1.5em; display: inline-block; line-height: 0.4; vertical-align: text-top; padding: 0 4px; }
.single-post #meta .socializer:before { content: 'Share'; float: left; line-height: 20px; display: inline-block; }

.wp-caption-text { font-size: 0.7em; padding: 5px 0; }
.wp-caption { max-width: 100%; }

#shed { padding: 100px 0 20px; }
#shed h2 { font-size: 1.5em; font-family: MessinaSerifWeb; letter-spacing: 0.5px; }
#wall { display: flex; justify-content: space-between; }
#wall .joist { width: 30%; }

/* STUDIO */
body.page-template-template-studio .structural { padding: 180px 0; }
#philosophy { margin-bottom: -20px; }
#studio-intro { font-size: 1.5em; letter-spacing: 0.2px; }
#people .left { width: 30%; }
#peeps { margin: 175px auto 125px; display: flex; align-items: flex-start; justify-content: space-between; flex-wrap: wrap; }
#peeps .person { flex: 1 1 auto; max-width: 30%; width: 30%; margin-bottom: 50px; }
#peeps .person h3 { margin: 0; }
#peeps .person .stuff { min-height: 100px; margin-top: 32px; }
#awards { padding-bottom: 0; }
.ridge-beam { border-top: 1px solid #000; }
.ridge-beam .rafter { border-bottom: 1px solid #000; display: flex; align-items: flex-start; justify-content: space-between; padding: 6px 0 4px; }
.ridge-beam .date { width: 11%; flex: 0 0 auto; }
.ridge-beam .date span { font-family: MessinaSerifWeb; font-size: 1.7em; display: inline-block; line-height: 0.6; vertical-align: text-top; }
.ridge-beam .project { width: 19%; margin-right: 1%; flex: 0 0 auto; }
.ridge-beam .info { width: 56%; flex: 0 0 auto; }
.ridge-beam .link, .ridge-beam .pdf { width: 13%; text-align: right; flex: 0 0 auto; text-align: left; margin: 0; }

@media (max-width: 992px) {
/* GENERAL */
	body.logged-in #roof { top: 46px; }
	.beam { width: 84%; max-width: 84%; }
	#over { width: 14vw; }
	#building { padding-bottom: 0; margin-bottom: 0; /* padding-top: 65px; margin-top: 0; */ }
	.window { padding: 50px 0; }
	.window p, #quote p { letter-spacing: 0.4px; font-size: 22px; line-height: 1.25; }
	.page-title, .journal-title { font-size: 32px; margin-bottom: 50px; }
	#truss, body.home #truss { padding: 110px 0; }
	#navp { position: absolute; top: 50vh; width: 14vw; opacity: 1 !important; }

/* HEADER */
	#roof { text-align: left; position: fixed; z-index: 1200; margin: 0; height: 65px; background-color: #fff; }
	.js #roof { -webkit-transition: all 1s !important; transition: all 1s !important; }
	#roof.navopen { background-color: #fcf0eb; }
	#roof .site-title { margin: auto;  position: absolute; left: 8vw; top: 0; bottom: 0; height: 20px; }
	#floorplans { width: 100vw; height: 100vh; position: fixed; background-color: #fcf0eb; z-index: 1100; margin: 0; text-align: center; font-size: 3em; font-family: MessinaSerifWeb; letter-spacing: 0.5px; display: none; -webkit-transition: none !important; transition: none !important; }
	#floorplans ul { margin: 100px 0 0 0; }
	#floorplans ul a { color: #000; }

/* 	FOOTER */
	#foundations { height: auto; }
	#footing { position: static;  }
	.still-plate { position: relative; width: 84%; overflow: hidden; margin: 0 auto; min-height: 0; bottom: auto; }
	#drain-tiles { margin-top: 50px; display: block !important; }
	#concrete-slab img { margin: 120px auto; display: block; width: 14vw; }
	
/* 	HOME */
	body.home .structural, body.single-project .structural { min-height: 0; padding: 0 0 8vw; }
	
/* 	PROJECTS */
	body.page-template-template-selected #truss,
	body.page-template-template-archive #truss { padding-top: 0; }
	body.page-template-template-selected #inspection-checklist, 
	body.page-template-template-archive #inspection-checklist { display: block !important; position: static; width: 84%; margin: 110px auto 0; }
	body.page-template-template-selected #inspection-checklist ul, 
	body.page-template-template-archive #inspection-checklist ul { margin: 25px 0; }
	body.page-template-template-selected #inspection-checklist ul li, 
	body.page-template-template-archive #inspection-checklist ul li { display: inline-block; margin-right: 20px; }
	#library .project { margin-bottom: 5vw !important; }
	.project h2 { margin: 0.4em 0; }
	body.single-project #truss { padding: 110px 0; }
	.single-project .structural { flex-direction: column; }
	#easy { /* position: static; opacity: 1 !important; */ margin: auto; }
	#stud img { margin-top: 20px; }
	.ratio img { display: block; }
	.ratio .left { margin-bottom: 8vw; }
	#plaque { padding: 50px 0; margin-top: 50px; }

/* STUDIO */
	body.page-template-template-studio .structural { padding: 50px 0; }
	#studio-intro { font-size: 1em; letter-spacing: 0; }
	#peeps { margin: 50px auto 0; }
	#peeps .person .stuff { min-height: 0; margin-bottom: 20px; }
	.ridge-beam .date { width: 24%; }
	.ridge-beam .project,
	.ridge-beam .info,
	.ridge-beam .link, .ridge-beam  .pdf { width: 75%; align-self: flex-end; }
	#bibliography { padding-bottom: 0; margin-top: 20px; }
	
/* 	JOURNAL */
	body.blog #roof, body.single-post #roof, body.category #roof, body.date #roof { background-color: #fcf0eb; }
	.grid-sizer, .grid-item { width: 100%; }
	.ridge-beam .rafter { display: block; }
	.ridge-beam .rafter div { width: 78% !important; float: right; margin: 0; text-align: left; }
	.ridge-beam .rafter .date { width: 22% !important; float: left;  }
	.beam.grid.masonry { display: block; }
	#sb_instagram { margin: 50px 0 0; }
	#plank { /* border-bottom: 1px solid #000; */ font-size: 1em; }
	.joist { position: static !important; }
	.joist h2, .single-post h1 { padding: 0; margin-bottom: 20px; }
	.single-post #meta { margin: 30px 0; }
	#shed { padding-top: 50px; }
	#wall { flex-direction: column; }

/* 	
	#categories { border-top: 1px solid #000; border-bottom: 1px solid #000; padding: 5px 0; margin: 0; }
	#plank li:before { display: none; }
	#plank li { display: block; text-align: left; line-height: 1.5; }
*/

/*	CONTACT */
	body.page-id-10 #truss { padding-top: 110px; }
	body.page-id-10 #over { opacity: 1 !important; top: 50vh; }
}

@media only screen and (max-device-width: 992px) and (orientation: landscape) {
	#floorplans ul { width: 50vw; margin: 20vh 0 0 0; }
	body.page-id-10 #over, #navp { position: absolute; top: 0; left: 50vw; width: 8vw; opacity: 1 !important; }
}