/*//////////////////*/
/*///// GLOBAL /////*/
/*//////////////////*/
html,
body {
    font-family: 'Open Sans', sans-serif;
    background-color: rgba(var(--background), 1);
    font-size: 16px;
}

.v-application, .v-application .v-application__wrap {background-color: rgba(var(--background), 1);}
* {font-family: 'Open Sans', sans-serif !important;}

/*///// SPACING /////*/
.mw-global {max-width: 1650px; margin: 0 auto;}
.mw-global-large {max-width: 1875px; margin: 0 auto;}
.maxW-800 {max-width: 800px; margin: 0 auto;}
.minW-180 {min-width: 180px;}
.minW-160 {min-width: 160px;}
.minW-150 {min-width: 150px;}
.minW-140 {min-width: 140px;}
.px-global {padding-left: 3rem; padding-right: 3rem;}
.py-global {padding-top: 4rem; padding-bottom: 4rem;}
.py-global-large {padding-top: 8rem; padding-bottom: 8rem;}
.py-global.py-pb-6rem {padding-bottom: 6rem;}
.py-global.py-pb-9rem {padding-bottom: 9rem;}
@media (max-width: 1450px) {.px-global {padding-left: 2.5rem; padding-right: 2.5rem;}}
@media (max-width: 950px) {
    .px-global {padding-left: 2rem; padding-right: 2rem;}
    .py-global-large {padding-top: 6rem; padding-bottom: 6rem;}
}
@media (max-width: 500px) {.px-global {padding-left: 1.5rem; padding-right: 1.5rem;}}

/*///// TRANSITIONS /////*/
.TSE {
    -webkit-transition: all 250ms ease-out;
    -moz-transition: all 250ms ease-out;
    -ms-transition: all 250ms ease-out;
    -o-transition: all 250ms ease-out;
    transition: all 250ms ease-out;
}

.TSE-long {
    -webkit-transition: all 500ms ease-out;
    -moz-transition: all 500ms ease-out;
    -ms-transition: all 500ms ease-out;
    -o-transition: all 500ms ease-out;
    transition: all 500ms ease-out;
}

/*///// HEADINGS /////*/
h1, h2, h3, h4, h5, h6 {
    font-family: 'Open Sans', sans-serif;
    font-weight: 700;
    color: rgba(var(--primary), 1);
}

h1.dark, h2.dark, h3.dark, h4.dark, h5.dark, h6.dark {
    color: rgba(var(--text), 1);
}

h1 {font-size: 2.7rem;}
h2 {font-size: 2.3rem;}
h3 {font-size: 1.8rem;}
h4 {font-size: 1.5rem;}
h5 {font-size: 1.3rem;}
h6 {font-size: 1.2rem;}

p {
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.8;
    font-family: 'Open Sans', sans-serif;
    color: rgba(var(--text), 1);
}

.error-page-super-font {font-size: 12rem; font-weight: 700; display: block; text-align: right; color: rgba(var(--white), 1);}
@media (max-width: 950px){  .error-page-super-font {font-size: 10rem; text-align: center;}  }

h1.text-shadow,
h2.text-shadow,
h3.text-shadow,
h4.text-shadow,
h5.text-shadow,
h6.text-shadow,
p.text-shadow {
    text-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
}

.text-color--spot1 {color: rgba(var(--spot1), 1);}
.text-color--spot2 {color: rgba(var(--spot2), 1);}
.text-color--spot3 {color: rgba(var(--spot3), 1);}
.text-color--spot4 {color: rgba(var(--spot4), 1);}
.text-color--spot5 {color: rgba(var(--spot5), 1);}
.text-color--spot6 {color: rgba(var(--spot6), 1);}
.text-color--primary {color: rgba(var(--primary), 1);}
.text-color--secondary {color: rgba(var(--secondary), 1);}
.text-color--text {color: rgba(var(--text), 1);}
.text-color--textLight {color: rgba(var(--textLight), 1);}
.text-color--textExtraLight {color: rgba(var(--textExtraLight), 1);}

p > a {color: rgba(var(--spot1), 1); position: relative;}
p > a::before {
    content: "";
    position: absolute;
    top: 100%;
    left: 0;
    width: 30%;
    height: 1px;
    background-color: rgba(var(--spot1), 1);
    opacity: 0;
    -webkit-transition: all 250ms ease-out;
    -moz-transition: all 250ms ease-out;
    -ms-transition: all 250ms ease-out;
    -o-transition: all 250ms ease-out;
    transition: all 250ms ease-out;
}

p > a:hover::before {width: 100%; opacity: 0.8;}
p > a.text-color--text::before {background-color: rgba(var(--text), 1)}

@media (max-width: 950px){
    h1 {font-size: 2rem;}
    h2 {font-size: 1.8rem;}
    h3 {font-size: 1.6rem;}
    h4 {font-size: 1.3rem;}
    h5 {font-size: 1.2rem;}
    h6 {font-size: 1.1rem;}
}

@media (max-width: 500px){
    h1 {font-size: 1.8rem;}
    h2 {font-size: 1.6rem;}
    h3 {font-size: 1.4rem;}
    h4 {font-size: 1.2rem;}
    h5 {font-size: 1.1rem;}
    h6 {font-size: 1rem;}
}

/*///// PREVENT HIGHLIGHTING /////*/
.prevent-highlighting {
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}

/*///// BUTTONS /////*/
.v-btn {letter-spacing: normal;}
.btnHold {display: flex; flex-flow: row wrap; align-items: center; justify-content: start;}
.btnHold > * {margin-right: 2rem;}
.btnHold > *:nth-last-child(1) {margin-right: 0;}
.btnHold.gap-small > * {margin-right: 1rem;}
.btnHold.gap-small > *:nth-last-child(1) {margin-right: 0;}

.btnHold.center {justify-content: center;}
.btnHold.center > * {margin: 0 1rem 1rem 1rem;}
.btnHold.center > *:nth-last-child(1) {margin-right: inherit;}

@media (max-width: 600px) {
    .btnHold > * {margin-right: 1rem;}
    .btnHold > *:nth-last-child(1) {margin-right: 0;}
}

/*///// RADIUS /////*/
.radius-15 {border-radius: 15px !important;}

/*///// CUSTOM LIST /////*/
h5.check-list-title {
    font-size: 1.1rem;
    font-weight: 600;
    color: rgba(var(--text), 1);
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: start;
    margin-bottom: 1rem;
}

h5.check-list-title img {width: 21px; margin-right: 0.5rem;}
ul.check-list {
    display: block;
    margin: 0;
    padding: 0;
    list-style: none;
}

ul.check-list li {
    padding-left: 29px;
    position: relative;
    list-style: none;
    margin-bottom: 1rem;
    font-size: 1rem;
    color: rgba(var(--text), 1);
}

ul.check-list li:nth-last-child(1) {margin-bottom: 0;}
ul.check-list li::before {
    content: "";
    position: absolute;
    top: 5px;
    left: 0;
    width: 19px;
    height: 15px;
    background-image: url('../images/check-small-orange.png');
    background-size: 100%;
    background-repeat: no-repeat;
}

@media (max-width: 850px) {
    ul.check-list.centerMobile li {
        text-align: center;
        padding-left: 0;
    }


    ul.check-list.centerMobile li::before {
        position: relative;
        top: auto;
        left: auto;
        display: inline-block;
        margin-right: 0.5rem;
    }
}

/*//////////////////////////////////*/
/*///////// RICH TEXT HTML /////////*/
/*//////////////////////////////////*/


.richText-html {display: block; -webkit-line-clamp: unset; overflow: visible;}
.richText-html p {margin-bottom: 1rem; color: rgba(var(--text), 0.85)}
.richText-html ul {margin-left: 1rem; margin-bottom: 1rem;}
.richText-html ul li {
    list-style: disc;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.8;
    font-family: 'Open Sans', sans-serif;
    color: rgba(var(--text), 0.85);
}

.richText-html.clipText {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.richText-html.no-margin-last *:nth-last-child(1) {margin-bottom: 0;}

/*//////////////////////////////////*/
/*/////////// CSS LOADER ///////////*/
/*//////////////////////////////////*/

/* HTML: <div class="loader"></div> */
.css-loader {
    height: 30px;
    aspect-ratio: 2.5;
    --_g: no-repeat radial-gradient(farthest-side, rgba(var(--primary), 1) 90%, #0000);
    background: var(--_g), var(--_g), var(--_g), var(--_g);
    background-size: 20% 50%;
    animation: l43 1s infinite linear;
}
@keyframes l43 {
    0%     {background-position: calc(0*100%/3) 50% ,calc(1*100%/3) 50% ,calc(2*100%/3) 50% ,calc(3*100%/3) 50% }
    16.67% {background-position: calc(0*100%/3) 0   ,calc(1*100%/3) 50% ,calc(2*100%/3) 50% ,calc(3*100%/3) 50% }
    33.33% {background-position: calc(0*100%/3) 100%,calc(1*100%/3) 0   ,calc(2*100%/3) 50% ,calc(3*100%/3) 50% }
    50%    {background-position: calc(0*100%/3) 50% ,calc(1*100%/3) 100%,calc(2*100%/3) 0   ,calc(3*100%/3) 50% }
    66.67% {background-position: calc(0*100%/3) 50% ,calc(1*100%/3) 50% ,calc(2*100%/3) 100%,calc(3*100%/3) 0   }
    83.33% {background-position: calc(0*100%/3) 50% ,calc(1*100%/3) 50% ,calc(2*100%/3) 50% ,calc(3*100%/3) 100%}
    100%   {background-position: calc(0*100%/3) 50% ,calc(1*100%/3) 50% ,calc(2*100%/3) 50% ,calc(3*100%/3) 50% }
}

/*////////////////////////////*/
/*//////// TEXT FIELD ////////*/
/*////////////////////////////*/

.v-input.uba-custom input {
    color: rgba(var(--primary), 1);
    overflow: hidden;
    text-overflow: ellipsis;
    height: 48px;
    max-height: 48px;
    min-height: 48px;
}

.v-input.uba-custom .v-field .v-field__outline {
    opacity: 0;
    border-color: rgba(var(--primary), 1);
    --v-field-border-opacity: 1;
    border-width: 2px;
    border-style: solid;
    box-shadow: none;
    -webkit-transition: all 250ms ease-out;
    -moz-transition: all 250ms ease-out;
    -ms-transition: all 250ms ease-out;
    -o-transition: all 250ms ease-out;
    transition: all 250ms ease-out;
}

.v-input.uba-custom .v-field.v-field--active .v-field__outline {opacity: 0.3 !important;}
.v-input.uba-custom .v-field .v-field__overlay {color: rgba(var(--white), 1)}
.v-input.uba-custom .v-field .v-field__overlay::before,
.v-input.uba-custom .v-field .v-field__overlay::after {
    border-color: rgba(var(--white), 1) !important;
}

.v-input.uba-custom .v-input__control {color: rgba(var(--white), 1) !important;}
.v-input.uba-custom .v-field.v-field--active.v-theme--light {
    --v-theme-on-background: 255,255,255 !important;
}

.v-input.v-textarea textarea {min-height: 80px !important;}

/*/////////////////////////////////////////*/
/*//////// AUTOCOMPLETE TEXT FIELD ////////*/
/*/////////////////////////////////////////*/

.v-input.uba-autocomplete-custom input {color: rgba(var(--primary), 1); overflow: hidden; text-overflow: ellipsis;}
.v-input.uba-autocomplete-custom .v-autocomplete__selection {color: rgba(var(--primary), 1); overflow: hidden; text-overflow: ellipsis;}
.v-input.uba-autocomplete-custom .v-field .v-field__overlay {
    border: 2px solid rgba(var(--primary), 1);
    opacity: 0;
    -webkit-box-shadow:inset 0 0 0 2px rgba(255,255,255,1);
    box-shadow:inset 0 0 0 2px rgba(255,255,255,1);
    -webkit-transition: all 250ms ease-out;
    -moz-transition: all 250ms ease-out;
    -ms-transition: all 250ms ease-out;
    -o-transition: all 250ms ease-out;
    transition: all 250ms ease-out;
}

.v-input.uba-autocomplete-custom .v-field.v-field--active .v-field__overlay {opacity: 0.3;}

/*/////////////////////////////////////////*/
/*////////// COMBOBOX TEXT FIELD //////////*/
/*/////////////////////////////////////////*/

.v-input.uba-combo-custom input {color: rgba(var(--primary), 1); overflow: hidden; text-overflow: ellipsis;}
.v-input.uba-combo-custom .v-combobox__selection {color: rgba(var(--primary), 1); overflow: hidden; text-overflow: ellipsis;}
.v-input.uba-combo-custom .v-field .v-field__overlay {
    border: 2px solid rgba(var(--primary), 1);
    opacity: 0;
    -webkit-box-shadow:inset 0 0 0 2px rgba(255,255,255,1);
    box-shadow:inset 0 0 0 2px rgba(255,255,255,1);
    -webkit-transition: all 250ms ease-out;
    -moz-transition: all 250ms ease-out;
    -ms-transition: all 250ms ease-out;
    -o-transition: all 250ms ease-out;
    transition: all 250ms ease-out;
}

.v-input.uba-combo-custom .v-field.v-field--active .v-field__overlay {opacity: 0.3;}

/*/////////////////////////////////////////*/
/*/////////// FIELDS CLEARABLE ////////////*/
/*/////////////////////////////////////////*/

.v-input.uba-combo-custom .v-field__clearable,
.v-input.uba-autocomplete-custom .v-field__clearable,
.v-input.uba-custom .v-field__clearable {color: rgba(var(--primary), 1);}

/*/////////////////////////////////////////*/
/*////////////// CHECKBOXES ///////////////*/
/*/////////////////////////////////////////*/

.customCheck.v-input .v-input__prepend {margin-right: 0.5rem;}
.customCheck.v-input .v-label {font-size: 1rem;}

.v-card.customCheckRow {border-radius: 0;}
.v-card.customCheckRow .v-icon.customCheckRow-icon {color: rgba(var(--spot1), 1); font-size: 1.8rem;}
.v-card.customCheckRow .customCheckLabel span {font-size: 1rem; margin-left: 0.4rem;}
.v-card.customCheckRow .customCheckLabel.active span {color: rgba(var(--primary), 1);}

@media (max-width: 1450px){
    .v-card.customCheckRow .customCheckLabel span {font-size: 0.9rem;  margin-left: 0.25rem;}
    .v-card.customCheckRow .v-icon.customCheckRow-icon {font-size: 1.5rem;}
}

/*///////////////////////////////////////*/
/*//////// BASIC FORM COMPONENTS ////////*/
/*///////////////////////////////////////*/

.v-input.uba-basicForm .v-input__details {padding-left: 0; color: rgba(var(--primary), 1); font-weight: 400;}
.v-input.uba-basicForm .v-messages {opacity: 1;}
.v-input.uba-basicForm .v-field__outline * {border-color: rgba(var(--primary), 1);}
.v-input.uba-basicForm .v-icon {color: rgba(var(--primary), 1);}

.v-input.uba-basicForm.error .v-field__outline * {border-color: rgba(var(--spot1), 1);}
.v-input.uba-basicForm.error .v-icon {color: rgba(var(--spot1), 1) !important;}

.v-input.uba-basicForm .v-field.v-field--dirty .v-field__outline {
    --v-field-border-width: 2px;
    --v-field-border-opacity: 0.58;
}

.v-input.uba-basicForm .v-field.v-field--focused .v-field__outline {
    --v-field-border-width: 2px;
    --v-field-border-opacity: 1;
}

.v-input.uba-basicForm .v-field--variant-outlined .v-field__outline__notch::before,
.v-input.uba-basicForm .v-field--variant-outlined .v-field__outline__notch::after {
    border-color: rgba(var(--primary), 1);
}

.v-input.uba-basicForm.grey-border .v-field__outline * {border-color: rgba(var(--text), 0.5);}
.v-input.uba-basicForm.grey-border .v-field--variant-outlined .v-field__outline__notch::before,
.v-input.uba-basicForm.grey-border .v-field--variant-outlined .v-field__outline__notch::after {
    border-color: rgba(var(--text), 1);
}

.form-row {
    display: flex;
    flex-flow: row wrap;
    margin-left: -0.5rem;
    margin-right: -0.5rem;
    width: calc(100% + 1rem);
    align-items: start;
}

.form-row .form-item {
    width: 50%;
    flex: 1;
    min-width: 250px;
    box-sizing: border-box;
    padding: 0 0.5rem 1rem 0.5rem;
}

.form-row .form-item.w100 {width: 100%; max-width: 100%; min-width: 100%;}
.form-row .form-item.hide-label .v-label {opacity: 0 !important;}

.socialLayout {display: flex; flex-flow: row nowrap; margin-bottom: 1rem;}
.socialLayout .socialLayout-item.list {min-width: 200px; padding-right: 1rem;}
.socialLayout .socialLayout-item.input {flex: 1;}
.socialLayout:nth-last-child(1) {margin-bottom: 0;}

@media (max-width: 1050px) and (min-width: 950px) {
    .form-row.slrs {flex-flow: column wrap;}
    .form-row.slrs .form-item.hide-label .v-label {display: none;}
    .form-row.slrs .form-item {width: 100%;}
}

@media (max-width: 700px) {
    .form-row.nrsp {flex-flow: column wrap;}
    .form-row.nrsp .form-item {width: 100%;}
}

@media (max-width: 560px) {
    .form-row.slrs {flex-flow: column wrap;}
    .form-row.slrs .form-item.hide-label .v-label {display: none;}
    .form-row.slrs .form-item {width: 100%;}
}

/*//////////////////////////////////////*/
/*////////////// DROP ZONE /////////////*/
/*//////////////////////////////////////*/

.dropZone {
    position: relative;
    border: 2px dashed rgba(var(--primary), 1);
    border-radius: 10px;
}

.dropZone:hover {
    border-color: rgba(var(--spot5), 1);
    background-color: rgba(var(--primary), 0.1);
}

.dropZone .dropZone-inner {
    position: relative;
    padding: 50px;
    min-height: 250px;
    box-sizing: border-box;
    text-align: center;
    display: flex;
    width: 100%;
    flex-flow: column;
    align-items: center;
    justify-content: center;
}

.dropZone span.title {
    font-size: 1.2rem;
    color: rgba(var(--text), 1);
    font-weight: 600;
    font-family: inherit;
}

.dropZone span.info {
    font-size: 0.9rem;
    color: rgba(var(--text), 0.6);
    font-weight: 400;
    font-family: inherit;
}

.dropZone .dropZone-loader {display: none;}
.dropZone.loading .dropZone-icon {display: none;}
.dropZone.loading .dropZone-loader {display: inline-block;}
.dropZone.loading {pointer-events: none; opacity: 0.5;}

/*//////////////////////////////////////*/
/*//////////// ACTIONS LIST ////////////*/
/*//////////////////////////////////////*/

.ubaActionList {position: relative;}
.ubaActionList .ubaActionList-item {border-bottom: 2px solid rgba(var(--primary), 0.2); padding-left: 0 !important; padding-right: 0 !important;}
.ubaActionList .ubaActionList-item:nth-last-child(1) {border-bottom: none;}

/*//////////////////////////////////////*/
/*/////////////// TOPBAR ///////////////*/
/*//////////////////////////////////////*/

#topBar {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background-color: rgba(var(--background), 1);
    -webkit-box-shadow: 0 0 10px 0 rgba(0,0,0,0.15);
    box-shadow: 0 0 10px 0 rgba(0,0,0,0.15);
    z-index: 100;
}

#topBar .topbar-inner {
    position: relative;
    padding-top: 0.7rem;
    padding-bottom: 0.7rem;
    display: flex;
    flex-flow: row nowrap;
    justify-content: space-between;
    align-items: center;
    z-index: 10;
    background-color: rgba(var(--background), 1);
}

#topBar .topbar-logo {display: block; width: 260px; height: 58px; position: relative;}
#topBar .topbar-logo img {
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
}

#topBar .topbar-logo img.small {
    opacity: 0;
    -moz-transform: scale(1) translateY(-50%);
    -webkit-transform: scale(1) translateY(-50%);
    -o-transform: scale(1) translateY(-50%);
    -ms-transform: scale(1) translateY(-50%);
    transform: scale(1) translateY(-50%);
    height: 0;
}

#topBar .topbar-logo img.large {
    opacity: 1;
    -moz-transform: scale(1) translateY(-50%);
    -webkit-transform: scale(1) translateY(-50%);
    -o-transform: scale(1) translateY(-50%);
    -ms-transform: scale(1) translateY(-50%);
    transform: scale(1) translateY(-50%);
    height: 100%;
}

#topBar ul.topbar-menu {
    display: flex;
    flex-flow: row nowrap;
    justify-content: start;
    align-items: center;
    margin: 0;
    padding: 0;
}

#topBar li.topbar-menu-item {list-style: none; margin-right: 2.5rem;}
#topBar li.topbar-menu-item:nth-last-child(1) {margin-right: 0;}
#topBar li.topbar-menu-item:nth-last-child(2) {margin-right: 0;}
#topBar a.topbar-menu-link {
    font-size: 1rem;
    color: rgba(var(--secondary), 1);
    display: block;
    font-weight: 600;
}

#topBar li.topbar-menu-item.active a.topbar-menu-link {color: rgba(var(--spot1), 1);}

#topBar a.topbar-menu-link:hover {color: rgba(var(--spot1), 1);}
#topBar svg.topbar-menu-icon {width: 2.2rem;}
#topBar svg.topbar-menu-icon path {fill: rgba(var(--secondary), 1);}
#topBar a.topbar-menu-link:hover svg.topbar-menu-icon path {fill: rgba(var(--spot1), 1);}

#topBar.changing {
    -webkit-box-shadow: 0 0 10px 0 rgba(0,0,0,0);
    box-shadow: 0 0 10px 0 rgba(0,0,0,0);
}

/*///// TOPBAR IS STUCK /////*/
#topBar.is-stuck .topbar-logo {height: 38px;}
#topBar.is-stuck a.topbar-menu-link {font-size: 0.9rem;}
#topBar.is-stuck svg.topbar-menu-icon {width: 1.8rem;}
#topBar.is-stuck .topbar-inner {padding-top: 0.5rem; padding-bottom: 0.5rem;}
#topBar.is-stuck .topbar-logo img.small {
    opacity: 1;
    -moz-transform: scale(1) translateY(-50%);
    -webkit-transform: scale(1) translateY(-50%);
    -o-transform: scale(1) translateY(-50%);
    -ms-transform: scale(1) translateY(-50%);
    transform: scale(1) translateY(-50%);
    height: 100%;
}

#topBar.is-stuck .topbar-logo img.large {
    opacity: 0;
    -moz-transform: scale(1) translateY(-50%);
    -webkit-transform: scale(1) translateY(-50%);
    -o-transform: scale(1) translateY(-50%);
    -ms-transform: scale(1) translateY(-50%);
    transform: scale(1) translateY(-50%);
    height: 0;
}

/*////////// MOBILE MENU BTN //////////*/
#topBar li.topbar-menu-item.menuBtn-hold {display: none;}
#topBar .menuBtn {display: inline-block; cursor: pointer; vertical-align: middle;}
#topBar .menuBar-1, #topBar .menuBar-2, #topBar .menuBar-3 {width: 23px; height: 4px; background-color: rgba(var(--secondary), 1); margin: 4px 0; transition: 0.4s;}
#topBar .menuBtn.change .menuBar-1 {-webkit-transform: rotate(-45deg) translate(-6px, 4px); transform: rotate(-45deg) translate(-6px, 4px);}
#topBar .menuBtn.change .menuBar-2 {opacity: 0;}
#topBar .menuBtn.change .menuBar-3 {-webkit-transform: rotate(45deg) translate(-7px, -6px); transform: rotate(45deg) translate(-7px, -6px);}

/*////////// V-MAIN //////////*/
main.v-main {padding-top: 80px;}
main.v-main.full-screen {padding-top: 0 !important;}

/*////////// RESPONSIVE //////////*/
@media (max-width: 1250px){
    #topBar li.topbar-menu-item {margin-right: 1.3rem;}
    #topBar a.topbar-menu-link {font-size: 0.85rem;}
    #topBar .topbar-logo {width: 220px; height: 50px;}
    #topBar.is-stuck .topbar-logo {height: 32px;}
    #topBar svg.topbar-menu-icon {width: 1.8rem;}
    main.v-main {padding-top: 71px;}
}

@media (max-width: 950px){
    #topBar li.topbar-menu-item {display: none;}
    #topBar li.topbar-menu-item.menuBtn-hold {display: block;}
}

/*///////////////////////*/
/*///// MOBILE MENU /////*/
/*///////////////////////*/

body.mobileMenu-open {
    position: fixed;
    left: 0;
    right: 0;
    width: 100%;
    overflow: hidden;
}

#mobileMenu {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background-color: rgba(255,255,255,0.95);
    z-index: 9;
    max-height: 100vh;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    -webkit-transition: opacity 500ms ease-out;
    -moz-transition: opacity 500ms ease-out;
    -ms-transition: opacity 500ms ease-out;
    -o-transition: opacity 500ms ease-out;
    transition: opacity 500ms ease-out;
    pointer-events: none;
    opacity: 0;
}

body.mobileMenu-open #mobileMenu {
    pointer-events: auto;
    opacity: 1;
}

#mobileMenu .mobileMenu-inner {
    position: relative;
    display: flex;
    flex-flow: column;
    justify-content: center;
    align-items: center;
    min-height: 100%;
    padding-top: 80px;
    padding-bottom: 10px;
}

#mobileMenu .mobileMenu-list {
    display: block;
    margin: 0;
    padding: 0;
    width: 100%;
    max-width: 500px;
}

#mobileMenu .mobileMenu-item {
    display: block;
    list-style: none;
    opacity: 0;
    transform: translateY(12px);
}

/*///// ANIMATE WHEN MENU OPENS /////*/
body.mobileMenu-open #mobileMenu .mobileMenu-item {
    animation: mobileMenuFadeIn 0.50s ease forwards;
}

body.mobileMenu-open #mobileMenu .mobileMenu-item:nth-child(1) { animation-delay: 0.08s; }
body.mobileMenu-open #mobileMenu .mobileMenu-item:nth-child(2) { animation-delay: 0.16s; }
body.mobileMenu-open #mobileMenu .mobileMenu-item:nth-child(3) { animation-delay: 0.24s; }
body.mobileMenu-open #mobileMenu .mobileMenu-item:nth-child(4) { animation-delay: 0.32s; }
body.mobileMenu-open #mobileMenu .mobileMenu-item:nth-child(5) { animation-delay: 0.40s; }
body.mobileMenu-open #mobileMenu .mobileMenu-item:nth-child(6) { animation-delay: 0.48s; }
body.mobileMenu-open #mobileMenu .mobileMenu-item:nth-child(7) { animation-delay: 0.56s; }
body.mobileMenu-open #mobileMenu .mobileMenu-item:nth-child(8) { animation-delay: 0.64s; }

@keyframes mobileMenuFadeIn {
    from {
        opacity: 0;
        transform: translateY(12px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

#mobileMenu .mobileMenu-link {
    display: block;
    cursor: pointer;
    font-size: 1.2rem;
    color: rgba(var(--secondary), 1);
    font-weight: 600;
    padding: 0.8rem 1.5rem;
    border-bottom: 1px solid rgba(var(--secondary), 0.1);
}

#mobileMenu .mobileMenu-item.active .mobileMenu-link {color: rgba(var(--spot1), 1);}
#mobileMenu .mobileMenu-item:nth-last-child(1) .mobileMenu-link {border-bottom: none;}
#mobileMenu .mobileMenu-link:hover {background-color: rgba(var(--secondary), 0.05); color: rgba(var(--spot1), 1)}

@media (min-width: 951px) {
    body.mobileMenu-open #mobileMenu {
        pointer-events: none !important;
        opacity: 0 !important;
    }
}

/*///////////////////////*/
/*////// HOME STAGE /////*/
/*///////////////////////*/

#stage {position: relative; background-color: rgba(var(--background-secondary), 1);}
#stage .stage-inner {position: relative}
#stage .stage-slider {position: relative}
#stage .stage-slider .swiper-wrapper::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 10;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 82.69%, rgba(0, 0, 0, 0.50) 100%);
}

/*///// PAGINATION /////*/
.swiper-pagination {top: auto !important; bottom: 30px !important;}
.swiper-pagination .swiper-pagination-bullet {
    width: 11px;
    height: 11px;
    background-color: rgba(var(--white), 1);
    border-radius: 8px;
    border: 2px solid rgba(var(--white), 1);
}

.swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {background-color: rgba(var(--spot3), 1);}
.swiper-pagination-bullet {opacity: 0.6;}
.swiper-pagination-bullet.swiper-pagination-bullet-active {opacity: 1;}

/*///// ARROWS /////*/
#stage .swiper-button-prev, #stage .swiper-button-next {width: 24px; height: 24px; bottom: 30px !important; top: auto !important; z-index: 15;}
#stage .swiper-button-prev svg, #stage .swiper-button-next svg {fill: rgba(var(--white), 1); color: rgba(var(--white), 1);}

#stage .swiper-button-prev {left: 50% !important; right: auto !important; margin-left: calc(-12px - 78px)!important;}
#stage .swiper-button-next {right: 50% !important; left: auto !important; margin-right: calc(-12px - 78px)!important;}
#stage .swiper:has(> .swiper-wrapper > :nth-child(6)) > .swiper-button-prev {margin-left: calc(-12px - 100px)!important;}
#stage .swiper:has(> .swiper-wrapper > :nth-child(6)) > .swiper-button-next {margin-right: calc(-12px - 100px)!important;}
#stage .swiper:has(> .swiper-wrapper > :nth-child(9)) > .swiper-button-prev {margin-left: calc(-12px - 122px)!important;}
#stage .swiper:has(> .swiper-wrapper > :nth-child(9)) > .swiper-button-next {margin-right: calc(-12px - 122px)!important;}

@media (max-width: 750px){
    #stage .swiper-button-prev, #stage .swiper-button-next {display: none !important;}
    #stage .swiper-pagination {text-align: right; padding-right: 2rem;}
}

@media (max-width: 700px){
    #stage .swiper-pagination {bottom: 15px !important;}
    #stage .stage-slider .swiper-slide img {height: 300px; object-position: bottom left; object-fit: cover;}
}


@media (max-width: 500px){
    #stage .swiper-pagination {padding-right: 1.5rem;}
}

/*////////////////////////////*/
/*/////// SEARCH BANNER //////*/
/*////////////////////////////*/

#searchBanner {position: relative; z-index: 15; background-color: rgba(var(--background-secondary), 1);}
#searchBanner .searchBanner-inner {position: relative; display: flex; flex-flow: row wrap; justify-content: center;}
#searchBanner .searchBanner-content {
    position: relative;
    padding: 1rem 1.5rem;
    background-color: rgba(var(--white), 1);
    width: 100%;
    max-width: 1350px;
    border-radius: 10px;
    box-shadow: 0 4px 16px 0 rgba(0, 0, 0, 0.16);
    min-height: 150px;
    margin-top: -20px;
}

#searchBanner .searchBanner-pattern {
    height: 56px;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    background-image: url('../images/patter-1.png');
    background-repeat: repeat;
    background-size: 59px;
}

.searchBanner-form {flex-flow: row nowrap; width: 100%;}
.searchBanner-form .searchBanner-item.input {flex: 1;}
.searchBanner-form .searchBanner-item {margin: 0 0.5rem;}
.searchBanner-form .searchBanner-item:nth-child(1) {margin-left: 0;}
.searchBanner-form .searchBanner-item:nth-last-child(1) {margin-right: 0;}

@media (max-width: 950px) {
    .searchBanner-form .searchBanner-item { margin: 0 0.5rem;}
}

@media (max-width: 700px) {
    .searchBanner-form {flex-flow: column; justify-content: center; align-items: center;}
    .searchBanner-form .searchBanner-item.input {flex: auto; width: 100%; max-width: 450px;}
    #searchBanner .searchBanner-content {padding-bottom: 1.8rem; margin-top: -10px;}
    .searchBanner-form .searchBanner-item {margin: 0 0 1rem 0;}
}

/*////////////////////////////*/
/*/////////// TABS ///////////*/
/*////////////////////////////*/

.searchBanner-tabs {
    position: relative;
    padding: 1rem 1.5rem;
    width: 100%;
    max-width: 1350px;
    font-size: 0;
    text-align: center;
}

.searchBanner-tabs .searchBanner-tab {
    display: inline-block;
    font-size: 1rem;
    border: 1px solid rgba(var(--primary), 1);
    color: rgba(var(--primary), 1);
    padding: 0.5rem 1rem;
    border-radius:  8px;
    cursor: pointer;
    margin: 0.5rem;
}

.searchBanner-tabs .searchBanner-tab:hover {
    background-color: rgba(var(--primary), 1);
    color: rgba(var(--white), 1);
}

@media (max-width: 500px){
    .searchBanner-tabs .searchBanner-tab {
        font-size: 0.8rem;
        padding: 0.5rem 1rem;
        margin: 0.3rem;
    }
}

/*////////////////////////////////////*/
/*//////// START CHAT SECTION ////////*/
/*////////////////////////////////////*/

#startChatSection {position: relative; background-color: rgba(var(--background-secondary), 1);}
#startChatSection .startChatSection-inner {position: relative; z-index: 2;}
#startChatSection .startChatSection-content {position: relative; display: flex; flex-flow: row nowrap; align-items: center;}
#startChatSection .startChatSection-img {
    width: 100%;
    max-width: 445px;
    margin-right: 6rem;
    min-width: 305px;
}

.africa-bg-watermark {
    position: absolute;
    top: 3rem;
    right: 2rem;
    width: 693px;
    pointer-events: none;
    z-index: 1;
}

@media (max-width: 950px) {
    #startChatSection .startChatSection-content {flex-flow: column;}
    #startChatSection .startChatSection-img {max-width: 305px; margin-right: 0; margin-bottom: 2rem; min-width: 0;}

    .africa-bg-watermark {display: none;}
    .startChatSection-text,
    .startChatSection-text * {text-align: center;}
}

/*////////////////////////////*/
/*//////// MARKETPLACE ///////*/
/*////////////////////////////*/

#marketplace {position: relative; background-color: rgba(var(--background-secondary), 1);}
#marketplace .marketplace-inner {position: relative; z-index: 5; text-align: center;}
#marketplace .swiper {padding-left: 44px; padding-right: 44px; position: relative;}
#marketplace .swiper::before, #marketplace .swiper::after {
    all: unset;
    content: "";
    display: block !important;
    position: absolute;
    width: 44px;
    height: 100%;
    top: 0;
    background-color: rgba(var(--background-secondary), 1);
    z-index: 10;
    border: none;
}

#marketplace .swiper::before {left: 0;}
#marketplace .swiper::after {right: 0;}

/*///// ARROWS /////*/
#marketplace .swiper-button-prev, #marketplace .swiper-button-next {
    width: 44px;
    height: 44px;
    z-index: 15;
    background-color: rgba(var(--spot3), 1);
    border-radius: 10px;
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    justify-content: center;
}

#marketplace .swiper-button-prev {left: 0;}
#marketplace .swiper-button-next {right: 0;}

#marketplace .swiper-button-prev svg,
#marketplace .swiper-button-next svg {
    fill: rgba(var(--white), 1);
    color: rgba(var(--white), 1);
    width: 22px;
    height: 22px;
}

#marketplace .swiper-slide {box-sizing: border-box; padding: 0.9rem;}

/*//////////////////////////////*/
/*//////// CATEGORY CARD ///////*/
/*//////////////////////////////*/

.categoryCard {
    position: relative;
    display: block;
    width: 100%;
    box-sizing: border-box;
    border: 3px solid rgba(var(--white), 1);
    border-radius: 10px;
    box-shadow: 0 5px 16px 0 rgba(0, 0, 0, 0.16);
    overflow: hidden;
    height: auto;
    min-height: 0;
    padding: 0;
}

.categoryCard img {
    width: 100%;
    position: relative;
    overflow: hidden;
    user-select: none;
    -webkit-user-select: none;
}

.categoryCard .categoryCard-caption {
    position: absolute;
    pointer-events: none;
    bottom: 20%;
    left: 0;
    padding: 0.5rem 1rem;
    background-color: rgba(var(--white), 0.85);
    font-size: 0.9rem;
    text-transform: capitalize;
    color: rgba(var(--primary), 1);
    width: 100%;
    text-align: center;
}

.categoryCard:hover .categoryCard-caption {
    background-color: rgba(var(--primary), 1);
    color: rgba(var(--white), 1);
}

/*//////////////////////////////////*/
/*//////// FEATURED LISTINGS ///////*/
/*//////////////////////////////////*/

#featuredListing {position: relative; background-color: rgba(var(--background), 1);}
#featuredListing .featuredListing-inner {position: relative; z-index: 5; text-align: center;}
#featuredListing h3.featuredListing-heading {padding-left: 84px;}
#featuredListing .swiper {padding-left: 64px; padding-right: 64px; position: relative;}
#featuredListing .swiper::before,
#featuredListing .swiper::after {
    all: unset;
    content: "";
    display: block !important;
    position: absolute;
    width: 64px;
    height: 100%;
    top: 0;
    background-color: rgba(var(--background), 1);
    z-index: 10;
    border: none;
}

#featuredListing .swiper::before {left: 0;}
#featuredListing .swiper::after {right: 0;}

/*///// ARROWS /////*/
#featuredListing .swiper-button-prev,
#featuredListing .swiper-button-next {
    width: 44px;
    height: 44px;
    z-index: 15;
    background-color: rgba(var(--spot3), 1);
    border-radius: 10px;
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    justify-content: center;
}

#featuredListing .swiper-button-prev {left: 0;}
#featuredListing .swiper-button-next {right: 0;}

#featuredListing .swiper-button-prev svg,
#featuredListing .swiper-button-next svg {
    fill: rgba(var(--white), 1);
    color: rgba(var(--white), 1);
    width: 22px;
    height: 22px;
}

/*///// SLIDE /////*/
#featuredListing .swiper-slide {box-sizing: border-box; padding: 1.3rem;}

@media (max-width: 900px){
    #featuredListing .swiper-slide {padding: 0.5rem;}
    #featuredListing h3.featuredListing-heading {padding-left: 71px;}
}

@media (max-width: 750px){
    #featuredListing h3.featuredListing-heading {padding-left: 0; text-align: center !important;}
}

@media (max-width: 501px){
    #featuredListing .swiper-slide {box-sizing: border-box; padding: 0;}
}

@media (max-width: 450px){
    #featuredListing .swiper {padding-left: 34px; padding-right: 34px;}
    #featuredListing .swiper::before,
    #featuredListing .swiper::after {width: 34px;}
    #featuredListing .swiper-button-prev {-webkit-border-radius: 10px 0 0 10px; border-radius: 10px 0 0 10px;}
    #featuredListing .swiper-button-next {-webkit-border-radius: 0 10px 10px 0; border-radius: 0 10px 10px 0;}
    #featuredListing .swiper-button-prev,
    #featuredListing .swiper-button-next {width: 34px;}
}

/*/////////////////////////////////*/
/*//////// UBA CARD LISTING ///////*/
/*/////////////////////////////////*/

.v-card.ubaListing-card {
    position: relative;
    display: block;
    width: 100%;
    box-sizing: border-box;
    border: 3px solid rgba(var(--background-secondary), 1);
    border-radius: 10px;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.16);
    overflow: hidden;
    height: auto;
    min-height: 0;
    padding: 0;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
}

.ubaListing-card.featured {
    border: 3px solid rgba(var(--spot2), 1);
    box-shadow: 0 5px 16px 0 rgba(0, 0, 0, 0.16);
}

.ubaListing-card.featured::before,
.ubaListing-card.featured::after{
    all: unset;
    content: "";
    position: absolute;
    top: -3px;
    right: -3px;
    width: 12px;
    height: 12px;
    background-color: rgba(var(--spot2), 1);
    z-index: 10;
    border-radius: 0 10px 0 0;
}

.ubaListing-card .ubaListing-image {position: relative;}
.ubaListing-card .ubaListing-card img {
    width: 100%;
    position: relative;
    overflow: hidden;
    user-select: none;
    -webkit-user-select: none;
}

.ubaListing-card .ubaListing-logo {
    position: absolute;
    bottom: -1rem;
    left: 1rem;
    width: 20%;
    max-width: 175px;
    border: 3px solid rgba(var(--white), 1);
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.16);
    z-index: 5;
}

.ubaListing-card .ubaListing-special {
    position: absolute;
    bottom: 0;
    right: 1rem;
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    justify-content: start;
    background-color: rgba(var(--background-secondary), 1);
    border: 3px solid rgba(var(--white), 1);
    border-bottom: 0;
    padding: 0.3rem 0.5rem;
    -webkit-border-radius: 8px 8px 0 0;
    border-radius: 8px 8px 0 0;
}

.ubaListing-card .ubaListing-special-icon {
    width: 1.2rem;
    height: 1.2rem;
    margin-right: 0.2rem;
}

.ubaListing-card .ubaListing-special span {
    white-space: nowrap;
    color: rgba(var(--spot1), 1);
    font-size: 0.8rem;
    font-weight: 700;
}

.ubaListing-card .ubaListing-cont {
    position: relative;
    display: flex;
    flex-flow: column;
    padding: 2rem 1rem 1rem 1rem;
    box-sizing: border-box;
    text-align: left;
    min-height: 240px;
}

.ubaListing-card .ubaListing-top {flex: 1;}
.ubaListing-card .ubaListing-category {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ubaListing-card .ubaListing-cont h3 {
    color: rgba(var(--text), 1);
    font-size: 1.3rem;
    font-weight: 600;
    line-height: 1.3;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-bottom: 0.2rem;
}

.ubaListing-card .ubaListing-location {
    display: flex;
    flex-flow: row nowrap;
    font-size: 1rem;
    color: rgba(var(--primary), 1);
    margin-bottom: 1rem;
    align-items: center;
    justify-content: start;
    white-space: nowrap;
    overflow: hidden;
    max-width: 100%;
}

.ubaListing-card .ubaListing-location span {
    display: block;
    flex: 1;
    max-width: calc(100% - 1.4rem);
    overflow: hidden;
    text-overflow: ellipsis;
}

.ubaListing-card .ubaListing-location svg {
    width: 1.4rem;
    min-width: 1.4rem;
    min-height: 1.4rem;
    height: 1.4rem;
    margin-left: -0.2rem;
}

.ubaListing-card .ubaListing-premium {
    position: absolute;
    top: 0;
    right: 0;
    background-color: rgba(var(--spot2), 1);
    display: flex;
    align-items: center;
    padding: 0.3rem 0.4rem 0.4rem 0.5rem;
    -webkit-border-radius: 0 6px 0 6px;
    border-radius: 0 6px 0 6px;
}

.ubaListing-card .ubaListing-premium span {
    display: block;
    position: relative;
    font-size: 0.8rem;
    color: rgba(var(--text), 1);
    margin-left: 0.2rem;
}

.ubaListing-card .ubaListing-verified {
    position: absolute;
    top: 0;
    left: 0;
    background-color: rgba(var(--white), 1);
    display: flex;
    align-items: center;
    padding: 0.23rem 0.5rem 0.23rem 0.5rem;
    -webkit-border-radius: 6px 0 6px 0;
    border-radius: 6px 0 6px 0;
}

.ubaListing-card .ubaListing-verified img {
    width: 1.5rem;
}

.ubaListing-card .ubaListing-verified span {
    display: block;
    position: relative;
    font-size: 0.8rem;
    font-weight: 700;
    color: rgba(var(--spot4), 1);
    margin-left: 0.2rem;
}

.ubaListing-card .ubaListing-bottom {text-align: right;}
.ubaListing-card.featured .ubaListing-bottom {text-align: left;}

@media (max-width: 900px){
    .ubaListing-card {box-shadow: 0 5px 8px 0 rgba(0, 0, 0, 0.16);}
}

@media (max-width: 450px){
    .ubaListing-card .ubaListing-cont h3 {font-size: 1.1rem;}
}

/*//////////////////////////////////*/
/*////////////// ABOUT /////////////*/
/*//////////////////////////////////*/

#about {position: relative; background-color: rgba(var(--background-blue), 1);}
#about .about-inner {position: relative;}
#about .about-row {display: flex; flex-flow: row nowrap; position: relative; align-items: stretch;}
#about .about-col {position: relative;}
#about .about-col.image {margin-right: 6rem; width: 35%; max-width: 500px; min-width: 400px;}
#about .about-col.content {flex: 1;}
#about .about-image {
    position: absolute;
    bottom: 0;
    left: 0;
    display: block;
    width: 100%;
    height: calc(100% + 9rem);
    border-radius: 10px;
    overflow: hidden;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: 50%;
    object-fit: cover;
    object-position: 50%;
}

@media (max-width: 1150px) {
    #about .about-col.content h3 br {display: none;}
    #about .about-col.image {margin-right: 3rem;}
}

@media (max-width: 950px){
    #about .about-row {flex-flow: column; align-items: center;}
    #about .about-col.image {margin-right: 0; width: 100%; max-width: 500px; min-width: 0;}
    #about .about-image {
        position: relative;
        height: 500px;
        margin-top: -9rem;
        bottom: auto;
        left: auto;
    }

    #about .about-col.content {text-align: center; margin-top: 3rem;}
    #about .about-col.content > * {text-align: center}
}

@media (max-width: 500px) {
    #about .about-image {height: 400px; object-position: 50% 20%;}
}

@media (max-width: 400px) {
    #about .about-image {height: 300px; object-position: 50% 20%;}
}

/*//////////////////////////////////*/
/*///////////// PRICING ////////////*/
/*//////////////////////////////////*/

#pricingSection {position: relative; background-color: rgba(var(--background-blue), 1);}
#pricingSection .pricingSection-inner {position: relative;}
#pricingSection .pricingSection-row {display: flex; flex-flow: row wrap; align-items: stretch; margin-left: -1rem; margin-right: -1rem;}

/*//////////////////////////////////*/
/*////////// PRICING CARD //////////*/
/*//////////////////////////////////*/

.pricingCard {flex: 1; padding: 1rem; min-width: 400px;}
.pricingCard.w100 {width: 100%; min-width: 100%;}
.pricingCard .pricingCard-hold {
    box-shadow: 0 4px 16px 0 rgba(0, 0, 0, 0.16);
    border-radius: 10px;
    overflow: hidden;
    min-height: 100%;
    display: flex;
    flex-flow: column;
}

.pricingCard .pricingCard-hold.popular-spacer {margin-top: 25px; min-height: calc(100% - 50px);}
.pricingCard.w100 .pricingCard-hold.popular-spacer {margin-top: 0; min-height: 100%;}
.pricingCard .pricingCard-inner {
    flex: 1;
    position: relative;
    background-color: rgba(var(--white), 1);
    padding: 1.5rem;
    display: flex;
    flex-flow: column;
}


.pricingCard .pricingCard-content {flex: 1;}
.pricingCard .pricingCard-heading {
    position: relative;
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    justify-content: start;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid rgba(var(--black), 0.2);
    margin-bottom: 0.5rem;
}

.pricingCard .pricingCard-heading-icon {width: 2rem; margin-right: 1rem;}
.pricingCard .pricingCard-heading {flex: 1;}
.pricingCard .pricingCard-description {margin-bottom: 1rem;}
.pricingCard .pricingCard-usage {color: rgba(var(--spot1), 1); margin-top: 1rem; font-style: italic;}
.pricingCard .pricingCard-price {
    position: relative;
    display: inline-block;
    background-color: rgba(var(--background-blue), 1);
    padding: 0.2rem 0.5rem;
    border-radius: 6px;
}

.pricingCard .pricingCard-currency,
.pricingCard .pricingCard-price {font-size: 1.5rem; color: rgba(var(--text), 1); margin-bottom: 1rem}
.pricingCard .pricingCard-period {font-size: 0.8rem; color: rgba(var(--text), 1); margin-left: 0.3rem}
.pricingCard .pricingCard-popular {
    position: relative;
    background-color: rgba(var(--spot4), 1);
    color: rgba(var(--white), 1);
    font-weight: 600;
    text-align: center;
    font-size: 1rem;
    height: 50px;
    padding: 0 1rem;
    white-space: nowrap;
    line-height: 50px;
}

@media (max-width: 840px){
    .pricingCard {min-width: 100%;}
    .pricingCard .pricingCard-hold.popular-spacer {margin-top: 0; min-height: 100%;}
}

@media (max-width: 650px){
    .pricingCard {min-width: 100%;}
    .pricingCard .pricingCard-hold.popular-spacer {margin-top: 0; min-height: 100%;}
}

/*//////////////////////////////////*/
/*///////// PRICING TOGGLE /////////*/
/*//////////////////////////////////*/

.pricingToggle {
    position: relative;
    display: flex;
    flex-flow: row wrap;
    align-items: center;
    justify-content: end;
    margin-bottom: 1.5rem;
}

.pricingToggle .pricingToggle-text {color: rgba(var(--primary), 1); margin: 0;}
.pricingToggle .pricingToggle-hold {
    background-color: rgba(var(--white), 1);
    border-radius: 100px;
    margin-left: 1rem;
    padding: 0.5rem 0.5rem;
}

.pricingToggle .v-btn {
    background-color: rgba(var(--white), 1);
    color: rgba(var(--text), 1);
    text-transform: capitalize;
    -webkit-transition: all 250ms ease-out;
    -moz-transition: all 250ms ease-out;
    -ms-transition: all 250ms ease-out;
    -o-transition: all 250ms ease-out;
    transition: all 250ms ease-out;
}

.pricingToggle .v-btn:hover {background-color: rgba(var(--white), 1); color: rgba(var(--primary), 1);}
.pricingToggle .v-btn:hover .v-btn__overlay {opacity: 0;}
.pricingToggle .v-btn.v-btn--active {background-color: rgba(var(--primary), 1);  color: rgba(var(--white), 1);}

@media (max-width: 750px){
    .pricingToggle {flex-flow: column;}
    .pricingToggle .pricingToggle-hold {margin-left: 0; margin-top: 1rem;}
}

@media (max-width: 350px){
    .pricingToggle .v-btn {
        height: 36px !important;
        padding-left: 10px !important;
        padding-right: 10px !important;
        line-height: 36px !important;
        font-size: 0.8rem !important;
    }

    .pricingToggle .v-btn-group--density-comfortable.v-btn-group {height: 36px !important;}
}


/*//////////////////////////////////////*/
/*///////// MOBILE APP SECTION /////////*/
/*//////////////////////////////////////*/

#mbAppSection {position: relative; background-color: rgba(var(--background-grey), 1);}
#mbAppSection .mbAppSection-inner {position: relative;}
#mbAppSection .mbAppSection-row {display: flex; flex-flow: row nowrap; align-items: center;}
#mbAppSection .mbAppSection-col {flex: 1;}
#mbAppSection .mbAppSection-col:nth-child(1) {padding-right: 3rem;}
#mbAppSection .mbAppSection-col:nth-last-child(1) {padding-left: 3rem;}
#mbAppSection .mbAppSection-btn {width: 160px; max-width: 160px; min-width: 160px; display: block;}
#mbAppSection .mbAppSection-btn:hover {opacity: 0.6;}

@media (max-width: 1150px) {
    #mbAppSection .mbAppSection-col:nth-child(1) {padding-right: 1.5rem;}
    #mbAppSection .mbAppSection-col:nth-last-child(1) {padding-left: 1.5rem;}
}

@media (max-width: 950px) {
    #mbAppSection .mbAppSection-row {flex-flow: column;}
    #mbAppSection .mbAppSection-col {width: 100%; max-width: 660px;}
    #mbAppSection .mbAppSection-col:nth-child(1) {padding-right: 0; order: 2;}
    #mbAppSection .mbAppSection-col:nth-last-child(1) {padding-left: 0; order: 1; margin-bottom: 3rem;}
}

@media (max-width: 500px) {
    #mbAppSection .mbAppSection-btn {width: 140px; max-width: 140px; min-width: 140px;}
}

/*//////////////////////////////////*/
/*///////////// FOOTER /////////////*/
/*//////////////////////////////////*/

#footer {position: relative; background-color: rgba(var(--primary), 1);}
#footer .footer-inner {position: relative;}
#footer .footer-main {display: flex; flex-flow:  row nowrap; justify-content: space-between; width: 100%;}

#footer .footer-logo {flex: 0; padding-right: 3rem;}
#footer .footer-logo-img {width: 160px; max-width: 160px; min-width:  160px;}

#footer .footer-content {flex: 1; max-width: 1100px;}
#footer .footer-row {display: flex; flex-flow: row nowrap; justify-content: end; align-items: start; width: 100%;}
#footer .footer-col {flex: 1;}
#footer .footer-col.mw-220 {min-width: 220px;}
#footer .footer-col.app-btn-col {max-width: 162px;}

#footer .footer-list {display: block; margin: 0; padding: 0; list-style: none;}
#footer .footer-list-item {list-style: none; margin-bottom: 0.5rem; text-align: left; font-size: 0;}
#footer .footer-list-item:nth-last-child(1) {margin-bottom: 0;}
#footer .footer-list-link {
    position: relative;
    display: inline-block;
    text-align: inherit;
    font-size: 1rem;
    color: rgba(var(--white), 1);
    text-decoration: none;
}

#footer .footer-list-link::before {
    content: "";
    position: absolute;
    top: 100%;
    left: 0;
    width: 30%;
    height: 1px;
    background-color: rgba(var(--white), 0);
    -webkit-transition: all 250ms ease-out;
    -moz-transition: all 250ms ease-out;
    -ms-transition: all 250ms ease-out;
    -o-transition: all 250ms ease-out;
    transition: all 250ms ease-out;
}

#footer .footer-list-link:hover::before {width: 100%; background-color: rgba(var(--white), 0.8);}
#footer .footer-app-btn {
    display: inline-block;
    width: 160px;
    padding: 0 4px;
    border: 1px solid #fff;
    border-radius: 8px;
}

#footer .footer-app-btn:hover {background-color: rgba(var(--white), 0.2);}
#footer .footer-bottom {
    position: relative;
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    border-top: 1px solid rgba(var(--white), 0.2);
    margin-top: 2rem;
    padding-top: 1rem;
    color: rgba(var(--white), 1);
}

@media (max-width: 1000px){
    #footer .footer-logo {padding-right: 2rem;}
    #footer .footer-logo-img {width: 130px; max-width: 130px; min-width:  130px;}
    #footer .footer-app-btn {width: 135px; padding: 0;}
    #footer .footer-col.app-btn-col {max-width: 137px;}
}

@media (max-width: 950px){
    #footer .footer-logo {padding-right: 0; padding-bottom: 2rem;}
    #footer .footer-main {flex-flow: column wrap; align-items: center;}
    #footer .footer-row {flex-flow: row wrap; align-items: stretch;}
    #footer .footer-col {
        width: 50%;
        min-width: calc(50% - 1rem) !important;
        max-width: 50%;
        padding: 1rem;
        border: 1px solid rgba(var(--white), 0.2);
        background-color: rgba(var(--white), 0.05);
        margin: 0.5rem;
        border-radius: 10px;
        box-sizing: border-box;
    }

    #footer .footer-content {width: 100%; max-width: none;}
}

@media (max-width: 650px){
    #footer .footer-row {flex-flow: column wrap; align-items: center;}
    #footer .footer-list-item {text-align: center;}
    #footer .footer-col {
        text-align: center;
        width: 100%;
        max-width: none;
    }
    #footer h4 {text-align: center;}
    #footer .footer-col.app-btn-col {max-width: none;}
    #footer .footer-bottom {flex-flow: column wrap; align-items: center;}
    #footer .footer-bottom-text {margin-bottom: 1rem;}
}

/*///////////////////////////////////*/
/*////////// SOCIAL WIDGET //////////*/
/*///////////////////////////////////*/

.socialsWidget {position: relative;}
.socialsWidget .socialsWidget-list {display: flex; flex-flow: row wrap; align-items: center; margin: 0; padding: 0; max-width: 100%;}
.socialsWidget .socialsWidget-item {list-style: none; margin-left: 0.4rem; margin-right: 0.4rem;}
.socialsWidget .socialsWidget-link {opacity: 1;}
.socialsWidget .socialsWidget-link svg {width: 1.5rem; height: 1.5rem; fill: rgba(var(--white), 1);}
.socialsWidget .socialsWidget-link i {width: 1.5rem; height: 1.5rem; color: rgba(var(--white), 1);}
.socialsWidget .socialsWidget-link:hover {opacity: 0.6;}

/*/////////////////////////////////*/
/*/////////// SEARCH BAR //////////*/
/*/////////////////////////////////*/

#searchBar {position: relative; z-index: 10;}
#searchBar .searchBar-inner {position: relative; padding-top: 2rem;}
#searchBar .searchBar-container {
    padding: 1.5rem 2rem;
    border-radius: 10px;
    box-shadow: 0 4px 16px 0 rgba(0, 0, 0, 0.16);
    background-color: rgba(var(--background), 1);
}

#searchBar .searchBar-form {display: flex; width: 100%; flex-flow: row nowrap; align-items: center; justify-content: space-between}
#searchBar .searchBar-main {display: flex; width: 100%; flex-flow: row nowrap; max-width: 900px;}
#searchBar .searchBar-filters {display: flex; flex-flow: row nowrap; padding-left: 1rem;}

#searchBar .searchBar-item {flex: 1;}
#searchBar .searchBar-item.input:nth-child(1) {padding-right: 0.5rem;}
#searchBar .searchBar-item.input:nth-child(2) {padding-left: 0.5rem;}
#searchBar .searchBar-item.button {flex: 0; padding-left: 1rem;}

@media (max-width: 1000px) {
    #searchBar .searchBar-form {flex-flow: column;}
    #searchBar .searchBar-filters {padding-left: 0; padding-top: 1rem; justify-content: end; width: 100%;}
}

@media (max-width: 750px) {
    #searchBar .searchBar-main {flex-flow: column; justify-content: center; align-items: center;}
    #searchBar .searchBar-item.input {width: 100%;}
    #searchBar .searchBar-item.input:nth-child(1) {padding-right: 0; padding-bottom: 1rem;}
    #searchBar .searchBar-item.input:nth-child(2) {padding-left: 0;}
    #searchBar .searchBar-item.button {padding-left: 0; padding-top: 1rem;}
    #searchBar .searchBar-filters {justify-content: center;}
}

@media (max-width: 500px){
    #searchBar .searchBar-container {
        padding: 1.5rem 1.5rem;
    }
}

/*//////////////////////////////////////*/
/*/////////// RESULTS SECTION //////////*/
/*//////////////////////////////////////*/

#resultsSection {position: relative; background-color: rgba(var(--background), 1);}
#resultsSection .resultsSection-inner {position: relative;}
#resultsSection .resultsSection-summary {color: rgba(var(--primary), 1); font-weight: 600;}
#resultsSection .resultsSection-summary span.highlight {color: rgba(var(--spot1), 1);}
#resultsSection .resultsSection-end-summary {color: rgba(var(--primary), 1);}

#resultsSection .resultsSection-list {display: flex; flex-flow: row wrap; width: calc(100% + 2rem); margin-left: -1rem; margin-right: -1rem;}
#resultsSection .resultsSection-list .resultsSection-item {width: 33.33%; min-width: 33.33%; box-sizing: border-box; padding: 1rem;}

#resultsSection .resultsSection-no-results {display: flex; flex-flow: row nowrap; align-items: center;}
#resultsSection .resultsSection-no-results img {width: 200px; min-width: 200px; max-width: 200px; margin-right: 3rem;}
#resultsSection .resultsSection-no-results-cont {flex: 1;}
#resultsSection .resultsSection-no-results-heading {
    display: block;
    font-size: 2rem;
    color: rgba(var(--primary), 1);
}

/*////////// SIDE MENU LAYOUT //////////*/
#resultsSection .resultsSection-layout {position: relative; display: flex; flex-flow: row nowrap;}
#resultsSection .resultsSection-side {
    position: sticky;
    left: 0;
    top: 85px;
    width: 350px;
    min-width: 350px;
    background-color: rgba(var(--background-secondary), 1);
    margin-right: 3rem;
    height: calc(100vh - 110px);
    border-radius: 10px;
    overflow: auto;
}

#resultsSection .resultsSection-content {position: relative; width: 100%;}
#resultsSection .resultsSection-heading {
    padding: 0.6rem 1rem;
    border-bottom: 2px solid rgba(0,0,0,0.1);
    font-size: 1rem;
    font-weight: 600;
    color: rgba(var(--primary), 1);
}

/*///// CUSTOM TREE /////*/
.v-list.customTree {background-color: transparent;}
.v-list.customTree > .v-list-group.v-list-group--open > .v-list-group__items > .v-list-group.v-list-group--open > .v-list-item.v-list-group__header {
    padding-left: 16px !important;
    padding-inline-start: 16px !important;
}

.v-list.customTree > .v-list-group.v-list-group--open > .v-list-group__items > .v-list-group.v-list-group--open > .v-list-group__items  > .v-list-item {
    padding-left: 40px !important;
    padding-inline-start: 40px !important;
}

.customTree .v-list-group:has([aria-selected="true"]) > .v-list-group__header .v-list-item-title,
.customTree .v-list-group:has([aria-selected="true"]) > .v-list-group__header .v-list-item__prepend {
    color: rgba(var(--primary), 1);
}

.floatingFilterBtn {
    position: fixed;
    bottom: 1rem;
    right: 1rem;
    opacity: 0;
    pointer-events: none;
    z-index: 10;
}

/*///// ON PAGE LOADER /////*/
#resultsSection .resultsOnPageLoader {
    position: absolute;
    top: 0;
    margin-left: -15px;
    width: calc(100% + 30px);
    height: calc(100vh);
    background-color: rgba(var(--background-secondary), 1);
    border-radius: 10px;
    z-index: 5;
    display: flex;
    justify-content: center;
    opacity: 0;
    pointer-events: none;
}

#resultsSection .resultsOnPageLoader.loading {
    position: sticky;
    opacity: 1;
    pointer-events: auto;
}

#resultsSection .resultsOnPageLoader .css-loader {margin-top: 6rem;}

@media (max-width: 1450px) {
    #resultsSection .ubaListing-card .ubaListing-cont h3 {font-size: 1.2rem;}
    #resultsSection .ubaListing-card .ubaListing-logo {width: 25%;}
    #resultsSection .resultsSection-list .resultsSection-item {padding: 0.6rem;}
    #resultsSection .resultsSection-list {width: calc(100% + 1.2rem); margin-left: -0.6rem; margin-right: -0.6rem;}
    #resultsSection .resultsSection-side {margin-right: 2rem; width: 300px; min-width: 300px;}
    #resultsSection .ubaListing-card .ubaListing-location {font-size: 0.9rem;}
    #resultsSection .v-list.customTree .v-list-item-title {font-size: 0.9rem;}
    #resultsSection .v-list.customTree .v-list-item__prepend {width: 24px;}
    .v-list.customTree > .v-list-group.v-list-group--open > .v-list-group__items > .v-list-group.v-list-group--open > .v-list-group__items  > .v-list-item {
        padding-left: 22px !important;
        padding-inline-start: 22px !important;
    }
}

@media (max-width: 1250px) {
    #resultsSection .resultsSection-list .resultsSection-item {width: 50%; min-width: 50%;}
}

@media (max-width: 960px){
    #resultsSection .resultsSection-no-results-heading {font-size: 1.5rem;}
    #resultsSection .resultsSection-side {
        position: fixed;
        top: 0;
        left: -310px;
        height: 100vh;
        z-index: 90;
        -webkit-transition: left 250ms ease-out;
        -moz-transition: left 250ms ease-out;
        -ms-transition: left 250ms ease-out;
        -o-transition: left 250ms ease-out;
        transition: left 250ms ease-out;
        box-sizing: border-box;
        -webkit-box-shadow: 0 0 10px 0 rgba(0,0,0,0.2);
        box-shadow: 0 0 10px 0 rgba(0,0,0,0.2);
    }
    #resultsSection .resultsSection-layout.showMenu .resultsSection-side {left: 0;}
    #resultsSection .resultsSection-heading {
        padding-top: 90px;
        position: sticky;
        top: 0;
        z-index: 10;
        background-color: rgba(var(--background-secondary), 1);
    }

    .floatingFilterBtn.show {
        opacity: 1;
        pointer-events: auto;
    }
}

@media (max-width: 600px){
    #resultsSection .resultsSection-no-results {flex-flow: column;}
    #resultsSection .resultsSection-no-results img {margin-right: 0; margin-bottom: 1rem;}
    #resultsSection .resultsSection-no-results-cont {text-align: center;}
}

@media (max-width: 700px) and (min-width: 550px) {
    #resultsSection .resultsSection-list {width: calc(100% + 1rem); margin-left: -0.5rem; margin-right: -0.5rem;}
    #resultsSection .resultsSection-list .resultsSection-item {padding: 0.5rem;}
    .ubaListing-card .ubaListing-cont h3 {font-size: 1.1rem;}
    .ubaListing-card .ubaListing-location {font-size: 0.8rem}
    .ubaListing-card .ubaListing-category {font-size: 0.8rem}
    .ubaListing-card .ubaListing-logo {width: 25%;}
    .ubaListing-card .ubaListing-premium span {font-size: 0;}
    .ubaListing-card .ubaListing-premium span::after {
        content: "Premium";
        font-size: 0.8rem;
    }
}

@media (max-width: 550px){
    #resultsSection .resultsSection-list .resultsSection-item {width: 100%; min-width: 100%;}
    #resultsSection .resultsSection-no-results img {width: 150px; min-width: 150px; max-width: 150px;}
}

@media (max-width: 400px){
    .ubaListing-card .ubaListing-logo {width: 25%;}
}

/*////////////////////////////////////////*/
/*/////////// CUSTOM PAGINATION //////////*/
/*////////////////////////////////////////*/

.v-pagination.custom-pagination .v-pagination__item .v-btn {
    border: 1px solid rgba(var(--spot4), 0.5);
    color: rgba(var(--secondary), 1);
    -webkit-transition: border 250ms ease-out;
    -moz-transition: border 250ms ease-out;
    -ms-transition: border 250ms ease-out;
    -o-transition: border 250ms ease-out;
    transition: border 250ms ease-out;
}

.v-pagination.custom-pagination .v-pagination__item .v-btn:hover {border-color: rgba(var(--spot4), 1);}
.v-pagination.custom-pagination .v-pagination__item .v-btn .v-btn__overlay {background-color: transparent;}
.v-pagination.custom-pagination .v-pagination__item.v-pagination__item--is-active .v-btn {
    border-color: rgba(var(--spot1), 1);
    color: rgba(var(--spot1), 1);
    background-color: transparent;
}

.v-pagination.custom-pagination .v-pagination__next .v-btn,
.v-pagination.custom-pagination .v-pagination__prev .v-btn {
    border: 1px solid rgba(var(--spot4), 0.5);
    color: rgba(var(--secondary), 1);
    -webkit-transition: border 250ms ease-out;
    -moz-transition: border 250ms ease-out;
    -ms-transition: border 250ms ease-out;
    -o-transition: border 250ms ease-out;
    transition: border 250ms ease-out;
}

.v-pagination.custom-pagination .v-pagination__next .v-btn .v-icon,
.v-pagination.custom-pagination .v-pagination__prev .v-btn .v-icon {
    color: rgba(var(--secondary), 1);
}

/*////////////////////////////////////////*/
/*/////////// STAGE INNER PAGES //////////*/
/*////////////////////////////////////////*/

#stageIn {position: relative; background-size: cover; background-position: 50%; background-repeat: no-repeat;}
#stageIn::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.25);
}
#stageIn .stageIn-inner {
    position: relative;
    z-index: 5;
    display: flex;
    flex-flow: column;
    justify-content: center;
    align-items: center;
    min-height: 350px;
}
#stageIn .stageIn-heading {text-align: center; color: rgba(var(--white), 1); margin-bottom: 1rem;}
#stageIn .stageIn-text {
    text-align: center;
    font-weight: 600;
    color: rgba(var(--white), 1);
    max-width: 800px;
    margin: 0 auto;
}

@media (max-width: 950px){
    #stageIn .stageIn-inner {min-height: 300px;}
}

/*////////////////////////////////////////*/
/*////////////// MEDIA LEFT //////////////*/
/*////////////////////////////////////////*/

#mediaLayout {position: relative;}
#mediaLayout .mediaLayout-inner {position: relative;}
#mediaLayout .mediaLayout-row {display: flex; flex-flow: row nowrap; align-items: center;}
#mediaLayout .mediaLayout-col {flex: 1;}
#mediaLayout .mediaLayout-col.image {max-width: 600px; padding-right: 6rem;}
#mediaLayout .mediaLayout-col .mediaLayout-image {
    box-shadow: 0 4px 24px 0 rgba(0, 0, 0, 0.16);
    border-radius: 10px;
    overflow: hidden;
}

#mediaLayout.noShadow .mediaLayout-col .mediaLayout-image {
    box-shadow: none;
}

#mediaLayout.right .mediaLayout-col.image {order: 2; padding-right: 0; padding-left: 6rem;}
#mediaLayout.right .mediaLayout-col.content {order: 1;}

@media (max-width: 1150px){
    #mediaLayout .mediaLayout-col.image {max-width: 400px; padding-right: 3rem;}
    #mediaLayout.right .mediaLayout-col.image {padding-right: 0; padding-left: 3rem;}
}

@media (max-width: 850px){
    #mediaLayout .mediaLayout-row {flex-flow: column;}
    #mediaLayout .mediaLayout-col.image {padding-right: 0; padding-bottom: 3rem;}
    #mediaLayout.right .mediaLayout-col.image {padding-left: 0; order: 1;}
    #mediaLayout.right .mediaLayout-col.content {order: 2;}
    #mediaLayout .mediaLayout-col.content {text-align: center;}
}

/*////////////////////////////////////////*/
/*/////// COMPARISON TABLE SECTION ///////*/
/*////////////////////////////////////////*/

#compTableSec {
    position: relative;
    background-color: rgba(var(--background-secondary), 1);
    background-image: url('../images/africa-patter-watermark.png');
    background-size: 600px;
    background-repeat: no-repeat;
    background-position: right center;
}
#compTableSec .compTableSec-inner {position: relative;}
.comparisonTable-card {
    position: relative;
    background-color: rgba(var(--background), 1);
    border-radius: 10px;
    box-shadow: 0 4px 16px 0 rgba(0, 0, 0, 0.16);
    padding: 2rem;
    max-width: 1250px;
    margin: 0 auto;
    overflow-y: auto;
    box-sizing: border-box;;
}

table.comparisonTable {width: 100%;}
table.comparisonTable thead th img {width: 1.5rem; display: inline-block; margin-right: 0.5rem; vertical-align: middle; margin-top: -0.2rem;}
table.comparisonTable thead th {
    text-align: left;
    font-size: 1rem;
    text-transform: uppercase;
    color: rgba(var(--primary), 1);
    font-weight: 600;
    vertical-align: middle;
    min-width: 200px;
    border-bottom: 2px solid rgba(0,0,0,0.1);
}

table.comparisonTable thead th,
table.comparisonTable tbody td {padding: 0.5rem 1rem;}
table.comparisonTable thead th {padding-bottom: 1rem;}
table.comparisonTable tbody tr:nth-child(1) td {padding-top: 1rem;}
table.comparisonTable thead th:nth-child(1) {min-width: 100%;}
table.comparisonTable tbody td {color: rgba(var(--primary), 1); font-weight: 600; font-size: 1rem;}
table.comparisonTable tbody tr:hover {background-color: rgba(0,0,0,0.05);}
.v-tooltip {font-size: 1rem;}

table.comparisonTable .v-icon.checked {color: rgba(var(--primary), 1);}
table.comparisonTable .v-icon.not-checked {color: rgba(var(--spot1), 1);}

table.comparisonTable .v-badge.hide-badge .v-badge__badge {display: none;}
table.comparisonTable .v-badge .v-badge__badge {padding: 0; bottom: calc(100% - 14px) !important; left: calc(100% - 2px) !important;}
table.comparisonTable .v-badge .v-badge__badge .v-icon {font-size: 1rem; color: rgba(var(--black), 0.5);}

@media (max-width: 1050px) {
    table.comparisonTable thead th {min-width: 155px;}
    table.comparisonTable thead th:nth-child(1) {min-width: 200px;}
}


/*/////////////////////////////////*/
/*///////// BOTTOM BANNER /////////*/
/*/////////////////////////////////*/

#bottomBanner {
    position: relative;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: 50%;
}

#bottomBanner::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    background: linear-gradient(0deg, rgba(240, 181, 55, 0.75) 0%, rgba(240, 181, 55, 0.75) 100%);
}

#bottomBanner .bottomBanner-inner {
    position: relative;
    display: flex;
    flex-flow: row wrap;
    align-items: center;
    width: 100%;
    min-height: 450px;
    text-align: center;
}

#bottomBanner .bottomBanner-content {width: 100%;}

/*//////////////////////////////////////*/
/*///////// CUSTOM BREADCRUMBS /////////*/
/*//////////////////////////////////////*/

.v-breadcrumbs.custom-breadcrumbs {padding: 0;}
.v-breadcrumbs.custom-breadcrumbs .v-breadcrumbs-item {cursor: default; font-size: 0.9rem;}
.v-breadcrumbs.custom-breadcrumbs li.v-breadcrumbs-item:nth-child(1) {padding-left: 0;}
.v-breadcrumbs.custom-breadcrumbs .v-breadcrumbs-item.v-breadcrumbs-item--disabled {color: rgba(var(--text), 1) !important;}
ul.v-breadcrumbs:empty {display: none !important;}

/*//////////////////////////////////////*/
/*////////// CATEGORY BANNER ///////////*/
/*//////////////////////////////////////*/

#categoryBanner {position: relative; margin-top: calc(-4rem - 30px); margin-bottom: 2rem;}
#categoryBanner .categoryBanner-overlay {
    position: absolute;
    background-color: rgba(var(--black), 0.05);
    z-index: 5;
    top: 0;
    left: 50%;
    width: 100%;
    height: 100%;
    display: flex;
    flex-flow: row wrap;
    align-items: center;
    justify-content: center;
    text-align: center;
    -moz-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
}

#categoryBanner .categoryBanner-overlay h1 {
    color: rgba(var(--white), 1);
    font-size: 4rem;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-top: 30px;
    line-height: 1.3;
    text-align: center;
}

#categoryBanner img {
    max-height: 300px;
    min-height: 250px;
    object-fit: cover;
    object-position: 50%;
    width: 100%;
}

@media (max-width: 1450px){
    #categoryBanner .categoryBanner-overlay h1 {font-size: 3rem;}
    #categoryBanner img {max-height: 250px;}
}

@media (max-width: 700px) {
    #categoryBanner .categoryBanner-overlay h1 {font-size: 2rem;}
}

/*//////////////////////////////////////*/
/*/////////// CATEGORY GRID ////////////*/
/*//////////////////////////////////////*/

#categoryGrid {position: relative;}
#categoryGrid .categoryGrid-inner {position: relative;}
#categoryGrid .categoryGrid-row {
    display: flex;
    width: calc(100% + 3rem);
    flex-flow: row wrap;
    justify-content: start;
    align-items: start;
    margin-left: -1.5rem;
    margin-right: -1.5rem;
}

#categoryGrid .categoryGrid-item {width: 20%; max-width: 20%; min-width: 20%; padding: 1.5rem; box-sizing: border-box;}

@media (max-width: 1350px) {
    #categoryGrid .categoryGrid-row {
        width: calc(100% + 2rem);
        margin-left: -1rem;
        margin-right: -1rem;
    }
    #categoryGrid .categoryGrid-item {padding: 1rem;}
}

@media (max-width: 1200px) {
    #categoryGrid .categoryGrid-item {width: 25%; max-width: 25%; min-width: 25%;}
}

@media (max-width: 1000px) {
    #categoryGrid .categoryGrid-item {width: 33.33%; max-width: 33.33%; min-width: 33.33%;}
}

@media (max-width: 750px){
    #categoryGrid .categoryGrid-row {
        width: calc(100% + 1rem);
        margin-left: -0.5rem;
        margin-right: -0.5rem;
    }
    #categoryGrid .categoryGrid-item {padding: 0.5rem;}
}

@media (max-width: 650px) {
    #categoryGrid .categoryGrid-item {width: 50%; max-width: 50%; min-width: 50%;}
}

@media (max-width: 450px) {
    #categoryGrid .categoryGrid-item .categoryCard .categoryCard-caption {font-size: 0.8rem; padding: 0.25rem 0.5rem;}
    #categoryGrid .categoryGrid-row {
        width: calc(100% + 0.5rem);
        margin-left: -0.25rem;
        margin-right: -0.25rem;
    }
    #categoryGrid .categoryGrid-item {padding: 0.25rem;}
}

/*//////////////////////////////////////*/
/*//////// CATEGORY DESCRIPTION ////////*/
/*//////////////////////////////////////*/

#categoryDescription {position: relative;}
#categoryDescription .categoryDescription-inner {position: relative;}

/*//////////////////////////////////*/
/*////////// FORM SECTION //////////*/
/*//////////////////////////////////*/

#formSection {position: relative; background-color: rgba(var(--background-blue), 1);}
#formSection.bg-white {background-color: rgba(var(--background), 1);}
#formSection .formSection-inner {position: relative;}
#formSection .formSection-form {position: relative;}
#formSection .formSection-row {position: relative; display: flex; flex-flow: row nowrap; align-items: stretch;}
#formSection .formSection-col {box-sizing: border-box;}
#formSection .formSection-col.side {padding-right: 3rem; width: 40%; max-width: 40%; min-width: 40%;}
#formSection .formSection-col.content {padding-left: 3rem; width: 60%; max-width: 60%; min-width: 60%;}

@media (max-width: 950px){
    #formSection .formSection-row {flex-flow: column;}
    #formSection .formSection-col.side {padding-right: 0; width: 100%; max-width: 100%; min-width: 100%; margin-bottom: 3rem;}
    #formSection .formSection-col.content {padding-left: 0; width: 100%; max-width: 100%; min-width: 100%;}
}

#submissionNote {position: relative; background-color: rgba(var(--background-blue), 1);}
#submissionNote .submissionNote-inner {position: relative; text-align: center;}
#submissionNote .submissionNote-icon {width: 3rem; display: inline-block;}

/*//////////////////////////////////*/
/*////////// BASIC SECTION /////////*/
/*//////////////////////////////////*/

.basicSection {position: relative;}
.basicSection.bg-position-bottom,
.basicSection.bg-position-top,
.basicSection.bg-position-center {background-size: cover; background-repeat: no-repeat; }
.basicSection.bg-position-bottom {background-position: bottom center;}
.basicSection.bg-position-top {background-position: top center;}
.basicSection.bg-position-center {background-position: 50%;}

.basicSection.background--default {background-color: rgba(var(--background), 1);}
.basicSection.background--secondary {background-color: rgba(var(--background-secondary), 1);}
.basicSection.background--blue {background-color: rgba(var(--background-blue), 1);}
.basicSection .basicSection-inner {position: relative;}
.basicSection .basicSection-inner.full-screen {min-height: calc(100vh - 80px); box-sizing: border-box;}

/*/////////////////////////////////*/
/*////////// LISTING INFO /////////*/
/*/////////////////////////////////*/

#listingInfo {position: relative;}
#listingInfo .listingInfo-inner {position: relative;}
#listingInfo .listingInfo-row {display: flex; flex-flow: nowrap;}
#listingInfo .listingInfo-col.images {width: 500px; min-width: 500px; max-width: 500px; padding-right: 2rem;}
#listingInfo .listingInfo-col.content {flex: 1;}

/*///// PAGE IMAGES /////*/
#listingInfo .listingInfo-image {position: relative; border-radius: 10px; overflow: hidden;}

/*///// PAGE HEADER /////*/
#listingInfo .listingHeader {position: relative; display: flex; flex-flow: row nowrap; align-items: end;}
#listingInfo .listingHeader-logo {
    width: 125px;
    max-width: 125px;
    min-width: 125px;
    border: 3px solid rgba(var(--white), 1);
    border-radius: 8px;
    overflow: hidden;
    background-color: rgba(var(--white), 1);
    box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.16);
}

#listingInfo .listingHeader-heading {flex: 1; padding-left: 1rem;}
#listingInfo .listingHeader-heading h1 {line-height: 1.3; font-size: 2.5rem;}
#listingInfo .listingHeader-verified-icon {width: 1.5rem;}

/*///// ICON TEXT & ROWS /////*/
#listingInfo .listingInfo-iconText {display: flex; flex-flow: row nowrap; align-items: start; color: rgba(var(--text), 1); cursor: default}
#listingInfo .listingInfo-iconText .v-icon {color: inherit; font-size: 1.5rem; margin-right: 0.5rem;}
#listingInfo .listingInfo-iconText span {display: block; flex: 1; font-size: 1rem; color: inherit;}
#listingInfo a.listingInfo-iconText {position: relative; cursor: pointer;}
#listingInfo a.listingInfo-iconText:hover {color: rgba(var(--spot1), 1);}
#listingInfo .listingInfo-iconText-hold {position: relative; cursor: pointer;}
#listingInfo .listingInfo-iconText-hold * {pointer-events: none;}
#listingInfo .listingInfo-iconText-hold.showing {pointer-events: none;}
#listingInfo .listingInfo-iconText-hold.showing * {pointer-events: auto;}

#listingInfo .listingInfo-iconRow {
    display: flex;
    flex-flow: row wrap;
    align-items: center;
    margin-left: -1rem;
    margin-Right: -1rem;
    width: calc(100% - 2rem);
}

#listingInfo .listingInfo-iconRow.mw-500 {max-width: calc(500px - 2rem);}
#listingInfo .listingInfo-iconCol {display: flex; padding: 0.5rem 1rem;}
#listingInfo .listingInfo-iconCol .v-btn {text-transform: none;}

/*///// SOCIAL SECTION /////*/
#listingInfo .listingSocials {
    display: flex;
    flex-flow: row wrap;
    align-items: center;
    width: calc(100% - 2rem);
    margin-left: -1rem;
    margin-right: -1rem;
}

#listingInfo .listingSocials-item {
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    cursor: pointer;
    padding: 0.5rem 1rem;
}
#listingInfo .listingSocials-icon {width: 1.5rem; max-width: 1.5rem; min-width: 1.5rem; margin-right: 0.5rem;}
#listingInfo .listingSocials-title {display: block; white-space: nowrap; font-size: 1rem; color: rgba(var(--text), 1);}
#listingInfo .listingSocials-item:hover .listingSocials-title {color: rgba(var(--primary), 1);}

/*///// CONNECT WRAP /////*/
#listingInfo .connect-wrap {position: relative;}
#listingInfo .connect-wrap.wrap-active {
    padding: 1rem 1rem 0.5rem 1rem;
    border: 1px solid rgba(var(--black), 0.1);
    border-radius: 10px;
}

#listingInfo .connect-wrap-label {
    display: none;
    position: absolute;
    top: -0.8rem;
    left: 1rem;
    background-color: rgba(var(--white), 1);
    flex-flow: row nowrap;
    font-size: 1rem;
    color: rgba(var(--text), 1);
    align-items: center;
    padding: 0 0.5rem;
}

#listingInfo .connect-wrap.wrap-active .connect-wrap-label {display: flex;}
#listingInfo .connect-wrap-label .v-icon {
    font-size: 1rem;
    color: inherit;
    margin-right: 0.5rem;
    -moz-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

/*///// SPECIAL OFFER /////*/
#listingInfo .specialOffer {position: relative;}
#listingInfo .specialOffer-inner {
    position: relative;
    background-color: rgba(var(--background-secondary), 1);
    border-radius: 10px;
    padding: 1rem;
}

#listingInfo .specialOffer-heading {display: flex; flex-flow: row nowrap; align-items: center;}
#listingInfo .specialOffer-heading img {width: 1.5rem; margin-right: 0.5rem;}
#listingInfo .specialOffer-heading span {
    font-size: 1rem;
    display: block;
    color: rgba(var(--text), 1);
    font-weight: 700;
}

#listingInfo .specialOffer-date {font-size: 0.9rem;}

/*///// DESCRIPTION SECTION /////*/
#listingInfo .descSection {position: relative;}
#listingInfo .descSection-inner {position: relative;}

/*///// 3 COLUMN GALLERY /////*/
#listingInfo .listingInfo-gallery {
    position: relative;
    display: flex;
    flex-flow: row nowrap;
    width: calc(100% + 2rem);
    margin-left: -1rem;
    margin-right: -1rem;
    margin-top: 1rem;
}

#listingInfo .listingInfo-gallery-item {
    flex: 1;
    max-width: 33.33%;
    box-sizing: border-box;
    padding: 1rem;
}

#listingInfo .listingInfo-gallery-image {
    position: relative;
    cursor: url('../images/zoom-cursor.png'), auto;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: 50%;
    border-radius: 8px;
    overflow: hidden;
}

#listingInfo .listingInfo-gallery-bg {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: 50%;
}

#listingInfo .listingInfo-gallery-image::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(var(--black), 0.2);
    opacity: 0;
    pointer-events: none;
    -webkit-transition: opacity 250ms ease-out;
    -moz-transition: opacity 250ms ease-out;
    -ms-transition: opacity 250ms ease-out;
    -o-transition: opacity 250ms ease-out;
    transition: opacity 250ms ease-out;
    z-index: 5;
}

#listingInfo .listingInfo-gallery-image:hover::before {opacity: 1;}
#listingInfo .listingInfo-gallery-image:hover .listingInfo-gallery-bg {
    -moz-transform: scale(1.2);
    -webkit-transform: scale(1.2);
    -o-transform: scale(1.2);
    -ms-transform: scale(1.2);
    transform: scale(1.2);
}

#listingInfo .listingInfo-gallery-image img {width: 100%;}

/*///// GALLERY SLIDER /////*/
#listingInfo .listingInfo-slider {margin-top: 2rem;}
#listingInfo .listingInfo-slider .swiper-pagination {bottom: 0 !important; top: auto !important;}
#listingInfo .listingInfo-slider .swiper-wrapper {padding-bottom: 44px;}

#listingInfo  .listingInfo-slider .swiper-pagination .swiper-pagination-bullet {
    background-color: rgba(var(--black), 0.2);
    border: 2px solid rgba(var(--white), 0);
}

#listingInfo  .listingInfo-slider .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
    background-color: rgba(var(--spot3), 1);
    border-color: rgba(var(--spot3), 1);
}

#listingInfo  .listingInfo-slider .swiper-button-prev,
#listingInfo  .listingInfo-slider .swiper-button-next {display: none !important;}

@media (max-width: 1250px) {
    #listingInfo .listingHeader-heading h1 {font-size: 2.2rem;}
    #listingInfo .listingInfo-col.images {width: 400px; min-width: 400px; max-width: 400px; padding-right: 1.5rem;}
    #listingInfo .listingHeader-logo {width: 100px; max-width: 100px; min-width: 100px;}
    #listingInfo .listingInfo-iconCol {padding-left: 0.5rem; padding-right: 0.5rem;}
    #listingInfo .listingInfo-iconRow {margin-left: -0.5rem; margin-Right: -0.5rem; width: calc(100% - 1rem);}
    #listingInfo .listingSocials-item {padding-left: 0.5rem; padding-right: 0.5rem;}
    #listingInfo .listingSocials {width: calc(100% - 1rem); margin-left: -0.5rem; margin-right: -0.5rem;}
}

@media (max-width: 1050px) {
    #listingInfo .listingInfo-row {flex-flow: column;}
    #listingInfo .listingInfo-col.images {padding-right: 0; padding-bottom: 2rem; width: 100%; max-width: 500px; min-width: 0; margin: 0 auto;}
}

@media (max-width: 600px){
    #listingInfo .listingHeader-heading h1 {font-size: 1.8rem;}
}

@media (max-width: 500px){
    #listingInfo .listingHeader-heading h1 {font-size: 1.5rem;}
}

@media (max-width: 400px){
    #listingInfo .listingHeader-heading h1 {font-size: 1.3rem;}
}

/*/////////////////////////////////*/
/*//////////// LIGHTBOX ///////////*/
/*/////////////////////////////////*/

/*///// BUTTONS /////*/
.lightboxCustom .v-btn.lightboxCustom-btn {position: absolute; z-index: 10;background-color: rgba(var(--black), 0.2);}
.lightboxCustom .v-btn.lightboxCustom-btn .v-icon {color: rgba(var(--white), 1)}
.lightboxCustom .v-btn.lightboxCustom-btn.close {top: 1rem;right: 1rem;}
.lightboxCustom .v-btn.lightboxCustom-btn.next,
.lightboxCustom .v-btn.lightboxCustom-btn.prev {
    top: 50%;
    -moz-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.lightboxCustom .v-btn.lightboxCustom-btn.next {right: 1rem;}
.lightboxCustom .v-btn.lightboxCustom-btn.prev {left: 1rem;}

/*///// COUNT /////*/
.lightboxCustom .lightboxCustom-count {
    position: absolute;
    bottom: 1rem;
    right: 1rem;
    padding: 0.5rem 1rem;
    border-radius: 50px;
    background-color: rgba(var(--black), 0.2);
}

.lightboxCustom .lightboxCustom-count span {
    display: block;
    font-size: 0.9rem;
    font-weight: 600;
    color: rgba(var(--white), 1);
}

/*/////////////////////////////////*/
/*////////// VIDEO PLAYER /////////*/
/*/////////////////////////////////*/

.customVideoPlayer-hold {
    position: relative;
    overflow: hidden;
    border-radius: 10px;
    background-color: #DEDEDE;
    background-image: url('../images/video-loader.gif');
    background-size: 30px;
    background-repeat: no-repeat;
    background-position: 50%;
}

.customVideoPlayer-hold .customVideoPlayer-overlay {
    position: absolute;
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    justify-content: center;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(var(--black), 0.1);
    z-index: 10;
    cursor: pointer;
}

.customVideoPlayer-hold .customVideoPlayer-overlay:hover {background-color: rgba(var(--black), 0.3);}
.customVideoPlayer-hold .customVideoPlayer-icon {width: 60px;height: 60px;}
.customVideoPlayer-hold .customVideoPlayer-overlay:hover .customVideoPlayer-icon {width: 80px;height: 80px;}
.customVideoPlayer-hold.playing .customVideoPlayer-overlay {opacity: 0 !important;}

.customVideoPlayer-hold .customVideoPlayer-iframe {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 5;
    border: 2px solid rgba(var(--black), 0.2);
    width: 100%;
    height: 100%;
    border-radius: 10px;
    overflow: hidden;
}

.customVideoPlayer-hold.playing .customVideoPlayer-thumbnail {opacity: 0;}

/*////////////////////////////////*/
/*////////// MAP SECTION /////////*/
/*////////////////////////////////*/

.mapSection {position: relative;}
.mapSection .mapSection-inner {position: relative;}
.mapSection .mapSection-card {box-shadow: 0 4px 16px 0 rgba(0, 0, 0, 0.16); border-radius: 20px; padding: 10px;}
.mapSection .mapSection-card-inner {border-radius: 10px; overflow: hidden; background-color: rgba(var(--black), 0.2);}
.mapSection .mapSection-card-error {
    display: flex;
    flex-flow: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    height: 100%;
    width: 100%;
}

.mapSection .mapSection-card-error span {font-size: 1.5rem; font-weight: 600; color: rgba(var(--black), 0.5);}
.mapSection .mapSection-card-error p {color: rgba(var(--black), 0.5);}

/*/////////////////////////////////////////*/
/*////////// QUESTIONS & COMMENTS /////////*/
/*/////////////////////////////////////////*/

#commentsSection {position: relative;}
#commentsSection .commentsSection-inner {position: relative;}
#commentsSection .commentForm {
    padding: 1.5rem 2rem;
    background-color: rgba(var(--background-secondary), 1);
    border-radius: 10px;
}

#commentsSection .commentsList-no-comments {
    padding: 1rem;
    border: 1px solid rgba(var(--black), 0.1);
    border-radius: 10px;
}

.commentsCard {
    position: relative;
    padding: 1rem;
    box-sizing: border-box;
    border: 1px solid rgba(var(--black), 0.1);
    border-radius: 15px;
    margin-bottom: 1.5rem;
}

.commentsCard .commentsCard-details {
    display: flex;
    flex-flow: row wrap;
    align-items: center;
    width: 100%;
    justify-content: start;
    margin-bottom: 0.5rem;
}

.commentsCard .commentsCard-name {
    font-size: 1.15rem;
    font-weight: 600;
    color: rgba(var(--text), 1);
    margin-right: 1rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

.commentsCard .commentsCard-date {
    font-size: 0.9rem;
    color: rgba(var(--textLight), 1);
    font-weight: 400;
    white-space: nowrap;
}

.commentsCard .commentsCard-comment,
.commentsCard .commentsCard-response {font-size: 0.9rem;}
.commentsCard .commentsCard-response {color: rgba(var(--primary), 1);}
.commentsCard .commentsCard-responseHold {
    position: relative;
    padding: 1rem;
    background-color: rgba(var(--background-blue), 1);
    border-radius: 10px;
    border-left: 3px solid rgba(var(--primary), 1);
    margin-top: 1rem;
}

.commentsCard .commentsCard-responseHeading {
    display: block;
    font-size: 0.9rem;
    color: rgba(var(--primary), 1);
    text-transform: uppercase;
    font-weight: 400;
}

.commentsCard .commentsCard-business {
    display: block;
    font-size: 1rem;
    font-weight: 700;
    color: rgba(var(--spot6), 1);
    margin-bottom: 0.5rem;
}

/*///// DASHBOARD COMMENT CARD /////*/
.dashboard-comments .commentsCard .commentsCard-details {flex-flow: column; align-items: start;}
.dashboard-comments .commentsCard .commentsCard-date {
    display: block;
    font-size: 0.8rem;
    color: rgba(var(--textExtraLight), 1);
    white-space: normal;
    word-break: break-word;
}
.dashboard-comments .commentsCard .commentsCard-response {color: rgba(var(--text), 1);}
.dashboard-comments .commentsCard .commentsCard-responseHeading {color: rgba(var(--spot6), 1);}

.dashboard-comments .commentsCard .commentsCard-submit .commentsCard-responseHeading {text-transform: capitalize;}
.dashboard-comments .commentsCard .commentsCard-submit {
    position: relative;
    padding: 1rem;
    background-color: rgba(var(--background-secondary), 1);
    border-radius: 10px;
    border: 1px solid rgba(var(--black), 0.16);
    margin-top: 1rem;
}

.dashboard-comments .commentsCard.highlight {
    background-color: rgba(var(--primary), 0.05);
    border: 1px solid rgba(var(--primary), 0.5);
}

.dashboard-comments .commentsCard .commentsCard-details-hold {
    display: flex;
    flex-flow: row nowrap;
    align-items: start;
    justify-content: space-between;
}

.dashboard-comments .commentsCard .commentsCard-status {
    border: 1px solid rgba(var(--textLight), 1);
    padding: 0.3rem 0.5rem;
    border-radius: 6px;
    font-size: 0.75rem;
    font-weight: 600;
    color: rgba(var(--textLight), 1);
    white-space: nowrap;
}

.dashboard-comments .commentsCard .commentsCard-status.live {
    color: rgba(var(--success), 1);
    border-color: rgba(var(--success), 1);
    background-color: rgba(var(--success), 0.1);
}

.dashboard-comments .commentsCard .commentsCard-status.awaiting {
    color: rgba(var(--spot1), 1);
    border-color: rgba(var(--spot1), 1);
    background-color: rgba(var(--spot1), 0.1);
}

.dashboard-comments .commentsCard .commentsCard-status.disputed {
    color: rgba(var(--spot7), 1);
    border-color: rgba(var(--spot7), 1);
    background-color: rgba(var(--spot7), 0.1);
}

.dashboard-comments .commentsCard .commentsCard-name {
    white-space: normal;
}


@media (max-width: 450px){
    .dashboard-comments .commentsCard .commentsCard-details-hold {flex-flow: column;}
    .dashboard-comments .commentsCard .commentsCard-details {order: 2;}
    .dashboard-comments .commentsCard .commentsCard-status {order: 1; margin-bottom: 0.2rem;}
}


/*/////////////////////////////////////////*/
/*////////// DUAL COLUMNS SECTION /////////*/
/*/////////////////////////////////////////*/

.dualColumn {position: relative; background-color: rgba(var(--background-blue), 1);}
.dualColumn .dualColumn-inner {position: relative;}
.dualColumn .dualColumn-row {display: flex; flex-flow:  row nowrap; align-items: stretch;}
.dualColumn .dualColumn-col {flex: 1;}
.dualColumn .dualColumn-col:nth-child(odd) {padding-right: 2rem;}
.dualColumn .dualColumn-col:nth-child(even) {padding-left: 2rem;}
.dualColumn .dualColumn-col-inner {
    min-height: 100%;
    position: relative;
    background-color: rgba(var(--white), 1);
    box-shadow: 0 4px 16px 0 rgba(0, 0, 0, 0.16);
    border-radius: 15px;
    padding: 1.5rem;
}

.dualColumn .dualColumn-heading {
    padding-bottom: 1rem;
    margin-bottom: 1.5rem;
    border-bottom: 1px solid rgba(var(--black), 0.1);
}

@media(max-width: 1150px) {
    .dualColumn .dualColumn-col:nth-child(odd) {padding-right: 1rem;}
    .dualColumn .dualColumn-col:nth-child(even) {padding-left: 1rem;}
}

@media(max-width: 950px) {
    .dualColumn .dualColumn-row {flex-flow: column;}
    .dualColumn .dualColumn-col:nth-child(odd) {padding-right: 0; padding-bottom: 2rem;}
    .dualColumn .dualColumn-col:nth-child(even) {padding-left: 0;}
}

/*/////////////////////////////////////////*/
/*////////// JOIN NETWORK SECTION /////////*/
/*/////////////////////////////////////////*/

#joinNetworkSection {
    position: relative;
    background-color: rgba(var(--background-secondary), 1);
    background-image: url('../images/africa-patter-watermark.png');
    background-size: 593px;
    background-repeat: no-repeat;
    background-position: right 2.5rem top 5rem;
}
#joinNetworkSection .joinNetworkSection-inner {position: relative;}
#joinNetworkSection .joinNetworkSection-card {
    width: 100%;
    max-width: 900px;
    margin: 0 auto;
    background-color: rgba(var(--white), 1);
    border-radius: 15px;
    padding: 1.5rem;
    box-shadow: 0 4px 16px 0 rgba(0, 0, 0, 0.16);
}

/*//////////////////////////////*/
/*////////// DASHBOARD /////////*/
/*//////////////////////////////*/

#dashLayout {position: relative;}
#dashLayout .dashLayout-inner {position: relative;}
#dashLayout .dashLayout-row {display: flex; flex-flow: row nowrap; align-items: start;}
#dashLayout .dashLayout-col.side {width: 450px; min-width: 450px; max-width: 450px; box-sizing: border-box; padding-right: 4rem;}
#dashLayout .dashLayout-col.content {flex: 1;}

/*///// DASH MENU CARD /////*/
#dashLayout .dashMenu {position: relative; background-color: rgba(var(--primary), 1); border-radius: 10px; margin-bottom: 1.5rem;}
#dashLayout .dashMenu-header {padding: 1rem; border-bottom: 1px solid rgba(var(--white), 0.2); color: rgba(var(--white), 1);}
#dashLayout .dashMenu-header * {color: inherit}
#dashLayout .dashMenu-header h5 {text-transform: uppercase; margin-bottom: 0.5rem;}
#dashLayout .dashMenu-header p {font-size: 0.9rem;}
#dashLayout .dashMenu-cont {position: relative; padding: 1rem;}

/*///// CURRENT CARD /////*/
#dashLayout .v-card.dashMenu-currentCard {
    border: 1px solid rgba(var(--white), 0.16);
    border-radius: 10px;
    padding: 0.8rem 1rem;
    color: rgba(var(--white), 1);
    margin-bottom: 1.5rem;
}

#dashLayout .v-card.dashMenu-currentCard:hover {border: 1px solid rgba(var(--white), 0.36);}
#dashLayout .v-card.dashMenu-currentCard .heading {font-size: 0.8rem; text-transform: uppercase; color: inherit; opacity: 0.7;}
#dashLayout .v-card.dashMenu-currentCard .title {
    color: inherit;
    margin-bottom: 0.3rem;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

#dashLayout .v-card.dashMenu-currentCard .package {color: rgba(var(--spot5), 1); font-weight: 600;}
#dashLayout .v-card.dashMenu-currentCard .package.premium {color: rgba(var(--spot2-light), 1);}

/*///// CONTENT HEADING /////*/
#dashLayout .dashMenu-content-heading {
    display: block;
    font-size: 0.9rem;
    color: rgba(var(--white),1);
    text-transform: uppercase;
    margin-bottom: 0.5rem;
}

/*///// MENU BUTTON TAB /////*/
#dashLayout .dashMenu-menuItem {
    border: 1px solid rgba(var(--white), 0);
    border-radius: 10px;
    padding: 0.8rem 1rem;
    color: rgba(var(--white), 1);
    margin-bottom: 0.5rem;
    font-size: 1rem;
    font-weight: 600;
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
}

#dashLayout .dashMenu-menuItem.active {border: 1px solid rgba(var(--white), 0.16);}
#dashLayout .dashMenu-menuItem:hover {border: 1px solid rgba(var(--white), 0.16);}
#dashLayout .dashMenu-menuItem.active:hover {border: 1px solid rgba(var(--white), 0.36);}
#dashLayout .dashMenu-menuItem .v-icon {font-size: 1.5rem; color: inherit; margin-right: 1rem;}
#dashLayout .dashMenu-menuItem .title {font-size: inherit; color: inherit; font-weight: inherit; display: block; flex:1;}

/*///// RESPONSE GUIDE /////*/
#dashLayout .respGuide-hold.mobile {display: none;}
#dashLayout .respGuide-card {
    position: relative;
    background-color: rgba(var(--white), 1);
    border: 1px solid rgba(var(--black), 0.2);
    padding: 1rem;
    border-radius: 10px;
}

#dashLayout .respGuide-card-heading {color: rgba(var(--spot6), 1); margin-bottom: 0.5rem;}
#dashLayout .respGuide-card p {font-size: 0.9rem;}

/*///// RESPONSE GUIDE - NOTE /////*/
#dashLayout .respGuide-note {
    background-color: rgba(var(--spot7), 0.2);
    border-radius: 8px;
    padding: 0.5rem;
    color: rgba(var(--spot7), 1);
    border: 1px solid rgba(var(--spot7), 1);
    margin: 1rem 0;
}

#dashLayout .respGuide-note * {color: inherit;}

/*///// RESPONSE GUIDE - LIST /////*/
#dashLayout .respGuide-list {display: block; margin: 0; padding: 0;}
#dashLayout .respGuide-list .respGuide-item {
    display: block;
    list-style: none;
    padding-bottom: 0.8rem;
    margin-bottom: 0.8rem;
    border-bottom: 1px solid rgba(var(--black), 0.16);
}

#dashLayout .respGuide-list .respGuide-item h6 {font-size: 0.95rem; color: rgba(var(--textMedium), 1);}
#dashLayout .respGuide-list .respGuide-item p {color: rgba(var(--textExtraLight), 1);}
#dashLayout .respGuide-list .respGuide-item:nth-last-child(1) {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}

/*///// FILTER COMMENT CARD /////*/
#dashLayout .filterCommentsCard {
    border-radius: 10px;
    background-color: rgba(var(--primary), 0.1);
    border: 1px solid rgba(var(--black), 0.16);
    padding: 1rem;
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    width: 100%;
}

#dashLayout .filterCommentsCard .filterCommentsCard-title {font-weight: 600; color: rgba(var(--primary), 1); white-space: nowrap;}
#dashLayout .filterCommentsCard .filterCommentsCard-description {color: rgba(var(--textLight), 1);}
#dashLayout .filterCommentsCard .v-select.uba-basicForm {margin: 0 1rem; max-width: 300px; min-width: 210px;}

@media (max-width: 1350px){
    #dashLayout .dashLayout-col.side {
        width: 380px;
        min-width: 380px;
        max-width: 380px;
        padding-right: 2rem;
    }
}

@media (max-width: 1250px){
    #dashLayout .dashLayout-col.side {
        width: 350px;
        min-width: 350px;
        max-width: 350px;
        padding-right: 1.5rem;
    }
}

@media (max-width: 950px){
    #dashLayout .dashLayout-row {flex-flow: column;}
    #dashLayout .dashLayout-col.side {
        width: 100%;
        min-width: 0;
        max-width: none;
        padding-right: 0;
    }

    #dashLayout .respGuide-hold.mobile {display: block; margin-top: 2rem;}
    #dashLayout .respGuide-hold.desktop {display: none;}
    #dashLayout .dashMenu-menuList {
        padding: 1rem;
        background-color: rgba(var(--primary), 1);
        border-radius: 10px;
    }

    #dashLayout .dashMenu-menuList-inner {
        margin-left: -0.5rem;
        margin-right: -0.5rem;
        width: calc(100% + 1rem);
        display: flex;
        flex-flow: row nowrap;
    }
    #dashLayout .dashMenu-menuList .dashMenu-menuItem {flex: 1; margin: 0 0.5rem;}
    #dashLayout .dashMenu-currentCard-hold {padding: 1rem 1rem 0 1rem;}
    #dashLayout .dashMenu-content-heading {padding: 0 1rem; margin-bottom: 0;}
    #dashLayout .dashMenu-cont {padding: 0;}

    #dashLayout .dashMenu.stick {margin-bottom: calc(1.5rem + 84px);}
    #dashLayout .dashMenu-menuList.stick {
        position: fixed;
        width: calc(100% - 4rem);
        margin: 0 2rem;
        top: 48px;
        z-index: 10;
        left: 0;
        -webkit-border-radius: 0 0 10px 10px;
        border-radius: 0 0 10px 10px;
        -webkit-box-shadow: 0 0 10px 0 rgba(0,0,0,0.2);
        box-shadow: 0 0 10px 0 rgba(0,0,0,0.35);
        padding: 0.6rem 1rem;
    }


}

@media (max-width: 700px){
    #dashLayout .filterCommentsCard {flex-wrap: wrap;}
    #dashLayout .filterCommentsCard .filterCommentsCard-description {
        display: block;
        width: 100%;
        min-width: 100%;
        margin-top: 1rem;
    }

    #dashLayout .filterCommentsCard .v-select.uba-basicForm {margin-right: 0;}
}

@media (max-width: 650px){
    #dashLayout .dashMenu.stick {margin-bottom: calc(1.5rem + 69px);}
    #dashLayout .dashMenu-menuItem .v-icon {margin-right: 0.5rem; font-size: 1.2rem;}
    #dashLayout .dashMenu-menuList .dashMenu-menuItem {
        font-size: 0.9rem;
        padding: 0.4rem 0.6rem;
        margin: 0 0.25rem;
        border-radius: 6px;
        white-space: nowrap;
        flex: auto;
    }
    #dashLayout .dashMenu-menuList-inner {margin-left: -0.25rem; margin-right: -0.25rem; width: calc(100% + 0.5rem);}
}

@media (max-width: 500px){
    #dashLayout .dashMenu-menuList.stick {
        width: calc(100% - 3rem);
        margin: 0 1.5rem;
    }

    #dashLayout .filterCommentsCard {flex-flow: column; align-items: start;}
    #dashLayout .filterCommentsCard .v-select.uba-basicForm {margin-left: 0; min-width: 100%; max-width: 100%;}
    #dashLayout .filterCommentsCard .filterCommentsCard-title {margin-bottom: 1rem;}
}

@media (max-width: 450px){
    #dashLayout .dashMenu-menuItem .v-icon {display: none;}
    #dashLayout .dashMenu-menuList .dashMenu-menuItem {text-align: center;}
    #dashLayout .filterCommentsCard .v-select.uba-basicForm {min-width: 100%;}
}

@media (max-width: 360px){
    #dashLayout .dashMenu-menuList .dashMenu-menuItem {font-size: 0.8rem;}
    #dashLayout .dashMenu.stick {margin-bottom: calc(1.5rem + 66px);}
}


/*/////////////////////////////////////*/
/*////////// FIGURE CARD GRID /////////*/
/*/////////////////////////////////////*/

.cardFigureGrid {position: relative;}
.cardFigureGrid .cardFigureGrid-list {
    position: relative;
    display: flex;
    flex-flow: row wrap;
    align-items: stretch;
    width: calc(100% + 1rem);
    margin-left: -0.5rem;
    margin-right: -0.5rem;
}

.cardFigureGrid .cardFigureGrid-item {
    flex: 1;
    min-width: 200px;
    width: 100%;
    box-sizing: border-box;
    padding: 0.5rem;
}

.cardFigureGrid .cardFigureGrid-item-inner {
    padding: 0.6rem 1rem;
    border-radius: 10px;
    background-color: rgba(var(--primary), 0.2);
    min-height: 100%;
}

.cardFigureGrid-heading {font-size: 0.8rem; color: rgba(var(--primary), 1);}

/*/////////////////////////////////////*/
/*////////// GRAPH CONTAINER /////////*/
/*/////////////////////////////////////*/

.graphContainer {
    border-radius: 10px;
    border: 1px solid rgba(var(--black), 0.16);
    padding: 1rem;
    min-height: 50px;
    background-color: rgba(var(--white), 1);
}

.graphContainer .graphContainer-label,
.graphContainer .graphContainer-detail {
    font-size: 1rem;
    font-weight: 600;
    display: block;
    color: rgba(var(--text), 1);
}

.graphContainer .graphContainer-detail {
    font-size: 0.8rem;
    font-weight: 400;
    margin-bottom: 1rem;
}

/*///// DUAL GRAPHS /////*/
.dualGraphs {
    position: relative;
    display: flex;
    flex-flow: nowrap;
    align-items: stretch;
    width: calc(100% + 2rem);
    margin-left: -1rem;
    margin-right: -1rem;
    margin-top: 1rem;
}
.dualGraphs .dualGraphs-item {flex: 1; padding: 1rem;}
.dualGraphs .dualGraphs-item .graphContainer {min-height: 100%; box-sizing: border-box;}

@media (max-width: 1150px) and (min-width: 950px) {
    .dualGraphs {flex-flow: column;}
}

@media (max-width: 750px) {
    .dualGraphs {flex-flow: column;}
}

/*/////////////////////////////////////*/
/*//////////// LOGIN SCREEN ///////////*/
/*/////////////////////////////////////*/

#loginSection {position: relative;}
#loginSection .loginSection-inner {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: 50%;
    position: relative;
    display: flex;
    flex-flow: column wrap;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    padding: 30px;
    min-height: 100vh;
}

#loginSection .loginSection-container {
    background-color: rgba(var(--white), 1);
    border-radius: 15px;
    -webkit-box-shadow: 0 0 30px 0 rgba(0,0,0,0.25);
    box-shadow: 0 0 30px 0 rgba(0,0,0,0.25);
    padding: 20px 24px;
    max-width: 500px;
    width: 100%;
}