.navElement{
    float:right;
    border-left: 1px solid var(--nav-bg-color-hover);
}

nav .navElement:first-child{
    border-right: 1px solid var(--nav-bg-color-hover);
}

.navElement--left{
    float:left;
    border-right: 1px solid var(--nav-bg-color-hover);
    border-left: 1px solid var(--nav-bg-color-hover);
}


.navElement__button{
    display: inline-block;
    font-weight: bold;
    padding: 8px 10px 11px 10px;
    cursor: pointer;
    line-height: 18px;
    color:var(--nav-color);
}

.navElement__button:hover{
    background:var(--nav-bg-color-hover);
}

.actionButton, .mainActionButton{
    display: inline-block;
    padding: 0.5em 1em;
}

.mainActionButton--big{
    border-radius: 0;
    display: inline-block;
    padding:0.85em 1.9em;
}

.actionButton{
    border:1px solid #ddd;
}

.actionButton:hover{
    background:#ddd;
}

.mainActionButton, .mainActionButton--big{
    background-color: var(--main-action-background-color);
    color: var(--main-action-color);
}

.mainActionButton:hover, .mainActionButton--big:hover{
    background-color: var(--main-action-background-color-hover);
    color:var(--main-action-color-hover);
}

.brad-1{
    border-radius:0.12em;
}

.brad-2{
    border-radius:0.25em;
}

.b-top{
    border-top: 1px solid #ddd;
}

.b-bottom{
    border-bottom: 1px solid #ddd;
}

.b-top--mainColor{
    border-top: 1px solid var(--main-color);
}

.b-bottom--mainColor{
    border-bottom: 1px solid var(--main-color);
}

.errorColor{
    color:var(--error);
}

.successColor{
    color:var(--success);
}

.metiImg_placeholder {
    background-color: #f6f6f6;
    background-size: cover;
    background-repeat: no-repeat;
    position: relative;
    overflow: hidden;
}

.metiImg_placeholder img {
    position: absolute;
    opacity: 0;
    top: 0;
    left: 0;
    width: 100%;
    transition: opacity 0.75s linear;
}

.metiImg_placeholder img.metiImg--loaded,
.metiImg_placeholder .lazyloading,
.metiImg_placeholder .lazyloaded,
.metiImg_placeholder .lazyload {
    opacity: 1;
}

.metiImg--small {
    filter: blur(25px);
    /* this is needed so Safari keeps sharp edges */
    transform: scale(1);
}

.fw-500{
    font-weight: 500 !important;
}

@media (min-width: 576px) {
    .w-sm-25{width:25%!important}
    .w-sm-50{width:50%!important}
    .w-sm-75{width:75%!important}
    .w-sm-100{width:100%!important}
    .w-sm-auto{width:auto!important}
    .h-sm-25{height:25%!important}
    .h-sm-50{height:50%!important}
    .h-sm-75{height:75%!important}
    .h-sm-100{height:100%!important}
    .h-sm-auto{height:auto!important}
    .mw-sm-100{max-width:100%!important}
    .mh-sm-100{max-height:100%!important}
    .min-sm-vw-100{min-width:100vw!important}
    .min-sm-vh-100{min-height:100vh!important}
    .vw-sm-100{width:100vw!important}
    .vh-sm-100{height:100vh!important}
}

@media (min-width: 768px) {
    .w-md-25{width:25%!important}
    .w-md-50{width:50%!important}
    .w-md-75{width:75%!important}
    .w-md-100{width:100%!important}
    .w-md-auto{width:auto!important}
    .h-md-25{height:25%!important}
    .h-md-50{height:50%!important}
    .h-md-75{height:75%!important}
    .h-md-100{height:100%!important}
    .h-md-auto{height:auto!important}
    .mw-md-100{max-width:100%!important}
    .mh-md-100{max-height:100%!important}
    .min-md-vw-100{min-width:100vw!important}
    .min-md-vh-100{min-height:100vh!important}
    .vw-md-100{width:100vw!important}
    .vh-md-100{height:100vh!important}
}

@media (min-width: 992px) {
    .w-lg-25{width:25%!important}
    .w-lg-50{width:50%!important}
    .w-lg-75{width:75%!important}
    .w-lg-100{width:100%!important}
    .w-lg-auto{width:auto!important}
    .h-lg-25{height:25%!important}
    .h-lg-50{height:50%!important}
    .h-lg-75{height:75%!important}
    .h-lg-100{height:100%!important}
    .h-lg-auto{height:auto!important}
    .mw-lg-100{max-width:100%!important}
    .mh-lg-100{max-height:100%!important}
    .min-lg-vw-100{min-width:100vw!important}
    .min-lg-vh-100{min-height:100vh!important}
    .vw-lg-100{width:100vw!important}
    .vh-lg-100{height:100vh!important}
}

@media (min-width: 1200px) {
    .w-xl-25{width:25%!important}
    .w-xl-50{width:50%!important}
    .w-xl-75{width:75%!important}
    .w-xl-100{width:100%!important}
    .w-xl-auto{width:auto!important}
    .h-xl-25{height:25%!important}
    .h-xl-50{height:50%!important}
    .h-xl-75{height:75%!important}
    .h-xl-100{height:100%!important}
    .h-xl-auto{height:auto!important}
    .mw-xl-100{max-width:100%!important}
    .mh-xl-100{max-height:100%!important}
    .min-xl-vw-100{min-width:100vw!important}
    .min-xl-vh-100{min-height:100vh!important}
    .vw-xl-100{width:100vw!important}
    .vh-xl-100{height:100vh!important}
}


.slick-prev,
.slick-next {
    position: absolute;
    z-index: 2;
    cursor: pointer;
}

.meti-slick-arrow {
    top: calc(50% - 2rem / 2);
    font-size: 2rem;
    color:white;
    text-shadow: 0px 0px 3px #000000c2;
}

.meti-slick-arrow.slick-prev {
    left: 1rem;
}

.meti-slick-arrow.slick-next {
    right: 1rem;
}

.rotate-90 {
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
}

.rotate-180 {
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
}

.rotate-270 {
    -moz-transform: rotate(270deg);
    -ms-transform: rotate(270deg);
    -o-transform: rotate(270deg);
    -webkit-transform: rotate(270deg);
    transform: rotate(270deg);
}

tr.collapse.in {
    display: table-row;
}