/********************************
* Frontend Styles
*********************************/

/* Ultimate Advanced Carousel */
    .ult-carousel-wrapper                       img { display: none; }
    .ult-carousel-wrapper .slick-initialized    img { display: block; }

/* Sweet Tooth Icon Box */
    .w-iconbox.w-sweettooth-iconbox
    {
        padding: 50px 35px 30px 35px;
        border: 1px solid;
        -webkit-border-radius: 1px;
        -moz-border-radius: 1px;
        border-radius: 1px;
    }
    .w-iconbox h4
    {
        font-family: 'mulibold';
    }
    .w-iconbox.w-sweettooth-iconbox .w-iconbox-title
    {
        color: #363535;
        padding-top: 34px;
        padding-bottom: 17px;
    }
    .w-iconbox.w-sweettooth-iconbox.iconpos_top-left .w-iconbox-icon    { text-align: left; }
    .w-iconbox.w-sweettooth-iconbox.iconpos_top-right .w-iconbox-icon   { text-align: right; }

/* Modals */
    [class*='modal-'] {
        display: none;
    }
    .st_button-modal#overlay {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: #000;
        opacity: 0.5;
        filter: alpha(opacity=50);
        z-index: 99999;
    }
    .st_button-modal#modal {
        position:fixed;
        max-width: 100%;
        background:url('../img/tint20.png') 0 0 repeat;
        background:rgba(0,0,0,0.2);
        border-radius:14px;
        padding:8px;
        z-index: 100000;
    }
        @media only screen and (max-width: 899px) {
            .st_button-modal#modal {
                width: 100% !important;
            }
        }

    .st_button-modal#modal #content {
        border-radius:8px;
        background:#fff;
        padding:20px;
        overflow: auto;
        height: 100%;
    }
    .st_button-modal#modal #close {
        position:absolute;
        background:url('../img/close.png') 0 0 no-repeat;
        width:24px;
        height:27px;
        display:block;
        text-indent:-9999px;
        top: 0px;
        right: 0px;
    }

/* Resource Element */
    .vc_st_resource {
        display:        inline-block;
        position:       relative;
        width:          100%;
        border-width:   1px;
        border-style:   solid;
        vertical-align: top;
    }
    .vc_st_resource a.img-a,
    .vc_st_resource img {
        display:        block;
        width:          100%;
    }
    .vc_st_resource h3 {
        font-size:      30px;
        margin-bottom:  30px;
    }
    .vc_st_resource p {
        padding-top:    10px;
        font-weight:    300;
        font-size:      16px;
    }
    .vc_st_resource .st_button {
        position:       absolute;
        bottom:         35px;
    }
    .vc_st_resource.no-img .st_button {
        width: 100%;
        left: 0px;
    }
    .vc_st_resource .st_button a {
        font-size:      12px;
        letter-spacing: 3px;
    }
    .vc_st_resource.no-img  h3           { font-size: 40px; }
    .vc_st_resource         .container   { padding: 25px 55px 90px 44px; }
    .vc_st_resource.no-img  .container   { padding-top: 50px; }

/* Pricing Box */
    .vc_st_pricebox {
        display:        inline-block;
        position:       relative;
        width:          100%;
        border-width:   1px;
        border-style:   solid;
        vertical-align: top;
        text-align:     center;
        padding:        0px 25px 80px 25px;
    }
        .vc_st_pricebox.featured {
            background-color: rgba(255,205,210, 0.30);
        }
    .vc_st_pricebox .plan-name {
        font-size:      12px;
        margin-top:     43px;
        text-transform: uppercase;
        font-family:    'mulibold';
    }
    .vc_st_pricebox .plan-price {
        margin-top:     30px;
        line-height:    100px;
    }
        .vc_st_pricebox .plan-price .dolla,
        .vc_st_pricebox .plan-price .per-period {
            font-family:    'mulibold';
            font-size:      15px;
            vertical-align: text-top;
        }
        .vc_st_pricebox .plan-price .dolla {
            vertical-align: middle;
        }
        .vc_st_pricebox .plan-price .amount {
            font-weight:    100;
            font-size:      100px;
            font-family:    'Lato';
            vertical-align: middle;
        }
            .vc_st_pricebox.row-of-4 .plan-price {  line-height: 63px; }
            .vc_st_pricebox.row-of-4 .plan-price .amount { font-size: 63px; }
    .vc_st_pricebox .plan-description {
        padding-bottom:     40px;
    }
        .vc_st_pricebox .plan-description ul,
        .vc_st_pricebox .plan-description ol {
            list-style-position: inside;
            margin-left: 0px;
        }
    .vc_st_pricebox .st_button {
        position:           absolute;
        bottom:             25px;
        width:              100%;
        left:               0px;
    }
    .vc_st_pricebox .st_button .g-btn {
        text-transform:     none;
        background-color:   transparent;
    }
        .vc_st_pricebox.disabled  .st_button .g-btn {
            cursor: default;
            -moz-transition: none;
            -webkit-transition: none;
            -o-transition: color 0 ease-in;
            transition: none;
        }
        .vc_st_pricebox.disabled  .st_button .g-btn:before {
            display: none;
        }


/* Info Card */
    .vc_st_infocard {
        display:        table;
        width:          100%;
        height:         175px;
        border:         1px solid;
        position:       relative;
        overflow:       hidden;
        text-overflow:  ellipsis;
    }
        .vc_st_infocard .card-front {
            display:        table-cell;
            width:          100%;
            text-align:     center;
            vertical-align: middle;
        }
            .vc_st_infocard .card-front .icon { font-size: 48px; }
            .vc_st_infocard .card-front .title {
                font-family:    'mulibold';
                font-size:      20px;
                margin-top:     15px;
            }

        .vc_st_infocard .card-back {
            position:       absolute;
            left:           0px;
            top:            0px;
            box-sizing:     border-box;
            width:          100%;
            height:         inherit;
        }
            .vc_st_infocard .card-back .icon {
                position:   absolute;
                font-size:  68px;
                left:       -30px;
                top:        50px;
                color:      rgba(255,255,255,0.1);
            }
            .vc_st_infocard .card-back .content {
                color:          white;
                font-size:      14px;
                line-height:    18px;
                padding:        25px 20px 25px 41px;
                overflow:       hidden;
                text-overflow:  ellipsis;
                box-sizing:     border-box;
                width:          100%;
                height:         inherit;
            }

/* Features Tabs */
    .sweettooth-features-tabs-canvas  .l-subheader.at_middle {
        transition: none;
        -ms-transition: none;
        -moz-transition: none;
        -webkit-transition: none;
        box-shadow: none;
    }
    .sweettooth-features-tabs-canvas  .w-logo-img {
        background-image: url('../img/logo-white.png');
        background-size: 100% 100%;
        background-repeat: no-repeat;
    }
    .sweettooth-features-tabs-canvas  .w-logo-img img {
        visibility: hidden;
    }
    .sweettooth-features-tabs-canvas  .l-submain.for_pagehead {
        box-shadow: none;
    }

    .sweettooth-features-tabs-canvas  .l-subheader.at_middle .w-nav.type_mobile .w-nav-control {
        color: white;
    }
    .sweettooth-features-tabs-canvas  .l-subheader.at_middle .w-nav.type_mobile .w-nav-list {
        background-color: transparent;
    }
        .sweettooth-features-tabs-canvas  .l-subheader.at_middle .w-nav.type_mobile .w-nav-list .w-nav-anchor {
            color: white;
        }
            .sweettooth-features-tabs-canvas  .l-subheader.at_middle .w-nav.type_mobile .w-nav-list .w-nav-anchor:not(.level_1) .w-nav-title {
                font-size: 13px;
                cursor: pointer;
            }

    .sweettooth-features-tabs-canvas  .l-subheader.at_middle .w-nav-item.level_1:hover .w-nav-anchor.level_1,
    .sweettooth-features-tabs-canvas  .l-subheader.at_middle .w-nav-anchor.level_1,
    .sweettooth-features-tabs-canvas  .l-submain.for_pagehead h1,
    .sweettooth-features-tabs-canvas  .l-submain.for_pagehead a  {
        color: white;
        background-color: transparent;
    }
        .sweettooth-features-tabs-canvas  .l-subheader.at_middle .w-nav-anchor.level_1 .w-nav-title:after {
            background-color: white;
        }

    .sweettooth-features-tabs-container .l-submain-h {
        padding-top: 0px;
    }
    .w-tabs.sweettooth-features .sweettooth-features-tabs-background {
        position: absolute;
        top: 0px;
        left: 0px;
        width: 100%;
        height: 113px;
        z-index: 0;
    }
        .w-tabs.sweettooth-features.layout_accordion .sweettooth-features-tabs-background {
            display: none;
        }

    .w-tabs.sweettooth-features:not(.layout_accordion) {
        visibility: hidden;
        z-index: 100;
    }
    .w-tabs.sweettooth-features:not(.layout_accordion) .w-tabs-list {
        background-color: transparent;
        text-align: center;
    }
    .w-tabs.sweettooth-features:not(.layout_accordion) .w-tabs-item {
        float: none;
        height: 113px;
        color: rgba(255, 255, 255, 0.4);
        display: inline-block;
        vertical-align: bottom;
    }
    .w-tabs.sweettooth-features:not(.layout_accordion) .w-tabs-item.active {
        padding-top: 0px;
        color: white;
        border-color: transparent;
        transition: padding-top 0.3s ease-in-out;
        -ms-transition: padding-top 0.3s ease-in-out;
        -moz-transition: padding-top 0.3s ease-in-out;
        -webkit-transition: padding-top 0.3s ease-in-out;
        background: transparent url('../img/active-tab.png') center bottom no-repeat;
    }
        .w-tabs.sweettooth-features:not(.layout_accordion) .w-tabs-item:hover {
            background-color: transparent;
            color: white;
        }

    .w-tabs.sweettooth-features:not(.layout_accordion) .w-tabs-item-icon {
        display: block;
        font-size: 48px;
    }
    .w-tabs.sweettooth-features:not(.layout_accordion) .w-tabs-item-title {
        margin-top: 14px;
        margin-left: 0px;
        font-size: 16px;
        font-family: 'mulibold';
    }
        .w-tabs.sweettooth-features:not(.layout_accordion) .w-tabs-item:not(.with_icon) .w-tabs-item-title {
            margin-top: 57px;
        }

/* ST Signup */
    .sweettooth_signup .form-group {
        margin-top: 15px;
    }
    .sweettooth_signup label {
        font-weight: bold;
    }
    .sweettooth_signup .magento-alert {
        margin-top: 10px;
    }
    .sweettooth_signup .input-validator .validator-message {
        font-size: 15px;
    }

/* ST Signup Billing */
#sweettooth_onetime_payment,
#recurly-subscription-form {
    float: right;
    text-align: left;
}
    @media only screen and (max-width: 899px) {
        #sweettooth_onetime_payment,
        #recurly-subscription-form  {
            float: none;
            display: inline-block;
        }
        .signup-subscription-page {
            text-align: center;
        }
        .signup-subscription-page .subscription-options {
            display: inline-block;
            text-align: left;
            width: 400px;
        }
    }
    .recurly .title {
        font-weight: normal;
    }
    .recurly .due_now .title,
    .recurly .due_now .cost {
        color: #C82254;
    }
    .recurly .due_now .cost {
        font-weight: bold;
    }
    .recurly #recurly-subscription-form .contact_info {
        display: none;
    }
    .recurly .zip input {
        padding: 21px 5px 21px 13px;
    }
    .recurly-plan-details,
    .recurly-addons,
    .recurly-copuon {
        display: none;
    }
    .recurly .product_info,
    .recurly .contact_info,
    .recurly .accept_tos,
    .recurly-plan-details .setup_fee,
    .recurly-copuon .coupon {
        background: none !important;
    }
    .recurly-plan-details .plan .name,
    .recurly-plan-details .plan .recurring_cost .cost {
        font-size: 25px !important;
    }
    .recurly-plan-details .plan .free_trial {
        font-style: initial !important;
    }
    .recurly-plan-details .plan .setup_fee {
        padding-bottom: 20px;
    }
    .recurly .subtotal-comment {
        text-align: right;
        clear: both;
        padding-top: 5px;
        font-style: italic;
        color: #999999;
    }
    .recurly .recurly-addons .add_ons .add_on {
        background: none;
        border: 0px !important;
        cursor: pointer;
        border-radius: 0px !important;
        box-shadow: initial !important;
    }
    .recurly .recurly-addons .add_ons .add_on .name {
        font-style: initial;
    }
    .recurly .recurly-addons .add_ons .add_on:hover {
        background: rgba(200, 34, 84, 0.1);
    }
    .recurly .recurly-addons .add_ons .add_on.selected {
        background: url('../img/check.png') no-repeat 10px center;
    }
    .recurly .recurly-addons .add_ons .add_on.selected:hover {
        background: rgba(200, 34, 84, 0.1) url('../img/uncheck.png') no-repeat 10px center;
    }
    .recurly .coupon .check {
        float: left;
        top: -4px;
        padding: 5px 0px;
        height: 40px;
        background-color: #C82254;
        color: #fff;
    }
    .recurly .coupon.invalid .description {
        color: red;
        font-weight: bold;
        float: none;
    }

    #sweettooth_onetime_payment .error,
    #recurly-subscription-form .error {
        color: #C82254;
        border: 2px solid #C82254;
        background-color: #fee;
        font-weight: bold;
        padding-left: 10px;
    }
        #sweettooth_onetime_payment .field .error,
        #recurly-subscription-form  .field .error
         {
            top: 100%;
            left: 0;
            margin-left: 8px;
            margin-top: -16px;
        }
    @media only screen and (max-width: 899px) {
        #sweettooth_onetime_payment .footer,
        #recurly-subscription-form .footer {
            text-align: center;
        }
    }

/* Colours */
    /* COLOR: transparent */
    .vc_st_resource.background_clear
    .st_button .g-btn.color_clear                       { background-color: transparent;}

    /* white */
    .color_white                                        { color: white; }
    .st_button .g-btn.border_white                      { box-shadow: 0 0 0 2px #fff inset;         color: #fff; }
    .vc_st_resource.background_white,
    .st_button .g-btn.border_white:before               { background-color: #fff; }
    .no-touch .st_button .g-btn.border_white:hover                 { color: #444; }
    .no-touch .st_button .g-btn.border_white.color_pink:hover      { color: #ff6b6b; }
    .no-touch .st_button .g-btn.border_white.color_blue:hover      { color: #5ac8ed; }
    .no-touch .st_button .g-btn.border_white.color_midnight:hover  { color: #8560a8; }
    .no-touch .st_button .g-btn.border_white.color_purple:hover    { color: #8560a8; }
    .no-touch .st_button .g-btn.border_white.color_navy:hover      { color: #1265a8; }
    .no-touch .st_button .g-btn.border_white.color_green:hover     { color: #59ba41; }
    .no-touch .st_button .g-btn.border_white.color_yellow:hover    { color: #fac000; }
    .no-touch .st_button .g-btn.border_white.color_teal:hover      { color: #008b83; }
    .no-touch .st_button .g-btn.border_white.color_brown:hover     { color: #6a4530; }
    .no-touch .st_button .g-btn.border_white.color_red:hover       { color: #f40; }
    .no-touch .st_button .g-btn.border_white.color_lime:hover      { color: #656c57; }

    /* pink */
    .color_pink                                         { color: #ff6b6b;}
    .vc_st_resource.background_pink,
    .st_button .g-btn.border_pink:before                { background-color: #ff6b6b; }
    .st_button .g-btn.border_pink                       { box-shadow: 0 0 0 2px #ff6b6b inset;      color: #ff6b6b; }
    .no-touch .st_button .g-btn.border_pink:hover       { color: #fff;}

    /* blue */
    .color_blue                                         { color: #5ac8ed;}
    .vc_st_resource.background_blue,
    .st_button .g-btn.border_blue:before                { background-color: #5ac8ed; }
    .st_button .g-btn.border_blue                       { box-shadow: 0 0 0 2px #5ac8ed inset;      color: #5ac8ed; }
    .no-touch .st_button .g-btn.border_blue:hover       { color: #fff; }

    /* midnight */
    .color_midnight                                     { color: #2c3e50;}
    .vc_st_resource.background_midnight,
    .st_button .g-btn.border_midnight:before            { background-color: #2c3e50; }
    .st_button .g-btn.border_midnight                   { box-shadow: 0 0 0 2px #2c3e50 inset;      color: #2c3e50; }
    .no-touch .st_button .g-btn.border_midnight:hover   { color: #fff; }

    /* purple */
    .color_purple                                       { color: #8560a8;}
    .vc_st_resource.background_purple,
    .st_button .g-btn.border_purple:before              { background-color: #8560a8; }
    .st_button .g-btn.border_purple                     { box-shadow: 0 0 0 2px #8560a8 inset;      color: #8560a8; }
    .no-touch .st_button .g-btn.border_purple:hover     { color: #fff; }

    /* navy */
    .color_navy                                         { color: #1265a8;}
    .vc_st_resource.background_navy,
    .st_button .g-btn.border_navy:before                { background-color: #1265a8; }
    .st_button .g-btn.border_navy                       { box-shadow: 0 0 0 2px #1265a8 inset;      color: #1265a8; }
    .no-touch .st_button .g-btn.border_navy:hover       { color: #fff; }

    /* green */
    .color_green                                        { color: #59ba41;}
    .st_button .g-btn.border_green                      { box-shadow: 0 0 0 2px #59ba41 inset;      color: #59ba41; }
    .vc_st_resource.background_green,
    .st_button .g-btn.border_green:before               { background-color: #59ba41; }
    .no-touch .st_button .g-btn.border_green:hover      { color: #fff; }

    /* yellow */
    .color_yellow                                       { color: #fac000;}
    .st_button .g-btn.border_yellow                     { box-shadow: 0 0 0 2px #fac000 inset;      color: #fac000; }
    .vc_st_resource.background_yellow,
    .st_button .g-btn.border_yellow:before              { background-color: #fac000; }
    .no-touch .st_button .g-btn.border_yellow:hover     { color: #fff; }

    /* teal */
    .color_teal                                         { color: #008b83;}
    .vc_st_resource.background_teal,
    .st_button .g-btn.border_teal:before                { background-color: #008b83; }
    .st_button .g-btn.border_teal                       { box-shadow: 0 0 0 2px #008b83 inset;      color: #008b83; }
    .no-touch .st_button .g-btn.border_teal:hover       { color: #fff; }

    /* brown */
    .color_brown                                        { color: #6a4530;}
    .vc_st_resource.background_brown,
    .st_button .g-btn.border_brown:before               { background-color: #6a4530; }
    .st_button .g-btn.border_brown                      { box-shadow: 0 0 0 2px #6a4530 inset;      color: #6a4530; }
    .no-touch .st_button .g-btn.border_brown:hover      { color: #fff; }

    /* cream */
    .color_cream                                        { color: #f5ddbf;}
    .vc_st_resource.background_cream,
    .st_button .g-btn.border_cream:before               { background-color: #f5ddbf; }
    .st_button .g-btn.border_cream                      { box-shadow: 0 0 0 2px #f5ddbf inset;      color: #f5ddbf; }
    .no-touch .st_button .g-btn.border_cream:hover      { color: #605c57; }

    /* red */
    .color_red                                          { color: #f40;}
    .vc_st_resource.background_red,
    .st_button .g-btn.border_red:before                 { background-color: #f40; }
    .st_button .g-btn.border_red                        { box-shadow: 0 0 0 2px #f40 inset;         color: #f40; }
    .no-touch .st_button .g-btn.border_red:hover        { color: #fff; }

    /* lime */
    .color_lime                                         { color: #baeb59;}
    .vc_st_resource.background_lime,
    .st_button .g-btn.border_lime:before                { background-color: #baeb59; }
    .st_button .g-btn.border_lime                       { box-shadow: 0 0 0 2px #baeb59 inset;      color: #baeb59; }
    .no-touch .st_button .g-btn.border_lime:hover       { color: #656c57; }