:root {
    --main-coral-color    : #4d8ada;
    --main-purple-color   : #E7CA90;
    --main-darkblue-color : #131626;
}

* {
    font-family : 'Avenir Next', sans-serif;
    font-weight : normal;
}

pre {
    background    : #eee;
    border-radius : 6px;
    padding       : 20px;
}

body {
    background : #000;
    color      : #fff;
}

body.open {
    overflow : hidden;
}

::-webkit-scrollbar {
    width  : 15px;
    height : 15px;
}

::-webkit-scrollbar-thumb {
    border-radius : 0;
    background    : var(--main-purple-color);
}

ul {
    margin       : 0;
    padding-left : 0;
}

img {
    max-width : 100%;
}

#wrap {
    min-height : calc(100vh - 297px);
}

/**
 * Text format
 */

h1 {
}

h2 {
    font-size : 34px;
}

h3 {
}

h4 {
    font-size : 18px;
}

h5 {
}

h6 {
    font-size : 14px;
}

#wrapper {
    min-height : 100vh;
    overflow   : hidden;
}

/*SEO: FORCE "ONE H1 PER PAGE" SIZE FIX*/
.h2-size {
    font-size : 34px;
}

.h4-size {
    font-size : 18px;
}

p, a, div {
    font-size   : 16px;
    line-height : 1.7;
}

p.small {
    font-size : 14px;
}

p a {
    font-weight     : 500;
    text-decoration : underline;
    color           : var(--main-purple-color);
}

a {
    color       : inherit;
    font-weight : 500;
}

a:hover {
    color           : var(--main-purple-color);
    text-decoration : none;
}

strong, .bold, strong span {
    font-family : 'Avenir Next', sans-serif;
    font-weight : bold;
}

.txt-coral {
    background    : var(--main-coral-color);
    border-radius : 5px;
    padding       : 3px 6px 0 6px;
    color         : #000;
    line-height   : 1.6;
}

.txt-purple {
    background    : var(--main-purple-color);
    border-radius : 5px;
    padding       : 3px 6px 0 6px;
    color         : #fff;
    line-height   : 1.6;
}

.cursor-pointer {
    cursor : pointer;
}

.txt-black {
    background    : black;
    border-radius : 5px;
    padding       : 3px 6px 0 6px;
    color         : #fff;
    line-height   : 1.6;
}

.border-bottom {
    width         : 100%;
    height        : 1px;
    border-bottom : 1px solid #999999;
    background    : transparent;
}

/**
 * Color definitions
 */
.text-coral {
    color : var(--main-coral-color) !important;
}

.text-purple {
    color : var(--main-purple-color) !important;
}

.text-blue {
    color : var(--main-darkblue-color) !important;
}

.text-white {
    color : #fff;
}

.text-black {
    color : #000;
}

.bg-white {
    background-color : white;
}

.bg-blue {
    background : var(--main-darkblue-color) !important;
}

.bg-lightblue {
    background : #2B2D43;
}

.bg-white {
    background : #fff3cd;
}

.bg-white-full {
    background : #fff;
}

.bg-grey {
    background : #ebedf5;
}

/*.bw, .bw img {filter:grayscale(100%);}*/

.partners img {
    max-height     : 90px;
    max-width      : 200px;
    vertical-align : middle;
}

.hover-purple:hover {
    color : var(--main-purple-color) !important;
}

.invert {
    filter : invert(100%) contrast(100%) grayscale(100%);
}

/**
 * Bg definitions
 */
.bg-parkl1 {
    background            : url(../images/bg-parkl1.png) no-repeat;
    background-size       : cover;
    background-attachment : fixed;
}

.bg-parkl2 {
    background            : url(../images/bg-parkl3.png) no-repeat;
    background-size       : cover;
    background-attachment : fixed;
}

.bg-parkl3 {
    background            : url(../images/bg-parkl2.png) no-repeat;
    background-size       : cover;
    background-attachment : fixed;
}

.bg-parkl4 {
    background            : url(../images/bg-parkl4.svg) no-repeat;
    background-size       : cover;
    background-position-y : center;
}

.bg-parkl5 {
    background            : url(../images/bg-parkl5.png) no-repeat;
    background-size       : cover;
    background-position   : center;
    background-attachment : fixed;
}

.bg-parkl6 {
    background          : url(../images/bg-parkl6.png) no-repeat;
    background-size     : cover;
    background-position : center;
}

.bg-parkl7 {
    background          : url(../images/bg-parkl7.png) no-repeat;
    background-size     : cover;
    background-position : center;
}

.bg-parkl8 {
    background          : url(../images/parkl8.png) no-repeat;
    background-size     : cover;
    background-position : center;
}

.bg-parkl8.fix {
    height        : 124px;
    position      : relative;
    border-radius : 5px;
    box-shadow    : 0 10px 10px rgba(0, 0, 0, 0.31);
}

.bg-parkl9 {
    width                 : 100%;
    margin-bottom         : -580px;
    background            : url(../images/bg-parkl8.png) no-repeat;
    background-size       : cover;
    background-position   : center;
    background-attachment : fixed;
}

.bg-parkl10 {
    background          : url(../images/karrier.jpg) no-repeat;
    background-size     : cover;
    background-position : center;
    height              : 510px;
}

.bg-parkl11 {
    background          : url(../images/bg-parkl11.png) no-repeat;
    background-size     : cover;
    background-position : center;
    height              : 630px;
}

.bg-parkl12 {
    background          : url(../images/bg-parkl12.jpg) no-repeat;
    background-size     : cover;
    background-position : center;
    height              : 630px;
}

.bg-parkl13 {
    background          : url(../images/bg-parkl13.png) no-repeat;
    background-size     : cover;
    background-position : center;
    height              : 630px;
}

.bg-parkl14 {
    background          : url(../images/bg-parkl14.jpg) no-repeat;
    background-size     : cover;
    background-position : center;
    height              : 630px;
}

.bg-parkl15 {
    background          : url(../images/bg-parkl15.png) no-repeat;
    background-size     : cover;
    background-position : center;
    height              : 630px;
}

.bg-parkl16 {
    background          : url(../images/bg-parkl16.png) no-repeat;
    background-size     : cover;
    background-position : center;
    height              : 630px;
}

.bg-parkl17 {
    background          : url(../images/bg-parkl17.jpg) no-repeat;
    background-size     : cover;
    background-position : center;
}

.bg-parkl18 {
    background          : url(../images/bg-parkl18.jpg) no-repeat;
    background-size     : cover;
    background-position : center;
}

.bg-parkl19 {
    background          : url(../images/irodahaz.jpg) no-repeat;
    background-size     : cover;
    background-position : center;
    height              : 630px;
}

.bg-parkl20 {
    background          : url(../images/bg-parkl20.jpg) no-repeat;
    background-size     : cover;
    background-position : center;
    height              : 630px;
}

/**
 * Hero text
 */
.text-at-hero {
    padding-right : 50px;
}

.contact-image {
    height        : calc(100% + 120px);
    position      : relative;
    top           : 0;
    border-radius : 10px;
    transform     : scale(1.1);
    box-shadow    : 0 15px 20px rgba(0, 0, 0, 0.2);
}

/**
 * Image holder
 */
.image--holder img {
    max-width : 100%;
}

/**
 * Chevron
 */
.chevron.purple:before {
    content             : '';
    background          : url(../images/icon-arrow.svg) no-repeat;
    width               : 20px;
    height              : 20px;
    background-size     : contain;
    background-position : center;
    display             : inline-block;
    top                 : 0;
    left                : 0;
    position            : absolute;
    transform           : rotate(0deg);
}

/**
 * Buttons
 */
.button {
    border     : none;
    cursor     : pointer;
    text-align : center;
}

.button:focus {
    outline : none;
}

.button.button-white-purple {
    background    : var(--main-purple-color) !important;
    color         : #fff;
    padding       : 10px 40px 9px 40px;
    border-radius : 25px;
    font-weight   : bold;
    transition    : 0.2s;
    border        : 1px solid var(--main-purple-color);
}

.button.button-white-purple:hover {
    background    : var(--main-darkblue-color) !important;
    color         : var(--main-purple-color);
    border-radius : 25px;
    font-weight   : bold;
    transition    : 0.2s;
    border        : 1px solid var(--main-darkblue-color);
}

.button.button-purple {
    background    : var(--main-purple-color) !important;
    color         : #fff;
    padding       : 10px 40px 9px 40px;
    border-radius : 25px;
    font-weight   : bold;
    transition    : 0.2s;
    border        : 1px solid var(--main-purple-color);
}

.button.button-purple:hover {
    background    : #fff !important;
    color         : var(--main-purple-color);
    border-radius : 25px;
    font-weight   : bold;
    transition    : 0.2s;
    border        : 1px solid var(--main-purple-color);
}

.button.button-white {
    background    : #fff !important;
    color         : #000;
    padding       : 10px 40px 9px 40px;
    border-radius : 25px;
    font-weight   : bold;
    transition    : 0.2s;
    border        : 1px solid #000;
}

.button.button-white:hover {
    background    : #000 !important;
    color         : #fff;
    border-radius : 25px;
    font-weight   : bold;
    transition    : 0.2s;
    border        : 1px solid #000;
}

.button.button-blue {
    background    : var(--main-darkblue-color) !important;
    color         : var(--main-coral-color) !important;
    padding       : 10px 40px 9px 40px;
    border-radius : 25px;
    font-weight   : bold;
    transition    : 0.2s;
    border        : 1px solid #000;
}

.button.button-blue:hover {
    background    : var(--main-coral-color) !important;
    color         : var(--main-darkblue-color) !important;
    border-radius : 25px;
    font-weight   : bold;
    transition    : 0.2s;
    border        : 1px solid #000;
}

.button.button-coral {
    background    : var(--main-coral-color) !important;
    color         : var(--main-darkblue-color) !important;
    padding       : 10px 40px 9px 40px;
    border-radius : 25px;
    font-weight   : bold;
    transition    : 0.2s;
}

.button.button-coral:hover {
    background    : var(--main-darkblue-color) !important;
    color         : var(--main-coral-color) !important;;
    border-radius : 25px;
    font-weight   : bold;
    transition    : 0.2s;
}

.button.button-underline {
    position    : relative;
    font-weight : bold;
}

.button.button-underline:after {
    content    : '';
    width      : 105%;
    height     : 2px;
    background : #fff;
    transition : 0.2s;
    bottom     : 0;
    left       : 0;
    display    : inline-block;
    position   : absolute;
}

.button.button-underline:hover:after {
    content    : '';
    width      : 120%;
    height     : 2px;
    background : #fff;
    transition : 0.2s;
    bottom     : 0;
    left       : 0;
    display    : inline-block;
    position   : absolute;
}

.button-image:hover {
    opacity : 0.9;
}

.download-store {
    max-height : 50px;
    max-width  : 47%;
}

.hover.top {
    position   : relative;
    top        : 0;
    transition : 0.2s;
}

.hover.top:hover {
    position   : relative;
    top        : 5px;
    transition : 0.2s;
}

.to-bottom {
    position : absolute;
    bottom   : 10px;
}

/**
 * News
 */
.bg-sav {
    position : absolute;
    top      : 30px;
    height   : calc(100% - 60px);
    width    : 100%;
}

.news--box {
    border-radius : 5px;
    background    : #fff;
    height        : 100%;
    overflow      : hidden;
    box-shadow    : 0 15px 20px rgba(0, 0, 0, 0.2);
}

.news--box img {
    width      : 100%;
    height     : 240px;
    object-fit : cover;
}

.news--box .text--holder {
    padding : 35px 25px;
}

/**
 * UL
 */
ul.ul-coral li {
    list-style   : none;
    position     : relative;
    padding-left : 20px;
}

ul.ul-coral li:before {
    content       : '';
    width         : 5px;
    height        : 5px;
    border-radius : 50%;
    background    : var(--main-coral-color);
    display       : inline-block;
    position      : absolute;
    top           : 12px;
    left          : 5px;
}

ul.ul-purple li {
    list-style   : none;
    position     : relative;
    padding-left : 20px;
}

ul.ul-purple li:before {
    content       : '';
    width         : 5px;
    height        : 5px;
    border-radius : 50%;
    background    : var(--main-purple-color);
    display       : inline-block;
    position      : absolute;
    top           : 12px;
    left          : 5px;
}

ul.ul-black li {
    list-style   : none;
    position     : relative;
    padding-left : 20px;
}

ul.ul-black li:before {
    content       : '';
    width         : 5px;
    height        : 5px;
    border-radius : 50%;
    background    : #000;
    display       : inline-block;
    position      : absolute;
    top           : 12px;
    left          : 5px;
}

/**
 * Fader
 */
.video-fader {
    position   : absolute;
    z-index    : 1;
    top        : 0;
    left       : 0;
    width      : 100%;
    height     : 100%;
    background : linear-gradient(0deg, rgba(23, 26, 46, 0.4), rgba(23, 26, 46, 0.4));
}

.video-verlauf {
    position   : absolute;
    z-index    : 2;
    bottom     : 0;
    left       : 0;
    width      : 100%;
    height     : 100%;
    background : linear-gradient(0deg, rgba(43, 45, 67, 1) 15%, rgba(43, 45, 67, 0) 37%);
}

.video-verlauf2 {
    position   : absolute;
    z-index    : 2;
    bottom     : 0;
    left       : 0;
    width      : 100%;
    height     : 100%;
    background : linear-gradient(0deg, rgba(43, 45, 67, 1) 0%, rgba(43, 45, 67, 0) 37%);
}

.video-verlauf3 {
    position   : absolute;
    z-index    : 2;
    bottom     : 0;
    left       : 0;
    width      : 100%;
    height     : 100%;
    background : linear-gradient(0deg, rgba(43, 45, 67, 1) 0%, rgba(43, 45, 67, 0) 37%);
    opacity    : 0.2;
}

/**
 * Navigation
 */
#def-header {
    position   : relative;
    height     : 120px;
    z-index    : 10;
    transition : 0.2s;
}

/* color variations */
.part #navigation li a:after {
    background : #fff;
}

/*.part #navigation li:nth-child(3) a:after {*/
/*height : 0;*/
/*}*/

.part #navigation li:nth-child(4) a:after {
    content    : '';
    width      : 100%;
    height     : 1px;
    bottom     : -5px;
    left       : 0;
    background : #fff;
    display    : inline-block;
    position   : absolute;
    transition : 0.2s;
}


/**
 * Mobile
 */
#mobile-backdrop {
    position   : fixed;
    top        : 0;
    left       : 0;
    width      : 100vw;
    height     : 100%;
    z-index    : -1000;
    background : rgba(19, 22, 38, 0.98);
    opacity    : 0;
}

#mobile-backdrop.open {
    z-index    : 100000;
    opacity    : 1;
    transition : 0.2s;
}

#mobile {
    position   : absolute;
    top        : 0;
    left       : 0;
    right      : 0;
    z-index    : -1000;
    text-align : center;
    height     : 100%;
    overflow-y : auto;
    width      : 100%;
    overflow-x : hidden;
    transition : 0.2s;
    opacity    : 0;
}

#mobile.open {
    z-index    : 100001;
    opacity    : 1;
    transition : 0.2s;
}

#mobile ul {
    padding : 0;
    margin  : 0;
}

#mobile ul li {
    display : block;
}

#mobile ul li a {
    font-size : 28px;
}

#navigation div.bordered {
    position : relative;
}

#navigation div.bordered:after {
    content    : '';
    display    : inline-block;
    position   : relative;
    bottom     : 10px;
    height     : 1px;
    left       : -50px;
    background : #fff;
    width      : calc(100% + 100px);
}

#mobile #close {
    background      : url(../images/close.png) no-repeat;
    width           : 30px;
    height          : 30px;
    background-size : cover;
    display         : inline-block;
    position        : absolute;
    top             : 45px;
    right           : 7%;
    border          : none;
    z-index         : 1000;
}

#mobilemenu {
    cursor : pointer;
}

/**
 * Form
 */
form {
}

form textarea {
    border        : none;
    border-bottom : 2px solid #000000;
    border-radius : 5px;
    background    : white;
    min-height    : 180px;
}

form label, form label a {
    padding-top : 3px;
}

form.white {
}

form.white input[type="text"], form.white input[type="email"], form.white input[type="tel"], form.white input[type="password"] {
    border        : none;
    border-bottom : 2px solid #000000;
    border-radius : 0;
    background    : transparent;
}

form.white input:focus {
    outline    : none;
    box-shadow : none;
}

form.white label, form.white label a {
    font-size : 16px;
}

form.white .checkbox input {
    display : none;
}

form.white .checkbox label:before {
    content  : '';
    width    : 14px;
    height   : 14px;
    display  : inline-block;
    outline  : 2px solid #000000;
    border   : 0 solid #000;
    position : absolute;
    top      : 9px;
    left     : 0;
}

form.white .checkbox input:checked + label:before {
    content    : '';
    width      : 14px;
    height     : 14px;
    display    : inline-block;
    border     : 2px solid #fff;
    outline    : 2px solid #000000;
    position   : absolute;
    top        : 9px;
    left       : 0;
    background : var(--main-purple-color);
}

form.white input:focus {
    border-color : var(--main-purple-color);
    color        : var(--main-purple-color);
}

form.white .nice-select {
    -webkit-tap-highlight-color : transparent;
    background-color            : transparent;
    color                       : var(--main-darkblue-color);
    border-radius               : 0;
    border                      : none;
    border-bottom               : 2px solid var(--main-darkblue-color);
    height                      : 39px;
}

/* --------------- */
form.purple input[type="text"], form.purple input[type="email"], form.purple input[type="tel"], form.purple input[type="password"] {
    border        : none;
    border-bottom : 2px solid #fff;
    border-radius : 0;
    background    : transparent;
}

form.purple input:focus {
    outline    : none;
    box-shadow : none;
}

form.purple input:focus {
    border-color : var(--main-purple-color);
    color        : var(--main-purple-color);
}

form.purple label, form.purple.purple label a {
    font-size : 16px;
    color     : #fff;
}

form.purple .checkbox input {
    display : none;
}

form.purple .checkbox label:before {
    content  : '';
    width    : 14px;
    height   : 14px;
    display  : inline-block;
    outline  : 2px solid #fff;
    border   : 0 solid #000;
    position : absolute;
    top      : 9px;
    left     : 0;
}

form.purple .checkbox input:checked + label:before {
    content    : '';
    width      : 14px;
    height     : 14px;
    display    : inline-block;
    border     : 2px solid var(--main-darkblue-color);
    outline    : 2px solid #fff;
    position   : absolute;
    top        : 9px;
    left       : 0;
    background : var(--main-purple-color);
}

/* --------------- */
form.dark {
}

form.dark input[type="text"], form.dark input[type="email"], form.dark input[type="tel"], form.dark input[type="password"] {
    border        : none;
    border-bottom : 2px solid white;
    border-radius : 0;
    background    : transparent;
    color         : #fff;
}

form.dark .nice-select {
    color         : white;
    border-bottom : 2px solid white;
}

form.dark .checkbox label, form.dark .checkbox label a {
    font-size : 16px;
    color     : white;
}

form.dark .checkbox label:before {
    content  : '';
    width    : 14px;
    height   : 14px;
    display  : inline-block;
    outline  : 2px solid #7443ed !important;
    border   : 0 solid #e5e5e5;
    position : absolute;
    top      : 9px;
    left     : 0;
}

form.dark input:focus {
    outline    : none;
    box-shadow : none;
}

form.dark input:focus {
    border-color : var(--main-purple-color);
    color        : var(--main-purple-color);
}

form.dark .checkbox input {
    display : none;
}

form.dark .checkbox input:checked + label:before {
    content    : '';
    width      : 14px;
    height     : 14px;
    display    : inline-block;
    border     : 2px solid var(--main-darkblue-color);
    outline    : 2px solid #7443ed;
    position   : absolute;
    top        : 9px;
    left       : 0;
    background : var(--main-purple-color);
}

.nice-select {
    -webkit-tap-highlight-color : transparent;
    background-color            : transparent;
    color                       : #fff;
    border-radius               : 0;
    border                      : none;
    border-bottom               : 2px solid #fff;
    height                      : 39px;
}

.nice-select ul li {
    color : var(--main-purple-color);
}

.nice-select ul {
    background : red;
}

.nice-select:after {
    width  : 10px;
    height : 10px;
}

/* --------------- */

form.checkbox.map input {
    display : none;
}

form.checkbox label {
    width        : 100% !important;
    padding-left : 0 !important;
    margin       : 0 !important;
}

form.checkbox label:before {
    content    : '';
    background : url(/assets/images/icon-off.svg) no-repeat;
    width      : 40px;
    height     : 20px;
    display    : inline-block;
    position   : absolute;
    top        : 9px;
    right      : 0;
    transition : 0.1s;
}

form.checkbox input:checked + label:before {
    content    : '';
    width      : 40px;
    height     : 20px;
    display    : inline-block;
    background : url(/assets/images/icon-on.svg) no-repeat;
    position   : absolute;
    top        : 9px;
    right      : 0;
    transition : 0.1s;
}

form .message {
    min-height       : 300px;
    border-radius    : 5px;
    border           : 0;
    background-color : #fff;
    padding          : 10px;
    color            : var(--main-purple-color);
}

/* --------------- */

.slider {
    width : 100%;
}

.slider input[type='range'] {
    -webkit-appearance : none;
    appearance         : none;
    width              : 100%;
    height             : 1px;
    background         : var(--main-darkblue-color);
    outline            : none;
    opacity            : 0.7;
    -webkit-transition : .2s;
    transition         : opacity .2s;
}

.slider input[type='range']::-webkit-slider-thumb {
    -webkit-appearance : none;
    appearance         : none;
    width              : 16px;
    height             : 16px;
    background         : var(--main-purple-color);
    cursor             : pointer;
    border-radius      : 50%;
}

.slider input[type='range']::-moz-range-thumb {
    width      : 16px;
    height     : 16px;
    background : #4CAF50;
    cursor     : pointer;
}

.slide--bg {
    background    : #fff;
    box-shadow    : 0 15px 10px rgba(0, 0, 0, 0.2);
    border-radius : 5px;
    cursor        : grab !important;
}

.slide--bg:active {
    cursor : grabbing !important;
}

/**
 * Promo box
 */
.promo-box {
}

.promo-box .promo-item {
    margin       : 15px 0 15px 0;
    position     : relative;
    padding-left : 30px;
    cursor       : pointer;
}

.promo-box .promo-item p {
    height      : 0%;
    overflow    : hidden;
    line-height : 23px;
    transition  : 0.2s;
}

.promo-box .promo-item:before {
    content             : '';
    background          : url("../images/icon-arrow.svg") no-repeat;
    width               : 20px;
    height              : 20px;
    background-size     : contain;
    background-position : center;
    display             : inline-block;
    top                 : 0;
    left                : 0;
    position            : absolute;
    transform           : rotate(90deg);
}

.promo-box.coral .promo-item:before {
    content             : '';
    background          : url("../images/icon-arrow-purple.svg") no-repeat;
    width               : 20px;
    height              : 20px;
    background-size     : contain;
    background-position : center;
    display             : inline-block;
    top                 : 0;
    left                : 0;
    position            : absolute;
    transform           : rotate(90deg);
}

.promo-box .promo-item.open:before {
    transform : rotate(0deg);
}

.promo-box .promo-item h4 {
    color : black;
}

.promo-box .promo-item.open h4 {
    color : var(--main-purple-color);
}

.promo-box .promo-item.open p {
    height     : 100%;
    overflow   : hidden;
    transition : 0.2s;
}

.promo-image {
    position : relative;
    width    : 100%;
    height   : 640px;
    overflow : hidden;
}

.promo-image .promo-item {
    position   : absolute;
    top        : 0;
    left       : 0;
    right      : 0;
    margin     : 0 auto;
    opacity    : 0;
    transition : 0.3s;
    transform  : scale(0.9);
}

.promo-image .promo-item.open {
    opacity    : 1;
    transition : 0.3s;
    transform  : scale(1);
}

.promo-image .promo-item img {
    width : 311px;
}

.hero-img-promo .promo-item img {
    position      : relative;
    top           : 0;
    object-fit    : cover;
    transform     : scale(0.9);
    height        : 440px;
    width         : 440px;
    border-radius : 10px;
    box-shadow    : 0 10px 10px rgba(0, 0, 0, 0.3);
}

.hero-img-promo-elektromos .promo-item img {
    margin-top : 140px;
    transform  : scale(1.2);
}

.hero-img img {
    position      : relative;
    object-fit    : cover;
    margin-top    : -19px;
    height        : 490px;
    width         : 440px;
    border-radius : 10px;
    box-shadow    : 0 10px 10px rgba(0, 0, 0, 0.3);
}


/**
 * Modal
 */
.custom-parkl .tingle-modal-box {
    width : inherit;
}

.custom-parkl iframe {
    max-width : 100%;
}

.custom-parkl .tingle-modal-box__content {
    padding : 15px;
}

/**
 * Dynamic modal
 */

.dynamic-modal {
    display : none;
}

.dynamic-modal.active {
    display : block;
}

.dynamic-modal img {
    width  : 100%;
    height : auto;
}

.dynamic-modal {
    position : fixed;
    top      : 0;
    left     : 0;
    width    : 100vw;
    height   : 100vh;
    z-index  : 10000000;
}

.dynamic-modal .modal-fader {
    background : rgba(0, 0, 0, 0.8);
    width      : 100%;
    height     : 100%;
    position   : absolute;
}

.dynamic-modal .modal-kontent {
    position      : absolute;
    z-index       : 10;
    left          : 0;
    right         : 0;
    max-width     : 350px;
    margin        : 0 auto;
    background    : #fff;
    top           : 50px;
    border-radius : 5px;
    overflow      : hidden;
}

/**
 * Answer box
 */
.answer-box {
}

.answer-box .answer-item {
    cursor        : pointer;
    margin-bottom : 10px;
}

.answer-box .answer-item h4 {
    padding        : 10px;
    border         : 1px solid var(--main-darkblue-color);
    border-radius  : 5px;
    text-transform : none;
    color          : var(--main-darkblue-color);
    position       : relative;
}

.answer-box .answer-item h4:after {
    content             : '';
    background          : url("../images/icon-plus.svg") no-repeat;
    width               : 20px;
    height              : 20px;
    background-size     : contain;
    background-position : center;
    display             : inline-block;
    top                 : 12px;
    right               : 10px;
    right               : 10px;
    position            : absolute;
}

.answer-item p, .answer-item div {
    overflow   : hidden;
    transition : 0.2s;
}

.answer-box .answer-item img {
    max-width : 50px;
}

.answer-box .answer-item p, .answer-item div, .answer-box .answer-item div {
    padding : 0 10px;
    color   : var(--main-darkblue-color);
}

.answer-box .answer-item.open {
    background    : #fff;
    border-radius : 5px;
    box-shadow    : 0 5px 10px rgba(0, 0, 0, 0.2);
    transition    : 0.2s;
}

.answer-box .answer-item h4 {
    padding-right : 34px;
}

.answer-box .answer-item.open h4 {
    border : none;
}

.answer-box .answer-item.open h4:after {
    content             : '';
    background          : url("../images/icon-minus.svg") no-repeat;
    width               : 20px;
    height              : 20px;
    background-size     : contain;
    background-position : center;
    display             : inline-block;
    top                 : 12px;
    right               : 10px;
    position            : absolute;
}

.answer-box .answer-item.open p, .answer-box .answer-item.open div {
    display : block;
}

/**
 * Footer
 */
footer .up {
    background : #171A2E;
    color      : #fff;
    text-align : center;
}

footer .gradient {
    background : rgb(20, 206, 201);
    background : linear-gradient(90deg, rgba(20, 206, 201, 1) 0%, rgba(92, 62, 176, 1) 100%); /*-webkit-animation-name:footerbg;!* Safari 4.0 - 8.0 *!*/
    /*-webkit-animation-duration:4s;!* Safari 4.0 - 8.0 *!*/
    /*animation-name:footerbg;*/
    /*animation-iteration-count:infinite;*/
    /*animation-direction:alternate;*/
    /*animation-duration:1s;*/
    width      : 100%;
    height     : 7px;
}

footer li {
    list-style-type : none;
    display         : inline-block;
    margin          : 5px 10px;
}

footer li a, footer p {
    font-size  : 12px;
    transition : 0.2s;
}

footer li a:hover {
    color      : var(--main-purple-color);
    transition : 0.2s;
}

footer .down {
    background : #E5E5E5;
    color      : var(--main-darkblue-color);
}

footer .down.bg-lightblue {
    background : var(--main-darkblue-color);
    color      : #fff;
}

footer .secondary-footer {
    opacity : 0.6;
}

/* Safari 4.0 - 8.0 */
@-webkit-keyframes footerbg {
    0% {
        background : linear-gradient(90deg, rgba(20, 206, 201, 1) 0%, rgba(92, 62, 176, 1) 100%);
    }
    50% {
        background : linear-gradient(90deg, rgba(92, 62, 176, 1) 0%, rgba(20, 206, 201, 1) 100%);
    }
    100% {
        background : linear-gradient(90deg, rgba(20, 206, 201, 1) 0%, rgba(92, 62, 176, 1) 100%);
    }
}

/* Standard syntax */
@keyframes footerbg {
    0% {
        background : linear-gradient(90deg, rgba(20, 206, 201, 1) 0%, rgba(92, 62, 176, 1) 100%);
    }
    50% {
        background : linear-gradient(90deg, rgba(92, 62, 176, 1) 0%, rgba(20, 206, 201, 1) 100%);
    }
    100% {
        background : linear-gradient(90deg, rgba(20, 206, 201, 1) 0%, rgba(92, 62, 176, 1) 100%);
    }
}

/**
 * Media q
 */

@media (max-width : 576px) {
    #mobile ul li a {
        font-size : 14px;
    }
}

@media (max-width : 768px) {
    .mobile-hero {
        text-align : center;
        position   : relative;
        top        : -30px;
    }

    .mobile-hero img {
        max-width     : 100%;
        border-radius : 5px;
    }

    .text-at-hero {
        padding-right : 0;
    }
}

@media (max-width : 992px) {
    h1 {
    }

    h2 {
        font-size : 28px;
    }

    h3 {
    }

    h4 {
    }

    h5 {
    }

    .news-box {
        margin-bottom : 25px;
    }

}

@media (max-width : 1200px) {
}
