/*
* Gramercy v1.0
* Copyright 2020, Chuck Mallott
* http://gramercy.us
* style.css
*/



/* Table of contents
––––––––––––––––––––––––––––––––––––––––––––––––––
- Base Styles
- Colors
- Typography
- Links
- Buttons
- Forms
- Lists
- Code
- Tables
- Layout
- Navigation
*/


/* Base Styles
–––––––––––––––––––––––––––––––––––––––––––––––––– */
/* NOTE
html is set to 62.5% so that all the REM measurements throughout Skeleton
are based on 10px sizing. So basically 1.5rem = 15px :) */
html {
  font-size: 62.5%; }
body {
  font-size: 2.0rem; /* currently ems cause chrome bug misinterpreting rems on body element */
  line-height: 1.3;
  letter-spacing: -.25px;
  font-weight: 400;
  font-family: 'Courier Prime', monospace;
  color: #ACB4BD;
  background-color: #1D232B;
  	-webkit-font-smoothing: antialiased;
  	-moz-osx-font-smoothing: grayscale;
  }
  
/* Larger than 750px */
@media (min-width: 750px) {
	body {
		font-size: 2.0rem;	
	}
}

  
/* Colors
–––––––––––––––––––––––––––––––––––––––––––––––––– 

Ink06			#1D232B;
Ink05			#232B35;
Ink04			#35404E;
Ink03			#59697B;
Ink02			#ACB4BD;
Ink01			#E6E9EA;

Indigo05		#002040;
Indigo04		#004080;
Indigo03		#0053A6;
Indigo02		#0087CB;
Indigo01		#E6F7FF;

Sun05			#FE7F00;
Sun04			#FEA900;
Sun03			#FFC619;
Sun02			#FFEA80;
Sun01			#FFF4BF;

Earth05			#331405;
Earth04			#806040;
Earth03			#BFBFBB;	
Earth02			#E6E5E1;
Earth01			#F2F1ED;

*/
  


/* Typography
–––––––––––––––––––––––––––––––––––––––––––––––––– 

Work Sans Web Font
* light			300
* regular		400
* semibold		600
* extrabold		800

*/



h1, h2, h3, h4, h5, h6 {
  margin-top: 1em;
  margin-bottom: 0;
  font-weight: 700;
  overflow-wrap: break-word;
  word-wrap: break-word;
  font-family: 'Work Sans', sans-serif; }
h1 { font-size: 5.2rem; line-height: 1; letter-spacing: -.25rem; color: #0087CB; font-weight: 300; }
h2 { font-size: 2.4rem; line-height: 1; letter-spacing: -.1rem; color: #ffC619; font-weight: 400; margin-top: .75rem; margin-bottom: 6rem; }
h3 { font-size: 2.8rem; line-height: 1.3; letter-spacing: -.025rem; font-weight: 400; color: #fff; }
h4 { font-size: 2.0rem; line-height: 1.3; color: #5050C8; }

/* Larger than 750px */
@media (min-width: 750px) {
	h1 {
		font-size: 6.6rem;	
	}
	h2 {
		font-size: 3.2rem;
	}
}

h1 em#brand-tag {
	color: rgba(255,255,255,.25);
	display: inline-block;
	font-style: normal;
}

p {
  padding: 0;
  margin: 0 0 2.4rem 0;
  }
  
p.hero {
	font-size: 3.2rem; line-height: 1.3; letter-spacing: -.05rem; color: #8E99A1; padding-top: .5em;
}

strong {
	font-weight: 600;
	color: #fff;
}

p small {
	font-size: 1.8rem;
}

.footer p small {
	font-size: 1.8rem;
}

::selection {
  background: #0087CB; /* WebKit/Blink Browsers */
  color: #fff;
}
::-moz-selection {
  background: #0087CB; /* Gecko Browsers */
  color: #fff;
}




/* Links
–––––––––––––––––––––––––––––––––––––––––––––––––– */
a {
  color: #FFC619;
  text-decoration: none; }
a:hover {
  color: #232B35;
  text-decoration: none;
  background-color: #FFC619; }


/* Buttons
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.button,
button,
input[type="submit"],
input[type="reset"],
input[type="button"] {
  display: inline-block;
  height: 50px;
  padding: 0 32px;
  color: #008CD2;
  text-align: center;
  font-size: 16px;
  font-weight: 700;
  line-height: 48px;
  letter-spacing: .1rem;
  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;
  background-color: #DEF0F9;
  border-radius: 7px;
  cursor: pointer;
  box-sizing: border-box;
  border: 2px solid transparent; }
.button:hover,
button:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
input[type="button"]:hover,
.button:focus,
button:focus,
input[type="submit"]:focus,
input[type="reset"]:focus,
input[type="button"]:focus {
  color: #008CD2;
  background-color: #fff;
  border: 2px solid #BEE1F4;	
  outline: 0;
}
  
.button.button-secondary,
button.button-secondary,
input[type="submit"].button-secondary,
input[type="reset"].button-secondary,
input[type="button"].button-secondary {
  color: #5050C8;
  background-color: #E0E0F5;
  border-color: transparent; }
.button.button-secondary:hover,
button.button-secondary:hover,
input[type="submit"].button-secondary:hover,
input[type="reset"].button-secondary:hover,
input[type="button"].button-secondary:hover,
.button.button-secondary:focus,
button.button-secondary:focus,
input[type="submit"].button-secondary:focus,
input[type="reset"].button-secondary:focus,
input[type="button"].button-secondary:focus {
  color: #5050C8;
  background-color: #fff;
  border-color: #C2C2EC;
}
  
.button.button-reverse,
button.button-reverse,
input[type="submit"].button-reverse,
input[type="reset"].button-reverse,
input[type="button"].button-reverse {
  color: rgba(255,255,255,.75);
  background-color: transparent;
  border-color: rgba(255,255,255,.1); }
.button.button-reverse:hover,
button.button-reverse:hover,
input[type="submit"].button-reverse:hover,
input[type="reset"].button-reverse:hover,
input[type="button"].button-reverse:hover,
.button.button-reverse:focus,
button.button-reverse:focus,
input[type="submit"].button-reverse:focus,
input[type="reset"].button-reverse:focus,
input[type="button"].button-reverse:focus {
  color: #FFF;
  background-color: transparent;
  border-color: rgba(255,255,255,.25);
}

.button.button-shade,
button.button-shade,
input[type="submit"].button-shade,
input[type="reset"].button-shade,
input[type="button"].button-shade {
  color: #3D515E;
  background-color: transparent;
  border-color: rgba(198,204,207,.5); }
.button.button-shade:hover,
button.button-shade:hover,
input[type="submit"].button-shade:hover,
input[type="reset"].button-shade:hover,
input[type="button"].button-shade:hover,
.button.button-shade:focus,
button.button-shade:focus,
input[type="submit"].button-shade:focus,
input[type="reset"].button-shade:focus,
input[type="button"].button-shade:focus {
  color: #283E4C;
  background-color: transparent;
  border-color: rgba(198,204,207,1);
}


/* Forms
–––––––––––––––––––––––––––––––––––––––––––––––––– */
input[type="email"],
input[type="number"],
input[type="search"],
input[type="text"],
input[type="tel"],
input[type="url"],
input[type="password"],
textarea,
select {
  height: 38px;
  padding: 6px 10px; /* The 6px vertically centers text on FF, ignored by Webkit */
  background-color: #fff;
  border: 1px solid #D1D1D1;
  border-radius: 4px;
  box-shadow: none;
  box-sizing: border-box; }
/* Removes awkward default styles on some inputs for iOS */
input[type="email"],
input[type="number"],
input[type="search"],
input[type="text"],
input[type="tel"],
input[type="url"],
input[type="password"],
textarea {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none; }
textarea {
  min-height: 65px;
  padding-top: 6px;
  padding-bottom: 6px; }
input[type="email"]:focus,
input[type="number"]:focus,
input[type="search"]:focus,
input[type="text"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
textarea:focus,
select:focus {
  border: 1px solid #33C3F0;
  outline: 0; }
label,
legend {
  display: block;
  margin-bottom: .5rem;
  font-weight: 600; }
fieldset {
  padding: 0;
  border-width: 0; }
input[type="checkbox"],
input[type="radio"] {
  display: inline; }
label > .label-body {
  display: inline-block;
  margin-left: .5rem;
  font-weight: normal; }


/* Lists
–––––––––––––––––––––––––––––––––––––––––––––––––– */
ul {
  list-style: circle inside; }
ol {
  list-style: decimal inside; }
ol, ul {
  padding-left: 0;
  margin-top: 0; }
ul ul,
ul ol,
ol ol,
ol ul {
  margin: 1.5rem 0 1.5rem 3rem;
  font-size: 90%; }
li {
  margin-bottom: 1rem; }


/* Code
–––––––––––––––––––––––––––––––––––––––––––––––––– */
code {
  padding: .2rem .5rem;
  margin: 0 .2rem;
  font-size: 90%;
  white-space: nowrap;
  background: #F1F1F1;
  border: 1px solid #E1E1E1;
  border-radius: 4px; }
pre > code {
  display: block;
  padding: 1rem 1.5rem;
  white-space: pre; }


/* Tables
–––––––––––––––––––––––––––––––––––––––––––––––––– */
th,
td {
  padding: 12px 15px;
  text-align: left;
  border-bottom: 1px solid #E1E1E1; }
th:first-child,
td:first-child {
  padding-left: 0; }
th:last-child,
td:last-child {
  padding-right: 0; }
  
  
/* Layout Styles
–––––––––––––––––––––––––––––––––––––––––––––––––– */

header {
	padding: 0;
}

blockquote {
	margin: 80px 10%;
	background: url(../images/quote-mark.png) no-repeat;
	background-size: 45px 35px;
	background-position: 0 10px;
	font-family: 'Work Sans', sans-serif;
}

blockquote p {
	font-size: 2.8rem;
	font-weight: 800;
	color: #fff;
	padding-left: 60px;
	padding-bottom: 0;
	margin-bottom: 10px;
}

blockquote cite {
	color: #59697B;
	font-size: 1.7rem;
	padding-left: 60px;
	font-style: normal;
}

/* Larger than 750px */
@media (min-width: 750px) {
	blockquote p {
		font-size: 3.6rem;	
	}
	blockquote cite {
		font-size: 2.0rem;
	}
}

.episodes-block {
	border-top: 2px solid rgba(255,255,255,.1);
	padding-top: 40px;
	margin-top: 0;
}

.episodes-block h2 {
	color: #fff;
	text-align: center;
	font-weight: 800;
	margin-bottom: 0;
	padding-bottom: 16px;
	font-size: 2.4rem;
}

.page h2 {
	color: #fff;
	font-weight: 800;
	margin-bottom: 0;
	padding-bottom: 16px;
}

.episode {
	padding-top: 40px;
}

.episode p {
	color: #fff;
}

img.season-art {
	max-width: 100%;
	height: auto;
	border-radius: 7px;
}

img.episode-art {
	border-radius: 7px;
	max-width:100%;
	max-height:100%;
	width: auto;
	height: auto;
}

/* Larger than 550px */
@media (min-width: 550px) {
	img.episode-art {
	max-width:180px;
	max-height:180px;
	width: auto;
	height: auto;
	}
}

.footer {
	margin: 100px 0 0 0;
	padding: 80px 0;
	background: #FFC619 url(../images/footer-texture.png) no-repeat;
	background-size: cover;
	color: #35404E;
}

.footer strong {
	color: #35404E;
}

.footer a:link, .footer a:visited {
	color: #35404E;
	text-decoration: none;
}

.footer a:hover {
	color: #232B35;
	text-decoration: none;
	background-color: #fff;
}

.footer img.footer-mark {
	margin-bottom: -20px;
}

.social-icons {
	display: block;
}

.social-icons img {
	margin: 0 16px;
}

.social-icons a:hover {
	background-color: transparent;
}


/* Navigation
-------------------------------------------------- */

ul.nav {
	list-style-type: none;
	display: block;
	text-align: center;
	width: 100%;
	border-bottom: 0;
	margin-bottom: 2em;
	margin-top: 0;
}

ul.nav li {
	padding: 0;
	margin-right: 0;
}

ul.nav li:last-child {
	margin-right: 0;
}

ul.nav li a:link, ul.nav li a:visited, ul.nav li a:active {
	color: rgba(255,255,255,.25);
}

ul.nav li a:hover {
	color: #fff;
	background: transparent;
}

body#intro 		ul.nav li.nav-intro a,
body#season1 	ul.nav li.nav-season1 a,
body#season2 	ul.nav li.nav-season2 a,
body#season3 	ul.nav li.nav-season3 a {
	color: #FFC619;
	border-bottom: 0;
	padding-bottom: 12px;
}

.main-title {
	padding: 0;
	margin: -1.5em 0;
}


/* Larger than 750px */
@media (min-width: 750px) {
	ul.nav li {
		padding: 0 40px 0 0;
		margin-right: 16px;
	}
	
	ul.nav {
		display: inline-flex;
		text-align: left;
		margin-bottom: 2em;
		border-bottom: 2px solid rgba(255,255,255,.10);
	}

	body#intro 		ul.nav li.nav-intro a,
	body#season1 	ul.nav li.nav-season1 a,
	body#season2 	ul.nav li.nav-season2 a,
	body#season3 	ul.nav li.nav-season3 a {
		color: #FFC619;
		border-bottom: 2px solid #fff;
		padding-bottom: 12px;
	}
	
	.main-title {
		padding: 0;
		margin: 0;
}


}



/* Mailchimp Form
–––––––––––––––––––––––––––––––––––––––––––––––––– */

#mc_embed_signup input#mce-EMAIL {
	background-color: rgba(255,255,255,.35);
	border: 0;
	border-radius: 0;
	width: 300px;
	font-size: 1.7rem;
	color: rgba(53,64,78,1);
	height: 50px;
	font-family: 'Work Sans', sans-serif;
}

#mc_embed_signup input#mce-EMAIL::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
	  color: rgba(53,64,78,.65);
	  opacity: 1; /* Firefox */
	}
	
#mc_embed_signup input#mce-EMAIL:-ms-input-placeholder { /* Internet Explorer 10-11 */
	  color: rgba(53,64,78,.65);
	}
	
#mc_embed_signup input#mce-EMAIL::-ms-input-placeholder { /* Microsoft Edge */
	  color: rgba(53,64,78,.65);
	}
	
#mc_embed_signup input#mc-embedded-subscribe {
	color: #fff;
	background-color: #FE7F00;
	border-radius: 0;
	font-size: 1.7rem;
	height: 50px;
	font-family: 'Work Sans', sans-serif;
}

#mc_embed_signup {
	margin-bottom: 40px;
}

#mc_embed_signup input.btn-hot {
	border: 1px solid #FE7F00;
}



/* Photo banner thing 
---------------------------------------------- */



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

.banner .logo {
	height: 160px;
}

/* Larger than 750px */
@media (min-width: 750px) {
	.banner .logo {
		height: 200px;	
	}
}

.banner .photobanner {
	height: 160px;
	animation: nudge 120s linear infinite alternate;
}

/* Larger than 750px */
@media (min-width: 750px) {
	.banner .photobanner {
		height: 200px;	
	}
}

@keyframes nudge {
  0% {
    transform: translate(0, 0);
  }
  
  100% {
    transform: translate(-1920px, 0);
  }
}

.banner img.logo {
	margin: 0 auto;
	position: absolute;
	top: 0; left: 0; bottom: 0; right: 0;
	z-index: 1;
	padding: 0;
}


.hide {
	display: none;
}