/*
yellow: ffe56a
purple: 993399
rust: 993333
*/

body {
	color: #fffdec;
	background-color: black !important;
	padding-top: 60px
}
/* COLORS */
.gold {
	color: #ffe56a !important
}
.gold-bg {
	background-color: #ffe56a !important
}
.rust {
	color: #993333 !important
}
.rust-bg {
	background-color: #993333 !important
}
.purple {
	color: #993399 !important
}
.purple-bg {
	background-color: #993399 !important
}
.cream {
	color: #fffdec !important
}
.cream-bg {
	background-color: #fffdec !important;
	color: black !important
}
.cream-bg h4:after {
	background-color: #993333 !important
}
.container>header>h1 {
	color: #fffdec 
}
p {
	color: #fffdec
}
.cream-bg p, .cream-bg h4 {
	color: black
}

/* HEADER */
.header-nav-wrapper .logo span {
	color: #fffdec 
}
.header-nav-wrapper nav ul li a {
	color: #fffdec
}
.header-nav-wrapper nav ul li a:hover {
	color: #993333
}
.header-nav-wrapper nav ul li a:hover:before {
	background-color: #993333
}

/* HERO HEADER */


.hero {
    height: calc(100vh - 120px);
    padding-bottom: 0;
}
.hero > header {
    border-top: 1px solid #ccc;
    position: absolute;
    bottom: 0;
    z-index: 1;
    width: 80%;
    left: 10%;
    text-align: center;
    padding-bottom: 20px
}

.hero > header h1 {
    display: block;
    font-size: 1.6rem;
    color: #ccc;
    padding-right: 10px
}
@media screen and (min-width: 768px){
	.hero > header {
		padding-bottom: 0
	}
	.hero > header h1 {
    	display: inline-block;
    }
    .hero {
	    height: calc(100vh - 166px);
	    padding-bottom: 109px;
	}
}
.hero > header h1 span {
    font-weight: bold;
    color: #fffdec;
    letter-spacing: 1px;
}
.hero > header i {
	font-size: 1.25rem;
	padding: 0 10px;
	color: #fffdec;
	
}
.navicon {
    padding: 30px;
    background: transparent
}
@media screen and (max-width: 480px){
	.header-nav-wrapper {
	    border-bottom: 0 !important;
	}
}

/* Fade CSS */

.hero .flickity-slider {
  transform: none !important;
}

.hero .carousel-cell {
  left: 0 !important;
  opacity: 0;
  transition-delay: 2s;
  transition: opacity 2s ease-in-out;
  z-index: 0;
}

.hero .carousel-cell.is-selected {
  opacity: 1;
  z-index: 0;
  transition: opacity 2s ease-in-out;
  /*transition: 0s opacity 1s ease-in, 1s opacity 1s ease-out;*/
}

.hero .carousel-cell {
	background-size: auto 90%;
	background-repeat: no-repeat;
	background-position: center center;
	background-color: transparent
}
.secondary-nav-wrapper {
    padding: 12px 30px;
}
.header-nav-wrapper nav ul li {
	padding: 10px 10px
}
@media (min-width: 1100px){
	.header-nav-wrapper nav ul li {
		padding: 10px 20px
	}
}
.header-nav-wrapper nav {
	padding: 0
}
header.hero, .carousel-cell {
	height: 85vw;
	background-color: black
}
@media (min-width: 100vh){
	header.hero, .carousel-cell {
		height: calc(100vh - 166px);
	}
}
div.mouse-container {
	right: 15px;
	left: auto
}
.hero .flickity-page-dots {
	display: none
}
.header-nav-wrapper {
	background-color: black
}
.header-nav-wrapper .logo, .secondary-nav-wrapper {
	background: transparent;
	border-color: transparent
}
.thumbnail-links a, .thumbnail-links img {
	pointer-events: none
}
.thumbnail-links {
	display: block
}
.thumbnail-links img{
	padding-bottom: 30px;
	border: 4px solid black;
	cursor: pointer;
	padding: 0;
	margin-right: 15px;
    margin-left: 15px;
    margin-bottom: 30px;
    transition: all 300ms;
    width: calc(100% - 30px)
}
@media (min-width: 768px){
	.thumbnail-links img:hover {
		opacity: .5;
		transition: all 300ms;
	}
	.thumbnail-links a {
		pointer-events: auto;
	}
	.thumbnail-links a img {
		pointer-events: auto;
		margin-right: 0px;
		margin-left: 0px;
		width: 100%
	}
}




.crew article.crew-member {
	height: auto;
	width: 100%;
	padding-bottom: 0;
	background-color: #993399
}
.crew article.crew-member figure {
	display: block;
	position: relative
}
.crew article.crew-member img {
    position: relative;
    top: 0;
    left: 0;
    height: auto;
    min-height: 100%;
    margin: 0;
    padding: 0;
    -webkit-transition: all 300ms;
    transition: all 300ms;
    -webkit-transform: none;
    transform: none;
    border: 4px solid black;
	width: 100%;
	display: block;
	float: left
}
.crew article.crew-member figure:after {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	width: 100%;
	background-color: #993399;
	opacity: 0;
	transition: all 300ms;
}
.crew article.crew-member:hover figure:after {
	opacity: .85;
	transition: all 300ms;
}
.crew article.crew-member .overlay {
	transform: none;
	opacity: 1 ;
	width: 100%;
	float: right;
	background: transparent !important;
}
@media (min-width: 550px){
	.crew article.crew-member img, .crew article.crew-member .overlay {
		width: 50%;
	}
}
@media (min-width: 768px){
	.crew article.crew-member img {
		width: 100%;
		float: none
	}
	.crew article.crew-member .overlay {
		position: absolute;
		top: 0;
		transform: none;
		width: 100%;
		opacity: 0 
	}
}
.crew article.crew-member figure figcaption * {
    padding: 20px 10px 0;
    display: block;
    color: #fffdec;
    line-height: 150%
}
.crew article.crew-member figure figcaption ul {
    float: left;
    width: 100%;
}

/* JUICER */
.juicer-feed * {
	color: #333
}
.j-soundcloud, .j-youtube {
	display: none !important
}

/* CONTACT */

.contact-form .form-control {
	background: #993399 !important
}
.contact-form .send-msg {
	color: #993399;
	border-color: #993399
}
.contact-form .send-msg:hover {
	background-color: #993399
}

strong {
	font-weight: bold !important
}


.juicer-feed.hip .j-text {
	background: rgba(0,0,0,.8) !important;
	color: #fffdec;
	font-family:Athelas,Verdana,Arial,sans-serif;font-size:15px;letter-spacing:.5px;font-weight:400;
}

.juicer-feed.hip .j-text p{
	color: #fff !important
}