/* ——————————————————————————————————————————————————————————————————— */
/* CSS for Berkay Türkkan web site by Hürel Çobanoğlu ———————————————— */
/* ——————————————————————————————————————————————————————————————————— */

/* ------------------------------------------------------------------- */
/* MATERIAL DESIGN INPUT --------------------------------------------- */
/* ------------------------------------------------------------------- */

.blog-post {
    font-size: 1.25rem;
}
.mat-outline-input-container {
	display: flex;
	flex-direction: column;
	position: relative;
}
.mat-outline-input-container input,
.mat-outline-input-container textarea,
.mat-outline-input-container .selected-dropdown {
	position: relative;
	width: 100%;
    height: auto;
    padding: 16px;
    margin: 0;
    border: 1px solid #ddd;
	border-radius: 5px;
	outline: none;
    transition: border 0.2s;
}
.mat-outline-input-container input:hover,.mat-outline-input-container textarea:hover {border: 1px solid #3379be;}
.mat-outline-input-container input:focus,
.mat-outline-input-container textarea:focus,
.mat-outline-input-container .selected-dropdown.active {
	background-color: #fff;
	border-color: #3379be;
	box-shadow: 0 0 0 1px #3379be inset;
}
.mat-outline-input-container .placeholder-txt {
	position: absolute;
    left: 9px;
    top: 18px;
    font-weight: 500;
	line-height: 1.5;
    padding: 0;
    padding: 0 8px;
    color: #6c757d;
    background-color: #fff;
    transition: all 0.2s;
}
.mat-outline-input-container input:focus ~ .placeholder-txt,
.mat-outline-input-container textarea:focus ~ .placeholder-txt,
.mat-outline-input-container .selected-dropdown.active ~ .placeholder-txt,
.mat-outline-input-container.filled .placeholder-txt {
	font-size: 90%;
	left: 8px;
	top: -8px;
	color: #3379be;
}
.mat-input-iconized input {padding-right: 52px;}
.mat-input-iconized .fa,
.mat-input-iconized .fas,
.mat-input-iconized .far,
.mat-input-iconized .fab {
	position: absolute;
    top: 22px;
    right: 16px;
    font-size: 24px;
    color: #aaa;
}

/* ------------------------------------------------------------------- */
/* SHARED ------------------------------------------------------------ */
/* ------------------------------------------------------------------- */
html, body {
    font-family: "Open Sans";
    letter-spacing: -.25px;
    color: #6c757d;
}
[class*="line-clamp"] {
    display: -webkit-box;
    -webkit-box-orient: vertical;  
    overflow: hidden;
}
.line-clamp-1 {-webkit-line-clamp: 1;}
.line-clamp-2 {-webkit-line-clamp: 2;}
.line-clamp-3 {-webkit-line-clamp: 3;}
.line-clamp-4 {-webkit-line-clamp: 4;}
.line-clamp-5 {-webkit-line-clamp: 5;}
.line-clamp-6 {-webkit-line-clamp: 6;}
.line-clamp-7 {-webkit-line-clamp: 7;}
.line-clamp-8 {-webkit-line-clamp: 8;}
.line-clamp-9 {-webkit-line-clamp: 9;}
ul {padding: 0 0 0 20px;}
ul li {margin: 0 0 .5rem 0;}
.havale {
    padding: 1.5rem;
    background-color: rgb(73 80 87 / 3%);
    box-shadow: 0 0 0 6px rgb(0 0 0 / 5%), 0 0 0 2px rgb(0 0 0 / 7%);
    border-radius: 0.5rem;
}
.havale p {margin-bottom: 0.5rem;}
.havale p:last-child {margin: 0;}
.havale button {line-height: 1.5725;}
main {
    position: relative;
    background-color: #fff;
}
.btn.fas {font-weight: 900;}
.carousel-item {background-image: radial-gradient(circle at top, #fff 33%, #706868 600%);}
.carousel-img {
    width: 100%;
    min-height: 320px;
    height: calc(100vh - 215px);
    object-fit: cover;
    mix-blend-mode: multiply;
}
.carousel a.quiz {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 200px;
    font-weight: 600;
    letter-spacing: -.3px;
    text-align: center;
    text-decoration: none;
    padding: .625rem;
    color: #fff;
    background-color: #dc3545;
    box-shadow: 0 0 0 4px #dc3545;
    border: 1px solid #fff;
    transform: translate(-50%, -50%) skew(-10deg, 0);
    opacity: .88;
    animation: quizBtnAnim infinite ease-in-out 1000ms;
}
.carousel a.quiz:hover {animation: none;}
.carousel a.quiz > span {
    display: block;
    transform: skew(10deg, 0);
}
@keyframes quizBtnAnim {
    0% {box-shadow: 0 0 0 4px #dc3545;}
    50% {box-shadow: 0 0 0 4px transparent;}
}
.carousel-control-prev,
.carousel-control-next {
    top: 50%;
    bottom: auto;
    width: 52px;
    height: 52px;
    background-position: -12px -12px;
    background-size: 79px;
    box-shadow: 0 0 10px rgb(0 0 0 / 22%);
    border-radius: 40px;
    transform: translate(0, -50%);
    opacity: .65;
}
.carousel-control-prev {
    left: 10px;
    background-image: url('../navimgs/left_arrow.png');
}
.carousel-control-next {
    right: 10px;
    background-image: url('../navimgs/right_arrow.png');
}
.carousel-control-prev:hover {background-image: url('../navimgs/left_arrow_active.png');}
.carousel-control-next:hover {background-image: url('../navimgs/right_arrow_active.png');}
.cookies-warning {
    position: fixed;
    left: 0;
    bottom: 0;
    padding: 1rem 0;
    font-size: .66rem;
    font-weight: 500;
    line-height: 1.43;
    color: #fff;
    background-color: #919fac;
    box-shadow: 0 .125rem .625rem .375rem rgb(37,51,66,.9);
    z-index: 1084;
}
.cookies-warning a {
    font-weight: 700;
    color: inherit;
}
.cookies-warning .container {
    display: flex;
    flex-wrap: wrap;
    position: relative;
    padding:0 2.5rem 0 1.5rem;
}
.cookies-warning p:only-of-type {margin: auto 0;}
.cookies-warning .btn-close {
    position: absolute;
    top: 0;
    right: .75rem;
    min-width: 1rem;
    min-height: 1rem;
    padding: .0625rem;
    background-image: none;
    box-shadow: none;
    transform: rotate(45deg);
    opacity: 1;
}
.cookies-warning .btn-close::before,
.cookies-warning .btn-close::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 1rem;
    height: .125rem;
    background-color: #fff;
    transform-origin: left top;
    transform: rotate(90deg) translate(-50%, -50%);
    border-radius: 50em;
}
.cookies-warning .btn-close::after {transform: rotate(180deg) translate(-50%, -50%);}
.cookies-warning .action-btn-group {margin: .5rem auto auto -.5rem;}
.cookies-warning .action-btn-group .btn {
    white-space: nowrap;
    padding: .533rem 1rem;
    margin: .5rem auto auto .5rem;
}

/* ------------------------------------------------------------------- */
/*  MATERIAL STEPPER ------------------------------------------------- */
/* ------------------------------------------------------------------- */
.stepper {
    list-style: none;
    counter-reset: section;
    padding: 0 1rem;
    margin: 0;
}
.stepper .step {
    display: flex;
    flex-direction: column;
    position: relative;
    transition: height .4s cubic-bezier(.4,0,.2,1),padding-bottom .4s cubic-bezier(.4,0,.2,1);
}
.stepper .step:not(:last-of-type).active {padding-bottom: 36px;}
.stepper > li:not(:last-of-type) {padding-bottom: 10px;}
.stepper .step::before {
    position: absolute;
    counter-increment: section;
    content: counter(section);
    height: 26px;
    width: 26px;
    color: #fff;
    background-color: #b2b2b2;
    border-radius: 50%;
    text-align: center;
    line-height: 26px;
    font-weight: 400;
    transition: background-color .4s cubic-bezier(.4,0,.2,1);
    font-size: 14px;
    left: 1px;
    top: 13px;
}
.stepper .step.active .step-title {color: #2196f3;}
.stepper .step.active:before {background-color: #2196f3;}
.stepper .step.passed .step-title {color: #4caf50;}
.stepper .step.passed::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f00c";
    background-color: #4caf50;
}
.stepper .step:not(:last-of-type)::after {
    content: '';
    position: absolute;
    top: 48px;
    left: 13.5px;
    width: 1px;
    height: calc(100% - 37.5px);
    background-color: rgba(0,0,0,.1);
    transition: height .4s cubic-bezier(.4,0,.2,1);
}
.stepper .step.active:not(:last-of-type)::after {background-color: #2196f3;}
.stepper .step.passed:not(:last-of-type)::after {background-color: #4caf50;}
.stepper .step .step-title {
    font-weight: 700;
    margin: 0 auto 0 -24px;
    cursor: pointer;
    padding: 15.5px 44px 24px 64px;
    display: block;
}
.stepper .step .step-content {
    position: relative;
    display: none;
    height: 0;
    transition: height .4s cubic-bezier(.4,0,.2,1);
    width: inherit;
    overflow: visible;
    margin-left: 41px;
    margin-right: auto;
}
.stepper .step.active .step-content {
    display: block;
    height: auto;
}
.stepper .step .step-brief {
    font-size: .8rem;
    font-weight: 400;
    margin-bottom: 1rem;
    color: #424242;
}
.stepper .step .form-check {
    position: relative;
    padding: .325rem .5rem .325rem 2em;
    margin-bottom: 0.5rem;
    border: 1px solid #ccc;
    border-radius: 0.5rem;
}
.stepper .step .form-check.active {
    box-shadow: 0 0 0 3px rgb(13 110 253 / 33%);
    border-color: rgb(13 110 253 / 66%);
}
.stepper .step .form-check-label {
    font-size: .85rem;
    line-height: 1.25;
    cursor: pointer;
}
.stepper .step .form-check-label small {display: block;}
.step-actions {
    display: flex;
    flex-direction: column;
}
.step-action {
    min-width: 100px;
    padding: 0.25rem 1rem;
    margin: 0 auto .5rem 0;
}
.step-action:last-child {margin-bottom: 0;}

/* ------------------------------------------------------------------- */
/* LIGHTBOX by Lokesh Dhakar ----------------------------------------- */
/* ------------------------------------------------------------------- */
.lightboxOverlay {outline: 0;}
.lightbox {
    display: flex;
    flex-direction: column-reverse;
    width: 100vw;
    height: 100vh;
}
.lb-outerContainer {
    width: 48px;
    height: 48px;
    margin: 0 auto auto auto;
    background: none;
}
.lb-container {padding: 0 2.75rem;}
.lb-outerContainer.animating ~ .lb-dataContainer {opacity: 0;}
.lb-dataContainer {
    width: 100% !important;
    padding: 10px;
    margin: auto auto 0 auto;
    border-radius: 0;
}
.lb-data {display: flex;}
.lb-data .lb-details {
    width: auto;
    margin: auto;
}
.lb-data .lb-number {padding: 0;}
.lb-data .lb-closeContainer {
    position: fixed;
    top: 1rem;
    right: 1rem;
}
.lightbox .lb-image {border-width: 1px;}
.lb-loader {
    position: fixed;
    top: 50%;
    left: 50%;
    width: 54px;
    height: 54px;
    padding: 12px;
    background-color: #fff;
    transform: translate(-50%, -50%);
    border-radius: 50%;
}
.lb-nav a.lb-prev,
.lb-nav a.lb-next {
    position: fixed;
    top: calc(50% + 1.5rem);
    width: 40px;
    height: 40px;
    background: none;
    transform: translate(0, -50%);
    opacity: .7;
}
.lb-nav a.lb-prev {left: .5rem;}
.lb-nav a.lb-next {right: .5rem;}
.lb-nav a.lb-prev::before,
.lb-nav a.lb-prev::after,
.lb-nav a.lb-next::before,
.lb-nav a.lb-next::after {
    content: "";
    position: absolute;
    width: 26px;
    height: 1px;
    background-color: #fff;
}
.lb-nav a.lb-prev::before {
    left: 4px;
    top: 10px;
    transform: rotate(-45deg);
}
.lb-nav a.lb-prev::after {
    left: 4px;
    top: 28px;
    transform: rotate(45deg);
}
.lb-nav a.lb-next::before {
    right: 4px;
    top: 10px;
    transform: rotate(45deg);
}
.lb-nav a.lb-next::after {
    right: 4px;
    top: 28px;
    transform: rotate(-45deg);
}
.lb-data .lb-close {
    width: 40px;
    height: 40px;
    background: none;
}
.lb-data .lb-close::before,
.lb-data .lb-close::after {
    content: "";
    position: absolute;
    top: 20px;
    right: 0;
    width: 40px;
    height: 1px;
    background-color: #fff;
}
.lb-data .lb-close::before {transform: rotate(45deg);}
.lb-data .lb-close::after {transform: rotate(-45deg);}
a.lb-link {
    color: inherit;
    text-decoration: none;
}
a.lb-link img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
/* LIGHTBOX XTR */
a.lb-link.col {
    flex: 0 0 auto;
    position: relative;
    width: calc(50% - 6px);
    padding: 0;
    margin: 3px;
    overflow: hidden;
}
a.lb-link.col img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform ease-in-out 300ms;
}
a.lb-link.col:hover img {transform: scale(1.25);}
a.lb-link.col .zoom {
    display: flex;
    position: absolute;
    justify-content: center;
    align-items: center;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}
a.lb-link.col .zoom::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: #0481de;
    mix-blend-mode: multiply;
    opacity: 0;
    transition: opacity ease-in-out 300ms;
}
a.lb-link.col .zoom .fas {
    position: relative;
    font-size: 2rem;
    color: #fff;
    transform: scale(0) rotate(-90deg);
    transition: transform ease-in-out 400ms;
}
a.lb-link.col:hover .zoom::before, a.lb-link.col:hover .zoom .fas {opacity: 1;}
a.lb-link.col:hover .zoom .fas {transform: scale(1.25) rotate(0);}

/* WHATSAPP ICON */
.btn-whatsapp {
    position: fixed;
    right: 1rem;
    bottom: 1rem;
    font-size: 4rem;
    line-height: 1;
    color: #fff;
    cursor: pointer;
    z-index: 1081;
}
.btn-whatsapp .gradient-bg {
    position: absolute;
    left: 4px;
    top: 8px;
    width: 48px;
    height: 48px;
    background-color: #fff;
    border-radius: 50%;
}
.btn-whatsapp .gradient-bg::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background-image: linear-gradient(45deg, #075E54, #25D366);
    border-radius: 50%;
    transition: opacity ease-in-out 200ms;
    opacity: .75;
}
.btn-whatsapp .arrow {
    position: absolute;
    left: 6px;
    bottom: 9px;
    border-width: 4px 7px 4px 0;
    border-style: solid;
    border-color: transparent #fff transparent transparent;
    transform: rotate(-45deg);
}
.btn-whatsapp .arrow::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -4px;
    border-width: 4px 7px 4px 0;
    border-style: solid;
    border-color: transparent #0a6e56 transparent transparent;
    transition: opacity ease-in-out 200ms;
    opacity: .75;
}
.btn-whatsapp .fab.icon-shadow {
    position: absolute;
    text-shadow: 0 0 12px rgba(0,0,0,.22), 0 0 8px rgba(0,0,0,.22), 0 0 4px rgba(0,0,0,.11);
    opacity: .75;
}
.btn-whatsapp .fab {position: relative;}
.btn-whatsapp .icon-helper {
    display: flex;
    position: absolute;
    align-items: center;
    right: 0;
    top: 50%;
    width: 0;
    min-height: 0;
    font-size: 14px;
    letter-spacing: .1px;
    line-height: 17px;
    text-align: right;
    text-decoration: none;
    padding: 0;
    color: rgba(255,255,255,.8);
    background-color: #0a6e56;
    box-shadow: 0 0 12px rgba(0,0,0,.22), 0 0 8px rgba(0,0,0,.22), 0 0 4px rgba(0,0,0,.11);
    transform: translate(0, -50%);
    border: 0 solid #fff;
    border-radius: 0;
    transition: all ease-in-out 100ms;
    overflow: hidden;
}
#whatsAppHelperMessage {min-width: 198px;}
.btn-whatsapp .icon-helper::after {
    content: "";
    position: absolute;
    right: 0;
    width: 72px;
    height: 82px;
    background-color: #0a6e56;
}
.btn-whatsapp:hover .icon-helper {
    right: -13px;
    width: 310px;
    min-height: 82px;
    padding: .75rem 5rem .75rem 1.5rem;
    border-width: 2px;
    border-radius: 50em;
}

.btn-whatsapp:hover {color: #fff;}
.btn-whatsapp:hover .gradient-bg::after, .btn-whatsapp:hover .arrow::after, .btn-whatsapp:hover .fab.icon-shadow  {opacity: 1;}


/* CALL ME */
.btn-callme {
    position: fixed;
    right: 1.6875rem;
    top: 1.6875rem;
    font-size: 1.875rem;
    padding: 0.5rem 0.7345rem;
    line-height: 1;
    color: #dc3545;
    background-color: #fff;
    box-shadow: 0 0 12px rgba(0,0,0,.22), 0 0 8px rgba(0,0,0,.22), 0 0 4px rgba(0,0,0,.11);
    transition: none;
    border-radius: 50em;
    z-index: 1081;
}
.btn-callme:hover, .btn-callme:focus {
    color: #dc3545;
    box-shadow: 0 0 12px rgba(0,0,0,.22), 0 0 8px rgba(0,0,0,.22), 0 0 4px rgba(0,0,0,.11);
}
.btn-callme:active {box-shadow: 0 0 0 4px rgba(255,255,255,.44), 0 0 12px rgba(0,0,0,.22), 0 0 8px rgba(0,0,0,.22), 0 0 4px rgba(0,0,0,.11);}
.btn-callme:hover::before {animation: callme 1200ms ease-in-out infinite;}
.btn-callme::before {
    display: block;
    transform: rotate(-45deg);
}
@keyframes callme {
    50% {transform:rotate(45deg);}
}
.callme-modal {z-index: 1085;}
.callme-modal .modal-body {
    padding: 0;
    margin: 2rem;
}
.callme-modal .modal-body .inputgroup-with-guide {
    display: flex;
    position: relative;
}
.callme-modal .modal-body .guide-text {
    display: flex;
    align-items: center;
    position: absolute;
    left: 0;
    padding: .5rem .75rem;
    color: #fff;
    background-color: #dc3545;
    border: 1px solid #dc3545;
    border-radius: 7px 0 0 7px;
}
.callme-modal .modal-body .form-control {
    position: relative;
    font-weight: 500;
    background: none;
    padding: .5rem .75rem .5rem 88px;
    border-color: #dc3545;
    border-radius: 8px;
    z-index: 1;
}
.modal-backdrop {z-index: 1084;}


/* ------------------------------------------------------------------- */
/* OFFER with COUNTDOWN ---------------------------------------------- */
/* ------------------------------------------------------------------- */
#fastOfferMobile {display: block;}
#fastOfferDesktop {display: none;}



/* FAST OFFER */
.noscroll {overflow: hidden;}
.fast-offer {
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0,0,0,.6);
    z-index: 1083;
}
.fast-offer .content {
    display: flex;
    flex-direction: column;
    position: absolute;
    left: 50%;
    top: 50%;
    min-width: 210px;
    width: 65%;
    align-items: center;
    text-align: center;
    transform: translate(-50%, -50%);
}
.fast-offer .close-overlay {
    top: 50%;
    width: 100vw;
    position: absolute;
    height: 100vh;
    transform: translate(0, -50%);
}
.fast-offer .overflow-container {
    position: relative;
    width: 100%;
    height: 100%;
    background-color: #dc3545;
    background-image: url('../navimgs/navbar-bg.jpg');
    background-size: cover;
    background-blend-mode: multiply;
    box-shadow: 0 0 16px rgb(0 0 0 / 33%), 0 0 0 5px rgb(0 0 0 / 22%), 0 0 0 1px #000;
    border-radius: 8px;
    overflow: hidden;
}
.fast-offer .definition {
    line-height: 1.25;
    margin: 1rem;
    color: #fff;
}
.fast-offer .definition > *:last-child, .fast-offer .definition > *:only-child {margin: 0;}
.fast-offer .definition > .fas {color: #dc3545;}
.fast-offer .countdown-container {
    display: flex;
    width: 100%;
    padding: .5rem 0 1rem 0;
    justify-content: center;
    background-color: #b12a37;
    border-width: 1px 0;
    border-style: solid;
    border-color: rgb(0 0 0 / 33%) rgb(255 255 255 / 33%) rgb(255 255 255 / 40%) rgb(0 0 0 / 33%);
    box-shadow: 0 2px 4px rgb(0 0 0 / 30%) inset;
}
.fast-offer .counter-input-group {
    display: flex;
    flex-direction: column;
}
.fast-offer .counter-input-group:last-child {border: none;}
.fast-offer .c-title {
    font-weight: 300;
    padding: 0 .5rem;
    margin: auto;
    color: #fff;
}
.fast-offer .c-number {
    min-width: 40px;
    width: calc(100% + 2ü1px);
    font-weight: 700;
    text-align: center;
    padding: .25rem .5rem;
    margin: .125rem -.5px 0 -.5px;
    color: rgb(255 255 255 / 75%);
    background-color: rgb(0 0 0 / 10%);
    box-shadow: 0 1px 3px rgb(0 0 0 / 10%) inset;
    border: 1px solid rgb(255 255 255 / 50%);
}
.fast-offer .counter-input-group:first-child .c-number {border-radius: .5rem 0 0 .5rem;}
.fast-offer .counter-input-group:last-child .c-number {border-radius: 0 .5rem .5rem 0;}
.fast-offer .btn {margin: 1rem;}
.fast-offer .btn-close {
    display: flex;
    position: absolute;
    top: -30px;
    right: -30px;
    width: 2.5rem;
    height: 2.5rem;
    padding: 0;
    color: #fff;
    justify-content: center;
    align-items: center;
    background-color: #000;
    background-image: none;
    border-radius: 50%;
    opacity: 1;
}


/* HEADER > NAVBAR */
.navbar {
    flex-direction: column;
    flex-wrap: nowrap;
    padding: 0;
    background-color: #dc3545;
    background-image: url('../navimgs/navbar-bg.jpg');
    background-size: cover;
    background-blend-mode: multiply;
}
header .navbar-brand {
    padding: 1rem .5rem 1rem 1rem;
    margin: 0 auto;
    background-color: #fff;
    transform: skew(-10deg, 0deg);
    box-shadow: 0 0 8px #000;
}
header .navbar-brand img {transform: skew(10deg,0deg);}
.navitem-container {
    position: relative;
    width: 100%;
    margin: -1px 0 0 0;
    background-color: #fff;
    border-bottom: 1px solid #ddd;
}
.navbar-nav-container {
    flex-direction: row;
    width: 100%;
    overflow-x: scroll;
    overflow-y: hidden;
}
.navbar-nav {
    flex-direction: row;
    width: fit-content;
}
.navbar-nav .nav-item {margin: 0;}
.navbar-nav .nav-link {
    white-space: nowrap;
    padding: .5rem .875rem;
    margin: .5rem .25rem;
    color: inherit;
    border-radius: 4px;
}
.navbar-nav .nav-link.active,
.navbar-nav .nav-link:hover {
    color: #fff;
    background-color: #dc3545;
}
.navbar-search-container {
    display: flex;
    position: relative;
    padding: .5rem;
    border-top: 1px solid #ddd;
}
.navbar-search-container .form-control {padding: 7px 37px 7px 12px;}
.form-control:focus {
    border-color: #ef919a;
    box-shadow: 0 0 0 3px rgb(220 53 69 / 25%);
}
.navbar-search-container .btn-search {
    position: absolute;
    top: 8px;
    right: 8px;
    padding: .4375rem .6875rem;
    color: #fff;
    background-color: #ced4da;
    border-radius: 0 4px 4px 0;
}
.form-control:focus ~ .btn-search {
    color: #fff;
    background-color: #dc3545;
}
.btn-search:focus {
    color: #fff;
    background-color: #ced4da;
    box-shadow: none;
}
.slidenav-control {
    display: flex;
    position: absolute;
    top: 0;
    height: 56px;
    line-height: normal;
    padding: .75rem 1rem .5rem 1rem;
    align-items: center;
    color: #b1b7bd;
    background-color: #fff;
    border-style: solid;
    border-color: #ced4da;
    cursor: pointer;
    transition: opacity ease-in-out 300ms;
}
.slidenav-control.hide {
    width: 0;
    padding: 0;
    overflow: hidden;
    opacity: 0;
}
.slidenav-control.show {
    width: auto;
    padding: .75rem 1rem .5rem 1rem;
    overflow: hidden;
    opacity: 1;
}
.slidenav-control.prev {
    left: 0;
    box-shadow: 4px 0 5px -3px rgb(0 0 0 / 33%);
    border-width: 0 1px 0 0;
}
.slidenav-control.next {
    right: 0;
    box-shadow: -4px 0 5px -3px rgb(0 0 0 / 33%);
    border-width: 0 0 0 1px;
}

/* THE APP */
#theApp {
    color: #30276b;
    /* background-color: #e9e8f1; */
    border-bottom: 1px solid #e9e8f1;
}
#theApp > .container .store-btn-group {padding: 1.5rem 0;}
#theApp .store-btn-group.go-detail {margin: .5rem auto;}
#theAppCarousel {
    max-width: 500px;
    margin: auto;
}
#theAppCarousel .carousel-indicators {margin-bottom: 1.75rem;}
#theAppCarousel .carousel-indicators [data-bs-target] {
    position: relative;
    min-width: 16px;
    width: 16px;
    height: 16px;
    text-indent: 0;
    margin: auto 4px;
    background-color: rgba(0,0,0,.1);
    border: 1px solid #fff;
    border-radius: 50em;
    opacity: 1;
}
#theAppCarousel .carousel-indicators [data-bs-target].active {
    background-color: #fff;
    box-shadow: 0 0 0 1px rgba(0,0,0,.2);
}
#theAppCarousel .carousel-indicators [data-bs-target]::after {
    content: "";
    position: absolute;
    left: 3px;
    top: 3px;
    width: 10px;
    height: 10px;
    background-color: #2e286b;
    border-radius: 50%;
    transform: scale(0);
    transform-origin: center center;
    transition: transform ease-in-out 300ms;
}
#theAppCarousel .carousel-indicators [data-bs-target].active::after {transform: scale(1);}
#theAppCarousel .carousel-inner {margin: auto;}
#theAppCarousel .carousel-inner::before,
#theAppCarousel .carousel-inner::after {
    content: "";
    position: absolute;
    top: 0;
    width: 18%;
    height: 100%;
    z-index: 1;
}
#theAppCarousel .carousel-inner::before {
    left: 0;
    /* background: linear-gradient(to right, #e9e8f1 5%, transparent); */
     background: linear-gradient(to right, #fff 5%, rgba(255,255,255,0));
}
#theAppCarousel .carousel-inner::after {
    right: 0;
    /* background: linear-gradient(to left, #e9e8f1 5%, transparent); */
    background: linear-gradient(to left, #fff 5%, rgba(255,255,255,0));
}
#theAppCarousel .carousel-item {background: none;}
#theAppCarousel .carousel-img {
    height: auto;
    margin: 0 0 2rem 0;
    object-fit: unset;
    mix-blend-mode: unset;
}
#theAppCarousel .carousel-control-prev, #theAppCarousel .carousel-control-next {border-color: #2e286b;}
#theAppCarousel .carousel-control-prev::before, #theAppCarousel .carousel-control-next::before, #theAppCarousel .carousel-control-prev::after, #theAppCarousel .carousel-control-next::after {background-color: #2e286b;}
/* Page */
.shity-phone-bezel {
    position: absolute;
    top: -2px;
    left: -3px;
    width: 281px;
    height: 575px;
}
.phone {
    position: relative;
    width: 275px;
    height: 571px;
    padding: 8px;
    border-width: 1px;
    border-style: solid;
    border-radius: 38px;

    /* Full Size
    width: 399px;
    height: 835px;
    padding: 10px;
    */
}
.phone.light,
.phone.light .screen,
.phone.light .notch {
    background-color: #fff;
    border-color: #e1e2e3;
}
.phone.dark,
.phone.dark .screen,
.phone.dark .notch {
    background-color: #343a40;
    border-color: #212529;
}
.phone.light {box-shadow: 0 0 6px rgb(0 0 0 / 25%) inset;}
.phone.dark {box-shadow: 0 0 5px rgb(0 0 0 / 95%) inset;}
.phone .screen {
    position: relative;
    width: 100%;
    height: 100%;
    border-width: 1px;
    border-style: solid;
    border-radius: 30px;
    overflow: hidden;
}
.phone .notch {
    position: absolute;
    top: 0;
    left: 25%;
    width: 50%;
    height: 3%;
    margin: 2% 0 0 0;
    border-width: 0 1px 1px 1px;
    border-style: solid;
    border-radius: 0 0 50em 50em;
    z-index: 1;
}
.phone .app-ss {width: 100%;}
body.app .phone img {margin: 0;}
body.app .text-purple {color: #181e64;}
body.app ul {
    list-style: none;
    padding: 0;
    margin: 0;
}
body.app h3 {font-weight: 700;}
body.app h4 {font-weight: 300;}
body.app section {
    position: relative;
    z-index: 1;
}
body.app section .phone {box-shadow: 0 0 6px rgb(0 0 0 / 25%) inset, 0 4px 8px rgb(0 0 0 / 11%), 0 8px 15px rgb(0 0 0 / 22%);}
body.app .featurette {
    background-color: #0481de;

    background-color: #fff;
    border-bottom: 1px solid #eae3f5;
}
body.app .featurette h3 {color: #673ab7;}
body.app .phone {height: 551px;}
body.app .shity-phone-bezel {height: 553px;}
body.app .phone .screen {
    padding: 3px 7px 0 8px;
    background-color: transparent;
    border-color: transparent;
}
body.app .phone .screen .carousel, body.app .phone .screen .carousel-inner, body.app .phone .screen .carousel-item, body.app .phone .screen .carousel-img {height: 100%;}
body.app .featurette .screen {overflow: visible;}
body.app .phone .notch {
    background-color: transparent;
    border-color: transparent;
}
body.app .more {background-color: #fff;}
body.app .more h3 {
    color: #673ab7;
    margin-bottom: 1rem;
}
body.app section .phone.carousel .screen .carousel-item {background: none;}
body.app .carousel-indicators {
    position: relative;
    flex-direction: column;
}
body.app .carousel-indicators > li {margin-bottom: 1rem;}
body.app .carousel-indicators [data-bs-target] {
    position: relative;
    width: auto;
    height: auto;
    text-align: left;
    text-indent: 0;
    padding: 1rem;
    margin: 0;
    color: #495057;
    background-clip: unset;
    border: 1px solid rgba(0,0,0,.125);
    border-radius: 0.75rem;
    transition: color ease-in-out 200ms, background-color ease-in-out 200ms, box-shadow ease-in-out 200ms;
    opacity: 1;
}
body.app .carousel-indicators [data-bs-target]:hover {
    box-shadow: 0 3px 8px 0 rgb(0 0 0 / 10%), 0 5px 12px 0 rgb(0 0 0 / 9%);
    transition: color ease-in-out 200ms, background-color ease-in-out 200ms, box-shadow ease-in-out 100ms;
}
body.app .carousel-indicators [data-bs-target]:active {box-shadow: 0 0 0 1px rgb(111 66 193 / 33%), 0 0 0 4px rgb(111 66 193 / 33%);}
body.app .carousel-indicators [data-bs-target].active {
    color: #6f42c1;
    background-color: #f8f5fc;
    box-shadow: 0 0 0 1px rgb(111 66 193 / 11%), 0 0 0 3px rgb(111 66 193 / 22%);
    border-color: rgb(111 66 193 / 22%);
    pointer-events: none;
}
body.app .quick-action .carousel-indicators [data-bs-target].active {
    color: #dc3545;
    background-color: #fff;
    box-shadow: 0 0 0 3px rgb(255 255 255 / 60%);
    border-color: #dc3545;
}
body.app .more .carousel-img {
    width: calc(100% + 2px);
    margin: 0 -1px;
    bottom: 100%;
    min-width: unset;
    min-height: unset;
    mix-blend-mode: unset;
}
body.app .quick-action {
    padding: 5rem 0;
    background-image: linear-gradient(to bottom, #06416c 2%, #004578 5%, #004578 95%, #06416c 98%);
    background-blend-mode: multiply;
}
body.app .quick-action:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-image: url('../navimgs/navbar-bg-mobile.jpg');
    background-size: cover;
    mix-blend-mode: multiply;
    opacity: .75;
    z-index: 0;
}
body.app .quick-action > .container {
    position: relative;
    z-index: 1;
}
body.app .quick-action > .container > .btn {box-shadow: 0 0 0 .0625rem rgb(255 255 255 / 33%), 0 0 0 .25rem rgb(255 255 255 / 33%);}
body.app .stepper {display: block;}
body.app .stepper .step.active {
    padding: 0 0 1rem 0;
    margin: 0;
}
body.app .stepper .step:not(:last-of-type)::after {
    content: '';
    height: calc(100% - 43px);
    background-color: #2196f3;
}
body.app .stepper .step.active:last-of-type {padding: 0;}
body.app .stepper .step.active .step-title {
    padding-bottom: .5rem;
    cursor: default;
}
body.app .stepper .step.active .step-title::before {content: none;}
body.app .quick-action.bg-grey {
    padding: 0;
    background-image: linear-gradient(to bottom, #c3c5c7 1%, #dee2e6 4%, #dee2e6 96%, #c3c5c7 99%);
}
body.app .quick-action.bg-grey:before {opacity: .35;}
body.app .quick-action.bg-grey .screen {
    background-image: url('../navimgs/navbar-bg.jpg');
    background-color: #c3c5c7;
    background-blend-mode: color-burn;
}
body.app .quick-action.bg-red {
    padding: 0;
    color: #ffc7cc;
    background-image: linear-gradient(to bottom, #c82232 1%, #dc3545 4%, #dc3545 96%, #c82232 99%);
}
body.app .quick-action.bg-red:before {mix-blend-mode: color-burn;}
body.app .quick-action.bg-red .screen {
    background-image: url('../navimgs/navbar-bg.jpg');
    background-color: #dc3545;
    background-blend-mode: multiply;
}
.fa-beat {animation:fa-beat 5s ease infinite;}
@keyframes fa-beat {
    0% {transform:scale(1);}
    5% {transform:scale(1.25);}
    20% {transform:scale(1);}
    30% {transform:scale(1);}
    35% {transform:scale(1.25);}
    50% {transform:scale(1);}
    55% {transform:scale(1.25);}
    70% {transform:scale(1);}
}
body.app .carousel-indicators.mini-size {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: left;
}
body.app .carousel-indicators.mini-size > li {margin: 0 .5rem .5rem 0;}
body.app .carousel-indicators.mini-size button {
    padding: .25rem .5rem;
    border-radius: .25rem;
}
body.app .carousel-indicators.mini-size button > [class*="fa-"] {opacity: .35;}
body.app #packContents .pack-cards {padding: 1rem 2rem 2rem 2rem;}
body.app #packContents .accordion-item:nth-child(1),
body.app #packContents .accordion-item:nth-child(2),
body.app #packContents .accordion-item:nth-child(3),
body.app #packContents .accordion-item:nth-child(4),
body.app #packContents .accordion-item:nth-child(5),
body.app #packContents .accordion-item:nth-child(6) {
    margin: auto auto 0 auto;
}
section.byebye .store-btn-group {padding-bottom: 1rem;}
body.app section.byebye .phone {margin: 20px auto -350px auto;}
body.app #registration .slidenav-controls {top: 50%;}
/* THE APP END */

/* FOOTER */
footer {
    position: relative;
    font-size: .85rem;
    padding: 0;
    color: #00233c;
    background-image: linear-gradient(to bottom, #06416c .25rem, #085085 1rem, #0481de);
    z-index: 1;
}
footer:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background-image: url('../navimgs/navbar-bg.jpg');
    mix-blend-mode: multiply;
    opacity: .33;
    z-index: 0;
}
footer > .container {
    position: relative;
    z-index: 1;
}
footer > .container > .row  {
    padding: 3rem 0 2rem 0;
    margin: 0;
}
footer > .container > .row > .col {
    display: flex;
    flex-direction: column;
    padding: 1rem;
}
.footer-title {
    display: flex;
    padding: 0;
    margin: 0 0 .5rem 0;
    color: rgb(255 255 255 / 75%);
}
.footer-title .title-icon {
    display: flex;
    align-items: center;
    font-size: 1.125rem;
    margin: auto .35rem auto 0;
}
.footer-title.navbar-brand .title-icon {
    height: 32px;
    opacity: 1;
}
.footer-title h4 {
    font-size: 1.125rem;
    font-weight: 600;
    line-height: 1.6;
    white-space: normal;
    margin: auto auto auto 0;
}
.footer-nav {
    display: flex;
    flex-direction: column;
}
footer .nav-link {
    font-weight: 600;
    line-height: 1.75;
    text-decoration: none;
    padding: 2px 0;
    margin: 0 auto .25rem 0;
    color: #012345;
    border-bottom: 1px solid rgb(1 35 69 / 50%);
    opacity: .8;
    transition: color ease-in-out 100ms, padding ease-in-out 300ms;
}
footer .nav-link:hover {
    color: #fff;
    padding-left: .25rem;
    border-color: rgb(255 255 255 / 33%);
    opacity: 1;
}
footer .nav-link.active {
    padding: 2px .5rem 2px 0;
    color: rgb(255 255 255 / 75%);
    border-color: rgb(255 255 255 / 75%);
    pointer-events: none;
}
footer .nav-link:last-child {margin-bottom: 0;}
.footer-nav.store-btn-group {
    padding: 0 0 0.5rem 0;
    margin: -0.5rem 0 0 -1rem;
}
footer .store-btn + .store-btn {margin-top: -.5rem;}
.footer-nav.social {
    flex-direction: row;
    margin: -.25rem 0 0 -.5rem;
}
footer .nav-link.fab {
    font-size: 2rem;
    line-height: normal;
    margin: auto .5rem;
    padding: 0;
    border: none;
    transition: color ease-in-out 300ms;
}
footer .nav-link.fab.fa-facebook {font-size: 1.75rem;}
footer .nav-link.fab.fa-youtube {font-size: 2.25rem;}
footer .payments {
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative;
    padding: 1rem;
    background-color: #f7f7f7;
    z-index: 1;
}
footer .payments .hire-purchase {
    width: 100%;
    max-width: 480px !important;
    margin: 1rem auto;
}
footer .payments .methods {
    height: 20px;
    margin: 1rem auto;
}



/* ------------------------------------------------------------------- */
/* PAGES / MAIN PAGE SECTIONS ---------------------------------------- */
/* ------------------------------------------------------------------- */
/* SHARED */
.sub-page .article-container, .sub-page .content-container {min-height: calc(100vh - 1557px);}
.sub-page > .container-fluid {
    background-color: #fff;
    background-image: linear-gradient(to bottom, #fff, rgb(220 53 69 / 2%));
    border-bottom: 1px solid rgb(220 53 69 / 8%);
}
.sub-page-heading {
    position: relative;
    padding: var(--bs-gutter-x,.75rem) var(--bs-gutter-x,.75rem) var(--bs-gutter-x,1.125rem) var(--bs-gutter-x,.75rem);
}
.sub-page-heading::before {
    content: "";
    position: absolute;
    left: 16px;
    top: -10px;
    width: 20px;
    height: 48px;
    background-color: #dc3545;
    transform: skew(-10deg,0);
}
.sub-page-heading h1 {
    font-size: 1.5rem;
    font-weight: 700;
    letter-spacing: normal;
    margin: 0 0 0 28px;
    color: #7d716e;
}
.sub-page-heading h2 {
    font-size: 1.125rem;
    font-weight: 300;
    line-height: 1.25;
    margin: 0;
    color: #7d716e;
}
.sub-page-heading h2 b {font-weight: 600;}
.sub-page .article-container .container {padding: var(--bs-gutter-x,.75rem);}
.sub-page .article-container .container .row:not(.offers) {margin: 0;}
.sub-page .article-container .container .row .col-lg-6 {padding: 0;}
.sub-page .article-container .container .row .col-lg-6 .row {margin: 0 -1rem;}
.two-col-layout .sidemenu .cat {
    width: calc(100% - 2rem);
    margin: 0 auto;
}
.two-col-layout .sidemenu .cat .sidemenu-title {
    color: #0d6efd;
    background-image: linear-gradient(to bottom, #0d6efd10, #0d6efd20);
}
.two-col-layout .sidemenu .cat .nav-link.active {
    position: relative;
    color: #0481de;
    background-color: #f2f6ff;
    pointer-events: none;
}
.two-col-layout .sidemenu .cat .nav-link.active::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: .25rem;
    height: 100%;
    background-color: #0481de;
}
.two-col-layout .sidemenu .favs {
    width: calc(100% - 2rem);
    margin: 1rem auto;
}
.two-col-layout .sidemenu .favs .sidemenu-title,
.two-col-layout .content .recs .sidemenu-title {
    color: #dc3545;
    background-image: linear-gradient(to bottom, #dc354510, #dc354520);
}
.sidemenu-title {
    width: 100%;
    margin: 0;
    padding: 1rem 1.25rem;
    background-image: linear-gradient(to bottom, #fff, #f0f1f2);
    border-bottom: 1px solid rgb(0 0 0 / 10%);
    border-radius: .75rem .75rem 0 0;
}
.sidemenu-title h5 {
    font-size: 1.125rem;
    font-weight: 700;
    margin: auto auto auto 0;
}
.sidemenu-title a.badge {
    text-decoration: none;
    margin: auto 0 auto auto;
    color: #fff;
}
.two-col-layout ul {
    list-style: none;
    padding: 0;
    margin-bottom: 0;
}
.two-col-layout ul.pagination {flex-wrap: wrap;}
.two-col-layout ul li {margin: 0;}
.two-col-layout .sidemenu-title + ul li, .two-col-layout .filter .dropdown-menu li {border-bottom: 1px solid rgb(0 0 0 / 7%);}
.two-col-layout .sidemenu-title + ul li:last-child, .two-col-layout .filter .dropdown-menu li:last-child {border: none;}
.two-col-layout ul a:not(.page-link) {
    display: flex;
    font-size: .875rem;
    font-weight: 600;
    text-decoration: none;
    padding: 1rem 1.25rem;
    margin: 0;
    color: inherit;
    background-color: #fff;
    border-radius: 0;
}
.two-col-layout .sidemenu-title + ul li:last-child a, .two-col-layout .filter .dropdown-menu li:last-child a {border-radius: 0 0 .75rem .75rem;}
.two-col-layout .sidemenu-title + ul li:first-child a {border-radius: .75rem .75rem 0 0;}
.two-col-layout .recs .sidemenu-title + ul li:first-child a {border-radius: 0;}
.two-col-layout ul a:hover {
    color: #fff;
    background-color: #0481de;
}
.two-col-layout .cat,
.two-col-layout .favs,
.two-col-layout .recs {
    box-shadow: 0 0 0 6px rgb(0 0 0 / 5%), 0 0 0 3px rgb(0 0 0 / 5%), 0 0 0 1px rgb(0 0 0 / 10%);
    border-radius: .75rem;
}
.two-col-layout .favs ul a, .two-col-layout .recs a {padding: .75rem 1rem;}
.two-col-layout .favs ul a:hover, .two-col-layout .recs a:hover, .two-col-layout .filter .dropdown-menu li a:hover {background-color: #dc3545;}
.two-col-layout ul a .fas {
    font-size: 1rem;
    margin: auto .5rem auto 0;
}
.two-col-layout ul a .value {
    line-height: normal;
    margin-bottom: auto 0;
}
.two-col-layout .favs ul a .fas,
.two-col-layout .recs ul a .fas {
    font-size: 1.25rem;
    margin-right: .75rem;
}
.two-col-layout .filter {
    padding: 0 .75rem;
    margin: 0 0 .5rem 0;
}
.two-col-layout .filter .btn {
    display: flex;
    width: 100%;
    text-align: left;
    padding: .5625rem 1rem;
}
.two-col-layout .filter .btn::after {margin: auto 0 auto auto;}
.two-col-layout .filter .dropdown-menu {
    width: calc(100% - 1.5rem);
    box-shadow: 0 .25rem 1rem rgb(0 0 0 / 33%);
    border: none;
    border-radius: 0 0 .75rem .75rem;
}
.mobile-only {margin: 1rem 0.5rem 0 0.5rem;}
/* SHARE END */

/* PACKS */
#registration {
    padding: .75rem 0;
    text-align: center;
}
#registration > .container {
    position: relative;
    max-width: none;
    padding: 0;
}
#registration > .container > .row {margin: 0;}
#slideNavPacksOuter {
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
}
#registration .heading {padding: 0 0 .25rem 0;}
#registration .heading > h2,
#socialMedia .heading h2 {
    font-size: 2rem;
    font-weight: 700;
    width: 240px;
    padding: 0;
    margin: 0 auto .25rem auto;

    background-image:
    linear-gradient(0deg, #6f42c1 0%, rgba(0,0,0,0) 60%),
    linear-gradient(225deg, #198754 0%, rgba(0,0,0,0) 40%),
    linear-gradient(45deg, #0d6efd 0%, rgba(0,0,0,0) 60%),
    linear-gradient(135deg, #fd7e14 0%, rgba(0,0,0,0) 40%),
    linear-gradient(90deg, #495057 0%, rgba(0,0,0,0) 60%),
    linear-gradient(180deg, #dc3545 0%, rgba(0,0,0,0) 100%);
    -webkit-background-clip: text;
    -moz-background-clip: text;
    -webkit-text-fill-color: transparent;
    -moz-text-fill-color: transparent;
}
#socialMedia .heading h2 {width: 214px;}
#registration .heading > p,
#theApp .heading p,
#clientStories .heading p {
    font-size: 1rem;
    font-weight: 400;
    line-height: normal;
    text-align: center;
    padding: 0 .5rem;
}
#clientStories .heading p {color: #fff;}
#registration .heading > *:last-child,
#registration .heading > *:only-child,
#theApp .heading > *:last-child,
#theApp .heading > *:only-child {
    margin: 0;
}
#registration .packages {
    flex-wrap: nowrap;
    --bs-gutter-x: .5rem;
    --bs-gutter-y: .5rem;
    overflow: auto;
}
#registration .packages > .col {
    width: 85%;
    max-width: 300px
}
#registration .packages > .col:first-child {margin-left: .5rem;}
#registration .packages > .col:last-child {margin-right: .5rem;}
#registration .card {
    height: 100%;
    border-radius: .75rem;
    border: none;
    overflow: hidden;
}
#registration .col:nth-child(1) .card {background-color: #0d6efd;}
#registration .col:nth-child(2) .card {background-color: #dc3545;}
#registration .col:nth-child(3) .card {background-color: #198754;}
#registration .col:nth-child(4) .card {background-color: #6f42c1;}
#registration .col:nth-child(5) .card {background-color: #495057;}
#registration .col:nth-child(6) .card {background-color: #fd7e14;}
#registration .card::before {
    content: "";
    position: absolute;
    left: 15px;
    top: 0;
    width: 15px;
    height: 33px;
    background-color: #fff;
    transform: skew(-10deg, 0);
    z-index: 1;
}
#registration .card::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background-image: linear-gradient(66deg, rgb(0 0 0 / 66%), transparent 66%);
    z-index: 0;
}
#registration .card-bg-image {
    position: absolute;
    object-fit: cover;
    bottom: 0;
    width: 100%;
    height: 100%;
    opacity: .2;
    mix-blend-mode: multiply;
}
#registration .card-body {
    display: flex;
    flex-direction: column;
    position: relative;
    color: #fff;
    padding: 1rem .75rem .75rem .75rem;
    z-index: 1;
}
.pack-name {
    font-size: 1.125rem;
    font-weight: 600;
    padding: 0 .5rem 0 1.25rem;
    margin: 0;
}
.pack-calendar {
    font-size: 1rem;
    padding: 0;
    margin: 0;
    opacity: .5;
}
.pack-price {
    font-size: 1.5rem;
    padding: .125rem 0 .5rem 0;
    margin: auto 0;
}
.old-price {
    display: inline-block;
    position: relative;
    line-height: 1;
    opacity: .66;
}
.old-price::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 110%;
    height: .125rem;
    background-color: #fff;
    transform: translate(-50%, -50%) rotate(-12.5deg);
}
.new-price {
    width: 100%;
    font-weight: 700;
    line-height: 1;
}
.pack-features {
    padding: 0;
    margin: 0 0 auto 0;
    list-style-type: none;
    list-style: none;
}
.pack-features li {
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;  
    overflow: hidden;

    font-size: .875rem;
    line-height: 2;
    padding: .35rem 0;
    margin: 0;
}
.pack-features li:last-child {border: none;}
.pack-features li .feature-icon {
    width: 1.5rem;
    font-size: 120%;
    line-height: 2;
    margin: auto .25rem auto auto;
    opacity: .75;
}
.pack-features li .txt {margin: auto auto auto 0;}
#registration .card-footer {
    position: relative;
    padding: .75rem;
    background: none;
    border-top: 1px solid rgb(255 255 255 / 33%);
    z-index: 1;
}
#registration .card-footer > .btn {
    width: 100%;
    opacity: .5;
}
#registration .card-footer > .btn:hover {opacity: 1;}
#registration .slidenav-controls,
#video .slidenav-controls {
    position: absolute;
    top: 66.6667%;
    left: 8px;
    width: calc(100% - 16px);
    z-index: 1;
}
#registration .slidenav-control,
#video .slidenav-control {
    top: auto;
    width: 44px;
    height: 44px;
    justify-content: center;
    padding: 0.625rem 1rem 0.5rem 1rem;
    color: #fff;
    background-color: #dc3545;
    border-width: 1px;
    border-radius: 50%;
    box-shadow: 0 0 0 3px rgb(255 255 255 / 50%);
}
#registration .slidenav-control.hide,
#video .slidenav-control.hide {
    width: 0;
    padding: 0;
    border: none;
}
#packContents,
body.home #clientStories {
    background-color: #dc3545;
    background-image: url('../navimgs/navbar-bg-mobile.jpg');
    background-size: cover;
    background-blend-mode: multiply;
    box-shadow: 0 0 30px rgb(0 0 0 / 33%) inset;
}
#packContents .heading h2,
#theApp .heading h2,
#clientStories .heading h2,
#blog .heading h2,
#video .heading h2,
#measurement .heading h2 {
    font-size: 2rem;
    font-weight: 700;
    line-height: 1;
    letter-spacing: .5px;
    text-align: center;
    padding: 1rem 0 0 0;
    margin: 0;
}
#packContents .heading h2 {
    color: #dee0e1;
    text-shadow: 0 0 30px #000;

    color: #fff;
    text-shadow: none;
}
#clientStories .heading h2 {
    line-height: normal;
    color: #fff;
}
#blog .heading h2 {
    line-height: normal;
    color: #dc3545;
}
#video .heading h2 {
    font-weight: 800;
    letter-spacing: -.25px;
}
#packContents .pack-cards {
    padding: 1rem;
    margin: 0;
}
#packContents .accordion-item {
    min-width: 100%;
    padding: .25rem;
    background: none;
    border-color: transparent;
}
#packContents .accordion-item:nth-child(1), #packContents .accordion-item:nth-child(2), #packContents .accordion-item:nth-child(3) {margin: auto auto 0 auto;}
#packContents .accordion-item:nth-child(4), #packContents .accordion-item:nth-child(5), #packContents .accordion-item:nth-child(6) {margin: 0 auto auto auto;}
#packContents .accordion-header {
    display: flex;
    padding: .5rem;
    background-color: #e9ecef;
    border-radius: .5rem .5rem 0 0;
    cursor: pointer;
}
#packContents .accordion-item:nth-child(1) .accordion-header {
    color: #fd7e14;
    background-color: #fed5b2;
}
#packContents .accordion-item:nth-child(2) .accordion-header {
    color: #198754;
    background-color: #cce5d9;
}
#packContents .accordion-item:nth-child(3) .accordion-header {
    color: #dc3545;
    background-color: #f4c2c7;
}
#packContents .accordion-item:nth-child(4) .accordion-header {
    color: #495057;
    background-color: #c8cacc;
}
#packContents .accordion-item:nth-child(5) .accordion-header {
    color: #6f42c1;
    background-color: #d4c6ec;
}
#packContents .accordion-item:nth-child(6) .accordion-header {
    color: #0d6efd;
    background-color: #cfe2ff;
}
#packContents .accordion-header.collapsed {animation: collapseRadius 0s linear 350ms 1 forwards;}
@keyframes collapseRadius {
    0% {border-radius: .5rem .5rem 0 0;}
    100% {border-radius: .5rem;}
}
.accordion-header .title-icon {
    font-size: 1rem;
    padding: .25rem;
    margin: auto 0;
}
.accordion-header h5 {
    font-size: 1rem;
    font-weight: 500;
    margin: auto .25rem;
}
.accordion-header .expand-icon {
    font-size: 1rem;
    padding: .25rem;
    margin: auto 0 auto auto;
    transform: rotate(-135deg);
    transition: transform ease-in-out 200ms;
}
.accordion-header.collapsed .expand-icon {transform: rotate(0deg);}
#packContents .accordion-collapse {
    font-size: 14px;
    background-color: #fff;
    border-radius: 0 0 .5rem .5rem;
}
#packContents ul {
    list-style: none;
    padding: .75rem 1rem;
    margin: 0;

    list-style: disc;
    padding: .75rem 1rem .75rem 2.75rem;
}
#packContents ul li {
    padding: .25rem;
    margin: 0;
}
#packContents p {padding: 1rem 1.25rem 0 1.25rem;}
#packContents .accordion-collapse hr {margin: 0;}
#packContents .accordion-collapse > *:last-child {
    padding-bottom: 1rem;
    margin-bottom: 0;
}

#theApp .carousel-control-prev, #theApp .carousel-control-next {top: 40%;}
.store-btn-group {
    display: flex;
    justify-content: center;
    padding: 0 0 2rem 0;
}
.store-btn-group.go-detail {
    position: relative;
    padding: 0;
    z-index: 1;
}
.store-btn img {
    max-width: 100%;
    max-height: 64px;
}
/* Page */
body.packs article {padding: 0 1rem;}
.nav-packs {
    position: relative;
    flex-wrap: nowrap;
    width: auto;
    padding: 0 1rem .25rem 1rem;
    margin: 0 -1rem;
    overflow-x: auto;
    overflow-y: hidden;
}
.nav-packs .card {
    min-width: auto;
    white-space: nowrap;
    margin: .5rem .5rem .5rem 0;
    color: #fff;
    border-radius: 1rem;
    opacity: .65;
    transition: all ease-in-out 200ms;
    cursor: pointer;
}
.nav-packs .card:last-child {margin-right: 0;}
.nav-packs .card.active {pointer-events: none;}
.nav-packs .card:hover, .nav-packs .card.active {opacity: 1;}
.nav-packs .card::before {
    content: "";
    position: absolute;
    left: 30px;
    top: -4px;
    width: 20px;
    height: 40px;
    background-color: #fff;
    transform: skew(-10deg, 0);
    z-index: 1;
}
.nav-packs .card:nth-child(1) {
    background-color: #0d6efd;
    box-shadow: 0 0 0 3px rgb(13 110 253 / 33%);
    border-color: #0667f6;
}
.nav-packs .card:nth-child(2) {
    background-color: #dc3545;
    box-shadow: 0 0 0 3px rgb(220 53 69 / 33%);
    border-color: #d53040;
}
.nav-packs .card:nth-child(3) {
    background-color: #198754;
    box-shadow: 0 0 0 3px rgb(25 135 84 / 33%);
    border-color: #127040;
}
.nav-packs .card:nth-child(4) {
    background-color: #6f42c1;
    box-shadow: 0 0 0 3px rgb(111 66 193 / 33%);
    border-color: #6837b6;
}
.nav-packs .card:nth-child(5) {
    background-color: #495057;
    box-shadow: 0 0 0 3px rgb(73 80 87 / 33%);
    border-color: #424750;
}
.nav-packs .card:nth-child(6) {
    background-color: #fd7e14;
    box-shadow: 0 0 0 3px rgb(253 126 20 / 33%);
    border-color: #f67703;
}
.nav-packs .card.active:nth-child(1) {color: #cfe2ff;}
.nav-packs .card.active:nth-child(2) {color: #f4c2c7;}
.nav-packs .card.active:nth-child(3) {color: #cce5d9;}
.nav-packs .card.active:nth-child(4) {color: #d4c6ec;}
.nav-packs .card.active:nth-child(5) {color: #c8cacc;}
.nav-packs .card.active:nth-child(6) {color: #fed5b2;}
.nav-packs .card-img {
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
    margin: 0;
    border-radius: calc(1rem - 1px);
    opacity: .2;
}
.nav-packs .card.active .card-img {
    mix-blend-mode: multiply;
    opacity: .3;
}
.nav-packs .card-body {
    display: flex;
    flex-direction: column;
    position: relative;
    line-height: normal;
    width: 100%;
    height: 100%;
    padding: 2.5rem;
}
.nav-packs .card-title {
    font-size: 1.35rem;
    font-weight: 700;
    text-align: center;
    white-space: normal;
    margin: auto auto 0 auto;
}
.nav-packs small {
    font-size: 1.125rem;
    margin: .25rem auto .25rem auto;
    opacity: .65;
}
.pack-price {
    font-size: 1.75rem;
    text-align: center;
    margin: .25rem auto auto auto;
}
.nav-packs .card .moneymoneymoney {
    width: auto;
    padding: 1rem 0 .25rem 0;
    margin: auto;
    opacity: 0;
    transition: opacity ease-in-out 500ms;
}
.nav-packs .card.active .moneymoneymoney {opacity: 1;}
.nav-packs .card .moneymoneymoney .btn-buy {
    padding: 0.5rem 1rem;
    margin: 0;
    background: #fff;
    pointer-events: none;
}
.nav-packs .card.active .moneymoneymoney .btn-buy {pointer-events: all;}
.nav-packs .card:nth-child(1) .moneymoneymoney .btn-buy {color: #0d6efd;}
.nav-packs .card:nth-child(2) .moneymoneymoney .btn-buy {color: #dc3545;}
.nav-packs .card:nth-child(3) .moneymoneymoney .btn-buy {color: #198754;}
.nav-packs .card:nth-child(4) .moneymoneymoney .btn-buy {color: #6f42c1;}
.nav-packs .card:nth-child(5) .moneymoneymoney .btn-buy {color: #495057;}
.nav-packs .card:nth-child(6) .moneymoneymoney .btn-buy {color: #fd7e14;}
body.packs .sub-page .row.responsive-tab-group {margin-bottom: 2rem;}
body.packs .responsive-tab-group .col-lg-auto {position: relative;}
body.packs .responsive-tab-group .col-lg-auto .slidenav-controls {
    position: absolute;
    top: calc(50% + 4px);
    width: 100%;
    z-index: 3;
}
body.packs .responsive-tab-group .col-lg-auto .slidenav-control {
    top: 50%;
    transform: translate(0, -50%);
    width: 44px;
    height: 44px;
    justify-content: center;
    padding: 0.625rem 1rem 0.5rem 1rem;
    color: #fff;
    background-color: #dc3545;
    border-width: 1px;
    border-radius: 50%;
    box-shadow: 0 0 0 3px rgb(255 255 255 / 50%);
}
body.packs .responsive-tab-group .col-lg-auto .slidenav-control.hide {
    width: 0;
    padding: 0;
    border: 0;
}
body.packs .responsive-tab-group .col-lg-auto .slidenav-control.prev {left: -10px;}
body.packs .responsive-tab-group .col-lg-auto .slidenav-control.next {right: -10px;}
body.packs .tab-content > .tab-pane {
    border-width: 1px;
    border-style: solid;
    border-radius: .5rem;
}
body.packs .tab-content > .tab-pane:nth-child(1) {
    background-color: rgb(13 110 253 / 3%);
    border-color: #cfe2ff;
}
body.packs .tab-content > .tab-pane:nth-child(2) {
    background-color: rgb(220 53 69 / 2%);
    border-color: #f4c2c7;
}
body.packs .tab-content > .tab-pane:nth-child(3) {
    background-color: rgb(25 135 84 / 3%);
    border-color: #cce5d9;
}
body.packs .tab-content > .tab-pane:nth-child(4) {
    background-color: rgb(111 66 193 / 3%);
    border-color: #d4c6ec;
}
body.packs .tab-content > .tab-pane:nth-child(5) {
    background-color: rgb(73 80 87 / 3%);
    border-color: #c8cacc;
}
body.packs .tab-content > .tab-pane:nth-child(6) {
    background-color: rgb(253 126 20 / 3%);
    border-color: #fed5b2;
}
body.packs .tab-content > .tab-pane:nth-child(1) h4, body.packs .tab-content > .tab-pane:nth-child(1) .feature-icon, body.packs .tab-content > .tab-pane:nth-child(1) h6 {color: #0d6efd;}
body.packs .tab-content > .tab-pane:nth-child(2) h4, body.packs .tab-content > .tab-pane:nth-child(2) .feature-icon, body.packs .tab-content > .tab-pane:nth-child(2) h6 {color: #dc3545;}
body.packs .tab-content > .tab-pane:nth-child(3) h4, body.packs .tab-content > .tab-pane:nth-child(3) .feature-icon, body.packs .tab-content > .tab-pane:nth-child(3) h6 {color: #198754;}
body.packs .tab-content > .tab-pane:nth-child(4) h4, body.packs .tab-content > .tab-pane:nth-child(4) .feature-icon, body.packs .tab-content > .tab-pane:nth-child(4) h6 {color: #6f42c1;}
body.packs .tab-content > .tab-pane:nth-child(5) h4, body.packs .tab-content > .tab-pane:nth-child(5) .feature-icon, body.packs .tab-content > .tab-pane:nth-child(5) h6 {color: #495057;}
body.packs .tab-content > .tab-pane:nth-child(6) h4, body.packs .tab-content > .tab-pane:nth-child(6) .feature-icon, body.packs .tab-content > .tab-pane:nth-child(6) h6 {color: #fd7e14;}
body.packs .tab-content .features > ul > li {display: flex;}
body.packs .tab-content .features > ul > li ul > li {
    padding: 0.75rem 0;
    border-bottom: 1px solid rgb(0 0 0 / 11%);
}
body.packs .tab-content .features > ul > li ul > li:last-child {border: none;}
body.packs .tab-content h4 {
    font-size: 1.5rem;
    font-weight: 700;
    padding: 0 0 0 3.25rem;
    margin: 0 0 1rem 0;
    opacity: .75;
}
body.packs .tab-content .features {padding: 2rem 1rem;}
body.packs .tab-content .feature-icon {
    font-size: 2rem;
    margin: 1.125rem .5rem auto 0;
    opacity: .4;
}
body.packs .tab-content .feature-content {padding: 1.25rem 0;}
body.packs .tab-content h6 {
    font-size: 1.25rem;
    font-weight: 600;
    margin: 0 auto .5rem 0;
    opacity: .75;
}
body.packs .havale {margin: 2rem 0 0 0;}
/* PACKS END */

/* SOCIAL MEDIA */
#socialMedia {padding: 2rem 1rem 1rem 1rem;}
.social-medias-container {
    display: flex;
    justify-content: space-evenly;
    flex-wrap: wrap;
    max-width: 750px;
    text-align: center;
    padding: .5rem;
    margin: auto;
}
.social-media-element {
    display: flex;
    position: relative;
    flex-direction: column;
    min-width: 100%;
    width: 100%;
    height: 100%;
    padding: .75rem 1rem 1rem 1rem;
    margin: .5rem;
    transform: skew(-10deg, 0);
    border-width: 2px;
    border-style: solid;
    border-radius: 1rem;
    transition: all ease-in-out 200ms;
}
.social-media-name {
    display: flex;
    transform: skew(10deg, 0);
}
.social-media-element.facebook {
    color: #1877F2;
    box-shadow: 0 0 0 3px #1877F211;
    border-color: #1877F233;
}
.social-media-element.facebook:hover {
    box-shadow: 0 0 0 5px #1877F222;
    background-color: rgb(24 119 242 / 4%);
}
.social-media-element.instagram {
    color: #be00a5;
    box-shadow: 0 0 0 3px #be00a511;
    border-color: #be00a533;
}
.social-media-element.instagram:hover {
    box-shadow: 0 0 0 5px #be00a522;
    background-color: rgb(190 0 165 / 3%);
}
.social-media-element.instagram .brand-icon {
    background-image: linear-gradient(45deg, #fecb1f, #f00010 33%, #be00a5 66%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.social-media-element.youtube {
    color: #ff0000;
    box-shadow: 0 0 0 3px #ff000011;
    border-color: #ff000033;
}
.social-media-element.youtube:hover {
    box-shadow: 0 0 0 5px #ff000022;
    background-color: rgb(255 0 0 / 4%);
}
.social-media-name .brand-icon {
    font-size: 2.25rem;
    margin: auto .5rem auto 0;
}
.social-media-name .brand-name {
    font-size: 1rem;
    margin: auto auto auto 0;
}

.social-media-element .followers {
    display: flex;
    flex-direction: column;
    line-height: normal;
    margin: .125rem auto .75rem auto;
    transform: skew(10deg, 0);
    opacity: .5;
}
.social-media-element .counter {
    font-size: 2rem;
    font-weight: 100;
    margin: 0 0 -.5rem 0;
    opacity: .5;
}
.social-media-element .btn {
    color: #fff;
    padding: .5rem 1rem;
    margin: 0 -1rem -1rem auto;
    box-shadow: none;
    border-radius: 21px 0 15px 0;
}
.social-media-element.facebook .btn {background-color: #1877F2;}
.social-media-element.instagram .btn {background-color: #be00a5;}
.social-media-element.youtube .btn {background-color: #ff0000;}
.social-media-element .transform-element {transform: skew(10deg, 0);}

/* CLIENT STORIES */
.stories-container {padding: 0 0 .5rem 0;}
.stories-container + .store-btn-group {padding-bottom: 1.75rem;}
#clientStoriesCarousel .carousel-item {background: none;}
.client-sample-container {
    max-width: 270px;
    margin: 1rem auto;
    background-color: #fff;
    box-shadow: 0 0 .5rem rgb(0 0 0 / 66%);
    border: 1px solid #ddd;
    border-radius: 17px;
}
body.success .client-sample-container {
    margin: auto;
    box-shadow: 0 0 .5rem 0 rgb(0 0 0 / 10%), 0 0 1rem 0 rgb(0 0 0 / 9%);
    border-color: rgb(0 0 0 / 10%);
}
.client-sample-header {
    display: flex;
    padding: .75rem .75rem;
    background-color: #fff;
    border-radius: 1rem 1rem 0 0;
    border-bottom: 1px solid #ddd;
}
.client-sample-header .bt-logo {
    width: 36px;
    margin: auto .5rem auto 0;
}
.client-pack {
    font-size: 12px;
    font-weight: 600;
    line-height: 1.2;
    margin: -1px 0 auto 0;
}
.client-pack > .description {color: #dc3545;}
.before-after-container {
    display: flex;
    position: relative;
    padding: 1rem .25rem;
    background-color: #fff;
}
.before-after-container .title {
    position: absolute;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.4288;
    padding: .25rem .5rem;
    color: #fff;
    background-color: #000;
    z-index: 1;
}
.before-after-container .title.before {
    left: -1px;
    top: 0;
    border-bottom: 1px solid #fff;
}
.before-after-container .title.after {
    right: -1px;
    bottom: 0;
    background-color: #dc3545;
    border-top: 1px solid #fff;
}
.before-after-container .title::after {
    content: "";
    position: absolute;
    width: 6px;
    height: 28px;
    transform: skew(-10deg, 0);
}
.before-after-container .title.before::after {
    top: 0;
    right: -3px;
    background-color: #000;
    border-right: 1px solid #fff;
}
.before-after-container .title.after::after {
    left: -3px;
    bottom: 0;
    background-color: #dc3545;
    border-left: 1px solid #fff;
}
.ba-item {
    display: flex;
    position: relative;
    width: 50%;
    height: 0;
    padding: 0 0 75% 0;
    margin: auto .25rem;
    overflow: hidden;
}
.ba-item .ba-img {
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.client-sample-container > .client-name {
    min-height: 35.2px;
    font-size: 80%;
    padding: .5rem 1rem;
}
.client-summary {
    position: relative;
    display: flex;
    flex-direction: column;
    font-size: 13px;
    line-height: 1.25;
    padding: .75rem 1rem;
    margin: 0 -1rem;
    background-color: #fff;
    box-shadow: 0 .25rem 1rem rgb(0 0 0 / 44%);
    z-index: 1;
}
.client-summary::before,
.client-summary::after {
    content: "";
    position: absolute;
    bottom: -1rem;
    border-width: .5rem;
    border-style: solid;
}
.client-summary::before {
    left: 0;
    border-color: #888 #888 transparent transparent;
}
.client-summary::after {
    right: 0;
    border-color: #888 transparent transparent #888;
}
.client-summary.gold .member-type {color: #d4af37;}
.client-summary.silver .member-type {color: #c0c0c0;}
.client-summary.bronze .member-type {color: #cd7f32;}
.progress-photo {
    display: flex;
    padding: .25rem;
    background-color: #fff;
    border-radius: 0 0 1rem 1rem;
}
.progress-img-container {
    width: 33.3333%;
    padding: .25rem;
}
.progress-img {max-width: 100%;}
.progress-img-container:first-child .progress-img {border-radius: 0 0 0 .5rem;}
.progress-img-container:last-child .progress-img {border-radius: 0 0 .5rem 0;}

/* MEASUREMENT */
#measurement {
    background-color: #e9e8f1;
    box-shadow: 0 -2px 12px rgb(0 0 0 / 40%);
}
#measurement .heading h2 {padding-top: 2rem;}
#measurement .row {justify-content: center;}
#measurement .card {
    height: 100%;
    box-shadow: 0 .125rem .25rem rgba(0,0,0,.075);
    transition: all ease-in-out 200ms;
}
#measurement .card:hover {box-shadow: 0 .5rem 1rem rgba(0,0,0,.15);}
#measurement .card-text {
    font-size: .875rem;
    line-height: normal;
}
#measurement .card-img-top {
    position: relative;
    width: calc(100% + 2px);
    height: 0;
    padding: 0 0 56.25% 0;
    margin: -1px;
    color: #dc3545;
    background-color: rgba(220,53,69,.07);
    border: 1px solid #f8c8cc;
}
#measurement .card-img-top .aligner {
    display: flex;
    position: absolute;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
}
#measurement .card-img-top [class*="fa-"] {font-size: 3rem;}
#measurement .card-title {color: #dc3545;}
#measurement .card-footer {padding: 0;}
#measurement .card-footer .btn {
    display: flex;
    width: 100%;
    padding: .875rem 1rem;
    border-radius: 0 0 3px 3px;
}
#measurement .card-footer .btn .fa-calculator {
    font-size: 1.5rem;
    margin: auto auto auto 0;
}
#measurement .card-footer .btn-title {
    margin: auto 0 auto auto;
    text-align: right;
    line-height: 1;
}
#measurement .card-footer .btn-title + [class*="fa-"] {margin: auto 0 auto .5rem;}
/* MEASUREMENT END */

/* BLOG */
#blog {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 75vh;
    padding: 1.5rem 0 3.5rem 0;
    background-color: #fff;
    z-index: 1;
}
body.blog #blog {box-shadow: none;}
#blog > .container {margin: auto auto 0 auto;}
.blog-container {
    width: 100%;
    max-width: 1400px;
    padding-top: 2rem;
    margin: 0 auto auto auto;
}
#blogCarousel .carousel-indicators {margin-bottom: -1.75rem;}
#blogCarousel .carousel-indicators [data-bs-target] {
    position: relative;
    min-width: 16px;
    width: 16px;
    height: 16px;
    text-indent: 0;
    margin: auto 4px;
    background-color: rgba(0,0,0,.1);
    border: 1px solid #fff;
    border-radius: 50em;
    opacity: 1;
}
#blogCarousel .carousel-indicators [data-bs-target].active {
    background-color: #fff;
    box-shadow: 0 0 0 1px rgba(0,0,0,.2);
}
#blogCarousel .carousel-indicators [data-bs-target]::after {
    content: "";
    position: absolute;
    left: 3px;
    top: 3px;
    width: 10px;
    height: 10px;
    background-color: #2e286b;
    border-radius: 50%;
    transform: scale(0);
    transform-origin: center center;
    transition: transform ease-in-out 300ms;
}
#blogCarousel .carousel-indicators [data-bs-target].active::after {transform: scale(1);}
#blogCarousel .carousel-inner::before,
#blogCarousel .carousel-inner::after {
    content: "";
    position: absolute;
    top: 0;
    width: 15%;
    height: 100%;
    z-index: 1;
}
#blogCarousel .carousel-inner::before {
    left: 0;
    background: linear-gradient(to right, #fff 5%, rgba(255,255,255,0));
}
#blogCarousel .carousel-inner::after {
    right: 0;
    background: linear-gradient(to left, #fff 5%, rgba(255,255,255,0));
}
#blogCarousel .carousel-item {padding-bottom: 1rem;}
#blog .card {
    max-width: 250px;
    margin: 1rem auto .5rem auto;
    box-shadow: 0 0 0 4px rgb(220 53 69 / 20%);
    border-color: rgb(220 53 69 / 40%);
    border-radius: .5rem;
    transition: all ease-in-out 300ms;
}
#blog .card:hover {
    box-shadow: 0 2px 4px rgb(0 0 0 / 10%), 0 4px 8px 0 rgb(0 0 0 / 10%), 0 10px 20px 0 rgb(0 0 0 / 9%);
    border-color: rgb(0 0 0 / 10%);
}
#blog .card-img {
    margin: 0;
    border-bottom: 1px solid rgb(220 53 69 / 20%);
    border-radius: calc(.5rem - 1px) calc(.5rem - 1px) 0 0;
}
#blog .card-title {
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.2;
    margin-bottom: .25rem;
    color: #dc3545;
}
#blog .card-text {
    font-size: .875rem;
    line-height: normal;
    margin-bottom: 0.25rem;
}
#blog .card-info {margin-bottom: .5rem;}
#blog .card-info .text-muted {
    color: #dc3545 !important;
    opacity: .65;
}
#blog .card .btn.stretched-link {
    padding: 0.25rem 0.5rem;
    margin: auto auto 0 0;
}
#blog .store-btn-group {padding: 1rem 0 0 0;}
/* Sayfa */
body.blog #blog .card {
    max-width: none;
    height: 100%;
    margin: auto;
}
body.blog .card-body {
    display: flex;
    flex-direction: column;
}
/* body.blog #blog .card {
    max-width: none;
    margin: auto;
    box-shadow: none;
    border-color: rgba(0,0,0,.125);
}
body.blog #blog .card:hover {box-shadow: 0 4px 8px 0 rgb(0 0 0 / 10%), 0 10px 20px 0 rgb(0 0 0 / 9%);}
body.blog #blog .card-img {border-color: rgba(0,0,0,.125);}
body.blog #blog .card-title {
    font-size: 1.25rem;
    line-height: normal;
   color: #6c757d;
} */
/*body.blog #blog .card-info .text-muted {color: #6c757d !important;}*/
article.blog-post h1 {
    font-weight: 700;
    color: #dc3545;
}
article.blog-post img {max-width: 100%;}
article.blog-post img.post-img {
    width: 100%;
    margin: .5rem 0 1rem 0;
}
article.blog-post .post-tags ul {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -.25rem;
}
article.blog-post .post-tags ul a {
    font-size: .8rem;
    line-height: normal;
    padding: 0.5rem 1rem;
    margin: 0 0.25rem 0.25rem 0;
    background-color: #eee;
    border-radius: 50em;
    transition: color .15s ease-in-out, background-color .15s ease-in-out;
}
article.blog-post .post-tags ul a:hover {background-color: #0481de;}
/* BLOG END */

/* FAQ */
body.faq .accordion-item {
    margin-bottom: 1rem;
    box-shadow: 0 2px 5px 0 rgb(0 0 0 / 10%), 0 0 0 1px rgb(0 0 0 / 10%);
    border: none;
    border-radius: 0.25rem;
    overflow: hidden;
}
body.faq .accordion-header {
    display: flex;
    padding: 0.5rem;
    background-image: linear-gradient(to bottom, #fff, #f0f1f2);
    cursor: pointer;
}
.accordion-item:nth-child(1n) .accordion-header {
    color: #0d6efd;
    background-image: linear-gradient(to bottom, #0d6efd05, #0d6efd11);
}
.accordion-item:nth-child(2n) .accordion-header {
    color: #dc3545;
    background-image: linear-gradient(to bottom, #dc354505, #dc354511);
}
.accordion-item:nth-child(3n) .accordion-header {
    color: #198754;
    background-image: linear-gradient(to bottom, #19875405, #19875411);
}
.accordion-item:nth-child(4n) .accordion-header {
    color: #6f42c1;
    background-image: linear-gradient(to bottom, #6f42c105, #6f42c111);
}
.accordion-item:nth-child(5n) .accordion-header {
    color: #fd7e14;
    background-image: linear-gradient(to bottom, #fd7e1405, #fd7e1411);
}
.accordion-item:nth-child(6n) .accordion-header {
    color: #6c757d;
    background-image: linear-gradient(to bottom, #6c757d05, #6c757d11);
}
.accordion-item:nth-child(7n) .accordion-header {
    color: #d9a100;
    background-image: linear-gradient(to bottom, #ffc10705, #ffc10711);
}
body.faq .accordion-header .title-icon {
    font-size: 1rem;
    padding: .25rem;
}
body.faq .accordion-item .expand-icon {
    font-size: 1rem;
    padding: .25rem;
}
body.faq .accordion-collapse .container {padding: 1rem;}
/* FAQ END */

/* SUCCESS STORIES */

/* VIDEO */
#video {
    display: flex;
    flex-direction: column;
    padding: 1.5rem 0 2rem 0;
    color: #30276b;
    background-color: #e9e8f1;
}
#video > .container {margin: auto auto 0 auto;}
#video > .video-container {
    width: 100%;
    margin: 0 auto auto auto;
}
#video > .video-container > .container {
    position: relative;
    padding: 0;
}
#video .video-container .container > .row {
    flex-wrap: nowrap;
    width: 100%;
    padding: 2rem 0;
    margin: 0;
    overflow-x: auto;
    overflow-y: hidden;
}
#video .video-container .container > .row > .col {
    max-width: 250px;
    padding: 0 .25rem;
}
#video .video-container .container > .row > .col:first-child {margin-left: 0.5rem;}
#video .video-container .container > .row > .col:last-child {margin-right: 0.5rem;}
.video-card {
    height: 100%;
    border-radius: calc(.5rem + 1px);
}
.video-card-img {
    position: relative;
    width: 100%;
    height: 0;
    padding: 0 0 56.25% 0;
    overflow: hidden;
}
.video-card-img .card-img-top {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    border-radius: .5rem .5rem 0 0;
}
.video-card .date {
    font-size: .875rem;
    margin: 0 0 .25rem 0;
}
.video-card h5 {
    font-size: 1rem;
    font-weight: 700;
    margin: 0 0 auto 0;
    color: #6c757d;
}
#video .store-btn-group {padding: 0;}
#video .slidenav-controls {top: 40%;}

/* ABOUT */
.about .sub-page h4 {
    font-weight: 700;
    color: #0481de;
}

/* QUIZ */
body.quiz-sum.packs .aspc-16x9 {
    position: relative;
    height: 0;
    padding: 0 0 56.35% 0;
}
body.quiz-sum.packs .aspc-16x9 iframe {
    position: absolute;
    width: 100%;
    height: 100%;
    padding: 0;
    border-radius: .5rem;
}
body.quiz-sum.packs .responsive-tab-group .col-lg-auto::before, body.quiz-sum.packs .responsive-tab-group .col-lg-auto::after {content: none;}
body.quiz-sum .features ul {
    padding: 0;
    margin: 0;
    list-style: none;
}
body.quiz-sum .features ul li {margin: 0;}
body.quiz-sum .features ul li .feature-icon {
    width: 56px;
    text-align: center;
}
body.quiz-sum .features ul li:last-child .feature-content {padding-bottom: 0;}
body.quiz-sum #clientStories {
    padding: 0 0 2rem 0;
    margin: 0 -1rem;
    background-color: #dc3545;
    background-image: url(../navimgs/navbar-bg-mobile.jpg);
    background-size: cover;
    background-blend-mode: multiply;
    box-shadow: 0 0 30px rgb(0 0 0 / 33%) inset;
}
body.quiz-sum #clientStories .store-btn-group {display: none;}
.lastword {flex-direction: column;}
.lastword h1 {
    background-image: linear-gradient(45deg, #fecb1f, #f00010 33%, #be00a5 66%);
    -webkit-background-clip: text;
    -moz-background-clip: text;
    -webkit-text-fill-color: transparent;
    -moz-text-fill-color: transparent;
}
.moneymoneymoney {
    display: flex;
    width: 100%;
    padding: .5rem 1rem .5rem 0;
}
.container-fluid.moneymoneymoney {
    width: auto;
    padding: 0;
    margin: 0 -1rem;
    background-image: linear-gradient(to top, #fff, rgb(220 53 69 / 11%));
    border-top: 1px solid rgb(220 53 69 / 22%);
}
body.quiz-sum .moneymoneymoney .havale {
    text-align: center;
    padding: 1.5rem 0;
    margin: 0 auto;
    background: none;
    box-shadow: none;
    border-radius: 0;
}
.lastword .btn-buy,
.moneymoneymoney .btn-buy {
    margin: 0 0 .4rem 0;
    color: #fff;
    background-image: linear-gradient(0deg, #6f42c1 0%, rgba(0,0,0,0) 60%),
    linear-gradient(225deg, #198754 0%, rgba(0,0,0,0) 40%),
    linear-gradient(45deg, #0d6efd 0%, rgba(0,0,0,0) 60%),
    linear-gradient(135deg, #fd7e14 0%, rgba(0,0,0,0) 40%),
    linear-gradient(90deg, #495057 0%, rgba(0,0,0,0) 60%),
    linear-gradient(180deg, #dc3545 0%, rgba(0,0,0,0) 100%);
}
.responsive-tab-group .moneymoneymoney .btn-buy {
    width: 100%;
    padding: .75rem 1rem;
    margin: 0 .5rem 0 0;
}
.lastword hr,
.moneymoneymoney hr {
    background-color: transparent;
    background-image: linear-gradient(to right, rgb(220 53 69 / 75%) 20%, transparent 0%);
    background-position: bottom;
    background-size: 8px 1px;
    background-repeat: repeat-x;
    opacity: 1;
}

/* CONTACT */
body.contact .article-container > .container {position: relative;}
body.contact .social {
    background-image: linear-gradient(to right, rgb(0 0 0 / 75%) 20%, transparent 0%);
    background-position: bottom;
    background-size: 8px 1px;
    background-repeat: repeat-x;
}
body.contact .form-group h4 {text-align: center;}
body.contact .socials {padding: .75rem 1rem;}
body.contact .socials + .whatsapp {
    align-items: center;
    font-size: 1.25rem;
    font-weight: 600;
    padding: .75rem 1rem 0 1rem;
    background-image: linear-gradient(to right, rgb(0 0 0 / 75%) 20%, transparent 0%);
    background-position: top;
    background-size: 8px 1px;
    background-repeat: repeat-x;
}
body.contact .socials + .whatsapp .label {display: flex;}
body.contact .socials + .whatsapp .label-icon {
    font-size: 2rem;
    margin: auto .25rem auto auto;
    background-image: linear-gradient(45deg, #075E54, #25D366);
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
}
body.contact .socials + .whatsapp .label .title {
    margin: auto auto auto 0;
    color: #198754;
}
body.contact .socials .col {
    width: auto;
    height: auto;
    margin: auto .5rem;
}
body.contact .socials .col:first-child {margin-left: auto;}
body.contact .socials .col:last-child {margin-right: auto;}
body.contact .social-icon {
    text-decoration: none;
    color: #6c757d;
    transition: color ease-in-out 100ms, background-image ease-in-out 300ms;
}
body.contact .fa-instagram {
    font-size: 2.25rem;
    padding: 0 2.5px;
    color: #fff;
    background-image: linear-gradient(45deg, #fecb1f, #f00010 33%, #be00a5 66%);
    border-radius: 11px;
}
body.contact .fa-youtube {
    font-size: 2.5rem;
    color: #f00;
}
body.contact .fa-facebook {
    font-size: 2.125rem;
    color: #1877F2;
}
body.contact .fa-envelope {
    font-size: 2.5rem;
    color: #03a9f4;
}
/* CONTACT END */

/* TEAM */
.staff {
    background-image: linear-gradient(to right, rgb(0 0 0 / 75%) 20%, transparent 0%);
    background-position: bottom;
    background-size: 8px 1px;
    background-repeat: repeat-x;
}
.staff:last-child {background-image: none;}
.staff > .row {margin: 0 -.5rem;}
.staff > .row > .col {
    position: relative;
    padding: 0 .5rem;
}
.staff > .row > .col > .row {
    border-radius: .5rem;
    box-shadow: 0 0 0 1px rgb(0 0 0 / 12%)
}
.staff h3 {
    font-size: 1.275rem;
    font-weight: 700;
}
.staff-img {
    width: 100%;
    height: 100%;
    border-radius: 7px 0 0 7px;
    object-fit: cover;
}
.staff-data {
    display: flex;
    flex-direction: column;
    padding: .75rem;
}
.staff-data h5 {
    position: relative;
    font-size: 1.125rem;
    font-weight: 700;
    margin: 0;
}
.staff-data h6 {
    font-size: 85%;
    font-weight: 600;
    opacity: .65;
}
.staff-detail .staff-data .connection-icon {font-size: 200%;}
.staff-detail .staff-data .badge {font-size: 100%;}
.staff-data .connections {margin: 0 -.125rem;}
.staff-data .connection-icon {
    font-size: 1.25rem;
    text-decoration: none;
    margin: 0 .125rem;
    color: #495057;
    transition: all ease-in-out 300ms;
}
.staff-data .fa-instagram {
    padding: 1px 2px 0 2px;
    border-radius: 7px;
    background-image: linear-gradient(45deg, #fff, #fff 33%, #fff 66%);
    transition: color ease-in-out 100ms, background-image ease-in-out 300ms;

    color: #fff;
    background-image: linear-gradient(45deg, #fecb1f, #f00010 33%, #be00a5 66%);
}
.staff-data .fa-instagram:hover {
    color: #fff;
    background-image: linear-gradient(45deg, #fecb1f, #f00010 33%, #be00a5 66%);
}
.staff-data .fa-facebook {color: #1877F2;}
.staff-data .fa-youtube {color: #f00;}
.staff-data .fa-linkedin {color: #0a66c2;}
.staff-data .contribution {
    display: flex;
    flex-wrap: wrap;
    margin: .75rem -2px 1rem -2px;
}
.staff-data .badge {
    display: block;
    font-weight: normal;
    padding: .25em .75em;
    margin: 1px;
    opacity: .55;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .1s ease-in-out,opacity .15s ease-in-out;
}
.staff-data .badge:hover, .staff-data .badge:active {opacity: 1;}
.staff-data .badge:focus {box-shadow: none;}
.staff-data .badge:active {box-shadow: 0 0 0 0.25rem rgb(130 138 145 / 50%);}
/* TEAM END */

/* 404 */
.error-404-page {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    padding: 0;
    margin: 0;
}
.error-404-page main {
    display: flex;
    flex-direction: column;
    min-height: 765px;
    height: 100%;
    padding: 2rem 0;
}
.error-404-page .bt-logo {
    width: 5rem;
    margin: auto auto .25rem auto;
}
.title-404 {
    font-family: 'Monoton', cursive;
    font-size: 5rem;
    padding: 0 2rem;
    margin: 1rem auto;
    color: #b9b7b5;
    border-width: 1px 0;
    border-style: solid;
    border-color: #ddd;
}
.page-illustration-container {
    display: flex;
    flex-direction: column;
    width: 100%;
    min-height: 500px;
    max-height: 500px;
    margin: -75px auto -95px auto;
    overflow: hidden;
}
.page-illustration {
    display: flex;
    position: relative;
    width: 208px;
    min-height: 288px;
    max-height: 288px;
    margin: 75px auto;
}
.page-illustration-body {
    position: absolute;
    left: 0;
    top: 0;
    width: 208px;
    height: 288px;
    background-color: #f9f8f7;
    border: 1px solid #ddd;
}
.page-illustration-decor {
    position: absolute;
    border: 1px dashed #e6e4e2;
    border-radius: 50%;
}
.page-illustration-decor.large {
    left: -75px;
    top: -35px;
    width: 150px;
    height: 150px;
}
.page-illustration-decor.small {
    right: -50px;
    bottom: -50px;
    width: 90px;
    height: 90px;
}
.page-illustration-curve {
    position: absolute;
    top: -1px;
    right: -1px;
    width: 60px;
    height: 60px;
    background-color: #eee;
    box-shadow: -2px 3px 3px rgba(0,0,0,.11);
    overflow: hidden;
}
.page-illustration-curve::after {
    content: "";
    position: absolute;
    top: -41px;
    right: -41px;
    width: 84px;
    height: 84px;
    background-color: #fff;
    transform: rotate(45deg);
    border-bottom: 1px solid #d8d6d4;
}
.page-illustration-crops {
    display: flex;
    position: absolute;
    left: -1px;
    bottom: -22.8px;
    width: 208px;
    height: 23.8px;
    border-width: 0 1px;
    border-style: solid;
    border-color: #ddd;
    overflow: hidden;
}
.page-illustration-crops .crop-item {
    width: 29.416px;
    height: 29.416px;
    margin: -14px 6px 6px 6px;
    background-color: #f9f8f7;
    border: 1px solid #ddd;
    transform: rotate(45deg);
}
.page-illustration-crops .crop-item:first-child {margin-left: -14px;}
.page-illustration-crops .crop-item:last-child {margin-right: -14px;}
.page-illustration .icon {
    font-size: 5rem;
    margin: auto;
    opacity: .1;
}
.error-404-page .info-text {margin: 0 auto 1rem auto;}
.error-404-page .navbar-search-container {margin: 0 auto 1rem auto;}
.error-404-page .btn-back-to-home {
    display: flex;
    padding: 0.5rem 1.25rem 0.5rem 1rem;
    margin: 0 auto auto auto;
}
.error-404-page .btn-back-to-home .btn-icon {margin: auto 4px auto 0;}
.error-404-page .btn-back-to-home .btn-title {margin: auto 0;}
.error-404-page footer {margin: auto 0 0 0;}
/* 4040 END */


/* ------------------------------------------------------------------- */
/* RESPONSIVE WEB & DEVICE SUPPORTS ---------------------------------- */
/* ------------------------------------------------------------------- */
@media (min-width: 320px) {
    .fast-offer .content {min-width: 280px;}
}
@media (min-width: 375px) {
    .fast-offer .content {min-width: 340px;}
    .fast-offer .c-title {padding: 0;}

    /* WHATSAPP ICON */
    .btn-whatsapp {
        right: 2rem;
        bottom: 2rem;
    }

    /* CAROUSEL */
    .carousel a.quiz {width: 250px;}

    /* CLIENT STORIES */
    .client-sample-container {max-width: 320px;}

    /* MEASUREMENT XTR RESPONSIVES */
    .row-cols-xs-2>* {
        flex: 0 0 auto;
        width: 50%;
    }
    :not(.offers) .p-xs-1, .p-xs-1:not(.offers) {padding: .25rem!important;}

    /* BLOG */
    #blog .card {max-width: 300px;}
}
@media (min-width: 480px) {
    /* LIGHTBOX XTR */
    a.lb-link.col {width: calc(33.3333333333% - 6px);}

    /* FOOTER */
    footer > .container > .row {padding: 3rem 0 1.5rem 0;}
    .footer-nav {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        margin: 0 0 0 -.5rem;
    }
    footer .nav-link,
    footer .nav-link:last-child {
        margin: .5rem;
        transition: color ease-in-out 100ms;
    }
    footer .nav-link:hover {padding: 2px 0;}
    .footer-nav.store-btn-group {justify-content: left;}
    footer .store-btn + .store-btn {margin: 0;}

    /* ------------------------------------------------------------------- */
    /* PAGES / MAIN PAGE SECTIONS ---------------------------------------- */
    /* ------------------------------------------------------------------- */
    /* PACKS */
    #registration .heading > h2,
    #theApp .heading h2,
    #socialMedia .heading h2 {
        font-size: 2.25rem;
        line-height: normal;
    }
    #registration .heading > h2, #socialMedia .heading h2 {width: auto;}
    #registration .heading > p, #theApp .heading p, #clientStories .heading p {font-size: 1.125rem;}
    #registration .card::before {
        left: 20px;
        height: 38px;
    }
    .pack-name {font-size: 1.4rem;}
    .pack-calendar {font-size: 1.25rem;}
    .pack-price {
        font-size: 1.75rem;
        padding: .75rem 0 1.25rem 0;
    }
    .pack-features li {font-size: .9125rem;}

    /* THE APP */
    #theApp > .container {
        position: relative;
        z-index: 1;
    }
    #theApp > .app-screens {margin-top: -2rem;}
    /* THE APP END */

    /* CLIENT STORIES */
    .client-sample-container {max-width: 380px;}

    /* BLOG */
    #blog .card {max-width: 420px;}
}
@media (min-width: 576px) {
    .sub-page-heading::before {height: 58px;}
    .sub-page-heading h1 {font-size: 2.25rem;}
    .sub-page-heading h2 {font-size: 1.25rem;}
    #theAppCarousel .carousel-inner {width: calc(100% - 120px);}

    /* VIDEO */
    #video > .video-container > .container {max-width: none;}
    #video .video-container .container > .row > .col {max-width: 38.5%;}

    /* SHARED */
    .sub-page .article-container, .sub-page .content-container {min-height: calc(100vh - 1092px);}

    /* PACKS */
    body.packs .tab-content .features {padding: 3rem;}
    body.packs .responsive-tab-group .col-lg-auto::before,
    body.packs .responsive-tab-group .col-lg-auto::after {
        content: "";
        position: absolute;
        top: 0;
        width: 60px;
        height: 100%;
        z-index: 2;
    }
    body.packs .responsive-tab-group .col-lg-auto::before {
        left: -1rem;
        background-image: linear-gradient(90deg, #fff, transparent);
    }
    body.packs .responsive-tab-group .col-lg-auto::after {
        right: -1rem;
        background-image: linear-gradient(-90deg, #fff, transparent);
    }
    body.packs .responsive-tab-group .col-lg-auto .slidenav-control.prev {left: -30px;}
    body.packs .responsive-tab-group .col-lg-auto .slidenav-control.next {right: -30px;}

    /* MEASUREMENT XTR RESPONSIVES */
    .row-cols-xs-2>* {
        flex: 0 0 auto;
        width: 50%;
    }
    :not(.offers) .p-sm-2, .p-sm-2:not(.offers) {padding: .5rem!important;}

    /* QUIZ */

    /* FOOTER */
}
@media (min-width: 768px) {
    /* HEADER > NAVBAR */
    .navbar {background-size: auto;}

    /* ------------------------------------------------------------------- */
    /* PAGES / MAIN PAGE SECTIONS ---------------------------------------- */
    /* ------------------------------------------------------------------- */
    /* SHARED */
    .sub-page .article-container, .sub-page .content-container {min-height: calc(100vh - 1065px);}
    .two-col-layout .recs {margin: 2rem 0 0 0;}

    /* PACKS */
    #registration > .container {max-width: 720px;}
    #registration > .container > .row {
        flex-wrap: wrap;
        --bs-gutter-x: 1rem;
        --bs-gutter-y: 1rem;
    }
    #registration .packages > .col {
        width: 50%;
        max-width: none;
    }
    #registration .packages > .col:first-child {margin-left: 0;}
    #registration .packages > .col:last-child {margin-right: 0;}
    #registration .slidenav-controls {display: none;}

    /* SOCIAL MEDIA */
    #socialMedia {padding: 3rem;}
    .social-media-element {min-width: unset;}
    .social-media-name .brand-icon, .social-media-element .counter {font-size: 3rem;}
    .social-media-name .brand-name {font-size: 1.25rem;}

    /* CLIENT STORIES */
    #clientStories .heading h2, #blog .heading h2, #video .heading h2, #measurement .heading h2 {padding-top: 2rem;}
    .stories-container {padding-top: .5rem;}
    .client-sample-container {max-width: 480px;}
    .client-sample-header {padding: 1.5rem;}
    .client-sample-header .bt-logo {
        width: 72px;
        margin-right: 1rem;
    }
    .client-pack {font-size: 1.25rem;}
    .before-after-container {padding: 1.5rem .25rem;}
    .before-after-container .title {
        font-size: 1.182rem;
        padding: .5rem 1.5rem;
    }
    .before-after-container .title.before {border-bottom-right-radius: 1rem;}
    .before-after-container .title.after {border-top-left-radius: 1rem;}
    .before-after-container .title::after {
        width: 15px;
        height: 43px;
    }
    .before-after-container .title.before::after {
        right: -4px;
        border-bottom-right-radius: 1rem;
    }
    .before-after-container .title.after::after {
        left: -4px;
        border-top-left-radius: 1rem;
    }
    .client-summary {
        font-size: 1rem;
        line-height: normal;
        padding: 1rem 1.5rem;
    }

    /* MEASUREMENT XTR RESPONSIVES */
    .row-cols-xs-2>* {
        flex: 0 0 auto;
        width: 50%;
    }
    :not(.offers) .p-md-3, .p-md-3:not(.offers) {padding: .75rem!important;}

    /* BLOG */
    #blog .card {max-width: 480px;}
    .two-col-layout .sidemenu .cat {width: 100%;}
    .two-col-layout .sidemenu .favs {
        width: 100% !important;
        margin: 2rem 0 0 0 !important;
    }
    .two-col-layout .sidemenu-title + ul li:first-child a {border-radius: 0;}

    /* QUIZ */

    /* CONTACT */
    body.contact .socials .col {margin: auto 1rem;}
    /* body.contact .fa-instagram {font-size: 3.25rem;} */
    body.contact .fa-instagram {
        font-size: 3.25rem;
        padding: 0.25px 2.75px;
        border-radius: 16px;
    }
    body.contact .fa-youtube {font-size: 3.5rem;}
    body.contact .fa-facebook {font-size: 3.125rem;}
    body.contact .fa-envelope {font-size: 3.5rem;}
    /* CONTACT END */

    /* THE APP */
    body.app .featurette > .container {
        position: relative;
        background-image: url('../imgs/app/bg.png');
        background-size: cover;
        background-position: 74% center;
        background-repeat: no-repeat;
    }
    body.app .featurette > .container::after {
        content: "";
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        position: absolute;
        background-image: linear-gradient(to right, #0481de, transparent);
        background-image: linear-gradient(to right, #fff, transparent);
    }
    body.app .featurette > .container > .row {
        position: relative;
        z-index: 1;
    }
    body.app .quick-action:before {
        background-image: url('../navimgs/navbar-bg.jpg');
        background-size: auto;
    }
    body.app .ss-col {margin: auto;}
    body.app .featurette > .container .phone {
        bottom: -611px;
        opacity: 0;
        animation: slideup .5s .5s ease-out forwards, fadein .5s .5s ease-out forwards;
    }
    @keyframes slideup {
        from {bottom: -611px;}
        to   {bottom: 0;}
    }
    @keyframes fadein {
        from {opacity: 0;}
        to   {opacity: 1;}
    }
    /* THE APP END */

    /* COOKIES */
    .cookies-warning {font-size: .875rem;}
    .cookies-warning .btn-close {top: .125rem;}
    /* COOKIES END */
}
@media (min-width: 800px) {
    .navbar-nav {margin: 0 auto;}
    nav .slidenav-controls {display: none;}
}
@media (min-width: 992px) {
    /* ------------------------------------------------------------------- */
    /*  MATERIAL STEPPER ------------------------------------------------- */
    /* ------------------------------------------------------------------- */
    .stepper {
        display: flex;
        width: 100%;
        padding: 4.5rem 1rem 2rem 1rem;
    }
    .stepper .step {width: 100%;}
    .stepper .step:not(:last-of-type)::after {content: none;}
    .stepper .step .step-title {
        display: flex;
        position: relative;
        padding: 14px 14px 24px 34px;
        margin: 0;
    }
    .stepper .step .step-title .txt {
        position: relative;
        padding-right: .5rem;
        background-color: #fff;
    }
    .stepper .step .step-title::before {
        content: "";
        position: absolute;
        top: 26px;
        left: 3rem;
        right: .5rem;
        height: 1px;
        background-color: rgba(0,0,0,.1);
    }
    .stepper .step.active .step-title::before {background-color: #2196f3;}
    .stepper .step.passed .step-title::before {background-color: #4caf50;}
    .stepper .step.active .step-content {margin: 0;}
    .step-actions.float {
        flex-direction: row;
        flex-wrap: wrap;
    }
    .step-actions.float .step-action {
        min-width: auto;
        margin: 0 0.5rem 0.5rem 0;
    }

    /* PACKS */
    .nav-packs {flex-direction: column;}
    .nav-packs .card, .nav-packs .card:last-child {margin: .5rem 1rem .5rem .5rem;}
    body.packs .responsive-tab-group .col-lg-auto .slidenav-controls {display: none;}

    /* CAROUSEL */
    .carousel-img {height: 65vh;}
    .carousel-indicators {margin-bottom: 2rem;}
    .carousel a.quiz {
        top: auto;
        bottom: -1.33rem;
        transform: translate(-50%, 0) skew(-10deg, 0);
    }

    /* LIGHTBOX XTR */
    a.lb-link.col {width: calc(50% - 6px);}

    /* ------------------------------------------------------------------- */
    /* PAGES / MAIN PAGE SECTIONS ---------------------------------------- */
    /* ------------------------------------------------------------------- */
    /* SHARED */
    .sub-page-heading::before {height: 65px;}
    .sub-page-heading h1 {font-size: 2.5rem;}
    .sub-page-heading h2 {font-size: 1.5rem;}
    .sub-page .article-container, .sub-page .content-container {min-height: calc(100vh - 806px);}
    .sub-page .article-container .container .row .col-lg-6 {padding: 1rem 0;}
    .sub-page .article-container .container .row .col-lg-6 + .col-lg-6 {padding: 0 0 1rem 2rem;}
    .sub-page .article-container .container .row .col-lg-6 .row {margin: 0;}

    /* PACKS */
    #registration {padding-top: 2rem;}
    #registration > .container {max-width: 960px;}
    #registration .packages > .col {width: 33.3333333333%;}
    #packContents .accordion-item {min-width: auto;}
    .accordion-header.collapsed h5 {
        display: -webkit-box;
        -webkit-box-orient: vertical;  
        overflow: hidden;
        -webkit-line-clamp: 1;
    }
    #packContents .heading h2, #clientStories .heading h2, #blog .heading h2, #video .heading h2, #measurement .heading h2 {font-size: 2.25rem;}
    body.packs .responsive-tab-group .col-lg-auto::before, body.packs .responsive-tab-group .col-lg-auto::after {content: none;}

    /* MEASUREMENT XTR RESPONSIVES */
    .row-cols-lg-3>* {
        flex: 0 0 auto;
        width: 33.3333333333%;
    }
    :not(.offers) .p-lg-3, .p-lg-3:not(.offers) {padding: 1rem!important;}

    /* QUIZ */

    /* FAQ */

    /* APP */
    body.app .stepper .step.active .step-content {margin: 0 0 0 34px;}

    /* CONTACT */
    body.contact .social {
        background-image: linear-gradient(to right, rgb(0 0 0 / 75%) 20%, transparent 0%);
        background-position: bottom;
        background-size: 8px 1px;
        background-repeat: repeat-x;
        background-image: linear-gradient(rgb(0 0 0 / 75%) 20%, transparent 0%);
        background-position: right;
        background-size: 1px 8px;
        background-repeat: repeat-y;
    }
    body.contact .form-group.mail-form h4 {text-align: left;}
    body.contact .socials {
        height: 100%;
        padding: .75rem 0;
    }
    body.contact .socials .col,
    body.contact .socials .col:first-child,
    body.contact .socials .col:last-child {
        width: 100%;
        text-align: center;
        margin: auto;
    }
    body.contact .social-icon {
        font-size: 3rem;
        margin: .5rem 0;
    }
    body.contact .fa-instagram {
        padding: .75px 3px;
        border-radius: 15px;
    }
    body.contact .socials + .whatsapp {padding: 2rem 1rem 1rem 1rem;}
    /* CONTACT END */

    /* COOKIES */
    .cookies-warning .container {
        flex-wrap: nowrap;
        padding: 0 1.5rem;
    }
    .cookies-warning .btn-close {
        position: relative;
        top: unset;
        right: unset;
        margin: auto -.5rem auto .5rem;
    }
    .cookies-warning .action-btn-group {
        display: flex;
        flex-wrap: nowrap;
        margin: auto .5rem;
    }
    .cookies-warning .action-btn-group .btn {margin: auto .5rem;}
    /* COOKIES END */
}
@media (min-width: 1025px) {
    /* ------------------------------------------------------------------- */
    /* PAGES / MAIN PAGE SECTIONS ---------------------------------------- */
    /* ------------------------------------------------------------------- */
    /* SHARED */
    main.sub-page .article-container, .sub-page .content-container {min-height: calc(100vh - 651px);}

    /* PACKS */
    #registration .heading > p, #theApp .heading p, #clientStories .heading p {font-size: 1.25rem;}
    #registration .card::before {height: 41px;}
    .pack-name {
        font-size: 1.5rem;
        padding: 0 .5rem 0 1.4rem;
    }
    .pack-calendar {padding: 0 .25rem;}
    .pack-price {
        font-size: 2rem;
        padding: .75rem .25rem 1.25rem .25rem;
    }
    .pack-features {padding: 0 .25rem;}
    .pack-features li {
        display: flex;
        justify-content: center;
        font-size: .975rem;
    }

    /* QUIZ */
}
@media (min-width: 1200px) {
    .navbar-nav-container {overflow: hidden;}
    /* FAST OFFER */
    #fastOfferMobile {display: none;}
    #fastOfferDesktop {display: block;}
    .noscroll {overflow: auto;}
    .fast-offer {
        position: absolute;
        bottom: auto;
        background: none;
        z-index: 0;
    }
    .fast-offer .close-overlay, .fast-offer .btn-close {display: none;}
    .fast-offer .content {
        position: relative;
        left: auto;
        top: auto;
        min-width: auto;
        width: auto;
        max-width: 1110px;
        margin: auto;
        transform: none;
    }
    .fast-offer .overflow-container {
        display: flex;
        justify-content: flex-end;
        width: 720px;
        height: 46px;
        margin: 0 0 0 auto;
        background: none;
        box-shadow: none;
        border-radius: 0;
    }
    .fast-offer .definition {
        font-size: 80%;
        text-align: right;
        padding: 0 4px;
        margin: auto 0;
    }
    .fast-offer .definition > .fas {color: #fff;}
    .fast-offer .countdown-container {
        width: auto;
        padding: 3px 16px 6.5px 16px;
        margin: auto 8px;
        box-shadow: 2px 0 4px rgb(0 0 0 / 30%) inset;
        border-width: 0 1px;
    }
    .fast-offer .counter-input-group {
        font-size: 12px;
        padding: 0;
        margin: auto 0;
        border: none;
    }
    .fast-offer .c-title {
        font-size: 11px;
        color: #fff;
    }
    .fast-offer .c-number {
        padding: 0;
        margin: 0 -.5px;
        color: #fff;
        border-radius: 0;
        border-color: rgba(255,255,255,.6);
    }
    .fast-offer .overflow-container .btn {
        font-size: 80%;
        white-space: nowrap;
        padding: .25rem .75rem;
        margin: 8.5px 4px;
        box-shadow: 0 0 0 1px #fff;
        border-radius: 50em;
    }

    /* HEADER > NAVBAR */
    .navbar {
        flex-direction: row;
        background-size: auto;
        background-attachment: fixed;
    }
    .navbar::after {
        content: "";
        position: absolute;
        left: 0;
        bottom: -1rem;
        width: 100%;
        height: 1rem;
        box-shadow: 0 0 8px rgb(0 0 0 / 50%), 0 0 1px #000;
    }
    header .navbar-brand {
        position: relative;
        margin: auto -10px auto auto;
        background: none;
        box-shadow: none;
        z-index: 1;
    }
    header.sticky .navbar-brand {margin: auto;}
    header .navbar-brand img {filter: grayscale(1) contrast(3) invert(1);}
    .navitem-container {
        display: flex;
        width: auto;
        padding: 0 0 0 8px;
        margin: auto auto auto 12px;
        border: none;
        border-radius: 8px;
        z-index: 1;

        margin: auto auto 0 12px;
        border-radius: 8px  8px 0 0;
    }
    header.sticky .navitem-container {
        position: fixed;
        left: 50%;
        top: -2px;
        margin: 0;
        background-color: rgb(255 255 255 / 88%);
        backdrop-filter: saturate(300%) blur(20px);
        box-shadow: 0 0 0 4px rgb(220 53 69 / 30%);
        border: 2px solid #dc3545;
        border-radius: 0 0 8px 8px;
        transform: translate(-50%, 0);
        z-index: 1082;
    }
    body:not(.home) header:not(.sticky) .navitem-container {
        margin: auto auto auto 12px;
        border-radius: 8px;
    }
    body.home header:not(.sticky) .navitem-container::before {
        content: "";
        position: absolute;
        left: -5px;
        top: 0;
        width: 11px;
        height: 57px;
        background: #fff;
        transform: skew(-10deg, 0);
        border-radius: 8px 0 0 0;
    }
    .navbar-nav {
        position: relative;
        width: auto;
        justify-content: left;
        margin: auto 0;
        overflow: unset;
    }
    .navbar-nav .nav-item {margin: auto 0;}
    .navbar-nav .nav-link {
        padding: .5rem .75rem;
        margin: .5rem .125rem;
    }
    .navbar-nav .nav-item:first-child .nav-link {margin-left: 0;}
    .navbar-nav .nav-item:last-child .nav-link {margin-right: 0;}
    .navbar-search-container {
        margin: auto auto auto 0;
        border: none;
    }
    header.sticky .navbar-search-container .form-control {width: 237px;}
    .slidenav-controls {display: none;}

    /* PACKS */
    #packContents,
    body.home #clientStories,
    body.quiz-sum #clientStories {
        background-image: url('../navimgs/navbar-bg.jpg');
        background-size: auto;
        background-attachment: fixed;
    }

    /* MEASUREMENT XTR RESPONSIVES */
    .row-cols-xl-4>* {
        flex: 0 0 auto;
        width: 25%;
    }
    :not(.offers) .p-xl-2, .p-xl-2:not(.offers) {padding: .5rem!important;}
    
    /* CAROUSEL */
    .carousel-img {height: auto;}

    /* LIGHTBOX XTR */
    a.lb-link.col {width: calc(33.3333333333% - 6px);}

    /* ------------------------------------------------------------------- */
    /* PAGES / MAIN PAGE SECTIONS ---------------------------------------- */
    /* ------------------------------------------------------------------- */
    /* PACKS */
    #registration {padding: 3rem 0 1rem 0;}
    #registration > .container {max-width: 1140px;}
    #registration .heading {padding: 0 0 1rem 0;}
    #registration .card {border-radius: 2rem;}
    #registration .heading > h2, #socialMedia .heading h2 {font-size: 3rem;}
    #registration .heading > p, #theApp .heading p, #clientStories .heading p {font-size: 1.5rem;}
    #registration .card::before {
        left: 33px;
        width: 20px;
        height: 47px;
    }
    #registration .packages > .col {padding: .25rem .75rem;}
    #registration .card-body {padding: 1rem;}
    .pack-name {
        font-size: 1.65rem;
        padding: 6px .5rem 0 2.75rem;
    }
    .pack-calendar {
        font-size: 1.5rem;
        padding: 0 .5rem 0 .75rem;
    }
    .pack-price {
        font-size: 2.25rem;
        padding: .75rem .75rem 1rem .75rem;
    }
    .pack-features {padding: 0 .75rem;}
    .pack-features li {font-size: 1rem;}
    #registration .card-footer {
        padding: .5rem 1.25rem 1.25rem 1.25rem;
        border: none;
    }
    #registration .card-footer > .btn {
        width: auto;
        border-radius: 50em;
        opacity: 1;
    }
    #packContents .heading h2,
    #theApp .heading h2 {
        font-size: 3rem;
        padding: 5rem 0 0 0;
    }
    #packContents .pack-cards {padding: 5rem;}
    .accordion-header .title-icon {
        font-size: 2rem;
        padding: .5rem;
    }
    body.faq .accordion-header {padding: 1rem;}
    .accordion-header h5 {font-size: 1.125rem;}
    .accordion-header .expand-icon {
        font-size: 1.125rem;
        padding: .5rem;
    }

    /* THE APP */
    #theApp > .app-screens {padding-bottom: 4rem;}
    #theAppCarousel {max-width: 560px;}
    body.app .quick-action.bg-red {padding: 4rem 0;}
    body.app #packContents .heading h2 {padding-top: 1.5rem;}
    /* THE APP END */

    /* CLIENT STORIES */
    #clientStories .heading h2, #blog .heading h2, #video .heading h2, #measurement .heading h2 {font-size: 3rem;}
    .stories-container {
        max-width: 1100px;
        padding-top: .75rem;
        margin: auto;
    }
    .stories-container .carousel-multi-item .carousel-control-prev {left: -40px;}
    .stories-container .carousel-multi-item .carousel-control-next {right: -40px;}
    .client-sample-container {
        min-width: 340px;
        max-width: 340px;
    }
    .client-sample-header {padding: 1rem;}
    .client-sample-header .bt-logo {
        width: 48px;
        margin-right: .5rem;
    }
    .client-pack {font-size: 15px;}
    .before-after-container {padding: 1rem .25rem;}
    .before-after-container .title {
        font-size: 14px;
        padding: .25rem .5rem;
    }
    .before-after-container .title.before {border-bottom-right-radius: 0;}
    .before-after-container .title.after {border-top-left-radius: 0;}
    .before-after-container .title::after {
        width: 6px;
        height: 28px;
    }
    .before-after-container .title.before::after {
        right: -3px;
        border-bottom-right-radius: 0;
    }
    .before-after-container .title.after::after {
        left: -3px;
        border-top-left-radius: 0;
    }
    .client-summary {
        font-size: 14px;
        padding: .75rem 1rem;
    }

    /* BLOG */
    #blog .card {max-width: 230px;}
    #blogCarousel .carousel-inner::before, #blogCarousel .carousel-inner::after, .carousel-control-prev, .carousel-control-next {z-index: 2;}

    /* SUCCESS STORIES */
    .article-container#clientStories .client-pack {font-size: 14px;}

    /* VIDEO */
    #video > .video-container > .container {max-width: 1140px;}
    #video .video-container .container > .row > .col:first-child, #video .video-container .container > .row > .col:last-child {margin: 0;}

    /* CALL ME */
    .btn-callme {right: .25rem;}
}
@media (min-width: 1280px) {
    /* CALL ME */
    .btn-callme {right: 1.6875rem;}
}
@media (min-width: 1400px) {
    /* WHATSAPP ICON */
    .btn-whatsapp {
        right: 2.75rem;
        bottom: 2.25rem;
    }

    /* VIDEO */
    #video > .video-container > .container {max-width: 1320px;}

    /* ------------------------------------------------------------------- */
    /* PAGES / MAIN PAGE SECTIONS ---------------------------------------- */
    /* ------------------------------------------------------------------- */
    /* PACKS */
    #registration > .container {max-width: 1320px;}
    #registration .card::before {
        left: 35px;
        width: 25px;
        height: 70px;
    }
    .pack-name {
        font-size: 1.95rem;
        padding: 1.25rem .5rem .5rem 3.5rem;
    }
    .pack-price {
        font-size: 2.25rem;
        line-height: 1.2;
        padding: .75rem;
    }
    #packContents .pack-cards {
        max-width: 1920px;
        margin: auto;
    }
    #theAppCarousel {max-width: 670px;}

    /* MEASUREMENT XTR RESPONSIVES */
    .row-cols-xs-2>* {
        flex: 0 0 auto;
        width: 16.6666666667%;
    }
    :not(.offers) .p-xxl-1, .p-xxl-1:not(.offers) {padding: .5rem!important;}

    /* BLOG */
    #blog .card {max-width: 270px;}

    /* SUCCESS STORIES */
    .article-container#clientStories .client-pack {font-size: 15px;}
}

@media (min-width: 1920px) {
    /* CLIENT STORIES */
    .client-sample-container {
        min-width: 480px;
        max-width: 480px;
    }
    body.success .client-sample-container {min-width: auto;}
    .client-sample-header {padding: 1.5rem;}
    .client-sample-header .bt-logo {
        width: 72px;
        margin-right: 1rem;
    }
    .client-pack {font-size: 1.25rem;}
    .before-after-container {padding: 1.5rem .25rem;}
    .before-after-container .title {
        font-size: 1.182rem;
        padding: .5rem 1.5rem;
    }
    .before-after-container .title.before {border-bottom-right-radius: 1rem;}
    .before-after-container .title.after {border-top-left-radius: 1rem;}
    .before-after-container .title::after {
        width: 15px;
        height: 43px;
    }
    .before-after-container .title.before::after {
        right: -4px;
        border-bottom-right-radius: 1rem;
    }
    .before-after-container .title.after::after {
        left: -4px;
        border-top-left-radius: 1rem;
    }
    .client-summary {
        font-size: 1rem;
        line-height: normal;
        padding: 1rem 1.5rem;
    }

    /* BLOG */
    #blog {padding: 0 20rem;}
    #blog .card {max-width: calc(20% - 1rem);}

    /* SUCCESS STORIES */
    .stories-container {max-width: 1520px;}
    .article-container#clientStories .client-sample-header {padding: 1rem;}
    .article-container#clientStories .client-sample-header .bt-logo {
        width: 60px;
        margin-right: .5rem;
    }
    .article-container#clientStories .client-pack {font-size: 17px;}
}























/* MULTI ITEM CAROUSEL */
.carousel-multi-item {margin-bottom: 3rem;}
.carousel-multi-item .carousel-indicators {margin: auto auto -2rem auto;}
.carousel-multi-item .carousel-item {
    background: none;
    transition: all ease-in-out 250ms;
}
@media (max-width: 1199px) {
    .carousel-multi-item .carousel-item > div {display: none;}
    .carousel-multi-item .carousel-item > div:first-child {display: block;}
}
@media (min-width: 1200px) {
    .carousel-multi-item .carousel-item.active, .carousel-multi-item .carousel-item-next, .carousel-multi-item .carousel-item-prev {display: flex;}
    .carousel-multi-item .carousel-item-end.active, .carousel-multi-item .carousel-item-next {transform: translateX(33.3333%);}
    .carousel-multi-item .carousel-item-start.active, .carousel-multi-item .carousel-item-prev {transform: translateX(-33.3333%);}
    .carousel-multi-item .carousel-item-end, .carousel-multi-item .carousel-item-start { transform: translateX(0);}
}