/*
    Theme Name: HWD_Greenfield
    Theme URI: https://www.hamiltrowebsitedesign.com
    Description: HWD GREENFIELD THEME
    Version: 1.
    Author: hamiltro
*/

/* Breakpoints: 600 - 768/769 - 992 - 1200 w side-pad 4% */

/* PALETTE / VARIABLES
*****************************************/
:root {
/* palette */
	--color: #666;
	--color-strong: BLACK;
	--color-background: WHITE;
	--color-accent1: BLACK; /*  */
	--color-accent2: #82b258; /*  */
	--color-accent3: BLACK;
	--color-accent4: #333333; /*  - footerBG;  */
	--color-accent5: #f5f2e4; /*  - readMoreBG;  */
	--color-headers: var(--color-accent2);
	--color-a: var(--color-accent2);
	--color-a-hover: var(--color-accent1);
	--color-banner-background: transparent;
	--color-row-border: #EEE;

/* siteTitle/mainNav */
	--color-mainNav-text-link: var(--color-accent1);
	--color-mainNav-text-link-hover: var(--color-accent2);
	--color-mob-menu-li-current-background-color:WHITE;
	--color-mob-menu-li-background-color:WHITE;
	--color-mob-menu-li-border: #EEE;;
	--color-navbar-wrapper-background: WHITE;
	--color-navbar-wrapper-border:  TRANSPARENT;
	--color-outline: #DDD; /* tabbing */

/* headers by class */
	--color-headersDefault: black;
	--color-siteTitle: var(--color-accent1); 
	--color-siteTitle-hover: var(--color-accent1); 
	--color-siteTitle-shadow-hover: TRANSPARENT;
	--color-overBanner: WHITE;
	--color-pageTitle: BLACK;
	--color-sectionTitle: var(--color-accent1);
	--color-rowHeader: var(--color-accent1);

/* buttons */
	--color-a-button: var(--color-accent1);
	--color-a-button-background: WHITE;
	--color-a-button-border: var(--color-accent1);
	--color-a-button-hover: WHITE;
	--color-a-button-background-hover: var(--color-accent2); 
	--color-a-button-border-hover: var(--color-accent1);

	--color-readMore-a: var(--color-accent2);
	--color-readMore-a-background: var(--color-accent5);
	--color-readMore-a-border: var(--color-accent2);
	--color-readMore-a-hover: var(--color-accent1);
	--color-readMore-a-hover-background: var(--color-accent5);
	--color-readMore-a-hover-border: var(--color-accent1);

/* footer */
	--color-footer: #eee;
	--color-footer-a: #DDD;
	--color-footer-a-hover:#FFF;
	--color-footer-background: var(--color-accent4);
	--color-footer-border: #888;
	--color-footer-credit: #888;
	--color-footer-credit-a:#888;
	--color-footer-credit-a-hover:#FFF;
	--color-icon-style: grey;
	--color-icon-style-hover: white;
	--color-icon-style: var(--color-accent2);
	--color-icon-style-hover: var(--color-accent3);

/* fonts */
	--font-body: 'Open Sans', sans-serif; 
	--font-input: 'Open Sans', sans-serif; 
	--font-nav:   'Open Sans', sans-serif;
	--font-quote: 'Playfair Display', Baskerville, serif;
	--font-readMore:  'Open Sans', sans-serif;
	--font-siteTitle:  'Open Sans', sans-serif;
	--font-siteSubTitle: 'Open Sans', sans-serif;
	--font-pageTitle:  'Open Sans', sans-serif;
	--font-sectionTitle:  'Open Sans', sans-serif;
}

@font-face {
    font-family: 'Avenir Next';
    src: url('/wp-content/themes/greenfield/fonts/AvenirNext-BoldItalic.woff2') format('woff2'),
        url('/wp-content/themes/greenfield/fonts/AvenirNext-BoldItalic.woff') format('woff');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

html{font-size: 17px;} /* default is 16px */
body {line-height: calc(1.1em + 0.5rem);}

p,li { font-size: clamp(1rem, 1rem + .2vw, 1.4rem);}
h1 {font-size: clamp(2rem, 2rem + .8vw, 2.44rem); line-height: calc(1.1em + 0.5rem);}
h2 {font-size: clamp(1.5rem, 1.5rem + .6vw, 2rem);line-height: calc(1.1em + 0.5rem);}
h3 {font-size: clamp(1.17rem, 1.17rem + .4vw, 1.67rem);line-height: calc(1.1em + 0.5rem);}
h4 {font-size: clamp(1rem, 1rem + .3vw, 1.5rem); line-height: calc(1.1em + 0.4rem);font-weight: bold;}
h5 {font-size: clamp(.83rem, .75rem + .35vw, 1rem);line-height: calc(1.1em + 0.4rem);}
h6 {font-size: clamp(.67rem, .64rem + .22vw, .8rem); line-height: calc(1.1em + 0.4rem); margin-bottom: .5rem}
.siteTitle {font-family: 'Avenir Next', Arial; font-weight: bold;}


/* BREAKPOINTS: 600 - 768/769 - 991/992 - 1200 w side-pad 4%
****************************************/

@media (min-width:769px) {
	.flex, .flexContainer {display: flex; flex-direction: row;}
	.mobileOnly {display:none;}
	.desktopOnly {display:block;}
	.flex-col-11 {width: 91.7%;padding: 0 1%;}
	.flex-col-10 {width: 83.3%;padding: 0 1%;}
	.flex-col-9 {width: 75%;padding: 0 1%;}
	.flex-col-8 {width: 66.7%;padding: 0 1%;}	
	.flex-col-7 {width: 58.3%;padding: 0 1%;}
	.flex-col-6 {width: 50%;padding: 0 1%;}
	.flex-col-5 {width: 41.7%;padding: 0 1%;}
	.flex-col-4 {width: 33.3%;padding: 0 1%;}
	.flex-col-3 {width: 25%;padding: 0 1%;}
	.flex-col-2 {width: 16.7%;padding: 0 1%;}
	.flex-col-1 {width: 8.3%;padding: 0 1%;}
	
	.thumb.flex-col-3,
	.thumb.flex-col-4	{padding-left: 0;}
	.excerpt.flex-col-8,
	.excerpt.flex-col-9	{padding-right: 0;}
}

.flexCol{
	display: flex;
	flex-direction: column;
}

/*  MISC
********************************************/
header {
  width: 100%;
  top: 0;
  z-index: 1000;
  transition: top 0.3s;
  height: 120px;
}

section.subpageBannerImage	{	
	height: min(100px, 50vh);
}

.readMore a.button {
    border: 1px solid black;
    background-color: var(--color-readMore-a-background);
    color: black;
    text-align: center;
    padding: 10px 30px;
    border-radius: 0px;
    font-weight: 200;
    font-size: 1em;
    font-family: var(--font-readMore);
}

/* ABOUT PAGE STYLES
****************************************/
.responsive-iframe {
    position: relative;
    padding-bottom: 56.25%; /* Aspect ratio */
    height: 0;
    overflow: hidden;
    width: min(1100px, 92%); /* Maximum width */
    margin: auto; /* Centering */
}

.responsive-iframe iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* PUBLICATIONS PAGE
****************************************/
.single-publications {

	@media (max-width: 600px) {
		.publications .sectionInner	{
			padding: 3rem 0;
		}
		.breadcrumbs {display: none;}	
	}
	
	.pubMedia .featured-image img {
		margin: 0 auto 50px;
		text-align: center;
		max-height: 700px;
		height: auto;
	}

}

/* ARCHIVE STYLES
************************************************************/
.flex-col-8.blogPost	{
	margin: 0 auto;
}
@media (min-width:768px) {
	.mobileOnly { display:none;}
	.desktopOnly { display:block; }
}
@media (max-width:767px) {
	.mobileOnly { display:block; padding-bottom:15px;}
	.desktopOnly { display:none; }
}

@media (max-width:768px) {
	.single-post .flexContainer {flex-direction: column;}
	.flex-col-8.blogPost,
	.flex-col-4.sidebar {width: 100%;}
}

.thumb {
    position: relative;
    overflow: hidden;
}

.thumb .workThumbnailImage {
    position: relative;
    z-index: 2;
}

.thumb::before {
    content: '';
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-size: contain;
    z-index: 1;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.thumb:hover::before {
    opacity: 1;
    background-image: url('');
}

.thumb:hover .workThumbnailImage img {
    opacity: 0;
}

.videoBlockHome {
    overflow: hidden;
}
.wp-video,
.wp-video-shortcode{
    width: 750px !important;
}

@media (min-width:821px) {
	.video-url { width: 750px;}
}
.work .flexWrapper{
    justify-content: left !important;
}