/* roboto-100 - cyrillic_cyrillic-ext_latin_latin-ext */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 100;
    src: url('/fonts/roboto-v32-cyrillic_cyrillic-ext_latin_latin-ext-100.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-100italic - cyrillic_cyrillic-ext_latin_latin-ext */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Roboto';
    font-style: italic;
    font-weight: 100;
    src: url('/fonts/roboto-v32-cyrillic_cyrillic-ext_latin_latin-ext-100italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-300 - cyrillic_cyrillic-ext_latin_latin-ext */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 300;
    src: url('/fonts/roboto-v32-cyrillic_cyrillic-ext_latin_latin-ext-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-300italic - cyrillic_cyrillic-ext_latin_latin-ext */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Roboto';
    font-style: italic;
    font-weight: 300;
    src: url('/fonts/roboto-v32-cyrillic_cyrillic-ext_latin_latin-ext-300italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-regular - cyrillic_cyrillic-ext_latin_latin-ext */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: url('/fonts/roboto-v32-cyrillic_cyrillic-ext_latin_latin-ext-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-italic - cyrillic_cyrillic-ext_latin_latin-ext */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Roboto';
    font-style: italic;
    font-weight: 400;
    src: url('/fonts/roboto-v32-cyrillic_cyrillic-ext_latin_latin-ext-italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-500 - cyrillic_cyrillic-ext_latin_latin-ext */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 500;
    src: url('/fonts/roboto-v32-cyrillic_cyrillic-ext_latin_latin-ext-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-500italic - cyrillic_cyrillic-ext_latin_latin-ext */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Roboto';
    font-style: italic;
    font-weight: 500;
    src: url('/fonts/roboto-v32-cyrillic_cyrillic-ext_latin_latin-ext-500italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-700 - cyrillic_cyrillic-ext_latin_latin-ext */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 700;
    src: url('/fonts/roboto-v32-cyrillic_cyrillic-ext_latin_latin-ext-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-700italic - cyrillic_cyrillic-ext_latin_latin-ext */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Roboto';
    font-style: italic;
    font-weight: 700;
    src: url('/fonts/roboto-v32-cyrillic_cyrillic-ext_latin_latin-ext-700italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-900 - cyrillic_cyrillic-ext_latin_latin-ext */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 900;
    src: url('/fonts/roboto-v32-cyrillic_cyrillic-ext_latin_latin-ext-900.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-900italic - cyrillic_cyrillic-ext_latin_latin-ext */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Roboto';
    font-style: italic;
    font-weight: 900;
    src: url('/fonts/roboto-v32-cyrillic_cyrillic-ext_latin_latin-ext-900italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}


[v-cloak] {
    display: none;
}

html, body {
    margin: 0;
    padding: 0;
    font-family: 'Roboto', sans-serif;
    color: rgb(56, 55, 54);
    font-size: 14px;
    font-width: 400;
}

body {
    --color-primary-20: 255, 253, 245;
    --color-primary-40: 255, 250, 235;
    --color-primary-50: 255, 245, 214;
    --color-primary-100: 255, 234, 173;
    --color-primary-200: 250, 222, 140;
    --color-primary-300: 250, 216, 115;
    --color-primary-400: 250, 204, 70;
    --color-primary-500: 250, 198, 45;
    --color-primary-600: 250, 189, 5;
    --color-primary-700: 240, 181, 5;
    --color-primary-800: 225, 171, 8;
    --color-accent-20: 244, 250, 254;
    --color-accent-40: 230, 242, 250;
    --color-accent-50: 205, 231, 249;
    --color-accent-100: 166, 210, 239;
    --color-accent-200: 120, 182, 223;
    --color-accent-400: 85, 162, 214;
    --color-accent-500: 39, 148, 219;
    --color-accent-600: 15, 122, 193;
    --color-accent-700: 15, 116, 184;
    --color-accent-750: 20, 106, 163;
    --color-accent-800: 22, 100, 153;
    --color-accent-850: 18, 93, 143;
    --color-accent-880: 17, 80, 122;
    --color-accent-900: 8, 40, 61;
    --color-contrast-0: 255, 255, 255;
    --color-contrast-20: 249, 249, 249;
    --color-contrast-40: 245, 244, 242;
    --color-contrast-50: 240, 238, 235;
    --color-contrast-100: 231, 228, 222;
    --color-contrast-200: 204, 202, 197;
    --color-contrast-300: 178, 176, 171;
    --color-contrast-400: 152, 150, 145;
    --color-contrast-450: 133, 132, 128;
    --color-contrast-500: 122, 121, 118;
    --color-contrast-600: 97, 96, 93;
    --color-contrast-700: 71, 70, 69;
    --color-contrast-750: 56, 55, 54;
    --color-contrast-800: 46, 45, 44;
    --color-contrast-850: 36, 36, 35;
    --color-contrast-900: 26, 26, 25;
    --color-contrast-950: 20, 20, 20;
    --color-contrast-980: 10, 10, 10;
    --color-contrast-1000: 0, 0, 0;
    --color-warn-20: 250, 240, 240;
    --color-warn-40: 250, 230, 231;
    --color-warn-50: 245, 215, 217;
    --color-warn-100: 245, 186, 188;
    --color-warn-200: 235, 150, 154;
    --color-warn-300: 235, 132, 135;
    --color-warn-400: 235, 103, 108;
    --color-warn-500: 235, 75, 81;
    --color-warn-600: 235, 56, 63;
    --color-warn-700: 230, 52, 58;
    --color-warn-750: 224, 45, 51;
    --color-warn-800: 219, 31, 38;
    --color-success-20: 242, 250, 240;
    --color-success-40: 221, 245, 215;
    --color-success-50: 194, 240, 182;
    --color-success-100: 151, 224, 135;
    --color-success-200: 126, 219, 105;
    --color-success-300: 117, 204, 97;
    --color-success-400: 105, 193, 85;
    --color-success-500: 100, 184, 81;
    --color-success-600: 94, 173, 76;
    --color-success-700: 86, 164, 69;
    --color-success-750: 73, 153, 55;
    --color-success-800: 64, 143, 46

}


a {
    color: inherit;
}

* {
    box-sizing: border-box;
    letter-spacing: 0 !important;
    font-family: 'Roboto', sans-serif !important;
}

/* default form style */
.form.default .field,
form.default .field {
    margin-bottom: 15px;
}

.form.default .field .field-element,
form.default .field .field-element {
    position: relative;
}

.form.default .field .field-title,
form.default .field .field-title {
    margin-bottom: 6px;
}

.form.default .field .field-element input[type="text"]:placeholder-shown + label,
.form.default .field .field-element textarea:placeholder-shown + label,
.form.default .field .field-element input[type="number"]:placeholder-shown + label,
.form.default .field .field-element input[type="password"]:placeholder-shown + label,
form.default .field .field-element input[type="text"]:placeholder-shown + label,
form.default .field .field-element textarea:placeholder-shown + label,
form.default .field .field-element input[type="number"]:placeholder-shown + label,
form.default .field .field-element input[type="password"]:placeholder-shown + label {
    opacity: 0;
    transform: translateY(100%);
}


.form.default .field .field-element textarea,
form.default .field .field-element textarea,
.form.default .field .field-element input[type="text"],
.form.default .field .field-element input[type="number"],
.form.default .field .field-element input[type="password"],
form.default .field .field-element input[type="text"],
form.default .field .field-element input[type="number"],
form.default .field .field-element input[type="password"] {
    border-radius: 6px;
    border-style: solid;
    border-width: 1px;
    border-color: rgb(240, 238, 235);
    padding: 1rem;
    padding-top: 1.2rem;
    width: 100%;
}


.form.default .field .field-element select,
form.default .field .field-element select {
    border-radius: 6px;
    border-style: solid;
    border-width: 1px;
    background-color: #fff;
    border-color: rgb(240, 238, 235);
    padding: 1rem;
    width: 100%;
}


form.default .field .field-element textarea,
.form.default .field .field-element textarea {
    min-height: 100px;

}

.form.default .field .field-element input[type="text"]:focus,
.form.default .field .field-element textarea:focus,
.form.default .field .field-element input[type="number"]:focus,
.form.default .field .field-element input[type="password"]:focus,
form.default .field .field-element input[type="text"]:focus,
form.default .field .field-element textarea:focus,
form.default .field .field-element input[type="number"]:focus,
form.default .field .field-element input[type="password"]:focus {
    outline: 0;
    border: solid 1px rgb(var(--color-primary-500));
}


.form.default .field .field-element input[type="text"] + label,
.form.default .field .field-element textarea + label,
.form.default .field .field-element input[type="number"] + label,
.form.default .field .field-element input[type="password"] + label,
form.default .field .field-element input[type="text"] + label,
form.default .field .field-element textarea + label,
form.default .field .field-element input[type="number"] + label,
form.default .field .field-element input[type="password"] + label {
    position: absolute;
    font-size: 0.8rem;
    top: -1.2rem;
    left: 0;
    transition: all 0.1s;
    opacity: 0.5;
    transform: translateY(calc(50% + 0.8rem));
    line-height: 100%;
    padding: 0.1rem 1rem;
}

.form.default .field .field-element.field-element2 {
    display: flex;
    justify-content: space-between;
    align-items: center;
}


.form.default .field .field-element.field-element3 {
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
}

.form.default .field .field-element.field-element3 > *,
.form.default .field .field-element.field-element2 > * {
    margin-right: 10px;

}

.form.default .field .field-element.field-element2 input[type="number"] {
    width: 60%;
}


.form.default .field .field-element .btn,
form.default .field .field-element .btn,
.form.default .field .field-element button,
form.default .field .field-element button,
.form.default .field .field-element input[type="submit"],
form.default .field .field-element input[type="submit"] {
    height: auto;
    display: block;
    text-align: center;
    color: #fff;
    border: none;
    line-height: 1.2;
    background: rgb(var(--color-primary-500));
    box-shadow: inset 0 0 0 1px rgb(var(--color-primary-500));
    cursor: pointer;
    text-decoration: none;
    font-size: 1rem;
    text-transform: uppercase;
    font-weight: 300;
    width: 100%;
    padding: 15px;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    color: rgb(var(--color-contrast-750));

}

.form.default button:hover,
.form.default input[type="submit"]:hover,
form.default button:hover,
form.default input[type="submit"]:hover {
    background-color: rgb(var(--color-primary-700));
}


/* - */

.form.default .field .field-element input[type="checkbox"],
form.default .field .field-element input[type="checkbox"]{
    display:none;
}
.form.default .field .field-element input[type="checkbox"] + label,
form.default .field .field-element input[type="checkbox"] + label{
    line-height: 2rem;
    cursor: pointer;
    position: relative;
    padding-left: 4rem;
}
.form.default .field .field-element input[type="checkbox"] + label:before,
form.default .field .field-element input[type="checkbox"] + label:before{
    content: '';
    display: block;
    width: 3rem;
    height: 1.5rem;
    color: rgb(var(--color-contrast-750));
    border: solid 1px;
    position: absolute;
    top: 0.1rem;
    left: 0px;
    border-radius: 1rem;
}


.form.default .field .field-element input[type="checkbox"] + label:after,
form.default .field .field-element input[type="checkbox"] + label:after{
    content: '';
    display: block;
    width: 1rem;
    height: 1rem;
    background-color: rgb(var(--color-contrast-750));
    position: absolute;
    top: 0.37rem;
    left: 0.3rem;
    border-radius: 0.5rem;
}
.form.default .field .field-element input[type="checkbox"]:checked + label:before,
form.default .field .field-element input[type="checkbox"]:checked + label:before{
    background-color: #333;

}

.form.default .field .field-element input[type="checkbox"]:checked + label:after,
form.default .field .field-element input[type="checkbox"]:checked + label:after{
    left: 1.8rem;
    background-color: #fff;
}


