body.page-id-34005 #content .container,
body.page-id-34005 .site-content { max-width: 100%; padding-left: 0 !important; padding-right: 0 !important; }

/* QUESTIONS */
#the-survey { width: 100%; }
#lover-archetype { margin-bottom: 30px !important; }
#lover-archetype #survey_steps { font-size: 14px; background-color: #000; color: #fff; display: inline-block; padding: 4px 15px; }
#lover-archetype .acf-field.acf-field-radio { border: 0; padding: 0 0 30px 0; max-width: 90vw; overflow-x: auto; }
#lover-archetype .acf-field.acf-field-radio .acf-input { border-left: 1px dashed var(--bb-primary-color); border-right: 1px dashed var(--bb-primary-color); padding: 20px 25px 0; min-width: 700px; }
#lover-archetype .acf-label label { display: block; text-align: center; font-size: 40px; font-weight: 100; padding: 40px 0 60px; line-height: 1; font-family: "century-gothic", sans-serif !important; }
#lover-archetype .acf-required { display: none; }
#lover-archetype .indicator { display: flex; justify-content: space-between; text-transform: uppercase; color: var(--bb-primary-color); font-family: "eurostile", sans-serif!important; }


#lover-archetype ul.acf-radio-list { display: flex; justify-content: space-between; column-gap: 20px; padding-top: 15px; margin: 0 !important; }
#lover-archetype ul.acf-radio-list::before, 
#lover-archetype ul.acf-radio-list::after { content: none; }
#lover-archetype ul.acf-radio-list li { margin: unset; flex: 1 1 70px; list-style-type: none !important; }
#lover-archetype ul.acf-radio-list li label { display: block; width: 100%; border: 1px solid currentcolor; -webkit-transition: 0.25s all ease-in-out; -moz-transition: 0.25s all ease-in-out; -o-transition: 0.25s all ease-in-out; transition: 0.25s all ease-in-out; background: transparent; line-height: 1; font-weight: 500; font-size: 1.3rem; padding: 15px; margin-left: 0 !important; text-align: center; cursor: pointer; }
#lover-archetype ul.acf-radio-list li label:hover,
#lover-archetype ul.acf-radio-list li label.selected { background-color: var(--bb-primary-color); color: #fff; }
#lover-archetype ul.acf-radio-list li label input[type="radio"] { position: absolute; top: -9999px; left: -9999px; visibility: hidden; opacity: 0; }
#survey_paging { width: 100%; display: flex; justify-content: space-between; }

/* Hide prev button on Q1S1 and next button on last question */
#lover-archetype .acf-field[data-name="Q_1_S_1"].active ~ #survey_paging .previous-btn,
#lover-archetype.all-done #survey_paging .next-btn { pointer-events: none; opacity: 0 !important; }

/* Hide next button until selection */
#lover-archetype .acf-field.active ~ #survey_paging .next-btn { pointer-events: none; opacity: 0.2; }
#lover-archetype .acf-field.active.has-selection ~ #survey_paging .next-btn { pointer-events: auto; opacity: 1; }

/* Making it stepped  */
#lover-archetype .acf-field { display: none; }
#lover-archetype .acf-field.active { display: block; }

/* Results */
/* label.et_pb_button { display: inline-block; } */

#lover-archetype-results { display: flex; align-items: center; justify-content: space-between; margin: 10% auto !important; gap: 30px; padding: 0 10px; }
#lover-archetype-results h3,
#lover-archetype-results h4 { font-family: 'eurostile', sans-serif !important; }
#lover-archetype-results h1,
#lover-archetype-results h3 { color: var(--bb-primary-color) !important; }
#lover-archetype-results h4 label { color: var(--bb-primary-color) !important; font-size: 0.8em; text-transform: uppercase; font-weight: normal; text-decoration: underline; cursor: pointer; }

#lover-archetype-survey #send_results { margin: 30px auto; padding: 30px; border: 1px solid var(--bb-primary-color); background: #111; color: #fff; font-weight: 600; }

#lover-archetype-video { flex: 1 1 60%; }
#lover-archetype-contents { flex: 1 1 40%; }
#lover-archetype-contents hr { margin: 10px auto !important; background-color: var(--bb-primary-color) !important; }

/* #lover-archetype-survey .lover-archetype-contents h2 { border-bottom: 1px solid var(--bb-primary-color); padding: 0.5em 0; margin: 0 0 0.5em 0; white-space: nowrap; } */

#lover-archetype-survey #report-header { background-color: #C79560 !important; margin-bottom: 0; }
#lover-archetype-survey #report-header h2 { padding: 0; color: #fff !important; }

.modal-toggle { position: absolute; top: -9999px; left: -9999px; visibility: hidden; opacity: 0; }
.modal-window { position: fixed; background-color: #111 !important; top: 0; right: 0; bottom: 0; left: 0; z-index: 10012; visibility: hidden; opacity: 0; pointer-events: none; transition: all 0.3s; padding-top: var(--bb-header-height) !important; width: 100vw; height: 100vh; overflow: auto; display: flex; flex-direction: column; }
[type="checkbox"]:checked + .modal-window { visibility: visible; opacity: 1; pointer-events: auto; }
.modal-window p,
.modal-window li { font-size: 1.2em; }
.modal-window hr { width: 100vw; height: 60px; background-color: #111 !important; border: 0; margin: 27px 0; position: relative; left: 50%; transform: translateX(-50%); }
.modal-window > div { max-width: 96%; margin: auto !important; } 
.modal-window > div .et_pb_row { padding: 27px !important; background: #000 !important; /* margin: 50px auto; */ margin: 0 auto; width: 100% !important; max-width: 1280px !important; }
.modal-window > div .et_pb_row:first-child { margin-top: 10% !important; }
.modal-window > div .et_pb_row:last-child { margin-bottom: 10% !important; }
.modal-window > div .et_pb_column { max-width: 100% !important; }
/* .modal-close { color: #fff; line-height: 50px; font-size: 80%; position: absolute; right: 4em; top: 2em; text-decoration: none; z-index: 4; } */

#your-chakras-graph { display: flex; flex-wrap: nowrap; align-items: flex-end; justify-content: space-between; gap: 10px; width: 100%; height: 240px; background: #000; margin: 20px 0 !important; overflow-x: auto; -ms-overflow-style: none; scrollbar-width: none; }
#your-chakras-graph::-webkit-scrollbar { display: none; }
#your-chakras-graph div { width: 7%; min-width: 65px; height: 100%; text-align: center; display: flex; flex-direction: column; justify-content: flex-end; color: #fff; }
#your-chakras-graph div p { color: currentColor; font-size: 13px; white-space: nowrap; margin: 0 10px; }
#your-chakras-graph #chakra_key { border-left: 1px dashed #fff; justify-content: space-between; }
#your-chakras-graph #chakra_1 { background: #d23a22; position: relative; }
#your-chakras-graph #chakra_2 { background: #b86026; position: relative; }
#your-chakras-graph #chakra_3 { background: #c2b93e; position: relative; }
#your-chakras-graph #chakra_4 { background: #357621; position: relative; }
#your-chakras-graph #chakra_5 { background: #3b82d8; position: relative; }
#your-chakras-graph #chakra_6 { background: #4c1f8d; position: relative; }
#your-chakras-graph #chakra_7 { background: #ffffff; position: relative; color: #000; }
#your-chakras-graph #chakra_8 { background: #5f6060; position: relative; }
#your-chakras-graph #chakra_9 { background: #dbbc77; position: relative; }
#your-chakras-graph #chakra_10 { background: #878529; position: relative; }
#your-chakras-graph #chakra_11 { background: #e78bcc; position: relative; }

#lover-archetype-results #aura-container { width: 70%; max-width: 255px; margin: 100px auto; }
#lover-archetype-results #aura-container::after { content: ''; display: block; border: 2px solid var(--bb-primary-color); width: 100%; height: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); }
#lover-archetype-results #auras { position: relative; padding: 0; z-index: 1; text-align: center; width: 80%; height: 0; padding-bottom: 100% !important; margin: 0 auto; }
#lover-archetype-results #auras .auroracolor { position: absolute; width: 100%; top: 0; left: 0; padding-top: 100%; mix-blend-mode: overlay; filter: blur(25px); line-height: 0; opacity: .6; border-radius: 999px;}
#lover-archetype-results #auras .auroracolor:nth-child(1) { top: -25%; z-index: 11; left: -25%; }
#lover-archetype-results #auras .auroracolor:nth-child(2) { top: -25%; z-index: 10; left: -8%; }
#lover-archetype-results #auras .auroracolor:nth-child(3) { top: -8%; z-index: 9; left: -8%; }
#lover-archetype-results #auras .auroracolor:nth-child(4) { top: -38%; z-index: 8; left: -15%; }
#lover-archetype-results #auras .auroracolor:nth-child(5) { top: 38%; z-index: 7; left: -15%; }
#lover-archetype-results #auras .auroracolor:nth-child(6) { top: 8%; z-index: 6; left: -8%; }
#lover-archetype-results #auras .auroracolor:nth-child(7) { top: 15%; z-index: 5; left: -28%; }
#lover-archetype-results #auras .auroracolor:nth-child(8) { z-index: 4; top: 15%; left: -00px; }
#lover-archetype-results #auras .auroracolor:nth-child(9) { top: 15%; z-index: 3; left: 38%; }
#lover-archetype-results #auras .auroracolor:nth-child(10) { top: -15%; left: 18%; z-index: 2; }
#lover-archetype-results #auras .auroracolor:nth-child(11) { top: 15%; left: 15%; z-index: 1; }


/* TABLET */
@media (max-width: 960px) {
	#lover-archetype-results { flex-direction: column; }
	#lover-archetype-video { width: 100%; }
}

/* MOBILE */
@media (max-width: 768px) {
	/* body:not(.et-tb) #main-content .container#lover-archetype-survey { padding-top: 2rem; padding-bottom: 2rem; } */
	/* #lover-archetype-survey h1 { font-size: 1.5rem; margin-bottom: 2rem; } */
	
	/* #lover-archetype .acf-label { padding: 0 5vw; } */
	/* #lover-archetype .acf-field.acf-field-radio .acf-input { margin: 0 5vw; } */
	#lover-archetype .acf-field.acf-field-radio { width: 100vw; max-width: 100vw; margin: 0 -5vw; }
	#lover-archetype #survey_paging { margin: 0 0 16px; }
	#lover-archetype ul.acf-radio-list li label { font-size: 20px; padding: 7px; min-width: 30px; }
	#lover-archetype #survey_paging .et_pb_button { font-size: 10px; }
	#lover-archetype .acf-field.acf-field-radio .acf-input { overflow: auto; margin: 0 5vw; }
	#lover-archetype .acf-label { position: sticky; left: 0; }
	#lover-archetype .acf-label label { padding: 16px 5vw; font-size: 20px; }
	#lover-archetype-results h1 { font-size: 30px; }
	#lover-archetype-results h2 { font-size: 1.5rem; }
	#lover-archetype-results h3 { font-size: 1.3rem; }
	#lover-archetype-results h4 { font-size: 20px; }
	#lover-archetype-results h5 { font-size: 36px; }
	
	#lover-archetype-survey #report-header h2 { font-size: 30px; }
	
	.modal-window > div .et_pb_row { padding: 10px !important; }
}

/* Lap 'n Up */
@media (min-width: 961px) {
	.sticky-column { position: sticky; top: 27px; left: 0; }
}