/*
Theme Name:  So Delicious
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 -*/


#ie-message {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  align-items: center;
  justify-content: center;
  display: none;
  pointer-events: none;
  z-index: -1;
}

#ie-message.on {
  z-index: 9999999;
  display: flex;
  pointer-events: all;
}

body.complete.logged-in > :not(.preloader-plus) { transition: none !important; }

/* Font path: url('../../../wp-content/themes/jk-divi-child_v22/fonts/ */

@font-face {
    font-family: 'ScrumptiousSerif';
    src: url('../../../wp-content/themes/jk-divi-child_v22/fonts/ScrumptiousSerif.woff2') format('woff2'),
        url('../../../wp-content/themes/jk-divi-child_v22/fonts/ScrumptiousSerif.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gilroy';
    src: url('../../../wp-content/themes/jk-divi-child_v22/fonts/Gilroy-Regular.woff2') format('woff2'),
        url('../../../wp-content/themes/jk-divi-child_v22/fonts/Gilroy-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gilroy';
    src: url('../../../wp-content/themes/jk-divi-child_v22/fonts/Gilroy-Medium.woff2') format('woff2'),
        url('../../../wp-content/themes/jk-divi-child_v22/fonts/Gilroy-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

html {

  --ui-vh: 100vh;
  --ui-vw: 100vw;

  --ui-window-size: calc(var(--ui-vw) + var(--ui-vh));

  --ui-mult: .01;

  --ui-scale: calc(var(--ui-window-size) * var(--ui-mult));

  font-size: var(--ui-scale);

}

body {

	--brand-orange: #f58f2d;
	--brand-light: #ffffff;
	--brand-dark: #000000;

	--brand-display-font: 'ScrumptiousSerif', sans-serif;
	
  	--easeInOutExpo: cubic-bezier(0.4, 0, 0, 1);

  	font-family: 'Gilroy' !important;
	color: var(--brand-light);
}

h1, h2, h3, h4, h5 , .et_pb_button.din {
  font-family: 'ScrumptiousSerif', sans-serif !important;
	font-weight: 400;
	font-style: normal;
  padding-bottom: 0;
}

.din *,
.din {
  font-family: din-condensed, sans-serif !important;
	font-weight: 400;
	font-style: normal;
}

#main-header {
	display:none !important;
}

.et_fixed_nav.et_show_nav #page-container ,
#page-container {
	padding-top: 0 !important;
	overflow: hidden;
}

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


#footer-bottom { display: none; }

.flex-centered { display: flex; flex-wrap: wrap; align-items: center; align-content: center; 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; }

.vertical-space-between {
  align-content: space-between;
}

.space-between {
  justify-content: space-between;
}

.align-top {
  align-items: flex-start;
}

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



@media (max-width:980px) {

  .swap-cols-mobile {
    display: flex;
    flex-direction: column-reverse;
  }

}



.et_pb_button:hover {
  text-decoration: underline;
} 

.age-gate__headline {
  color: white;
  text-transform: uppercase;
  font-weight: 500;
  line-height: 1.2em;
  font-size: 22px;
  margin-bottom: 0;
}

.age-gate__submit {
	background-color: var(--brand-dark) !important;
	color: white !important;
}

/*
.age-gate__form {
  max-width: 320px !important;
  margin: 0 auto !important;
}


.age-gate__buttons {
  flex-wrap: wrap;
}

.age-gate__submit--yes {
  width: 100%;
  background-color: var(--brand-green) !important;
  text-decoration: underline;
  font-weight: normal !important;
  text-transform: uppercase;
  font-family: 'Gotham';
     padding: 20px 20px 25px !important;
	border-radius:3px !important;
}


.age-gate__submit--no {
  background-color: black !important;
  text-decoration: underline;
  font-weight: normal !important;
  text-transform: uppercase;
  font-family: 'Gotham';
  padding: 15px 45px 20px !important;
  border: 2px solid var(--brand-beige) !important;
	border-radius:3px;
}
*/



#in-app-msg {
  position: fixed;
  bottom:0;
  left: 0;
  width: 100vw;
  height: 50vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background: white;
  padding: 10vw;
  font-size: 18px;
  text-align: center;
  color: black;
  z-index: 9999;
}





/* -- Form Styles --*/

#entry-form .gform_required_legend ,
#entry-form .gfield_required_asterisk {
	color: var(--brand-light) !important;
}



#entry-form .gfield_label .gfield_required_asterisk ,
#entry-form .gfield_consent_label .gfield_required_asterisk {
    top: -5px;
    position: relative;
}

#entry-form .gfield_consent_label .gfield_required_asterisk {
	
}

#entry-form .ginput_counter {
  display: none !important;
}

#entry-form label ,
#entry-form legend {
	font-family: var(--brand-display-font);
}


#entry-form .ginput_complex {
  justify-content: center;
}

#entry-form .gfield--type-consent {
  text-align: left;
  font-family: 'ScrumptiousSerif';
}

#entry-form .gfield--type-consent .ginput_container {
  display: flex;
  gap: 3%;
}

#entry-form .gfield--type-consent .gfield_label {
  color: white;
}

#entry-form select {
  text-align: center !important;
  
}



input::-webkit-input-placeholder ,
textarea::-webkit-input-placeholder {  }
input::-moz-placeholder ,
textarea::-moz-placeholder {  }
input:-ms-input-placeholder ,
textarea:-ms-input-placeholder {  }
input:-moz-placeholder ,
textarea:-moz-placeholder {  }


input:focus::-webkit-input-placeholder ,
textarea:focus::-webkit-input-placeholder { opacity: .5; }
input:focus::-moz-placeholder ,
textarea:focus::-moz-placeholder { opacity: .5; }
input:focus:-ms-input-placeholder ,
textarea:focus:-ms-input-placeholder { opacity: .5; }
input:focus:-moz-placeholder ,
textarea:focus:-moz-placeholder { opacity: .5; }


#entry-form .gform_button {
  font-family: 'ScrumptiousSerif';
  margin: 0 auto;
}

#entry-form .gform_button:hover {
  text-decoration: underline;
}

#entry-form .gform_required_legend {
  font-size: 12px !important;
}

body:not(.logged-in) #conf-form {
  display: none;
}

#entry-form label a {
	color: var(--brand-light);
	text-decoration: underline;
}

#entry-form .gfield_consent_label {
  width: calc(100% - 20px);
}


body:not(.logged-in) #entry-form .gform_confirmation_wrapper #conf-form {
  display: block !important;
}

#entry-form .validation_message {
  background: #f22248;
  border: none;
  border-radius: 100px;
  padding: 5px !important;
  margin-top: 10px !important;
  margin-bottom: 0 !important;
  color: white !important;
  font-size: 14px !important;
  line-height: 1em !important;
  text-align: center !important;
  font-family: 'Gilroy' !important;
}

#entry-form .gform_wrapper.gravity-theme .gfield_error label {
  color: #f22248 !important;
}

#entry-form .gform_wrapper.gravity-theme .gfield_error [aria-invalid=true] {
  border: 1px solid #f22248 !important;
}

.gform_ajax_spinner {
	border: 2px solid rgba(255, 255, 255, 0.5);
	border-left: 2px solid rgba(255, 255, 255,1);
	animation: spinner 1.1s infinite linear;
	border-radius: 50%;
	width: 15px;
	height: 15px;
	position: absolute;
	bottom: 10px;
	right: 10px;
}

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


body:not(.logged-in) #conf-row {
  display: none;
}

body:not(.logged-in) .gform_confirmation_wrapper #conf-row {
  display: block !important;
}

.gform_confirmation_message h1 ,
.gform_confirmation_message h2 ,
.gform_confirmation_message h3 {

}



.gform_wrapper .gform_validation_errors { display: none; }

.gform_wrapper .validation_error .gfield_error {
  max-width: 100% !important;
}

.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 var(--brand-red) !important; }


#contact-form-module .question-dropdown .gfield_required {
  margin: 0;
}



.gform_confirmation_message_2 {
  display: none;
}


/*old buttons*/
#bonus-buttons-row {
  display: none;
}


/*new buttons*/
#bonus-forms-row {

}

#bonus-forms-row .et_pb_column {
  display: flex;
  align-items: center;
  justify-content: center;
}


#bonus-forms-row .bonus-form {
  margin: 0 1%;
}

#bonus-forms-row .bonus-form .gform_heading ,
#bonus-forms-row .bonus-form .gform-body {
    display: none;
}

#bonus-forms-row .bonus-form .gform-footer {
  margin: 0 !important;
  padding: 0 !important;
}

#bonus-forms-row .bonus-form input[type="submit"] {
  font-family: 'Gilroy' !important;
  background-color: var(--gcid-su2a8i3ogp);
  font-weight: 700;
  color: #000000 !important;
  font-size: 18px !important;
  border-radius: 50px;
  padding: 10px 20px !important;
  border: none !important;
}



















body:not(.logged-in) #intro-section ,
body:not(.logged-in) #quiz-section {
  height: var(--window-height);
}


body:not(.logged-in) #intro-section {
  position: fixed;
  width: 100%;
	height: 100%;
  top: 0;
  left: 0;
  z-index: 999;
  transition: opacity .5s ease;
}



body:not(.logged-in).quiz-on #intro-section {
  opacity: 0;
  pointer-events: none;
}



#intro-row {
  display: flex;
  justify-content: center;
  align-items: center;
}

#intro-row .et_pb_column {
  width: clamp(280px, 85vh, 40rem);
}

#start-quiz {
  cursor: pointer;
}



.float {
  --float-dur: 3s;
  animation: float 3s ease-in-out infinite;
}

@keyframes float {
  0% { transform: translateY(0); }
  50% { transform: translateY(-30px); }
  100% { transform: translateY(0); }
}

.float:nth-child(1) { animation-duration: calc(var(--float-dur) * 1); }
.float:nth-child(2) { animation-duration: calc(var(--float-dur) * .8); }
.float:nth-child(3) { animation-duration: calc(var(--float-dur) * 1.2); }




body:not(.logged-in) #audio-row {
  display:none;
}





/* Quiz Form */

#quiz-form .et_pb_code_inner ,
#quiz-form .gform_wrapper ,
#quiz-form form ,
#quiz-form .gform-body ,
#quiz-form .gform_page {
  height: 100% !important;
  width: 100% !important;
}

#quiz-form .gform_heading {
  display: flex;
  justify-content: center;
  margin-bottom: clamp(30px,6vh,80px);
}

#quiz-form .form-logo {
  width: clamp(80px,5rem,124px);
}


#quiz-form .gform_page_fields {
  height: calc(100% - var(--form-footer-height) - var(--form-logo-height));
}

#quiz-form .swiper {
  overflow: visible;
}

#quiz-form .swiper-wrapper {
  transition-property: unset !important;
  transition-timing-function: unset !important;
  transition-duration: 0s !important;
}

#quiz-form .gform_page {
  transform: none !important;
  width: 100% !important;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0 !important;
  pointer-events: none;
  transition-duration: .25s !important;
  transition-delay: .5s;
}

#quiz-form .gform_page.swiper-slide-active {
  opacity: 1 !important;
  pointer-events: all;
}


#quiz-form .gform_page .gfield--type-quiz ,
#quiz-form .gform_page .gform_fields {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  width: 100%;
}


#quiz-form .gfield--type-quiz .gfield_label {
  font-family: 'ScrumptiousSerif', sans-serif !important;
  font-weight: 400;
  font-size: clamp(20px, 1.5rem, 50px);
  line-height: 1.3em;
  color: var(--gcid-wfgk844dbh) !important;
  margin: 0 auto;
  width: 100%;
  text-align: center;
}

#quiz-form .gfield--type-quiz:not(:has(.gfield_description)) .gfield_label {
  margin-bottom: clamp(30px,6vh,80px);
}

#quiz-form .gfield--type-quiz:has(.gfield_description) .gfield_description {
  margin-bottom: clamp(30px,3rem,80px);
}

#quiz-form .gfield--type-quiz .gfield_description {
  font-family: 'ScrumptiousSerif', sans-serif !important;
  font-weight: 400;
  font-size: clamp(16px, 1rem, 30px);
  line-height: 1.3em;
  color: white !important;
  margin: 0 auto;
  width: 100%;
  text-align: center;
}


#quiz-form .gform_page .gfield--type-quiz .ginput_container {
  width: 100%;
}

#quiz-form .flex-cols .gfield_radio {
  display: flex;
  flex-direction: row;
}

#quiz-form .gfield .gchoice:has(.smooth) { --selected-color: #2CB2CC; }
#quiz-form .gfield .gchoice:has(.mind) { --selected-color: #F39C49; }
#quiz-form .gfield .gchoice:has(.sublime) { --selected-color: #d0a96a; }
#quiz-form .gfield .gchoice:has(.enchanting) { --selected-color: #6c2a5b; }
#quiz-form .gfield .gchoice:has(.visionary) { --selected-color: #F7B2C2; }


#quiz-form .pick-image .gfield_radio {

}

#quiz-form .pick-image label {
  width: 80%;
  max-width: 100%;
  position: relative;
}

#quiz-form .pick-image svg {
  position: absolute;
  width: 100%;
  transform: scale(1);
  z-index: -1;
  opacity: 0;
  transition: all .5s ease;
}

/*
#quiz-form .pick-image svg path[fill="#231f20"] {
  fill: rgba(0,0,0,0);
}

#quiz-form .pick-image svg path[fill="#fff"] {
  fill: #2CB2CC;
}
*/

#quiz-form .pick-image path {
  fill: var(--selected-color);
}

#quiz-form .pick-image input:checked + label svg {
  opacity: 1;
  transform: scale(1.1);
}



#quiz-form .gfield_radio .gchoice > input {
  display: none;
}


#quiz-form .flex-cols .gchoice {
  flex: 1;
  display: flex;
  justify-content: center;
  flex-direction: column;
  align-items: center;
}


#quiz-form .gfield:not(.flex-cols) .gchoice {
  margin-bottom: clamp(14px, 4vh, 40px);
  display: flex;
  align-items: flex-start;
}

#quiz-form .gfield .gchoice:last-child {
  margin-bottom: 0 !important;
}


#quiz-form .gfield:not(.flex-cols) .gchoice .gform-field-label {
  font-size: clamp(14px, 3.5vh, 30px);
  font-weight: bold;
  line-height: 1.3em;
  cursor: pointer;
}

#quiz-form .gchoice .power-name {
  display: none;
}

#quiz-form .gfield:not(.flex-cols) .gchoice svg {
  width: clamp(20px, 3rem, 50px);
  margin-right: 20px;
  cursor: pointer;
}


#quiz-form .gfield:not(.flex-cols) input:checked + svg + label {
  color: var(--selected-color);
}

#quiz-form .gfield:not(.flex-cols) input:checked + svg path:nth-child(6) {
  fill: var(--selected-color);
}

/*
#quiz-form .gfield:not(.flex-cols) .gform-field-label:before {
  content: '';
}
*/







#quiz-form .pick-image img {
  -webkit-mask-image: url(/flavorpersonalityquiz/wp-content/uploads/logo-shape-dark.svg);
  mask-image: url(/flavorpersonalityquiz/wp-content/uploads/logo-shape-dark.svg);
  mask-repeat: no-repeat;
  cursor: pointer;
}








.gfield.songs .gchoice {
  padding: 0 1%;
}

.gchoice:has(#song-1) { --player-color: #2CB2CC; }
.gchoice:has(#song-2) { --player-color: #F39C49; }
.gchoice:has(#song-3) { --player-color: #d0a96a; }
.gchoice:has(#song-4) { --player-color: #6c2a5b; }
.gchoice:has(#song-5) { --player-color: #F7B2C2; }


.song-player {
  --player-btn-size: clamp(20px,1.25rem,50px);
  --player-title-height: 50px;
  --player-border-radius: 15px;
   width: 100%;
  border-top-left-radius: calc(var(--player-title-height) * .6);
  border-top-right-radius: calc(var(--player-title-height) * .6);
  border-bottom-left-radius: var(--player-border-radius);
  border-bottom-right-radius: var(--player-border-radius);
  border: 2px solid var(--player-color) !important;
}



.song-player .et_audio_container {
  padding: 0;
}

.song-player .et_pb_module_header {
  background-color: var(--player-color);
  width: 100%;
  height: var(--player-title-height);
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: calc(var(--player-title-height) * .5);
}

.song-player .mejs-audio {
  margin: 10%;
}

.song-player .mejs-controls {
  display: flex;
  flex-wrap: nowrap !important;
  height: var(--player-btn-size) !important;
  justify-content: space-between;
  align-items: center;
}

.song-player .mejs-controls .mejs-playpause-button {
  position: relative;
  height: 100% !important;
  width: var(--player-btn-size) !important;
  margin-top: 0 !important;
}

.song-player .mejs-playpause-button button:before {
  content: '' !important;
  /* background-image: url(/flavorpersonalityquiz/wp-content/uploads/player-play.svg) !important;
  background-size: contain;
  background-repeat: no-repeat; */
  width: var(--player-btn-size);
  height: var(--player-btn-size);
  display: block;
}

.song-player .mejs-playpause-button svg {
  width: var(--player-btn-size);
  height: var(--player-btn-size);
  display: block;
  position: absolute;
  top: 0;
  left: 0;
}

.song-player .mejs-playpause-button svg path {
  fill: var(--player-color);
}

.song-player .mejs-playpause-button.mejs-pause svg {
  opacity: 0;
}

.song-player .mejs-playpause-button.mejs-pause button:before {
  content: '' !important;
  background-image: url(/flavorpersonalityquiz/wp-content/uploads/player-pause.svg) !important;
  background-size: contain;
  background-repeat: no-repeat;
  width: var(--player-btn-size);
  height: var(--player-btn-size);
  display: block;
}


.song-player .mejs-controls .mejs-time-rail {
  width: calc(100% - (var(--player-btn-size) * 2.75));
  margin-left: 0 !important;
  height: 100% !important;
  flex-grow: unset;
}

.song-player .mejs-time-rail:after {
  content: '';
  background-image: url(/flavorpersonalityquiz/wp-content/uploads/player-check.svg);
}

.song-player .mejs-time ,
.song-player .mejs-volume-button ,
.song-player .et_audio_container .mejs-controls a.mejs-horizontal-volume-slider {
  display: none !important;
}


.song-player .et_audio_container .mejs-controls .mejs-time-rail .mejs-time-total {
  background: white;
  border-radius: 0px;
  height: 100%;
  margin: 0;
}

.song-player .et_audio_container .mejs-controls .mejs-time-rail .mejs-time-current {
  background: var(--player-color);
  height: 100%;
  border-radius: 0px;
}

.song-player .mejs-time-handle-content ,
.song-player .et_audio_container .mejs-time-rail .mejs-time-hovered {
  display: none !important;
}





.player-check {
  width: var(--player-btn-size);
  height: var(--player-btn-size);
  cursor: pointer;
}

.player-check:hover path:first-child ,
.songs input[type="radio"]:checked + label + .song-player .player-check path:first-child {
  fill: var(--player-color);
}

.player-check:hover path:last-child ,
.songs input[type="radio"]:checked + label + .song-player .player-check path:last-child {
  fill: white;
}

.songs input[type="radio"]:checked + label {
  color: var(--player-color);
}

.songs label {
  display: none !important;
}

















#quiz-form .inner-soul .gfield_radio {
  
}

#quiz-form .inner-soul .gfield_radio svg {
  width: 100%;
  cursor: pointer;
}

#quiz-form .inner-soul .gfield_radio svg path[stroke] {
  opacity: 0;
  stroke-width: 0;
  transition: all 1s var(--easeInOutExpo);
}

#quiz-form .inner-soul .gfield_radio input:checked + label svg path[stroke] {
  opacity: 1;
  stroke-width: 7%;
}








#quiz-form .gform-page-footer {
  display: flex;
  align-items: center;
  justify-content: center;
  --button-size: clamp(20px, 4vh, 50px);
  margin: 0;
  padding: 0;
  height: clamp(40px, 10vh, 100px);
  padding-bottom: 5vh;
}

#quiz-form .gform-page-footer input[type="button"] {
  
  background-image: url(/flavorpersonalityquiz/wp-content/uploads/step-arrow.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  background-color: rgba(0, 0, 0, 0);
  border: none;
  color: rgba(0, 0, 0, 0);
  width: var(--button-size);
  height: var(--button-size);
  margin: 0 !important;
  cursor: pointer;
}

#quiz-form .gform-page-footer input[type="button"].gform_next_button {
  transform: rotate(180deg);
}

#quiz-form .foot-counter {
  color: var(--gcid-wfgk844dbh);
  font-size: calc(var(--button-size) * .65);
  font-weight: bold;
  margin: 0 15px;
}

#quiz-form .gform-page-footer input[type="submit"] {
  font-family: 'ScrumptiousSerif', sans-serif !important;
  font-weight: 400;
  font-size: clamp(16px, 1rem, 30px);
  line-height: 1em;
  border-radius: 100px;
  color: #231f20;
  background-color: var(--gcid-wfgk844dbh) !important;
  margin: 0;
  text-align: center;
  padding: 8px 10px;
  border: none;
  cursor: pointer;
  transition: all .5s ease;
  display: none;
}

#quiz-form .gform-page-footer input[type="submit"]:hover {
  color: white !important;
  background-color: #00beda !important;
}





#quiz-form .gfield_label .gfield_required {
  display: none;
}

#quiz-form .gform_wrapper.gravity-theme .gfield_validation_message ,
#quiz-form .gform_wrapper.gravity-theme .validation_message {
  background: #f22248;
  border: none;
  border-radius: 100px;
  padding: 5px !important;
  margin-top: 10px !important;
  margin-bottom: 0 !important;
}

#quiz-form .gform_wrapper.gravity-theme .gfield_error .gfield_repeater_cell label,
#quiz-form .gform_wrapper.gravity-theme .gfield_error label,
#quiz-form .gform_wrapper.gravity-theme .gfield_error legend,
#quiz-form .gform_wrapper.gravity-theme .gfield_validation_message,
#quiz-form .gform_wrapper.gravity-theme .validation_message,
#quiz-form .gform_wrapper.gravity-theme [aria-invalid=true]+label,
#quiz-form .gform_wrapper.gravity-theme label+[aria-invalid=true] {
  color: inherit !important;
}








body:not(.logged-in) #calculating-row {
  display: none;
  pointer-events: none;
}

body:not(.logged-in) .gform_confirmation_wrapper #calculating-row {
  display: flex;
  position: fixed;
  top: 0;
  left: 0;
	right:0;
  z-index: 5;
  width: 100vw;
  height: var(--window-height);
  opacity: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: opacity .5s ease;
}

body:not(.logged-in) .gform_confirmation_wrapper.calculating #calculating-row {
  opacity: 1;
}




#calculating-text h2 {
  font-size: clamp(22px, 10vh, 80px);
  line-height: 1.2em;
  display: inline-block;
  position: relative;
  --ani-delay: .15s;
}

#calculating-text h2 span {
  animation: calc-lettering-ani .2s ease forwards;
  animation-play-state: paused;
}

#calculating-text h2 span:nth-child(1) { animation-delay: calc(var(--ani-delay) * 0); }
#calculating-text h2 span:nth-child(2) { animation-delay: calc(var(--ani-delay) * 1); }
#calculating-text h2 span:nth-child(3) { animation-delay: calc(var(--ani-delay) * 2); }
#calculating-text h2 span:nth-child(4) { animation-delay: calc(var(--ani-delay) * 3); }
#calculating-text h2 span:nth-child(5) { animation-delay: calc(var(--ani-delay) * 4); }
#calculating-text h2 span:nth-child(6) { animation-delay: calc(var(--ani-delay) * 5); }
#calculating-text h2 span:nth-child(7) { animation-delay: calc(var(--ani-delay) * 6); }
#calculating-text h2 span:nth-child(8) { animation-delay: calc(var(--ani-delay) * 7); }
#calculating-text h2 span:nth-child(9) { animation-delay: calc(var(--ani-delay) * 8); }
#calculating-text h2 span:nth-child(10) { animation-delay: calc(var(--ani-delay) * 9); }
#calculating-text h2 span:nth-child(11) { animation-delay: calc(var(--ani-delay) * 10); }
#calculating-text h2 span:nth-child(12) { animation-delay: calc(var(--ani-delay) * 11); }
#calculating-text h2 span:nth-child(13) { animation-delay: calc(var(--ani-delay) * 12); }
#calculating-text h2 span:nth-child(14) { animation-delay: calc(var(--ani-delay) * 13); }
#calculating-text h2 span:nth-child(15) { animation-delay: calc(var(--ani-delay) * 14); }
#calculating-text h2 span:nth-child(16) { animation-delay: calc(var(--ani-delay) * 15); }
#calculating-text h2 span:nth-child(17) { animation-delay: calc(var(--ani-delay) * 16); }
#calculating-text h2 span:nth-child(18) { animation-delay: calc(var(--ani-delay) * 17); }
#calculating-text h2 span:nth-child(19) { animation-delay: calc(var(--ani-delay) * 18); }
#calculating-text h2 span:nth-child(20) { animation-delay: calc(var(--ani-delay) * 19); }
#calculating-text h2 span:nth-child(21) { animation-delay: calc(var(--ani-delay) * 20); }
#calculating-text h2 span:nth-child(22) { animation-delay: calc(var(--ani-delay) * 21); }
#calculating-text h2 span:nth-child(23) { animation-delay: calc(var(--ani-delay) * 22); }
#calculating-text h2 span:nth-child(24) { animation-delay: calc(var(--ani-delay) * 23); }


.gform_confirmation_wrapper.calculating #calculating-text h2 span {
  animation-play-state: running;
}





@keyframes calc-lettering-ani {

  0% {  }
  100% { color: var(--gcid-wfgk844dbh)!important;  }

}


#calc-bar-img {
  width: clamp(100px, 15vh, 200px);
}






body:not(.logged-in) #result-section {
  display: none;
}


body:not(.logged-in) .gform_confirmation_wrapper #result-video {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: var(--window-height);
  z-index: 1;
  pointer-events: none;
  opacity: 0;
  transition: opacity .5s ease;
}

body:not(.logged-in) .gform_confirmation_wrapper.result-on #result-video {
  opacity: 1;
}


.gform_confirmation_wrapper.result-on #result-video video {
  height: 100vh !important;
  object-fit: cover;
}

#fpo-title {

}

body:not(.logged-in) #unmute-button {
  display: none !important;
}

@media (hover:none) {

  body:not(.logged-in) #unmute-button.on {
    display: inline-block !important;
    position: absolute;
    z-index: 999;
    top: 30px;
    left: 30px;
    cursor: pointer;
  }

}








body:not(.logged-in) #share-section {
  display: none;
}



body:not(.logged-in) .gform_confirmation_wrapper.share-on #share-section {
  display: flex;
  justify-content: center;
  align-items: center;
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: 99;
}




.smooth {
  --share-text-color-1: #231f20;
  --share-text-color-bold: #2d7a86;
  --share-text-color-2: #231f20;
  --retake-btn-txt-color: #ffffff;
  --logo-color: #2d7a86;
  --share-bg-image: url(/flavorpersonalityquiz/wp-content/uploads/smooth-share-bg-circ.jpg);
}

.mind {
  --share-text-color-1: #231f20;
  --share-text-color-bold: #ffffff;
  --share-text-color-2: #231f20;
  --retake-btn-txt-color: #231f20;
  --logo-color: #ffffff;
  --share-bg-image: url(/flavorpersonalityquiz/wp-content/uploads/mind-share-bg-circ.jpg);
}

.sublime {
  --share-text-color-1: #231f20;
  --share-text-color-bold: #e8caa2;
  --share-text-color-2: #ffffff;
  --retake-btn-txt-color: #231f20;
  --logo-color: #ffffff;
  --share-bg-image: url(/flavorpersonalityquiz/wp-content/uploads/sublime-share-bg-circ.jpg);
}

.enchanting {
  --share-text-color-1: #ffffff;
  --share-text-color-bold: #e8caa2;
  --share-text-color-2: #ffffff;
  --retake-btn-txt-color: #231f20;
  --logo-color: #ffffff;
  --share-bg-image: url(/flavorpersonalityquiz/wp-content/uploads/enchanting-share-bg-circ.jpg);
}

.visionary {
  --share-text-color-1: #231f20;
  --share-text-color-bold: #f22248;
  --share-text-color-2: #231f20;
  --retake-btn-txt-color: #ffffff;
  --logo-color: #231f20;
  --share-bg-image: url(/flavorpersonalityquiz/wp-content/uploads/visionary-share-bg-circ.jpg);
}

#share-section .et-pb-parallax-background--css {
  opacity: 1 !important;
  mix-blend-mode: unset !important;
  background-attachment: scroll;
  background-position: center;
  background-image: var(--share-bg-image) !important;
}

#share-parent-row {
  width: 40rem !important;
  max-width: 100vh;
  min-width: 57vw;
}

#share-text-1 * {
  color: var(--share-text-color-1) !important;
}

#share-text-1 strong {
  color: var(--share-text-color-bold) !important;
}

#share-text-2 * {
  color: var(--share-text-color-2) !important;
}

#share-text-2 strong {
  color: var(--share-text-color-bold) !important;
}

#divider:before {
  top: 50% !important;
  border-top-color: var(--share-text-color-2) !important;
}

body #page-container .et_pb_section #retake-quiz ,
body #page-container .et_pb_section #retake-quiz:hover {
  color: var(--retake-btn-txt-color) !important;
  background-color: var(--share-text-color-bold) !important;
}

#instruction-row .et_pb_text {
  padding-left: 1rem;
  padding-right: 3rem;
}

#instruction-row .et_pb_text:first-child {
  padding-right: 1rem !important;
}

#instruction-row .et_pb_text:before {
  content: '';
  color: var(--share-text-color-2) !important;
  position: absolute;
  top: 0;
  left: 0;
}

#instruction-row .et_pb_text:nth-child(1):before { content: '1.'; }
#instruction-row .et_pb_text:nth-child(2):before { content: '2.'; }
#instruction-row .et_pb_text:nth-child(3):before { content: '3.'; }

#instruction-row .et_pb_text_inner * ,
#share-text-3 .et_pb_text_inner * ,
#share-text-4 .et_pb_text_inner * {
  color: var(--share-text-color-2) !important;
}

#instruction-row .et_pb_text_inner a {
  color: var(--share-text-color-1) !important;
  white-space: nowrap;
}

#lollapalooza-logo svg path {  fill: var(--logo-color) !important; }

#share-icon svg *:not(circle) {  fill: var(--share-text-color) !important; }

.sublime #share-icon svg *:not(circle) { fill: #6b72b8 !important; }
.enchanting #share-icon svg *:not(circle) { fill: #511642 !important; }

.share-icon {

}



body:not(.logged-in) #thankyou-section {
  display: none;
  pointer-events: none;
}

body:not(.logged-in) .gform_confirmation_wrapper.thanks-on #thankyou-section {
  display: flex;
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: 999;
  background-color: #e8caa2 !important;
  pointer-events: all;
}

body:not(.logged-in) #thankyou-section .et-pb-parallax-background--css {
  background-size: 130% 100% !important;
  opacity: 1 !important;
  mix-blend-mode: unset !important;
  background-attachment: scroll;
  background-position: center;
}











@media (max-width:980px) {

  body:not(.logged-in) #intro-section ,
  body:not(.logged-in) #quiz-section {
    height: var(--window-height);
    padding: 3vh 0;
  }

  #intro-section .et-pb-parallax-background--css {
    background-size: 130% 100% !important;
  }

  #intro-section #cake {
    left: 3vw;
    top: -10vw;
  }

  #intro-section #smore {
    width: clamp(50px, 45vw, 22vh) !important;
    bottom: -30vw;
    right: 0rem;
  }

  #intro-section #drops {
    left: 20vw;
    top: -15vw;
  }

  #intro-section #intro-logo {
    top: -25vw;
    width: 25vw;
    margin-bottom: -15vw !important;
  }

  :root {
    --gvid-eihhgyayjy: clamp(16px, 5vw, 36px) !important;
  }

  #intro-section .intro-text-white ,
  #intro-section .intro-h1 {
    margin-bottom: 20px !important;
  }

  #intro-section .intro-text-white {
    width: 70%;
  }

  #intro-section .intro-h1 {
    width: 70%;
  }

  #intro-section .intro-h1 h1 {
    line-height: 1.3em;
  }

  #quiz-section > .et_pb_row {
    width: 85% !important;
  }

  #quiz-form .form-logo {
    width: clamp(60px, 12vh, 124px);
  }

  #quiz-form .gform_heading {
    margin-bottom: clamp(20px, 3vh, 60px) !important;
  }

  #quiz-form .flex-cols .gfield_radio {
    flex-direction: column;
  }

  #quiz-form .flex-cols .gchoice {
    margin-bottom: 4vh;
  }

  #quiz-form .gfield:not(.flex-cols) .gchoice {
    margin-bottom: clamp(14px, 2vh, 40px);
  }

  #quiz-form .gfield--type-quiz .gfield_label {
    font-size: clamp(16px, 2.75vh, 50px) !important;
  }

  #quiz-form .gfield--type-quiz:has(.gfield_description) .gfield_description {
    margin-bottom: clamp(20px, 3vh, 80px);
    padding: 0;
  }

  #quiz-form .gfield--type-quiz:not(:has(.gfield_description)) .gfield_label {
    margin-bottom: clamp(20px, 3vh, 80px) !important;
  }

  #quiz-form .gfield:not(.flex-cols) .gchoice .gform-field-label {
    font-size: clamp(14px, 2.25vh, 30px);
    width: 100%;
    max-width: 100%;
  }
  
  #quiz-form .gfield:not(.flex-cols) .letter-svg {
    width: 50px !important;
    margin-top: 0px;
  }

  #quiz-form .song-player {
    --player-title-height: 7vh;
    --player-border-radius: 50px;
    border-top-left-radius: var(--player-border-radius);
    border-top-right-radius: var(--player-border-radius);
    border-bottom-left-radius: var(--player-border-radius);
    border-bottom-right-radius: var(--player-border-radius);
  }

  #quiz-form .song-player .et_audio_container {
    padding: 0 !important;
    display: flex;
  }

  .song-player .et_pb_module_header {
    width: 50px;
    border-radius: 100px 0px 0px 100px;
    font-size: 25px;
    padding-left: 7px;
    margin-left: -1px;
  }

  #quiz-form .song-player .mejs-audio {
    margin: 0;
    width: calc(100% - 50px) !important;
    height: var(--player-title-height) !important;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  #quiz-form .song-player .mejs-inner {
    width: 90%;
  }

  #quiz-form .pick-image .gfield_radio {
    display: flex;
    flex-wrap: wrap;
    flex-direction: unset;
    justify-content: center;
  }

  #quiz-form .pick-image .gchoice {
    width: 42%;
    flex: unset;
    margin-bottom: 3vh;
  }

  #quiz-form .inner-soul.flex-cols .gchoice {
    margin-bottom: 0;
    width: 40%;
    margin: 0 auto;
  }

  #quiz-form .gform-page-footer input[type="button"] {
    width: calc(var(--button-size) * .6);
    height: calc(var(--button-size) * .6);
  }

  #quiz-form .gform-page-footer {
    height: clamp(30px, 8vh, 100px);
    padding-bottom: 0;
  }

  #calculating-text h2 {
    font-size: 6vh !important;
  }

  .smooth {
    --share-mob-bg: #f6d79e;
    --share-mob-logo-color: #231f20;
    --share-bg-image: url(/flavorpersonalityquiz/wp-content/uploads/smooth-share-bg-mobile.jpg);
  }

  .mind {
    --share-mob-bg: #ffa357;
    --share-mob-logo-color: #ffffff;
    --share-bg-image: url(/flavorpersonalityquiz/wp-content/uploads/mind-share-bg-mobile.jpg);
  }

  .sublime {
    --share-mob-bg: #6d73bf;
    --share-mob-logo-color: #231f20;
    --share-bg-image: url(/flavorpersonalityquiz/wp-content/uploads/sublime-share-bg-mobile.jpg);
  }

  .enchanting {
    --share-mob-bg: #6c2a5b;
    --share-mob-logo-color: #ffffff
    --share-bg-image: url(/flavorpersonalityquiz/wp-content/uploads/enchanting-share-bg-mobile.jpg);
  }

  .visionary {
    --share-mob-bg: #ffed9f;
    --share-mob-logo-color: #231f20;
    --share-bg-image: url(/flavorpersonalityquiz/wp-content/uploads/visionary-share-bg-mobile.jpg);
  }


  #share-parent-row {
    width: 95% !important;
    padding: 5% !important;
    margin-top: -10%;
  }

  #share-parent-row:before {
    content:'';
    position: absolute;
    top:0;
    right:0;
    bottom:0;
    left: 0;
    border-radius: 20px;
    overflow: hidden;
    background-color: var(--share-mob-bg);
    opacity: .9;
  }

  .thanks-on #share-parent-row:before {
    display: none;
  }

  #share-sd-logo {
    width: 18vw;
    margin-bottom: 5vw !important;
    margin-top: -11vw;
  }

  #share-text-1 {
    width: 100%;
    font-size: 4vw;
    line-height: 1.2em;
  }

  #share-text-2 {
    width: 100%;
    font-size: 4vw;
    line-height: 1.2em;
  }

  #share-text-4 {
    font-size: 5vw;
    line-height: 1.2em;
  }

  #instruction-row {
    margin-bottom: 3vh;
  }

  #instruction-row .et_pb_text {
    width: 100% !important;
    padding-right: 0;
    text-align: center;
    margin-bottom: 5vw;
  }

  #instruction-row .et_pb_text_inner * {
    font-size: 4vw;
    line-height: 1.2em;
  }

  #instruction-row .et_pb_text:before {
    display: none !important;
  }

  #instruction-row .et_pb_text .et_pb_text_inner p:before {
    color: var(--share-text-color-2) !important;
  }
  
  #instruction-row .et_pb_text:nth-child(1) .et_pb_text_inner p:before { content: '1. '; }
  #instruction-row .et_pb_text:nth-child(2) .et_pb_text_inner p:before { content: '2. '; }
  #instruction-row .et_pb_text:nth-child(3) .et_pb_text_inner p:before { content: '3. '; }

  #lollapalooza-logo {
    display: none !important;
  }

  #lollapalooza-logo-mobile {
    width: 80%;
    margin: 0 auto;
  }

  #lollapalooza-logo-mobile svg {
    width: 100%;
  }
  #lollapalooza-logo-mobile svg path {
    fill: var(--share-mob-logo-color) !important;
  }

  #share-icon-row {
    margin-bottom: 0;
  }

  .share-icon {
    margin-bottom: 2vh !important;
  }

  .share-icon:not(#download-icon) svg {
    overflow: visible;
  }

  .enchanting .share-icon:not(#download-icon) svg path {
    fill: white;
  }

  body:not(.logged-in) #thankyou-section .et-pb-parallax-background--css {
    background-size: 160% 100% !important;
  }

  

}