/* Libre Franklin Font */
/* Static font definitions */
@font-face {
    font-family: "Libre Franklin";
    src: url("../fonts/Libre_Franklin/static/LibreFranklin-Thin.ttf") format("truetype");
    font-weight: 100;
    font-style: normal;
}

@font-face {
    font-family: "Libre Franklin";
    src: url("../fonts/Libre_Franklin/static/LibreFranklin-ThinItalic.ttf") format("truetype");
    font-weight: 100;
    font-style: italic;
}

@font-face {
    font-family: "Libre Franklin";
    src: url("../fonts/Libre_Franklin/static/LibreFranklin-ExtraLight.ttf") format("truetype");
    font-weight: 200;
    font-style: normal;
}

@font-face {
    font-family: "Libre Franklin";
    src: url("../fonts/Libre_Franklin/static/LibreFranklin-ExtraLightItalic.ttf") format("truetype");
    font-weight: 200;
    font-style: italic;
}

@font-face {
    font-family: "Libre Franklin";
    src: url("../fonts/Libre_Franklin/static/LibreFranklin-Light.ttf") format("truetype");
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: "Libre Franklin";
    src: url("../fonts/Libre_Franklin/static/LibreFranklin-LightItalic.ttf") format("truetype");
    font-weight: 300;
    font-style: italic;
}

@font-face {
    font-family: "Libre Franklin";
    src: url("../fonts/Libre_Franklin/static/LibreFranklin-Regular.ttf") format("truetype");
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: "Libre Franklin";
    src: url("../fonts/Libre_Franklin/static/LibreFranklin-Italic.ttf") format("truetype");
    font-weight: 400;
    font-style: italic;
}

@font-face {
    font-family: "Libre Franklin";
    src: url("../fonts/Libre_Franklin/static/LibreFranklin-Medium.ttf") format("truetype");
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: "Libre Franklin";
    src: url("../fonts/Libre_Franklin/static/LibreFranklin-MediumItalic.ttf") format("truetype");
    font-weight: 500;
    font-style: italic;
}

@font-face {
    font-family: "Libre Franklin";
    src: url("../fonts/Libre_Franklin/static/LibreFranklin-SemiBold.ttf") format("truetype");
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: "Libre Franklin";
    src: url("../fonts/Libre_Franklin/static/LibreFranklin-SemiBoldItalic.ttf") format("truetype");
    font-weight: 600;
    font-style: italic;
}

@font-face {
    font-family: "Libre Franklin";
    src: url("../fonts/Libre_Franklin/static/LibreFranklin-Bold.ttf") format("truetype");
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: "Libre Franklin";
    src: url("../fonts/Libre_Franklin/static/LibreFranklin-BoldItalic.ttf") format("truetype");
    font-weight: 700;
    font-style: italic;
}

@font-face {
    font-family: "Libre Franklin";
    src: url("../fonts/Libre_Franklin/static/LibreFranklin-ExtraBold.ttf") format("truetype");
    font-weight: 800;
    font-style: normal;
}

@font-face {
    font-family: "Libre Franklin";
    src: url("../fonts/Libre_Franklin/static/LibreFranklin-ExtraBoldItalic.ttf") format("truetype");
    font-weight: 800;
    font-style: italic;
}

@font-face {
    font-family: "Libre Franklin";
    src: url("../fonts/Libre_Franklin/static/LibreFranklin-Black.ttf") format("truetype");
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: "Libre Franklin";
    src: url("../fonts/Libre_Franklin/static/LibreFranklin-BlackItalic.ttf") format("truetype");
    font-weight: 900;
    font-style: italic;
}
/* Variable font definitions */
@font-face {
    font-family: "Libre Franklin";
    src: url("../fonts/Libre_Franklin/LibreFranklin-VariableFont_wght.ttf") format("truetype");
    font-weight: 100 900;
    font-style: normal;
}

@font-face {
    font-family: "Libre Franklin";
    src: url("../fonts/Libre_Franklin/LibreFranklin-Italic-VariableFont_wght.ttf") format("truetype");
    font-weight: 100 900;
    font-style: italic;
}
/* Opacity */
.opacity-10 {
    opacity: 0.1;
}

.opacity-20 {
    opacity: 0.2;
}

.opacity-30 {
    opacity: 0.3;
}

.opacity-40 {
    opacity: 0.4;
}

.opacity-50 {
    opacity: 0.5;
}

.opacity-60 {
    opacity: 0.6;
}

.opacity-70 {
    opacity: 0.7;
}

.opacity-80 {
    opacity: 0.8;
}

.opacity-90 {
    opacity: 0.9;
}

.opacity-100 {
    opacity: 1;
}

/* Colors */
/* $facebook_bg */
.sb__bg_color_facebook {
    background-color: #3e5ea0 !important;
    border-color: #3e5ea0 !important;
}

/* $twitter_bg */
.sb__bg_color_twitter {
    background-color: #60b2ef !important;
    border-color: #60b2ef !important;
}

/* $linkedin_bg */
.sb__bg_color_linkedin {
    background-color: #0283c1 !important;
    border-color: #0283c1 !important;
}

/* $instagram_bg */
.sb__bg_color_instagram {
    background-color: #fb3958 !important;
    border-color: #fb3958 !important;
}

/* $notification_green */
.sb__color_notification_green {
    color: #91CB75 !important;
}

/* $notification_red */
.sb__color_notification_red {
    color: #D63A43 !important;
}

/* $notification_yellow */
.sb__color_notification_yellow {
    color: #ffcb00 !important;
}

/* $apple_green */
.sb__bg_color_applegreen {
    background-color: #78be20 !important;
}

.sb__color_applegreen {
    color: #78be20 !important;
}

.sb__border_color_applegreen, .sb__button_outline_applegreen, .sb__button_applegreen, .sb__bg_color_applegreen {
    border-color: #78be20 !important;
}

/* $kelly_green */
.sb__bg_color_kellygreen {
    background-color: #009639 !important;
}

.sb__color_kellygreen {
    color: #009639 !important;
}

.sb__border_color_kellygreen, .sb__button_outline_kellygreen, .sb__button_kellygreen, .sb__bg_color_kellygreen {
    border-color: #009639 !important;
}

/* $dark_seafoam_green */
.sb__bg_color_dark_seafoam_green {
    background-color: #3db769 !important;
    border-color: #3db769 !important;
}

/* $default_white */
.sb__bg_color_default_white {
    border-color: #ffffff !important;
}

.sb__color_default_white {
    color: #ffffff !important;
}

/* $default_grey */
.sb__bg_color_default_grey {
    background-color: #666666 !important;
    border-color: #666666 !important;
}

.sb__color_default_grey {
    color: #666666 !important;
}

/* $light_grey */
.sb__bg_color_light_grey {
    background-color: #cacaca !important;
    border-color: #cacaca !important;
}

.sb__color_light_grey {
    color: #cacaca !important;
}

/* $review_grey */
.sb__bg_color_review_grey {
    background-color: #5f5f5f !important;
    border-color: #5f5f5f !important;
}

.sb__color_review_grey {
    color: #5f5f5f !important;
}

/* $sharing_grey */
.sb__bg_color_sharing_grey {
    background-color: #4a4a4a !important;
    border-color: #4a4a4a !important;
}

.sb__color_sharing_grey {
    color: #4a4a4a !important;
}

/* $default_black */
.sb__color_default_black {
    color: #333333 !important;
}

.sb__bg_color_default_black {
    background-color: #333333 !important;
    border-color: #333333 !important;
}

/* $cool_grey_two */
.sb__bg_color_cool_grey_two {
    background-color: #a1a2a4 !important;
    border-color: #a1a2a4 !important;
}

.sb__color_cool_grey_two {
    color: #a1a2a4 !important;
}

/* $rating_yellow */
.sb__color_rating_yellow {
    color: #ffcb00 !important;
}

/* $ugly_yellow */
.sb__color_ugly_yellow {
    color: #cedc00 !important;
}

/* $ugly_yellow */
.sb__bg_color_ugly_yellow {
    background-color: #cedc00 !important;
    border-color: #cedc00 !important;
}

/* $ugly_yellow */
.sb__bg_color_light_ugly_yellow {
    background: #7DC960 !important;
    border-color: #7DC960 !important;
}

/* $sickly_yellow */
.sb__bg_color_sickly_yellow {
    background-color: #cbdb2e !important;
    border-color: #cbdb2e !important;
}

/* $yellow_orange */
.sb__bg_color_yellow_orange {
    background-color: #f2a900 !important;
    border-color: #f2a900 !important;
}

.sb__color_yellow_orange {
    color: #f2a900 !important;
}

/* $opportunity_orange */
.sb__bg_color_opportunity_orange {
    background-color: #fec24d !important;
    border-color: #fec24d !important;
}

.sb__color_opportunity_orange {
    color: #fec24d !important;
}

/* $member_red */
.sb__bg_color_member_red {
    background-color: #ec5f48 !important;
    border-color: #ec5f48 !important;
}

.sb__color_member_red {
    color: #ec5f48 !important;
}

/* $lipstick */
.sb__bg_color_lipstick {
    background-color: #d22630 !important;
    border-color: #d22630 !important;
}

.sb__color_lipstick {
    color: #d22630 !important;
}

/* $opportunity_blue */
.sb__bg_color_opportunity_blue {
    background-color: #46bda1 !important;
    border-color: #46bda1 !important;
}

.sb__color_opportunity_blue {
    color: #46bda1 !important;
}

/* $dark_opportunity_blue */
.sb__bg_color_dark_opportunity_blue {
    background-color: #28987e !important;
    border-color: #28987e !important;
}

/* $light_blue */
.sb__bg_color_light_blue {
    background-color: #0083b2 !important;
    border-color: #0083b2 !important;
}

.sb__color_light_blue {
    color: #0083b2 !important;
}

/* $turquoise */
.sb__bg_color_turquoise {
    background-color: #00b2a9 !important;
    border-color: #00b2a9 !important;
}

/* $dark_turquoise */
.sb__bg_color_dark_turquoise {
    background-color: #009189 !important;
    border-color: #009189 !important;
}

/* $community_orange */
.sb__bg_color_community_orange {
    background-color: #f28e00 !important;
    border-color: #f28e00 !important;
}

/* $dark_community_orange */
.sb__bg_color_dark_community_orange {
    background-color: #f25d00 !important;
    border-color: #f25d00 !important;
}

/* $profile_yellow */
.sb__bg_color_profile_yellow {
    background-color: #ffba1c !important;
    border-color: #ffba1c !important;
}

/* $dark_profile_yellow */
.sb__bg_color_dark_profile_yellow {
    background-color: #ff9616 !important;
    border-color: #ff9616 !important;
}

/* $very_light_pink */
.sb__bg_color_very_light_pink {
    background-color: #bbbbbb !important;
    border-color: #bbbbbb !important;
}

.sb__color_very_light_pink {
    color: #bbbbbb !important;
}

/* $dark_mint_10 */
.sb__bg_color_dark_mint_10 {
    background-color: rgba(70, 189, 161, 0.1) !important;
    border-color: rgba(70, 189, 161, 0.1) !important;
}

/* $dark_mint_20 */
.sb__bg_color_dark_mint_20 {
    background-color: rgba(70, 189, 161, 0.2) !important;
    border-color: rgba(70, 189, 161, 0.2) !important;
}

/* $review_grey */
.sb__bg_color_brown {
    background-color: #b25900 !important;
    border-color: #b25900 !important;
}

.sb__color_brown {
    color: #b25900 !important;
}

/* Base */
* {
    font: normal 16px "Libre Franklin", Roboto, sans-serif, Arial, Helvetica;
}

/* Typography */
/* Font Size */
.font-size-1 {
    font-size: 0.5rem;
}

.font-size-2 {
    font-size: 1rem;
}

.font-size-3 {
    font-size: 1.5rem;
}

.font-size-4 {
    font-size: 2rem;
}

.font-size-5 {
    font-size: 2.5rem;
}

.font-size-6 {
    font-size: 3rem;
}

.font-size-7 {
    font-size: 3.5rem;
}

.font-size-8 {
    font-size: 4rem;
}

.font-size-9 {
    font-size: 4.5rem;
}

.font-size-10 {
    font-size: 5rem;
}

/* Font Weight */
.font-weight-100 {
    font-weight: 100;
}

.font-weight-200 {
    font-weight: 200;
}

.font-weight-300 {
    font-weight: 300;
}

.font-weight-400 {
    font-weight: 400;
}

.font-weight-500 {
    font-weight: 500;
}

.font-weight-600 {
    font-weight: 600;
}

.font-weight-700 {
    font-weight: 700;
}

.font-weight-800 {
    font-weight: 800;
}

.font-weight-900 {
    font-weight: 900;
}

p,
span {
    font-weight: normal;
    line-height: 1.5;
    font-size: 1rem;
}

label {
    font-weight: normal;
    line-height: 1.5;
    font-size: 0.875rem;
}

h1, h1 *, .h1 *, h2, h2 *, .h2 *, h3, h3 *, .h3 *, h4, h4 *, .h4 *, h5, h5 *, .h5 *, h6, h6 *, .h6 *,
.h1, .h2, .h3, .h4, .h5, .h6 {
    font-weight: normal;
    line-height: 1.25;
}

    h1, h1 *, .h1 *, .h1 {
        font-size: 3.75rem;
    }

    h2, h2 *, .h2 *, .h2 {
        /*font-weight: 500;*/
        font-size: 2.5rem;
    }

    h3, h3 *, .h3 *, .h3 {
        font-size: 1.875rem;
    }

    h4, h4 *, .h4 *, .h4 {
        /*font-weight: 500;*/
        font-size: 1.75rem;
    }

    h5, h5 *, .h5 *, .h5 {
        /*font-weight: 500;*/
        font-size: 1.375rem;
    }

    h6, h6 *, .h6 *, .h6 {
        font-size: 1.25rem;
    }

@media screen and (max-width: 768px) {
    h1, h1 *, .h1 *, .h1 {
        font-size: 2.5rem;
    }

    h2, h2 *, .h2 *, .h2 {
        font-size: 1.875rem;
    }

    h3, h3 *, .h3 *, .h3 {
        font-size: 1.625rem;
    }

    h4, h4 *, .h4 *, .h4 {
        font-size: 1.5rem;
    }
}

@media screen and (max-width: 576px) {
    h1, h1 *, .h1 *, .h1 {
        font-size: 1.875rem;
    }

    h2, h2 *, .h2 *, .h2 {
        font-size: 1.625rem;
    }

    h3, h3 *, .h3 *, .h3 {
        font-size: 1.5rem;
    }

    h4, h4 *, .h4 *, .h4 {
        font-size: 1.375rem;
    }

    h5, h5 *, .h5 *, .h5 {
        font-size: 1.25rem;
    }

    h6, h6 *, .h6 *, .h6 {
        font-size: 1.125rem;
    }
}
/* Buttons */
.btn.disabled,
.btn:disabled {
    cursor: not-allowed;
}

img + .img-button {
    border-top: none;
    border-radius: 0 0 3px 3px;
}

/* $facebook_bg */
.sb__button_facebook {
    color: #ffffff !important;
    background-color: #3e5ea0 !important;
    border-color: #3e5ea0 !important;
}

    .sb__button_facebook:hover {
        background-color: #30487b !important;
    }

/* $twitter_bg */
.sb__button_twitter {
    color: #ffffff !important;
    background-color: #60b2ef !important;
    border-color: #60b2ef !important;
}

    .sb__button_twitter:hover {
        background-color: #329cea !important;
    }

/* $linkedin_bg */
.sb__button_linkedin {
    color: #ffffff !important;
    background-color: #0283c1 !important;
    border-color: #0283c1 !important;
}

    .sb__button_linkedin:hover {
        background-color: #01618f !important;
    }

/* $instagram_bg */
.sb__button_instagram {
    color: #ffffff !important;
    background-color: #fb3958 !important;
    border-color: #fb3958 !important;
}

    .sb__button_instagram:hover {
        background-color: #fa072e !important;
    }

/* $apple_green */
.sb__button_applegreen {
    color: #ffffff !important;
    background-color: #78be20 !important;
}

    .sb__button_applegreen:hover {
        background-color: #5c9219 !important;
    }

.sb__button_outline_applegreen {
    color: #78be20 !important;
    background-color: #ffffff;
}

    .sb__button_outline_applegreen:hover {
        color: #ffffff !important;
        background-color: #78be20 !important;
    }

/* $kelly_green */
.sb__button_kellygreen {
    color: #ffffff !important;
    background-color: #009639 !important;
}

    .sb__button_kellygreen:hover {
        background-color: #006326 !important;
    }

.sb__button_outline_kellygreen {
    color: #009639 !important;
    background-color: #ffffff;
}

    .sb__button_outline_kellygreen:hover {
        color: #ffffff !important;
        background-color: #009639 !important;
    }

/* $yellow_orange */
.sb__button_yellow_orange {
    color: #ffffff !important;
    background-color: #f2a900 !important;
    border-color: #f2a900 !important;
}

    .sb__button_yellow_orange:hover {
        background-color: #bf8500 !important;
    }

.sb__button_dark_yellow_orange {
    color: #ffffff !important;
    background-color: #bf8500 !important;
    border-color: #f2a900 !important;
}

.sb__button_outline_yellow_orange {
    color: #f2a900 !important;
    background-color: #ffffff;
    border-color: #f2a900 !important;
}

    .sb__button_outline_yellow_orange:hover {
        background-color: #f2a900 !important;
        color: #ffffff !important;
    }

/* $yellow_orange */
.sb__button_sickly_yellow {
    color: #ffffff !important;
    background-color: #cbdb2e !important;
    border-color: #cbdb2e !important;
}

    .sb__button_sickly_yellow:hover {
        background-color: #a9b71f !important;
    }

/* $cool_grey_two */
.sb__button_cool_grey_two {
    color: #ffffff !important;
    background-color: #a1a2a4 !important;
    border-color: #a1a2a4 !important;
}

    .sb__button_cool_grey_two:hover {
        background-color: #87888b !important;
    }

.sb__button_outline_cool_grey_two {
    color: #a1a2a4 !important;
    background-color: #ffffff;
    border-color: #a1a2a4 !important;
}

    .sb__button_outline_cool_grey_two:hover {
        background-color: #a1a2a4 !important;
        color: #ffffff !important;
    }

/* button_disabled */
.sb__button_disabled {
    color: #bbbbbb !important;
    background-color: #eeeeee !important;
    border-color: #eeeeee !important;
    cursor: not-allowed;
}

/* badges */
.badge.badge-product, .badge.badge-service, .badge.badge-opportunity, .badge.badge-memberoffer {
    color: #ffffff;
    font-size: 1rem;
    padding: 0.5em 1rem;
    border-radius: 0 0 0.25rem 0.25rem;
}

.badge.badge-opportunity {
    background-color: #46bda1;
}

.badge.badge-product {
    background-color: #cbdb2e;
}

.badge.badge-service {
    background-color: #009639;
}

.badge.badge-memberoffer {
    background-color: #ec5f48;
    position: relative;
}

    .badge.badge-memberoffer::before, .badge.badge-memberoffer::after {
        content: "";
        top: 0;
        position: absolute;
        border: 0.7rem solid #d22630;
        z-index: -2;
    }

    .badge.badge-memberoffer::before {
        left: -1rem;
        border-right-width: 0.75rem;
        border-left-color: transparent;
    }

    .badge.badge-memberoffer::after {
        right: -1rem;
        border-left-width: 0.75rem;
        border-right-color: transparent;
    }

.badge.top-right, .badge.top-left {
    position: absolute;
    top: 0;
}

.badge.top-right {
    right: 15px;
}

.badge.top-left {
    left: 15px;
}

div.badge.badge-product, div.badge.badge-service, div.badge.badge-opportunity, div.badge.badge-memberoffer {
    padding: 0 !important;
}

div > .badge.badge-product, div > .badge.badge-service, div > .badge.badge-opportunity, div > .badge.badge-memberoffer {
    margin: 0 !important;
    border-radius: 0 !important;
}

    div > .badge.badge-product:first-child, div > .badge.badge-service:first-child, div > .badge.badge-opportunity:first-child, div > .badge.badge-memberoffer:first-child {
        border-radius: 0 0 0 0.25rem !important;
        margin-right: -3px !important;
    }

    div > .badge.badge-product:last-child, div > .badge.badge-service:last-child, div > .badge.badge-opportunity:last-child, div > .badge.badge-memberoffer:last-child {
        border-radius: 0 0 0.25rem 0 !important;
    }

    div > .badge.badge-product:first-child:last-child, div > .badge.badge-service:first-child:last-child, div > .badge.badge-opportunity:first-child:last-child, div > .badge.badge-memberoffer:first-child:last-child {
        border-radius: 0 0 0.25rem 0.25rem !important;
    }

/* product details */
#product-details {
    /* badges */
}

    #product-details .badge {
        border-radius: 0 0 0.25rem 0.25rem !important;
    }

        #product-details .badge.badge-memberoffer {
            margin-right: 1rem !important;
            margin-left: 1rem !important;
        }

.timeBadge.timeBadge-timeLeft {
    color: #ffffff;
    font-size: 0.75rem;
    margin-right: 0.5rem;
    margin-left: 0.5rem;
    padding-top: 0.5rem;
    padding: 0.1rem 0.25rem 0 0.25rem;
}

.timeBadge.timeBadge-timeLeft {
    background-color: #fec24d;
    max-width: 125px;
}

.timeBadge.top-left {
    position: absolute;
    top: 0;
    left: 125px;
}

.marketplaceDateBadge {
    color: #ffffff;
    font-size: 1rem;
    margin-right: 0.5rem;
    margin-left: 0.5rem;
    padding-top: 0.5rem;
    border-radius: 0 0 0.25rem 0.25rem;
}

/* mixin for multiline */
/*.block-with-text {
    @include multiLineEllipsis($lineHeight: 1.2em, $lineCount: 3, $bgColor: white);
}*/
.crop-text-1,
.crop-text-2,
.crop-text-3,
.crop-text-4,
.crop-text-5 {
    overflow-y: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    line-height: 1.5rem;
}

.crop-text-1 {
    -webkit-line-clamp: 1;
    height: 1.5rem;
}

.crop-text-2 {
    -webkit-line-clamp: 2;
    height: 3rem;
}

.crop-text-3 {
    -webkit-line-clamp: 3;
    height: 4.5rem;
}

.crop-text-4 {
    -webkit-line-clamp: 4;
    height: 6rem;
}

.crop-text-5 {
    -webkit-line-clamp: 5;
    height: 7.5rem;
}

/* New Card for Biz Solutions */
/* To be carried across pillars */
.card.solutions-card {
    margin-bottom: 1rem;
}

    .card.solutions-card .card-body {
        border-top: 0.625rem solid #ffffff;
    }

        .card.solutions-card .card-body .category {
            border: 1px solid #ffffff;
            border-radius: 1rem;
            font-size: 0.8125rem;
            margin-bottom: 1rem;
            padding: 0.25rem 1rem;
            text-transform: capitalize;
            font-weight: 500;
        }

        .card.solutions-card .card-body .card-text {
            color: #666666;
            margin-bottom: 1rem;
            overflow-y: hidden;
            text-overflow: ellipsis;
            line-height: 1.5rem;
            -webkit-line-clamp: 4;
            height: 6rem;
        }

        .card.solutions-card .card-body .media {
            position: relative;
        }

            .card.solutions-card .card-body .media .cta {
                position: absolute;
                top: -5px;
                left: 50px;
            }

        .card.solutions-card .card-body .pricing {
            display: flex;
            flex-direction: column;
            align-self: flex-end;
            text-align: right;
        }

            .card.solutions-card .card-body .pricing label {
                margin: 0;
                font-size: 0.75rem;
                color: #a1a2a4;
            }

            .card.solutions-card .card-body .pricing .suffix {
                font-size: 0.75rem;
            }

    .card.solutions-card.voucher .card-body {
        border-color: #78be20;
    }

        .card.solutions-card.voucher .card-body .category {
            border-color: #78be20;
            color: #78be20;
        }

        .card.solutions-card.voucher .card-body .media .cta {
            color: #ffffff !important;
            background-color: #78be20 !important;
            border-color: #78be20 !important;
        }

            .card.solutions-card.voucher .card-body .media .cta:hover {
                background-color: #5c9219 !important;
            }

    .card.solutions-card.voucher .card-footer > .action {
        background-color: #78be20;
    }

    .card.solutions-card.connect .card-body {
        border-color: #f2a900;
    }

        .card.solutions-card.connect .card-body .category {
            border-color: #f2a900;
            color: #f2a900;
        }

        .card.solutions-card.connect .card-body .media .cta {
            color: #ffffff !important;
            background-color: #f2a900 !important;
            border-color: #f2a900 !important;
        }

            .card.solutions-card.connect .card-body .media .cta:hover {
                background-color: #bf8500 !important;
            }

    .card.solutions-card.connect .card-footer > .action {
        background-color: #f2a900;
    }

    .card.solutions-card .card-footer {
        display: flex;
        background-color: #ffffff;
        padding: 0;
    }

        .card.solutions-card .card-footer > .action {
            color: #ffffff;
        }

            .card.solutions-card .card-footer > .action.sold-out {
                background-color: #ec5f48;
                cursor: not-allowed;
                opacity: 0.8;
            }

        .card.solutions-card .card-footer > * {
            align-self: center;
            flex-grow: 1;
            max-width: 50%;
            text-align: center;
        }

.card-overflow {
    overflow: auto;
    max-height: 750px;
}

    /* width */
    .card-overflow::-webkit-scrollbar {
        width: 10px;
    }

    /* Track */
    .card-overflow::-webkit-scrollbar-track {
        border-radius: 10px;
    }

    /* Handle */
    .card-overflow::-webkit-scrollbar-thumb {
        background: rgba(120, 190, 32, 0.3);
        border-radius: 5px;
    }

.percentage-wrapper .circle svg path {
    stroke-linecap: round;
}

/* Loader */
.ajax-loading-block-window {
    position: fixed;
    width: 100%;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background-color: rgba(255, 255, 255, 0.7);
    z-index: 9999;
}

    .ajax-loading-block-window::after {
        content: "";
        display: block;
        position: absolute;
        left: 48%;
        top: 40%;
        width: 40px;
        height: 40px;
        border-style: solid;
        border-color: #009639;
        border-top-color: transparent;
        border-width: 4px;
        border-radius: 50%;
        -webkit-animation: spin 0.8s linear infinite;
        animation: spin 0.8s linear infinite;
    }

@-webkit-keyframes spin {
    from {
        -webkit-transform: rotate(0deg);
    }

    to {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes spin {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}
/* errors */
.validation-summary-valid,
.validation-summary-errors {
    font-size: 0.75rem !important;
    font-weight: bold !important;
}

    .validation-summary-valid ul,
    .validation-summary-errors ul {
        font-weight: normal;
        padding: 0;
        list-style-type: none;
    }

        .validation-summary-valid ul > li:before,
        .validation-summary-errors ul > li:before {
            content: "-";
            margin-right: 0.75rem;
        }

.validation-summary-valid {
    color: #3db769 !important;
}

.validation-summary-errors {
    color: #d22630 !important;
}

.field-validation-error, .field-validation-error > span {
    color: #d22630 !important;
    font-weight: 500 !important;
    font-size: 0.75rem !important;
}
/*.input-validation-error {
    outline: 0;
    border: none;
    box-shadow: 0 0 0 0.2rem rgba(255, 0, 0, 0.25);
    background-color: rgba(255, 0, 0, 0.25);
}

.field-validation-valid {
}*/
/* Header */
.navbar logo {
    cursor: pointer;
}

    .navbar logo > img {
        max-height: 35px;
    }

/* Footer */
footer.footer {
    background-color: #ffffff;
    border-top: 1px solid #eeeeee;
    text-align: center;
    height: 40px;
    width: 100%;
}

    footer.footer * {
        color: #666666;
        line-height: 40px;
    }

    footer.footer .nav-link {
        padding-top: 0;
        padding-bottom: 0;
    }

    footer.footer .nav .nav-divider {
        width: 1px;
        height: 20px;
        margin: 10px 0;
        border-right: 1px solid #eeeeee;
    }

        footer.footer .nav .nav-divider:last-of-type {
            border: none;
        }

/* Login */
.external-auth-divider p {
    overflow: hidden;
    text-align: center;
    padding: 0 3rem;
    margin-top: 1rem;
}

    .external-auth-divider p:before, .external-auth-divider p:after {
        background-color: rgba(0, 0, 0, 0.2);
        content: "";
        display: inline-block;
        height: 1px;
        position: relative;
        vertical-align: middle;
        width: 50%;
    }

    .external-auth-divider p:before {
        right: 0.5rem;
        margin-left: -50%;
    }

    .external-auth-divider p:after {
        left: 0.5rem;
        margin-right: -50%;
    }

.external-auth-methods button.btn-outline-light,
.external-auth-methods a.btn-outline-light {
    color: #757575;
    font-size: 1.25rem;
    font-weight: 600;
    text-align: center;
}

    .external-auth-methods button.btn-outline-light > div,
    .external-auth-methods a.btn-outline-light > div {
        margin: 0 auto;
        white-space: nowrap;
        width: 100px;
        /*padding-right: 7rem;*/
    }

        .external-auth-methods button.btn-outline-light > div span,
        .external-auth-methods a.btn-outline-light > div span {
            font-size: 1.25rem;
            font-weight: 600;
            vertical-align: sub;
        }

.addthis_inline_share_toolbox {
    display: flex;
    justify-content: flex-end;
    /*white-space: nowrap;*/
    flex-wrap: wrap;
}

    .addthis_inline_share_toolbox > span {
        margin-top: 0.5rem;
        margin-right: 1rem;
        white-space: nowrap;
    }

/* common */
.ribbon {
    width: 150px;
    height: 150px;
    overflow: hidden;
    position: absolute;
}

    .ribbon::before, .ribbon::after {
        position: absolute;
        z-index: -1;
        content: "";
        display: block;
        border: 5px solid #e7371a;
    }

    .ribbon span {
        position: absolute;
        display: block;
        width: 225px;
        padding: 15px 0;
        background-color: #ec5f48;
        box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
        color: #fff;
        line-height: 1;
        text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
        text-transform: uppercase;
        text-align: center;
    }

    .ribbon.ribbon-yellow-orange::before, .ribbon.ribbon-yellow-orange::after {
        border: 5px solid #bf8500;
    }

    .ribbon.ribbon-yellow-orange span {
        background-color: #f2a900;
    }

/* top left*/
.ribbon-top-left {
    top: -10px;
    left: -10px;
}

    .ribbon-top-left::before, .ribbon-top-left::after {
        border-top-color: transparent;
        border-left-color: transparent;
    }

    .ribbon-top-left::before {
        top: 0;
        right: 0;
    }

    .ribbon-top-left::after {
        bottom: 0;
        left: 0;
    }

    .ribbon-top-left span {
        right: -25px;
        top: 30px;
        transform: rotate(-45deg);
    }

/* top right*/
.ribbon-top-right {
    top: -10px;
    right: -10px;
}

    .ribbon-top-right::before, .ribbon-top-right::after {
        border-top-color: transparent;
        border-right-color: transparent;
    }

    .ribbon-top-right::before {
        top: 0;
        left: 0;
    }

    .ribbon-top-right::after {
        bottom: 0;
        right: 0;
    }

    .ribbon-top-right span {
        left: -25px;
        top: 30px;
        transform: rotate(45deg);
    }

/* bottom left*/
.ribbon-bottom-left {
    bottom: -10px;
    left: -10px;
}

    .ribbon-bottom-left::before, .ribbon-bottom-left::after {
        border-bottom-color: transparent;
        border-left-color: transparent;
    }

    .ribbon-bottom-left::before {
        bottom: 0;
        right: 0;
    }

    .ribbon-bottom-left::after {
        top: 0;
        left: 0;
    }

    .ribbon-bottom-left span {
        right: -25px;
        bottom: 30px;
        transform: rotate(225deg);
    }

/* bottom right*/
.ribbon-bottom-right {
    bottom: -10px;
    right: -10px;
}

    .ribbon-bottom-right::before, .ribbon-bottom-right::after {
        border-bottom-color: transparent;
        border-right-color: transparent;
    }

    .ribbon-bottom-right::before {
        bottom: 0;
        left: 0;
    }

    .ribbon-bottom-right::after {
        top: 0;
        right: 0;
    }

    .ribbon-bottom-right span {
        left: -25px;
        bottom: 30px;
        transform: rotate(-225deg);
    }

/* Timeline */
.timeline {
    border-left: 4px solid #78be20;
    border-bottom-right-radius: 4px;
    border-top-right-radius: 4px;
    background: white;
    margin: 50px 150px auto;
    letter-spacing: 0.5px;
    position: relative;
    line-height: 1.4em;
    font-size: 1.03em;
    padding: 50px;
    list-style: none;
    text-align: left;
    font-weight: 100;
    max-width: 30%;
}

    .timeline h1, .timeline h1 *, h1 .timeline *, .timeline .h1 *, .h1 .timeline * {
        letter-spacing: 1.5px;
        font-weight: 100;
        font-size: 1.4em;
    }

    .timeline h2, .timeline h2 *, h2 .timeline *, .timeline .h2 *, .h2 .timeline *, .timeline h3, .timeline h3 *, h3 .timeline *, .timeline .h3 *, .h3 .timeline * {
        letter-spacing: 1.5px;
        font-weight: 400;
        font-size: 1.4em;
    }

    .timeline .event {
        padding-bottom: 25px;
        position: relative;
    }

        .timeline .event:last-of-type {
            padding-bottom: 0;
            margin-bottom: 0;
            border: none;
        }

        .timeline .event:before, .timeline .event:after {
            position: absolute;
            display: block;
            top: 0;
        }

        .timeline .event:before {
            left: -217.5px;
            color: #666666;
            content: attr(data-date);
            text-align: right;
            font-weight: 100;
            line-height: 1.5;
            font-size: 1rem;
            min-width: 120px;
        }

        .timeline .event:after {
            box-shadow: 0 0 0 4px #78be20;
            left: -57.85px;
            background: white;
            border-radius: 50%;
            height: 11px;
            width: 11px;
            content: "";
            top: 5px;
        }

/*<label >
<!-- Input element for the checkbox -->
<input type="checkbox" class="image-check" >
<!-- Customization element for the checkbox -->
<span >
<img class="check-toggle" src="https://images.unsplash.com/photo-1537815749002-de6a533c64db?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=845&q=80" / >
</span >
</label >*/
input[type=checkbox].image-check {
    position: absolute;
    left: -10000px;
    top: auto;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

    input[type=checkbox].image-check ~ span {
        position: relative;
    }

        input[type=checkbox].image-check ~ span ~ * {
            color: #a1a2a4;
            display: block;
            font-size: 22px;
            margin-top: 10px;
        }

        input[type=checkbox].image-check ~ span .check-toggle {
            width: 160px;
            height: 160px;
            position: relative;
            display: inline-block;
            vertical-align: middle;
            border: 2px solid #62b51f;
            border-radius: 50%;
            cursor: pointer;
            padding: 5px;
            filter: gray; /* IE6-9 */
            -webkit-filter: 100%; /* Safari 6.0 - 9.0 */
            filter: grayscale(100%);
            transition: all 0.2s ease-in-out;
        }

    input[type=checkbox].image-check:hover ~ span .check-toggle {
        filter: unset; /* IE6-9 */
        -webkit-filter: none; /* Safari 6.0 - 9.0 */
        filter: grayscale(0);
        transform: scale(1.1);
    }

    input[type=checkbox].image-check:focus ~ span .check-toggle {
        box-shadow: 0 0 0 2px rgba(98, 181, 31, 0.25);
    }

    input[type=checkbox].image-check:checked ~ span:first-of-type ~ * {
        color: #666666;
    }

    input[type=checkbox].image-check:checked ~ span:first-of-type:after {
        content: url("/Themes/SimplyBiz/Content/images/tick.svg");
        position: absolute;
        top: -60px;
        right: 0;
    }

    input[type=checkbox].image-check:checked ~ span:first-of-type .check-toggle {
        filter: unset; /* IE6-9 */
        -webkit-filter: none; /* Safari 6.0 - 9.0 */
        filter: grayscale(0);
    }

.popover-green .popover .arrow::after {
    background: #ffffff;
    border-right-color: #006341;
}

.popover-green .popover .popover-header,
.popover-green .popover .popover-body {
    background: #006341;
    color: #ffffff;
    border-bottom-color: #006341;
}

.popover-green .popover .popover-header {
    font-size: 18px;
    font-style: italic;
}

.popover-green .popover .popover-body {
    font-size: 14px;
}

/* Forms */
.form-control {
    border-color: #bbbbbb;
}

    .form-control ::-webkit-input-placeholder { /* Chrome/Opera/Safari */
        color: #bbbbbb;
    }

    .form-control ::-moz-placeholder { /* Firefox 19+ */
        color: #bbbbbb;
    }

    .form-control :-ms-input-placeholder { /* IE 10+ */
        color: #bbbbbb;
    }

    .form-control :-moz-placeholder { /* Firefox 18- */
        color: #bbbbbb;
    }

.custom-control-input:checked ~ .custom-control-label::before {
    border-color: #78be20;
    background-color: #78be20;
}

div.toggle-password {
    position: relative;
}

    div.toggle-password > a.toggle-password {
        position: absolute;
        top: 0;
        right: 0;
        margin-top: 0.75rem;
        margin-right: 0.75rem;
        z-index: 2;
        cursor: pointer;
        color: #666666;
    }

/* Links */
a.no-decoration {
    text-decoration: none;
    color: #666666;
    background-color: unset;
}

/* Breadcrumb */
.breadcrumb {
    border-radius: 0;
    border-bottom: 1px solid #eeeeee;
    padding: .75rem 1rem;
}

    .breadcrumb .breadcrumb-item > a {
        color: #666666;
        background-color: unset;
        font-size: 0.85rem;
        text-decoration: none;
    }

    .breadcrumb .breadcrumb-item + .breadcrumb-item::before {
        content: none;
    }

/* Carousel */
.carousel-indicators {
    bottom: -50px;
}

    .carousel-indicators li {
        width: 10px !important;
        height: 10px !important;
        border-radius: 100%;
        background-color: #a1a2a4 !important;
        list-style-type: none;
    }

        .carousel-indicators li.active {
            background-color: #78be20 !important;
        }

/* nav-pills */
.nav-pills a.nav-link {
    color: #666666;
    background-color: #ffffff;
}

.nav-pills .nav-link.active {
    background-color: #009639;
    border-radius: 5px 5px 0 0;
}

/* jumbotron */
.jumbotron {
    background-color: #f2f2f2 !important;
}

.directory-overflow {
    overflow: auto;
    max-height: 750px;
}

/*# sourceMappingURL=simplybiz.css.map */
.mt-lg-n5 {
    margin-top: -4rem !important;
}

.btn-close-green {
    background: transparent url('data:image/svg+xml,<%3Fxml version="1.0" encoding="UTF-8" standalone="no" %3F><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="24" height="24" viewBox="0 0 24 24" xml:space="preserve"><desc>Created with Fabric.js 3.6.6</desc><defs></defs><g transform="matrix(1.61 0 0 1.61 12.11 11.11)" ><polygon style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(0,150,57); fill-rule: nonzero; opacity: 1;" points="-1.06,0 -6.89,-5.83 -5.83,-6.89 0,-1.06 5.83,-6.89 6.89,-5.83 1.06,0 6.89,5.83 5.83,6.89 0,1.06 -5.83,6.89 -6.89,5.83 " /></g></svg>') center/1em auto no-repeat;
}

.btn-close:focus {
    outline: none;
    box-shadow: none;
}

label {
    margin-bottom: 0.5rem;
}

.custom-control {
    position: relative;
    display: block;
    min-height: 1.5rem;
    padding-left: 1.5rem;
}

.custom-checkbox .custom-control-label::before {
    border-radius: 0.25rem;
}

.custom-checkbox .custom-control-input:checked ~ .custom-control-label::after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3e%3c/svg%3e");
}

.custom-checkbox .custom-control-input:indeterminate ~ .custom-control-label::before {
    border-color: #007bff;
    background-color: #007bff;
}

.custom-checkbox .custom-control-input:indeterminate ~ .custom-control-label::after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 4'%3e%3cpath stroke='%23fff' d='M0 2h4'/%3e%3c/svg%3e");
}

.custom-checkbox .custom-control-input:disabled:checked ~ .custom-control-label::before {
    background-color: rgba(0, 123, 255, 0.5);
}

.custom-checkbox .custom-control-input:disabled:indeterminate ~ .custom-control-label::before {
    background-color: rgba(0, 123, 255, 0.5);
}

input[type="radio"],
input[type="checkbox"] {
    box-sizing: border-box;
    padding: 0;
}

.form-check .form-check-input:checked[type=checkbox] {
    border-color: #78be20;
    background-color: #78be20;
}

.form-check .form-check-input:focus[type=checkbox] {
    box-shadow: 0 0 2px 2px #78be20;
}

.dropdown-toggle::after {
    margin-top: 13px !important;
    margin-left: 0.500em !important;
}

.multiselect-selected-text {
    font-weight: normal !important;
    line-height: 1.75 !important;
    margin-left: 5px !important;
}
