/*
Theme Name:  JK-Divi-Child_1
Theme URI:
Version:     1.0
Description: This theme requires Divi parent theme.
Author:      JK
Author URI:
Template:    Divi
*/

/*- Add any CSS custom code for this child theme below this line -*/

@font-face{
    font-family:'Knockout';
    src: url('fonts/Knockout-HTF49-Liteweight.woff2') format('woff2'),
        url('fonts/Knockout-HTF49-Liteweight.woff') format('woff'),
        url('fonts/Knockout-HTF49-Liteweight.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Knockout';
    src: url('fonts/Knockout-HTF68-FullFeatherwt.woff2') format('woff2'),
        url('fonts/Knockout-HTF68-FullFeatherwt.woff') format('woff'),
        url('fonts/Knockout-HTF68-FullFeatherwt.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Knockout';
    src: url('fonts/Knockout-HTF69-FullLiteweight.woff2') format('woff2'),
        url('fonts/Knockout-HTF69-FullLiteweight.woff') format('woff'),
        url('fonts/Knockout-HTF69-FullLiteweight.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: 'Knockout';
    src: url('fonts/Knockout-HTF91-UltmtMiddlewt.woff2') format('woff2'),
        url('fonts/Knockout-HTF91-UltmtMiddlewt.woff') format('woff'),
        url('fonts/Knockout-HTF91-UltmtMiddlewt.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'Knockout';
    src: url('fonts/Knockout-HTF72-FullCruiserwt.woff2') format('woff2'),
        url('fonts/Knockout-HTF72-FullCruiserwt.woff') format('woff'),
        url('fonts/Knockout-HTF72-FullCruiserwt.ttf') format('truetype');
    font-weight: 800;
    font-style: normal;
}

:root {
  --brand-yellow: #f7c530;
  --easeInOutExpo: cubic-bezier(0.4, 0, 0, 1);
}

body * { -webkit-tap-highlight-color: rgba(0,0,0,0); }

body { font-family: 'Knockout'; font-weight: 400; }

.display-none { display: none !important; }

sup {
  font-size: .3em;
  position: relative;
  top: -1.6em;
}

h1, h2, h3 { padding-bottom: 0; line-height: .9em; }

h1#main_heading {
  float: left;
  text-indent: -9999px;
  position: absolute;
  left: 0;
  top: 0;
}

a {
  border: revert!important;
  outline: revert!important; 
}

a:focus {
  border: initial!important;
  outline: auto!important; 
}


#header_title {
  height: 0;
  overflow: hidden;
}

#footer-bottom { display: none; }

.flex-centered { display: flex; flex-wrap: wrap; align-items: center; align-content: center; justify-content: center; }
.flex-centered-top { display: flex; flex-wrap: wrap; align-items: flex-start; align-content: flex-start; justify-content: center; }
.flex-centered-nowrap { display: flex; align-items: center; align-content: center; justify-content: center; }
.flex-centered-left { display: flex; flex-wrap: wrap; align-items: center; align-content: center; justify-content: left; }
.flex-centered-right { display: flex; flex-wrap: wrap; align-items: center; align-content: center; justify-content: flex-end; }

#main-content { min-height: calc(90vh - 150px); background-color: black; }

#et-main-area { padding-top: 150px; }

#global-header {
  position: fixed;
  z-index: 99;
  width: 100%;
  height: 150px;
  padding: 0;
  display: flex;
  align-items: center;
  transition: all .5s ease-out;
}

#global-header .et_pb_row ,
#global-header .et_pb_column {
  display: flex;
  align-items: center;
  width: 100%;
  max-width: 100%;
  height: 100%;
  padding: 0 !important;
}

#global-header .et_pb_menu {
  display: flex;
  width: 100%;
  height: 100%;
  padding: 0 2%;
}

#global-header .et_pb_menu_inner_container { width: 100%; }

#global-header .et_pb_menu__menu ,
#global-header .et-menu-nav ,
#global-header #menu-primary-nav { width: 100%; height: 100%; }

#global-header .et_pb_menu__menu { margin: 0; }

#global-header #menu-primary-nav { justify-content: space-around; }

#global-header .et_pb_menu__logo-wrap { z-index: 999;}

#global-header .et_pb_menu__logo { margin-right: 0; width: 180px; max-width: 180px; transition: all .5s ease; }

#global-header .et_pb_menu__logo img { width: 100%; }

#global-header .et_pb_menu__menu { display: none !important; }

#global-header .et_mobile_nav_menu { display: block; width: 100%; }

#global-header .mobile_menu_bar {
  height: 100%;
  display: flex;
  justify-content: flex-end;
  align-content: center;
  align-items: center;
  padding-bottom: 0 !important;
  transform: translate(-20px, 0) !important;
}

#global-header .et_mobile_menu { padding: 0; }

#global-header .mobile_nav .mobile_menu_bar:before { color: white !important; font-size: 60px; }

#global-header .mobile_nav.closed .mobile_menu_bar:before { transform: scaleX(.8); }

#global-header .mobile_nav.opened .mobile_menu_bar:before { content: "M"; }

#global-header .mobile_nav.opened .mobile_menu_bar { z-index: 999; }

#global-header .et_mobile_menu {
  position: fixed;
  width: 100vw;
  height: 100vh;
  top: 0 !important;
  left: 0 !important;
  display: flex !important;
  flex-wrap: wrap;
  justify-content: center;
  z-index: 99;
  border-top: 0;
  padding: 25vh 0 !important;
  background-color: black !important;
  border: none !important;
  opacity: 0;
  pointer-events: none;
  transition: all .5s ease;
}

#global-header .mobile_nav.opened .et_mobile_menu {
  opacity: 1;
  pointer-events: all;
}

#global-header .et_mobile_menu:before ,
#global-header .et_mobile_menu:after {
  content: '';
  z-index: -1;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: black !important;
}

#global-header .et_mobile_menu:after {
  opacity: .15;
  background-image: url('../../uploads/2019/12/nav-bg.jpg');

}

#global-header .et_mobile_menu .menu-item {
  width: 100%;
  display: flex;
  align-items: center;
  padding: 0 !important;
}

#global-header .et_mobile_menu .menu-item a {
  font-size: calc(30px + 2vw) !important;
  padding: 2vw !important;
  width: 100%;
  text-transform: uppercase;
  border-bottom: none;
  text-align: center;
}

.partnership-post .nav-partnerships a ,
.creators-class-post .nav-creators-class a ,
.beyond-bottle-post .nav-beyond-bottle a ,
.flavor-post .nav-flavors a { color: var(--brand-yellow) !important; }


.small-nav #global-header { height: 80px; background-color: rgba(0,0,0,.9) !important; }

.small-nav #global-header .et_pb_menu__logo { max-width: 100px; }


@media (max-width:980px) {

  #global-footer .et_pb_column { padding: 0; }

  #global-footer .et_pb_column { width: 100%; margin-right: 0; margin-bottom: 5px; }

  #global-footer .logo-column ,
  #global-footer .social-column { width: 50%; padding-top: 40px; margin-top: 40px; border-top: 1px solid rgba(255,255,255,.3); }

  #global-footer .et_pb_text { text-align: center; }

  #global-footer .et_pb_social_media_follow a.icon ,
  #global-footer .et_pb_social_media_follow a.icon:before { width: calc(10px + 8vw); font-size: calc(10px + 5vw); }

}


.single .post {
  margin-bottom: 0;
  padding-bottom: 0;
}

body #page-container .et_pb_section #back-button.et_pb_button_0:before,
#back-button.fa-arrow-left:before,
*[data-icon="agsdix-fas fa-arrow-left"]:before,
*[data-icon="agsdix-fas fa-arrow-left"]:after {
  content: "\f060"!important;
  font-family: "Font Awesome 5 Free"!important;
}


#bottle-row { padding: 50px 0 100px; }

#bottle-row:before {
  content: '';
  position: absolute;
  display: block;
  bottom: 0;
  width: 100%;
  height: 85px;
  background-image: url(../../uploads/2019/12/rough-edge.png);
  background-position: center bottom;
}

#name-of-flavor:before ,
#name-of-artist:before {
  content: '';
  color: var(--brand-yellow);
  font-weight: 600;
  font-size: 26px;
  letter-spacing: 1px;
}

#name-of-flavor:before {
  content: 'Flavor';
}

#name-of-artist:before {
  content: 'Artist';
}


.bot-size-blurb {
  width: 20%;
  max-width: 20%;
}

#flavor-section #artist-photo ,
#flavor-section #artist-photo .et_pb_image_wrap ,
#flavor-section #artist-photo img {
  width: 100%;
  height: 25vw;
  overflow: hidden;
}

#flavor-section #artist-photo img {
  height: 100%;
  object-position: top;
  object-fit: cover;
  filter: saturate(0);
}

#flavor-section #artist-photo.align-bottom img {
  object-position: bottom;
}


.bb-menu-link h4 { margin-top: 20px; }

.bb-menu-link:hover h4 { color: var(--brand-yellow); }


.custom-grid .dp-dfg-filter-link { color: white; border: none; }

.custom-grid .dp-dfg-filter-link:after {
  content: '';
  position: relative;
  display: block;
  width: 100%;
  height: 5px;
  bottom: -10px;
  background-color: white;
}

.custom-grid .dp-dfg-filter-link.active { color: var(--brand-yellow); }

.custom-grid .dp-dfg-filter-link.active:after { background-color: var(--brand-yellow); }


.custom-grid .entry-title {
  font-size: calc( 10px + 1vw);
  line-height: 1.3em;
  font-weight: 800;
  text-align: center;
}

.custom-grid.winner ,
.custom-grid.winner .dp-dfg-item { padding-bottom: 0; margin-bottom: 0; }

.custom-grid.winner .dp-dfg-item img {
  object-fit: contain !important;
  height: 120% !important;
}

.custom-grid:not(.creators-class-main) .dp-dfg-overlay ,
.custom-grid:not(.creators-class-main) .dp-dfg-header {
  opacity: 0;
  transition: opacity .5s ease;
}

.custom-grid:not(.creators-class-main) .dp-dfg-item:hover .dp-dfg-overlay ,
.custom-grid:not(.creators-class-main) .dp-dfg-item:hover .dp-dfg-header {
  opacity: 1;
}

.custom-grid.creators-class-main .dp-dfg-skin-default.dp-dfg-skin-zoomimage .dp-dfg-item:hover .dp-dfg-image img {
  transform: none !important;
}

.custom-grid.creators-class-main .dp-dfg-header {
  padding: 1em;
}

.custom-grid.creators-class-main .entry-title {
  font-size: calc( 10px + 2vw);
  font-weight: 600;
}

.custom-grid.creators-class-main .dp-dfg-item {
  width: 43vw;
  height: 43vw;
  margin: 0 auto;
}

.custom-grid.creators-class-main .dp-dfg-image {
  height: 38vw;
}

.custom-grid.creators-class-main .dp-dfg-image img {
  height: 100%;
  object-fit: cover;
  object-position: top;
}

.dp-dfg-item .entry-title .brisk-heading {
  color: var(--brand-yellow);
  font-size: 20px;
  line-height: 1.3em;
  display: block;
}


#calorie-badge:before {
	content: '';
	display: inline-block;
	background-color: var(--brand-yellow);
	position: relative;
	width: 5px;
	height: 110px;
	top: -25px;
	left: -45px;
}


.et_pb_video_play .button_text {
  display: block;
  text-indent: -9999px;
}



#artist-bio-row #artist-photo ,
#artist-bio-row #artist-photo .et_pb_image_wrap ,
#artist-bio-row #artist-photo img {
  width: 100%;
  height: 30vw;
  overflow: hidden;
}

#artist-bio-row #artist-photo img {
  object-position: top;
  object-fit: cover;
  filter: saturate(0);
}


#artist-photo.cc-artist-image img { filter: none !important; }

#flavor-section p ,
#artist-bio-row p { font-size: calc(14px + 1vw); line-height: 1.5em; }

#artist-bio-row .et_pb_text:nth-of-type(3) { max-width: 75%; }

.nutri-facts { display: none;}


/*
#promo-bottle-image img {
	object-fit: cover;
	object-position: bottom;
	height: 100%;
}
*/

@media (max-width:1360px) {

  #flavor-section p ,
  #artist-bio-row p { font-size: calc(10px + 2vw); line-height: 1.5em; }

}

@media (max-width:1200px) {

  .custom-grid .entry-title { font-size: calc(6px + 1vw); }

}

@media (max-width:980px) {

  .custom-grid .entry-title { font-size: 3vw; }

}

@media (max-width:980px) and (min-width: 768px) {

  #artist-photo ,
  #artist-photo .et_pb_image_wrap ,
  #artist-photo img {
    height: 50vw !important;
  }

  #artist-bio-row { margin-bottom: 5vw !important; }

  #artist-bio-row .et_pb_column {
    width: 45%;
    margin-right: 5%;
  }

  #artist-bio-row .et_pb_column:last-of-type { margin-right: 0; }

  #artist-bio-row h1 { font-size: calc(10px + 6vw); }
  #artist-bio-row h2 { font-size: calc(10px + 3vw); }

  #art-quote-row .et_pb_column {
    width: 50%;
  }

}

@media (max-width:767px) {

  #back-button { top: -50px; left: -60px; }

  #artist-bio-row { margin-bottom: 5vw !important; }

  #artist-photo ,
  #artist-photo .et_pb_image_wrap ,
  #artist-photo img {
    height: 87vw !important;
  }

  #artist-bio-row .et_pb_text { text-align: center; max-width: 100% !important; }

  #artist-bio-row .et_pb_text:first-of-type { margin-top: 10px !important; }

  #artist-bio-row h1 { font-size: calc(10px + 10vw); }
  #artist-bio-row h2 { font-size: calc(10px + 5vw); }

  #artist-bio-row p { font-size: calc(10px + 3vw); line-height: 1.5em; }

  #flavor-section #name-of-flavor h1 { font-size: calc(10px + 9vw); }

	#art-quote-row .et_pb_column:last-of-type { margin-top: -7vw; }
	
	.custom-grid .dp-dfg-filter-link { padding: 0 20px 30px; }
	
  .custom-grid .entry-title { font-size: 5vw !important; }

  .custom-grid.creators-class-main .entry-title { font-size: 8vw !important; }

  .custom-grid.creators-class-main .dp-dfg-item {
    width: 90vw;
    height: 90vw;
    margin: 0 auto !important;
  }

  .custom-grid.creators-class-main .dp-dfg-image {
    height: 80vw;
  }

  #winner-badge {
    max-width: 45vw;
    left: 0vw;
  }

  .bb-menu-link .et_pb_text {
    position: relative !important;
    width: 100%;
    text-align: center;
    padding: 10% 5% !important;
  }

  .bb-menu-link .et_pb_text h2 { font-size: calc(10px + 10vw); }
  .bb-menu-link .et_pb_text h3 { font-size: calc(10px + 6vw); }
  .bb-menu-link .et_pb_text h4 { font-size: calc(10px + 4vw); }

  #promo-flavor-section {  }


}


@media (max-width:480px) {

  .custom-grid .dp-dfg-items { display: flex; }

  .custom-grid .dp-dfg-layout-grid .dp-dfg-item { width: 50% !important; margin: 0; }

  .custom-grid .entry-title { font-size: 5vw; } #zero-video .fluid-width-video-wrapper ,
 	#smash-video .fluid-width-video-wrapper {
    	transform: none !important;
  	}

}





@keyframes fade-in-modal {
  0% { opacity: 0; }
  100% { opacity: 1; pointer-events: all; }
}

.modal-open body { overflow: hidden; }

.modal {
  position: fixed;
  z-index: 999999;
  width: 100vw;
  height: 100vh;
  top: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  pointer-events: none;
  opacity: 0;
  text-align: center !important;
  transition: opacity .5s ease;
}

.modal-shade ,
.bio-shade {
  position: fixed;
  z-index: -1;
  width: 100vw;
  height: 100vh;
  background-color: rgba(0,0,0,.8);
  opacity: .98;
}

.modal.on ,
.modal-shade.on { opacity: 1; pointer-events: all; }

.modal.off ,
.modal-shade.off { opacity: 0; pointer-events: none; animation: none !important; }

.close-btn { position: absolute; top: -50px; right: 0; }
.close-btn:hover { cursor: pointer; }




/* -- Global Animations --*/

.emerge[data-emergence=hidden] {

}

.emerge {
  transition: opacity 2s var(--easeInOutExpo);
  opacity: 0;
  /* filter: blur(3px); */
}
.emerge[data-emergence=visible] {
  opacity: 1;
  /* filter: blur(0px); */
}

/*
:nth-of-type(1) .emerge.em-up { transition-delay: .1s; }
:nth-of-type(2) .emerge.em-up { transition-delay: .2s; }
:nth-of-type(3) .emerge.em-up { transition-delay: .3s; }
:nth-of-type(4) .emerge.em-up { transition-delay: .4s; }
:nth-of-type(5) .emerge.em-up { transition-delay: .5s; }
:nth-of-type(6) .emerge.em-up { transition-delay: .6s; }
:nth-of-type(7) .emerge.em-up { transition-delay: .7s; }
:nth-of-type(8) .emerge.em-up { transition-delay: .8s; }
:nth-of-type(9) .emerge.em-up { transition-delay: .9s; }
:nth-of-type(10) .emerge.em-up { transition-delay: 1s; }
*/







/* -- Form Styles --*/

.gform_wrapper * {  }

.gform_page {  }

.gsection { margin: 0 0 5px 0 !important; padding: 0 !important; }

.gf_progressbar_wrapper { padding: 0 !important; }

.gf_progressbar { padding: 0 !important; background-color: #000 !important; }

.gf_progressbar:after { display: none !important; }

.gf_progressbar_percentage { height: 10px !important; background-color: #ee3524 !important; background-image: none !important; transition: all .5s ease-in-out; }

.gf_progressbar_percentage span { display: none !important; }

.gform_wrapper { margin: 0 !important; }

body .gform_wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]) ,
body .gform_wrapper textarea.textarea ,
body div.form_saved_message div.form_saved_message_emailform form input[type=text] ,
.gform_wrapper select ,
.ginput_container_checkbox ,
.gfield_checkbox label {

	font-size: 16px !important;
	height: 40px;
	padding: 0 10px !important;
}

.gf_left_half .ginput_container ,
.gf_right_half .ginput_container { margin-bottom: 0px !important; }

.gf_left_half { width: 47%; padding-right: 3%; margin: 0 !important; }

.gform_wrapper ul li.gf_right_half { margin-top: 0 !important; }

.ginput_container { margin: 0 0 10px !important; }

.gform_wrapper li.hidden_label input { margin-top: 0 !important; }

.gform_body * { transition: all .3s ease !important; }

.gfield_label { font-size: 26px !important; }

.gform_wrapper .gfield_checkbox li label { max-width: 100% !important; }

.gform_wrapper .ginput_container_checkbox {
    padding: 0 15px 5px;
	color: rgba(0,0,0,.5) !important;
}

.gform_wrapper .gfield_checkbox li { overflow: visible !important; }

.gform_wrapper .gfield_checkbox li input[type=checkbox] {
	position: absolute;
    opacity: 0;
    cursor: pointer;
}

.gform_wrapper .gfield_checkbox label {
	position: relative;
	left: 30px;

}

.gform_wrapper .gfield_checkbox label:before {
	content: "";
	position: absolute;
    display: inline-block;
    margin-right: 10px;
	top: 0px;
    left: -25px;
    height: 25px;
    width: 25px;
    border: 2px solid rgba(0,0,0,.5);
	border-radius: 3px;
}

.gform_wrapper .gfield_checkbox input:checked + label:before { border: 2px solid rgba(0,0,0,1); }

.gform_wrapper .gfield_checkbox input:checked + label:after {
	content: "";
    position: absolute;
    z-index: 1;
    top: 3px;
	left: -16px;
    width: 8px;
    height: 14px;
    border: solid #ee3524;
    border-width: 0 3px 3px 0;
    transform: rotate(45deg);
}


.gform_wrapper .gfield_checkbox input:checked + label { color: rgba(0,0,0,1); font-weight: 400 !important; }



.gform_footer input.button ,
.gform_page_footer input.button {
	border: none !important; border-radius: 5px !important; background-color: #EE3524 !important; color: rgba(255,255,255,1) !important; font-size: 20px !important; padding: 10px 40px; font-family: 'Oswald', sans-serif; font-weight: 400;
}


.gform_footer input.button:hover ,
.gform_page_footer input.button:hover { cursor: pointer; background-color: #000 !important; color: #fff !important; transform: scale(1.05); }

.gform_footer input.gform_previous_button { background-color: #000 !important; }

.gform_ajax_spinner {
	border: 4px solid rgba(0, 0, 0, 0.3);
	border-left: 4px solid rgba(0,0,0,.7);
	animation: spinner 1.1s infinite linear;
	border-radius: 50%;
	width: 30px;
	height: 30px;
	position: absolute;
	bottom: 0px;
	right: 10px;
}

@keyframes spinner { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }


.gform_wrapper li.gfield.gfield_error,
.gform_wrapper li.gfield.gfield_error.gfield_contains_required.gfield_creditcard_warning {
	margin-bottom: 0!important;
	border: none !important;
	padding-bottom: 0 !important;
	padding-top: 0 !important;
	padding-right: 15px !important;
	background-color: rgba(0,0,0,0) !important;
}

.gform_wrapper .validation_error ,
.gform_wrapper .validation_message { display: none; }


.gform_wrapper li.gfield_error input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]),
.gform_wrapper li.gfield_error textarea ,
.gfield_error .ginput_container_checkbox ,
.gfield_error select
{ border: 2px solid #ee3524 !important; }

.gform_wrapper .gfield_error .gfield_label ,
.gform_wrapper li.gfield_error ul.gfield_checkbox { color: #ee3524 !important; }

.gform_wrapper .gfield_required { display: none !important; }