:root {

    --bg: #1E102A;
    --bg-focus: #E0F1FF;

    --border-grid: #E9E9E9;

    --text-grid: #4E4E4E;
    --text-grid-header: #5d5d5d;
    --text-link: #4E4E4E;
    --text-menu: #4E4E4E;
    --text-caption: #4E4E4E;

    --text-field-label: #4E4E4E;
    --text-field: #4E4E4E;
    --text-error: #FF5065;

    --main: #59A6EA;


    --text-input: #171717;
    --text-input-form-readonly: #272727;
    --text-input-readonly: #757477; /* #b4b2b7;*/
    --text-invalid: #FF3939;
    --text-label-invalid: #cf4c35;

    --focus: #4185fc; /*color: #3466f9; OLD ONE */
    --focus-trasparent: #4185fccc; /*color: #3466f9; OLD ONE */
}

body, body.x-body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Open Sans", Roboto, sans-serif;
    font-weight: 400;
    text-align: initial;
    text-rendering: optimizeLegibility;
}

body:not(.x-body) {
    font-size: 14px;
}

@media (max-width: 900px) {
    body:not(.x-body) {
        font-size: 12px;
    }
}

.i-frame-body-help {
    width: 70%;
    margin: 20px auto 0;
}

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

@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 500;
    src: local('Roboto Medium'), local('Roboto-Medium'), url(../fonts/Roboto-Medium.ttf) format('truetype');
}

@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 300;
    src: local('Roboto Light'), local('Roboto-Light'), url(../fonts/Roboto-Light.ttf) format('truetype');
}

@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 200;
    src: local('Roboto Thin'), local('Roboto-Thin'), url(../fonts/Roboto-Thin.ttf) format('truetype');
}

@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 600;
    src: local('Roboto Bold'), local('Roboto-Bold'), url(../fonts/Roboto-Bold.ttf) format('truetype');
}

/** OpenSans */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 300;
    src: local('Open Sans Light'), local('Open-Sans-Light'), url(../fonts/OpenSans-Light.woff) format('woff');
}

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

@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 500;
    src: local('Open Sans Bold'), local('Open-Sans-SemiBold'), url(../fonts/OpenSans-Semibold.woff) format('woff');
}

@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 600;
    src: local('Open Sans Bold'), local('Open-Sans-SemiBold'), url(../fonts/OpenSans-Semibold.woff) format('woff');
}

@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 700;
    src: local('Open Sans Bold'), local('Open-Sans-Bold'), url(../fonts/OpenSans-Bold.woff) format('woff');
}

@font-face {
    font-family: 'Open Sans';
    font-style: italic;
    font-weight: 300;
    src: local('Open Sans Light'), local('Open-Sans-Light-Italic'), url(../fonts/OpenSans-LightItalic.woff) format('woff');
}

@font-face {
    font-family: 'Open Sans';
    font-style: italic;
    font-weight: 400;
    src: local('Open Sans'), local('Open-Sans-Regular-Italic'), url(../fonts/OpenSans-Italic.woff) format('woff');
}

@font-face {
    font-family: 'Open Sans';
    font-style: italic;
    font-weight: 500;
    src: local('Open Sans Bold'), local('Open-Sans-SemiBold-Italic'), url(../fonts/OpenSans-SemiboldItalic.woff) format('woff');
}

@font-face {
    font-family: 'Open Sans';
    font-style: italic;
    font-weight: 600;
    src: local('Open Sans Bold'), local('Open-Sans-SemiBold-Italic'), url(../fonts/OpenSans-SemiboldItalic.woff) format('woff');
}

@font-face {
    font-family: 'Roboto';
    font-style: italic;
    font-weight: 700;
    src: local('Open Sans Bold'), local('Open-Sans-Bold-Italic'), url(../fonts/OpenSans-BoldItalic.woff) format('woff');
}