.tooltip {
    color: #616161;
    font-size: 12px;
    background-color: #c6e1ff;
}
@font-face {
    font-family: 'Nunito';
    font-style: normal;
    font-weight: 400;
    src: local('Nunito'), local('Nunito'), url(/fonts/Nunito/Nunito-Light.ttf) format('opentype');
    unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
    font-family: 'Nunito';
    font-style: normal;
    font-weight: 400;
    src: local('Nunito'), local('Nunito'), url(/fonts/Nunito/Nunito-Light.ttf) format('opentype');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
}
@font-face {
    font-family: 'Nunito';
    font-style: normal;
    font-weight: 400;
    src: local('Nunito'), local('Nunito'), url(/fonts/Nunito/Nunito-Light.ttf) format('opentype');
}

@font-face {
    font-family: 'Dosis';
    font-style: normal;
    font-weight: 400;
    src: local('Dosis Regular'), local('Dosis-Regular'), url(/fonts/Dosis2.woff2) format('woff2');
    unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: 'Dosis';
    font-style: normal;
    font-weight: 400;
    src: local('Dosis Regular'), local('Dosis-Regular'), url(/fonts/Dosis.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
}

@font-face {
    font-family: 'Dosis';
    font-style: normal;
    font-weight: 400;
    src: local('Dosis Regular'), local('Dosis-Regular'), url(/fonts/Dosis.woff) format('woff');
}

hr {
    border-bottom: 1px solid #616161;
}

body {
    color: #616161;
}

.menuItem {
    background-color: rgba(155, 155, 155, 10%);
}

.activeMenuItem {
    background-color: rgb(155 155 155 / 35%);
    vertical-align: middle;
    position: relative;
    border-width: 0 0 2px;
    border-style: solid;
    border-image: linear-gradient( to right, #D50740, transparent) 1;
    border-radius: 5px;
    margin: 0 0 10px -25px;
    padding: 5px 25px 5px 5px;
}
.menuItemLabel {
    color: #616161;
}
.activeMenuItem .menuItemLabel {
    font-weight: bold;
}
.menuSeparator {
    font-size: 16px;
    font-weight: bold;
    color: #616161;
}
.menuBorderBottom {
    border-bottom: #D7D7D7;
}
.basketbtn {
    box-shadow: -4px 7px 17px -4px rgba(0,0,0,0.75);
    font-weight: 600;
    font-size: 18px;
}
.basketbtn img {
    vertical-align: bottom;
}
.basketCount {
    background: #3A85DE;
    font-weight: 600;
    font-size: 10px;
    color: #fff;
}
.menubtn {
    background: #fff;
    box-shadow: -4px 7px 17px -4px rgba(0,0,0,0.75);
    font-weight: 600;
    font-size: 18px;
    color: #535E66;
}
.bubble {
    background-color: #fff;
    box-shadow: -4px 7px 27px -4px rgba(0,0,0,0.75);
    color: #979797;
}
.bubble .user {
    color: #515e66;
}

.bubble a {
    color: #515e66;
}
.bubbleArrow {
    border-left: transparent;
    border-right: transparent;
    border-bottom: #fff;
}

#createAccountSteps > .createAccountCurrStep {
    color: #ff0000;
}

.bubble > ul > li:not(.nohover):hover {
    background-color: rgba(191, 191, 191, 0.47);
}

.bubble > ul > li:first-child:hover {
    background: none;
}
.bubble > ul > li > ul > li:hover {
    background-color: rgba(191, 191, 191, 0.47);
}
.block {
    background: #fff;
}
.blue {
    color: #3f87d6;
}
.btn {
    font-family: 'Dosis';
    font-size: 14px;
    font-weight: bold;
}
.btn.silver {
    color: #646363;
}

.btn.blue {
    color: #fff;
}

.btn.red {
    color: #fff;
    background-color: #CC3333;
}
.btn.disabled {
    background-color: rgba(0, 0, 0, 0.15);
}
.btn.switch {
    color: #3f87d6;
    box-shadow: inset 0px 0px 0px 1px #3f87d6;
    background-color: #fff;
}
.btn.switch[selected] {
    color: #fff;
    background-color: #3f87d6;
}
.btn.switch.gray {
    box-shadow: #616161;
    color: #000;
}
.btn.switch.gray[selected] {
    background-color: #616161;
}

.primary-red-button {
    background-color: #CC3333 !important;
    border-color: #CC3333 !important;
    color: #ffffff;
}

.control {
    border: 1px solid #979797;
}
.control:focus {
    border-color: #006bff;
}
h2 {
    /*color: #4A90E2;*/
    font-size: 18px;
}
h4 {
    font-size: 14px;
}
.field-validation-error {
    color: #ff0000;
    border: #ff0000;
    background-color: #ffeeee;
    font-size: 12px;
    font-weight: normal;
}
#layoutSuccess, #layoutError, #layoutInfo, #layoutWarning {
    border: 2px solid #fff;
    color: #fff;
}
#layoutSuccess {
    background: #83d085;
}
#layoutError {
    background: #ff7070;
}
#layoutInfo {
    background: #76b8ff;
}
#layoutWarning {
    background: #ff982d;
}
input[type=checkbox] + label:before {
    background-color: #fff;
    color: #000;
    font-size: 30px;
    border-color: #979797;
}
input[type=text]:read-only {
    color: #9D9D9D;
    border-color: #9D9D9D;
}
.productTile {
    background-color: #fff;
    box-shadow: 0 1px 10px 3px rgba(0, 0, 0, 0.15);
}
.productFreeDeliveryInfo.True {
    color: #28a424;
}
.productFreeDeliveryInfo.False {
    color: #ff7500;
}
.inputNumberMinus {
    background-color: #a10000;
    color: #fff;
    font-weight: bold;
    font-size: 20px;
}
.inputNumberMinus:disabled {
    background: #979797;
}
.inputNumberPlus {
    background-color: #02b600;
    color: #fff;
    font-weight: bold;
    font-size: 20px;
}
.inputNumberPlus:disabled {
    background: #979797;
}
.deliveryOptionsState {
    color: #9B9B9B;
}
.deliveryOptionsState.selected {
    background-color: #4A90E2;
    color: #fff;
    font-weight: bold;
}
.checkedPanel {
    font-size: 20px;
    font-weight: bold;
}
.checkedPanel:before {
    background-image: url('/Images/p_check_green.svg');
    background-size: 30px;
    background-position: center;
}
.errorPanel {
    position: relative;
    font-size: 20px;
    font-weight: bold;
}
.errorPanel:before {
    background-image: url('/Images/p_discussion_grey_copy_6.svg');
    background-size: 30px;
    background-position: center;
}
input[type=checkbox] + label:before {
    background-color: #fff;
    color: #000;
    font-size: 14px;
    border-color: #979797;
}
input[type=checkbox]:disabled + label:before {
    color: #a7a7a7;
    border-color: #a7a7a7;
}

.btn {
    border-radius: 5px;
}

.textButton.active {
    color: #fff !important;
}

.imageButton.active {
   border: 2px solid #00ff21
}

.popin {
    padding: 10px;
}

    .popin > .title {
        font-size: 25px;
    }

    .popin > .info {
        font-size: 25px;
    }

.form-modal {
    width: 100%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.login-form {
    width: 100%;
}

.alert-modal {
    width: 100%;
    margin-top: 20px;
}

.progressbar {
    counter-reset: step;
    margin: auto;
    padding: 0;
}

    .progressbar:after {
        display: block;
        content: " ";
        clear: both;
    }

    .progressbar li {
        list-style-type: none !important;
        width: 25%;
        float: left;
        font-size: 12px;
        position: relative;
        text-align: center;
        text-transform: uppercase;
        color: #bbbbbb;
    }

        .progressbar li:before {
            width: 30px;
            height: 30px;
            content: counter(step);
            counter-increment: step;
            line-height: 30px;
            border: 2px solid #7d7d7d;
            display: block;
            text-align: center;
            margin: 0 auto 10px auto;
            border-radius: 50%;
            background-color: white;
        }

        .progressbar li:after {
            width: 100%;
            height: 2px;
            content: '';
            position: absolute;
            background-color: #7d7d7d;
            top: 15px;
            left: -50%;
            z-index: -1;
        }

        .progressbar li:first-child:after {
            content: none;
        }

        .progressbar li.createAccountCurrStep,
        .progressbar li.createAccountDoneStep {
            color: green;
        }

            .progressbar li.createAccountDoneStep:before {
                border-color: #55b776;
            }

            .progressbar li.createAccountCurrStep:before {
                border-color: #ff0000;
            }

            .progressbar li.createAccountDoneStep + li:after {
                background-color: #55b776;
            }

@media (min-width: 1024px) {
    .form-modal {
        max-width: 700px;
    }

    .form-modal-auth {
        width: auto;
        max-width: none;
    }

    .login-form {
        width: 500px;
        margin: 7% calc((100% - 500px) / 2) 3%;
    }

    .alert-modal {
        width: 500px;
        margin: auto calc((100% - 500px) / 2);
    }

    .progressbar {
        margin-right: 15px;
        padding: initial;
    }

    .progressbar:after {
        display: none;
    }

    .progressbar li {
        list-style-type: decimal !important;
        width: auto;
        float: none;
        font-size: inherit;
        position: relative;
        text-align: left;
        text-transform: inherit;
    }

        .progressbar li:before,
        .progressbar li:after {
            display: none;
        }

    #createAccountSteps.progressbar > .createAccountDoneStep:after {
        display: inline-block;
        content: " \2713";
        position: relative;
        height: auto;
        width: auto;
        background: none;
        top: auto;
        left: auto;
        margin-left: 4px;
    }
}