@charset "UTF-8";

@import url(https://fonts.googleapis.com/css?family=DM+Sans:400,500,700);

/************ Peachy Theatrical Stylesheet ************/
/************ Copyright (c) 2020 *************/
/**************** 01/08/2020 ***************/

/* HEADINGS */
h1, h2, h3, h4, h5, h6 { /*reset for mobile browsers */
	font-weight: normal;
}

h1 {
	font-family: 'Poppins';
	font-weight: bold;
	font-size: clamp(4rem, 8vw, 7rem);
	margin-top: 0px;
	margin-bottom:30px;
	line-height: 1;
}

h2 {
	font-family: 'Poppins';
	font-weight: bold;
	font-size: clamp(2.6rem, 5vw, 3.8rem);
	padding-top:0px;
	margin-top:0px;
	line-height: 1.1;
}

h3 {
	font-family: 'Poppins';
	font-weight: bold;
	font-size: clamp(2.2rem, 4vw, 3rem);
	line-height: 1.15;
}

h4 {
	font-family: 'Poppins';
	font-weight: bold;
	font-size: clamp(3.4rem, 8vw, 6rem);
	margin: 0px;
	padding-bottom:10px;
	line-height: 1;
}



/* HYPERLINK STYLES */
a:link, a:visited, a:active {
	text-decoration: underline;
	word-wrap: break-word;
	position: relative;
	color: #F8B195;
	transition: all 0.3s ease-in-out 0s;
	line-height:inherit;
}

a:hover {
  text-decoration: none;
  transition: all 0.3s ease-in-out 0s;
}

.underline::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 2px;
  bottom: 0;
  left: 0;
  background-color: #fff;
  visibility: hidden;
  transform: scaleX(0);
  transition: all 0.3s ease-in-out 0s;
}

.active:before {
	content: "";
	position: absolute;
	width: 100%;
	height: 2px;
	bottom: 0;
	left: 0;
	background-color: #fff;
	visibility: visible;
	transform: scaleX(1);
}

.underline-dark::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 2px;
  bottom: 0;
  left: 0;
  background-color: #1b1c1d;
  visibility: hidden;
  transform: scaleX(0);
  transition: all 0.3s ease-in-out 0s;
}

.active-dark:before {
	content: "";
	position: absolute;
	width: 100%;
	height: 2px;
	bottom: 0;
	left: 0;
	background-color: #1b1c1d;
	visibility: visible;
	transform: scaleX(1);
}

.underline:hover::before, .underline-dark:hover::before {
  visibility: visible;
  transform: scaleX(1);
}

menu a:link, a:visited, a:active {
	font-family: 'Apercu', Helvetica, Arial, sans-serif;	
	text-decoration: none;
	line-height: 1.8;
	font-weight:500;
	padding-bottom:2px;

}

.menu-white a:link, .menu-white a:visited, .menu-white a:active, .menu-white a:hover {
	color:#fff;
}

.menu-dark a:link, .menu-dark a:visited, .menu-dark a:active, .menu-dark a:hover {
	color:#1b1c1d;
}


a img {
	pointer-events: all;
}


/* MAIN BODY STYLE */
* {
  box-sizing: border-box;
}

html, body { 
	overflow-x: hidden; 
}

html {
	font-size:100%;
	margin:0px !important;
	padding:0px !important;
	background:#F8B195;
}

body {
	margin: 0px !important;
	padding: 0px !important;
	width: 100%;
	height: 100%;
	background:#F8B195;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: antialiased;
	font-family: 'EBGaramond', Helvetica, Arial, sans-serif;	
	font-size: 1.5rem;
	color: #f0f0f0;
	line-height:1.6;
}

::selection {
  background: #F8B195; /* WebKit/Blink Browsers */
  color: #fff;
}

::-moz-selection {
  background: #F8B195; /* Gecko Browsers */
  color: #fff;
}

p {
	margin:0px !important;
	overflow:hidden;
}

p strong {
	font-weight:800;
}

video {
  /* override other styles to make responsive */
  width: 100%    !important;
  height: auto   !important;
}

img {
	pointer-events: none;
	max-width: 100%;
	height: auto;
}

ul {
  list-style: none;
}

.center-text {
	text-align:center;
}

.shadow {
    box-shadow: inset 0px 0px 10px 0px rgba(0,0,0,0.1);
}

.flex-line-top {
	display:flex;
	align-items:top center;
	justify-content:space-between;
}

.flex-line-center {
	display:flex;
	flex-wrap: wrap;
	align-items:center;
	justify-content:space-between;
}

.flex-line-center > * {
  flex: 1 1 200px;
  margin: 10px;
}

.pad-100 {
	width:60% !important;
	padding-top:25px;
}

.rotateimg {
  -webkit-transform:rotate(15deg);
  -moz-transform: rotate(15deg);
  -ms-transform: rotate(15deg);
  -o-transform: rotate(15deg);
  transform: rotate(15deg);
}



/* HEADER */
header {
	width:100%;
	min-height:100vh;
	min-height:100svh;
	padding: 0px 5% !important;
	margin: 0px !important;
	border:none;
}

.header-content {
	width:100%;
	min-height:100vh;
	min-height:100svh;
	display:flex;
	flex-flow: column nowrap;
	align-items: center;
	justify-content: center;
}

#header-topline {
	width:90%;
	display: flex;
	position:absolute;
	top:20px;
	align-items:center;
	justify-content: space-between;
	font-family: 'Apercu', Helvetica, Arial, sans-serif;
}

#header-midline {
	display:block;
	width:100%;
	margin: 0;
	padding: clamp(96px, 14vh, 140px) 0;
	margin-top:50px;
	text-align: center;
}

#header-hero {
	display:block;
	margin:0 auto;
	padding:0;
	max-width:780px;
}

#header-hero a {
	font-weight: bold;
	color: inherit;
	text-decoration: none;
}

#header-hero a:hover {
	text-decoration: underline;
}

#logo {
	display:flex;
	align-items:center;
	padding:0px;
}

.header-content > #logo {
	margin-bottom: clamp(26px, 5vw, 44px);
}

.header-content > #logo img {
	width: 200px;
}

menu {
	display:flex;
	align-items:center;
	justify-content:space-between;
	font-size: 1.1rem;
	padding:0px;
	margin:0px;
}

menu li {
	list-style: none;
	min-width: 50px;
}

#subheadline {
	font-size: clamp(1.45rem, 3vw, 2rem);
	margin: 0 auto 0 auto;
	padding:0;
	width:min(80%, 900px);
	max-width:900px;
	display: block;
	line-height: 1.55;
}

.button {
	font-family: 'Poppins', Helvetica, Arial, sans-serif;	
	border: none;
	border-radius: 50px;
	padding: 12px 50px;
	text-align: center;
	text-transform: uppercase;
	text-decoration: none;
	display: inline-block;
	font-size: 1.1rem;
	font-weight:bold;
	transition: all 0.3s ease-in-out 0s;
	margin-top: 40px;
	line-height: 1.2;
}

.button:hover  {
	background-color: #1b1c1d;
	color: #fff;
	transition: all 0.3s ease-in-out 0s;
}

.btn-white {
	background-color: white;
	color:  #F8B195;

}

.btn-peach {
	background-color: #F8B195;
	color:  #FFF;

}


/* BODY STYLES */
#content-box {
	display:flex;
	align-items: center;
	justify-content: center;
	flex-flow: column nowrap;
	width:100%;
	min-height: clamp(520px, 72vh, 700px);
	padding-top:clamp(80px, 12vw, 120px);
	padding-bottom:clamp(80px, 12vw, 120px);
}

.dark {
	color:#ffffff;
	background-color: #5b5b5c;
}

.white {
	background-color: #f0f0f0;
	color: #5b5b5c;
}

.peach {
	color:#ffffff;
	background-color: #F8B195;
}

.peach a {
	color:#fff;
}

.productions-head {
	background-image: url('images/headline-bg.png'); 
	background-size: cover;
	background-position: center top;
	background-clip: border-box;
}

#content-inner {
	width:min(90%, 1120px);
	margin: 0 auto;
}

#content-inner-narrow {
	width:min(80%, 900px);
	margin: 0 auto;
}

#grid {
	width:100%;
	display: flex;
	align-content: center;
	justify-content: space-around;
	flex-wrap:wrap;
	font-family: 'Apercu', Helvetica, Arial, sans-serif;
	line-height:1.8em;
}

#grid-item {
	display:block;
	margin:40px;
	text-align:center;
}

#grid-item-wide {
	min-width:48%;
	height:auto;
	margin-top:80px;
	text-align:left;
}

.align-top {
	align-items: top center;
}

.align-center {
	align-items: center;
}

.pad-left {
	padding-left:30px;
}

.pad-right {
	padding-right:30px;
}

#section-header {
	display:block;
	margin:0 auto;
	padding:0;
}

#section-header-left {
	display:inline-block;
	position: relative;
	margin-left:0;
	width:48%;
	max-width: 450px;
}

#section-header-right {
	margin:auto;
	margin-right:0;
	width:48%;
	max-width: 450px;
	text-align:right;
	vertical-align: middle;
}

#home-subhead {
	font-family: 'Apercu', Helvetica, Arial, sans-serif;	
	font-size:clamp(1.45rem, 3vw, 2rem);
	line-height:1.55em;
	margin:0 auto;
	padding:0;
	display: block;
	max-width:559px;
}

#main-subhead {
	font-family: 'Apercu', Helvetica, Arial, sans-serif;	
	font-size:clamp(1.35rem, 2.7vw, 1.8rem);
	line-height:1.55em;
	margin:0 auto;
	padding:0;
	display: block;
}

#img-wrap {
	position:absolute; 
}

.gradient-headline {
	margin: 0 auto;
	background-repeat: no-repeat;
	background-image:url('images/headline-bg.png');
	background-size: contain;
	background-clip: text;
	-webkit-background-clip: text;
	color: transparent;
}

#left-contact {
	font-size: 2.9rem;
	font-family: 'EBGaramond', Helvetica, Arial, sans-serif;
	text-align: left;
}

#right-contact {
	font-size: 3.2rem;
	font-family: 'EBGaramond', Helvetica, Arial, sans-serif;
	text-align:right;
}

.socials-menu {
	display:flex;
}

.socials-left {
	justify-content:flex-end;
	padding-top:20px;
}

.socials-left a {
	margin-left: 40px;
}

.socials-right {
	justify-content:flex-start;
}

.socials-right a {
	margin-right:20px;
}

.socials-menu img:hover {
	filter: opacity(50%);
}

.email {
	font-size: 3.2rem;
}

#map {
	width:100%;
	height:clamp(420px, 70vh, 750px);
}



/* FOOTER */
footer {
	width:100%;
	height:100%;
	background-color: #1b1c1d;
	font-family: 'Sofia', Helvetica, Arial, sans-serif;
	font-size: 1rem;
	line-height:2em;
	color: #fff;
}

#footer-content a {
	color: #fff;
	line-height: inherit;
}

#footer-content {
	width:85%;
	padding: 80px 0 60px 0;
	margin: 0 auto;
	display:flex;
	flex-flow: row wrap;
	align-content: center;
	justify-content: space-between;
	align-items: flex-start;
}

#footer-inner-left {
	display:block;
	width:50%;
	height:100%;
	text-align:left;
}

#footer-inner-right {
	display:block;
	width:50%;
	height:100%;
	text-align: right;
}

#footer-list {
	display: flex;
	text-align: center;
	padding:0px;
	margin:0px;
	list-style: none;
}

#footer-list li {
	padding:0px 10px;
}

#footer-list li.first-item {
	padding-left:0px;
}

#footer-list li.last-item {
	padding-right:0px;
}

/* Mobile Styling */
@media (max-width: 899px) {
	body {
		font-size: 1.25rem;
		line-height: 1.5;
	}

	header {
		padding: 0 7% !important;
	}

	.header-content {
		justify-content: center;
	}

	#header-topline {
		position: absolute;
		left: 7%;
		right: 7%;
		top: 16px;
		width: auto;
		z-index: 30;
	}

	#logo img {
		width: 78px;
	}

	.header-content > #logo img {
		width: 200px;
	}

	#header-midline {
		padding: 88px 0 64px;
	}

	#header-hero {
		max-width: 100%;
	}

	h1 {
		font-size: clamp(3.2rem, 11vw, 4.4rem);
		margin-bottom: 22px;
	}
	
	h4 {
		font-size: clamp(3rem, 10vw, 3.9rem);
		padding-bottom: 14px;
	}
	
	h2 {
		font-size: clamp(2.35rem, 11vw, 3rem);
	}

	#content-box h2 {
		font-size: clamp(2.35rem, 11vw, 3rem) !important;
	}
	
	h3 {
		font-family: 'Poppins';
		font-weight:bold;
		font-size: 2.4rem;
	}
	
	#main-subhead {
		font-size: clamp(1.42rem, 4vw, 1.5rem);
	}
	
	#home-subhead {
		font-size: clamp(1.42rem, 4.2vw, 1.58rem);
	}

	#subheadline {
		width: 100%;
		font-size: clamp(1.42rem, 4.2vw, 1.58rem);
		line-height: 1.5;
	}

	#content-box {
		min-height: auto;
		padding-top: 72px;
		padding-bottom: 72px;
	}

	#content-inner,
	#content-inner-narrow {
		width: 84%;
	}

	.button {
		width: min(100%, 280px);
		padding: 13px 24px;
		margin-top: 32px;
		font-size: 0.95rem;
	}
	
	#left-contact {
		font-size: 1.95rem;
		text-align:center;
	}
	
	#left-contact h2 {
		font-size: 2.1rem;
	}
	
	#right-contact {
		font-size: 1.9rem;
		text-align:center;
	}
	
	.email {
		font-size: clamp(1.28rem, 4.4vw, 1.55rem);
	}

	.socials-left {
		padding-top: 36px;
	}

	.socials-left a {
		margin-left: 12px;
		margin-right: 12px;
	}

	.socials-menu img {
		width: 42px;
		height: 42px;
	}

	#map {
		height: 420px;
	}

	footer {
		font-size: 0.95rem;
	}

	#footer-content {
		width: 86%;
		padding: 56px 0 48px;
	}

	#footer-inner-left, #footer-inner-right {
		text-align:center;
		flex-flow: column wrap;
		width:100%;
	}

	#footer-inner-right {
		padding-top:35px;
	}

	#footer-list {
		justify-content: center !important;
		flex-wrap: wrap;
	}
	
	.column {
    	width: 100%;
  	}
}