﻿@font-face {
    font-family: 'Svyaznoy Sans';
    src: url("../fonts/SvyaznoySans/SvyaznoySans-Bold.woff") format("woff"),url("../fonts/SvyaznoySans/SvyaznoySans-Bold.woff2") format("woff2");
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'Svyaznoy Sans';
    src: url('../fonts/SvyaznoySans/SvyaznoySans-Medium.woff2') format('woff2'), url('../fonts/SvyaznoySans/SvyaznoySans-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Svyaznoy Sans';
    src: url('../fonts/SvyaznoySans/SvyaznoySans.woff2') format('woff2'), url('../fonts/SvyaznoySans/SvyaznoySans.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Odds';
    src: url('../fonts/OddsRegular/Odds-Regular.woff2') format('woff2'), url('../fonts/OddsRegular/Odds-Regular.woff') format('woff');
    font-style: normal;
    font-weight: 400;
}

.mokka__price-text {
    font-family: 'Rubik';
    font-style: normal;
    color: #FFFFFF;
    font-weight: 400;
    font-size: 18px;
    margin-right:7px;
}

.mokka__price-text--price {
    font-weight: 500;
    font-size:1.1rem;
}

/*.mokka__price-text .mokka__name {
    font-family: 'Odds';
    font-size: 1.2rem;
    font-style: normal;
    font-weight: 400;
}*/

.mokka__name span {
    position: relative;
    top: 5px;
    width: 75px;
    height: 25px;
    display: inline-block;
}

.mokka__name .logo--style1 {
    background: url('../images/mokka-logo-2.svg') no-repeat;
    /* padding-right: 10px;
    border-right: 1px solid rgba(233, 233, 233, 1);
    margin-right: 10px;*/
}

.mokka__name .logo--style2 {
    background: url('../images/mokka-logo-1.svg') no-repeat;
   /* border-right: 1px solid rgba(233, 233, 233, 1);
    padding-right: 10px;
    margin-right: 10px;*/
}

.mokka__name .logo--style3,
.mokka__name .logo--style4 {
    background: url('../images/mokka-logo-3.svg') no-repeat;
    /*border-right: 1px solid rgba(233, 233, 233, 1);
    padding-right: 10px;
    margin-right: 10px;*/
}



.mokka__price-block {
    display: flex;
}

.mokka__price-block a {
    text-decoration: none !important;
    text-align:left;
    padding:16px;
    padding-right:8px;
    flex-grow:1;
}

.mokka__price-block a:hover {
    text-decoration: none !important;
    color: #FFFFFF;
}

.mokka__icon-help {
    cursor: pointer;
    padding: 16px;
    padding-left: 8px;
    display: flex;
    align-items: center;
}

.mokka-modal {
    padding:1.5rem;
    max-width:750px;
}

.mokka-modal__text {
    font-family: 'Rubik';
    font-style: normal;
    font-weight: 400;
    font-size: 15px;
    line-height: 1.1;
    text-align: center;
    color: #323232;
}

.mokka-modal__title {
    font-family: 'Odds';
    font-style: normal;
    font-weight: 400;
    font-size: 60px;
    line-height:0.8;
    text-align: center;
    text-transform: lowercase;
    color: #FF5A1E;
    margin:0;
}

.mokka__price-block--style1 {
    background: #ffffff;
    border: 1.92908px solid #C4C4C4;
}

.mokka__price-block--style2 {
    background: #FF5A1E;
    border: none;
}

.mokka__price-block--style3 {
    background: transparent;
    border: none;
}

.mokka__price-block--style4 {
    background: #ffffff;
    border: 1.92908px solid #C4C4C4;
}

.mokka__price-text--style1 {
    color: #FF5A1E;
}

.mokka__price-text--style2 {
    color: #FFFFFF;
}

.mokka__price-text--style3,
.mokka__price-text--style4 {
    color: #000000;
}

.mokka__icon-help--style1 .svg-fill {
    fill: #FF5A1E;
}

.mokka__icon-help--style1 .svg-stroke {
    stroke: #FF5A1E;
}

.mokka__icon-help--style2 .svg-fill {
    fill: #FFFFFF;
}

.mokka__icon-help--style2 .svg-stroke {
    stroke: #FFFFFF;
}

.mokka__icon-help--style3 .svg-fill,
.mokka__icon-help--style4 .svg-fill {
    fill: #000000;
}

.mokka__icon-help--style3 .svg-stroke,
.mokka__icon-help--style4 .svg-stroke {
    stroke: #000000;
}