body.letter-spacing {
    letter-spacing: 0.12em !important;
    word-spacing: 0.16em !important;
}

body.letter-spacing button {
    transition: all 0.2s;
    letter-spacing: 0.12em !important;
    word-spacing: 0.16em !important;
}

body.full-width .l-container {
    width: calc(100% - 100px);
    max-width: calc(100% - 100px);
}

/*
================================================== !!! ==================================================
	FONT SIZE
================================================== !!! ==================================================
*/

html[data-font-size="1"] {
    font-size: 90%;
}

html[data-font-size="2"] {
    font-size: 95%;
}

html[data-font-size="4"] {
    font-size: 105%;
}

html[data-font-size="5"] {
    font-size: 110%;
}

/*
================================================== !!! ==================================================
	TEXT VERSION
================================================== !!! ==================================================
*/

.text-version, .text-version * {
    background: white !important;
    color: #000000 !important;
}

.text-version .l-header-top {
    background: white;
    border-bottom: 2px solid #000000;
}

.text-version .wcag__container {
    border-left: 2px solid #000000;
}

.text-version .button, .text-version .login-button, .text-version .tile {
    border: 2px solid #000000;
}

.text-version .button:hover, .text-version .login-button:hover, .text-version .tile:hover {
    text-decoration: underline;
}

.text-version .menu-top__link:hover, .text-version .news__content a:hover {
    text-decoration: none;
    border-color: #000000;
}

.text-version .l-bottom-bar {
    border-top: 2px solid #000000;
}

.text-version .tile__title {
    background: transparent !important;
}

.text-version .login-button__separator {
    background: #000000 !important;
}

.text-version .wcag__list-button:hover {
    text-decoration: underline;
}

.text-version .login-button__separator,
.text-version .login-button__img,
.text-version .tile__icon {
    display: none;
}

.text-version .tile {
    justify-content: center;
    align-items: center;
}

.text-version .tile__title {
    text-align: center !important;
    align-self: center !important;
    padding: 0 20px !important;
}

.text-version .center-tile {
    border: 2px solid #000000;
}

.text-version .center-tile__inner {
    background: transparent !important;
}

.text-version .section__img, .text-version .section__img--left, .text-version .news__img-container, .text-version .single-news__img-container, .text-version .logo__img, .text-version .eu-project__img, .text-version .eu-project-bottom__img-container {
    display: none;
}

.text-version .eu-project-bottom__text {
    margin-left: 0;
    padding-left: 0;
    border-left: 0;
}

.text-version #content-help img {
    display: none !important;
}

/*
================================================== !!! ==================================================
	CONTRAST BLACK-WHITE
================================================== !!! ==================================================
*/

.contrast-bw, .contrast-bw * {
    background: #000000 !important;
    color: #ffffff !important;
}

.contrast-bw .l-header-top {
    background: #000000;
    border-bottom: 2px solid #ffffff;
}

.contrast-bw .wcag__container {
    border-left: 2px solid #ffffff;
}

.contrast-bw .button, .contrast-bw .login-button, .contrast-bw .tile {
    border: 2px solid #ffffff;
}

.contrast-bw .button:hover, .contrast-bw .login-button:hover, .contrast-bw .tile:hover {
    text-decoration: underline;
}

.contrast-bw .menu-top__link:hover, .contrast-bw .news__content a:hover {
    text-decoration: none;
    border-color: #ffffff;
}

.contrast-bw .l-bottom-bar {
    border-top: 2px solid #ffffff;
}

.contrast-bw .tile__title {
    background: transparent !important;
}

.contrast-bw .login-button__separator {
    background: #ffffff !important;
}

.contrast-bw .wcag__list-button:hover {
    text-decoration: underline;
}

/*
================================================== !!! ==================================================
	CONTRAST BLACK-YELLOW
================================================== !!! ==================================================
*/

.contrast-by, .contrast-by * {
    background: #000000 !important;
    color: yellow !important;
}

.contrast-by .l-header-top {
    background: #000000;
    border-bottom: 2px solid yellow;
}

.contrast-by .wcag__container {
    border-left: 2px solid yellow;
}

.contrast-by .button, .contrast-by .login-button, .contrast-by .tile {
    border: 2px solid yellow;
}

.contrast-by .button:hover, .contrast-by .login-button:hover, .contrast-by .tile:hover {
    text-decoration: underline;
}

.contrast-by .menu-top__link:hover, .contrast-by .news__content a:hover {
    text-decoration: none;
    border-color: yellow;
}

.contrast-by .l-bottom-bar {
    border-top: 2px solid yellow;
}

.contrast-by .tile__title {
    background: transparent !important;
}

.contrast-by .login-button__separator {
    background: yellow !important;
}

.contrast-by .wcag__list-button:hover {
    text-decoration: underline;
}

/*
================================================== !!! ==================================================
	CONTRAST YELLOW-BLACK
================================================== !!! ==================================================
*/

.contrast-yb, .contrast-yb * {
    background: yellow !important;
    color: black !important;
}

.contrast-yb .l-header-top {
    background: yellow;
    border-bottom: 2px solid black;
}

.contrast-yb .wcag__container {
    border-left: 2px solid black;
}

.contrast-yb .button, .contrast-yb .login-button, .contrast-yb .tile {
    border: 2px solid black;
}

.contrast-yb .button:hover, .contrast-yb .login-button:hover, .contrast-yb .tile:hover {
    text-decoration: underline;
}

.contrast-yb .menu-top__link:hover, .contrast-yb .news__content a:hover {
    text-decoration: none;
    border-color: black;
}

.contrast-yb .l-bottom-bar {
    border-top: 2px solid black;
}

.contrast-yb .tile__title {
    background: transparent !important;
}

.contrast-yb .login-button__separator {
    background: black !important;
}

.contrast-yb .wcag__list-button:hover {
    text-decoration: underline;
}

.contrast-yb .center-tile {
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}

.contrast-yb .login-button__separator,
.contrast-yb .login-button__img,
.contrast-yb .tile__icon {
    display: none;
}