:root {

    /* Colors: */
    --unnamed-color-bfd568: #BFD568;
    --unnamed-color-7a7a7a: #7A7A7A;
    --unnamed-color-2cc0d6: #2CC0D6;
    --unnamed-color-ffffff: #FFFFFF;
    --unnamed-color-abdf79cc: #ABDF79CC;
    --unnamed-color-2ed1eacc: #2ED1EACC;
    --unnamed-color-2ed1ea: #2ED1EA;
    --unnamed-color-f8f8f8: #F8F8F8;
    --unnamed-color-c3db66: #C3DB66;
    --unnamed-color-57daee: #57DAEE;
    --unnamed-color-34cbe7: #34CBE7;
    --unnamed-color-bbe593: #BBE593;
    --color-head-and-text: #636363;
    --color-breadcrumbs: #656565;
    --color-gradient-start: #aad77e;
    --color-background: #F6F6F6;
    --color-blog: #656565;

    --color-blue-28D7ED: #28D7ED;
    --color-green-C3DB66: #C3DB66;
}

.cs-fc-blue-28D7ED {
    color: #28D7ED;
    color: var(--color-blue-28D7ED);
}

.cs-fc-green-C3DB66 {
    color: #C3DB66;
    color: var(--color-green-C3DB66);
}

/** jump points - just as a help:
    xs: until 768
    sm  until 992
    md  until 1200
    lg  until 1599
    big|xl  beginning @1600
 */

/* dummy containers from 100px height to 800px height */
.cs-dummy-height-100 {
    height: 100px;
    min-height: 100px;
}

.cs-dummy-height-200 {
    height: 200px;
    min-height: 200px;
}

.cs-dummy-height-300 {
    height: 300px;
    min-height: 300px;
}

.cs-dummy-height-400 {
    height: 400px;
    min-height: 400px;
}

.cs-dummy-height-500 {
    height: 500px;
    min-height: 500px;
}

.cs-dummy-height-600 {
    height: 600px;
    min-height: 600px;
}

.cs-dummy-height-700 {
    height: 700px;
    min-height: 700px;
}

.cs-dummy-height-800 {
    height: 800px;
    min-height: 800px;
}


.section_padding_top_160 > [class*="container"] {
    padding-top: 160px;
}

.section_padding_top_170 > [class*="container"] {
    padding-top: 170px;
}

.section_padding_top_180 > [class*="container"] {
    padding-top: 180px;
}


.columns_margin_top_100 [class*="col-"],
.row.columns_margin_top_100 [class*="col-"] {
    margin-top: 100px;
}

.columns_margin_top_120 [class*="col-"],
.row.columns_margin_top_120 [class*="col-"] {
    margin-top: 120px;
}


.bg-color-2ed1ea a, .bg-color-2ed1ea a:hover {
    background-color: var(--unnamed-color-2ed1ea) !important;
    color: white !important;
}

.bg-color-57daee a, .bg-color-57daee a:hover {
    background-color: var(--unnamed-color-57daee) !important;
    color: white !important;
}

.bg-color-c3db66 a, .bg-color-c3db66 a:hover {
    background-color: var(--unnamed-color-c3db66) !important;
    color: white !important;
}

.bg-color-bbe593 a, .bg-color-bbe593 a:hover {
    background-color: var(--unnamed-color-bbe593) !important;
    color: white !important;
}

.bg-color-bbe593 i.cs-icon2 > svg {
    fill: #bbe593;
    fill: var(--unnamed-color-bbe593);
}

.bg-color-2ed1ea i.cs-icon2 > svg {
    fill: #2ed1ea;
    fill: var(--unnamed-color-2ed1ea);
}

.bg-color-57daee i.cs-icon2 > svg {
    fill: #57daee;
    fill: var(--unnamed-color-57daee);
}

.bg-color-c3db66 i.cs-icon2 > svg {
    fill: #c3db66;
    fill: var(--unnamed-color-c3db66);
}

.color-green, a.color-green {
    color: #C3DB66;
    color: var(--unnamed-color-c3db66);
}

.special-border-color-green:after {
    color: #C3DB66;
    color: var(--unnamed-color-c3db66);
    background-color: #C3DB66;
    background-color: var(--unnamed-color-c3db66);

}

.color-red {
    color: #e85242;
}

.color-white {
    color: #FFFFFF;
    color: var(--unnamed-color-ffffff);
}

/*i.cs-icon-color-bbe593 > svg{*/
/*    fill: #bbe593 !important;*/
/*    fill: var(--unnamed-color-bbe593) !important;*/
/*}*/

/*i.cs-icon-color-2ed1ea > svg{*/
/*    fill: #2ed1ea !important;*/
/*    fill: var(--unnamed-color-2ed1ea) !important;*/
/*}*/

/*i.cs-icon-color-57daee > svg{*/
/*    fill: #57daee !important;*/
/*    fill: var(--unnamed-color-57daee) !important;*/
/*}*/

/*i.cs-icon-color-c3db66 > svg{*/
/*    fill: #c3db66 !important;*/
/*    fill: var(--unnamed-color-c3db66) !important;*/
/*}*/


/* helper since we don't have bootstrap 5*/
.mt-0 {
    margin-top: 0;
}

.mb-0 {
    margin-bottom: 0;
}

.ml-0 {
    margin-left: 0
}

.mr-0 {
    margin-right: 0
}

.pt-0 {
    padding-top: 0;
}

.pb-0 {
    padding-bottom: 0;
}

.pl-0 {
    padding-left: 0
}

.pr-0 {
    padding-right: 0
}

.p-0 {
    padding: 0;
}

.visible-xxs {
    display: none;
}


@media (max-width: 500px ) {
    .visible-xxs {
        display: initial;
    }
}


@media (min-width: 1200px ) {
    .hidden-from-md {
        display: none;
    }
}

@media (max-width: 1200px ) {
    .hidden-to-md {
        display: none;
    }
}

@media (max-width: 992px ) {
    .hidden-to-sm {
        display: none;
    }
}

@media (max-width: 768px ) {
    .hidden-to-xs {
        display: none;
    }
}


.layer-5 {
    position: relative;
    z-index: 5;
}

.layer-10 {
    position: relative;
    z-index: 10;
}

.layer-15 {
    position: relative;
    z-index: 15;
}

#box_wrapper section.allow_overflow {
    overflow: visible;
}


/* font adjustments */
.theme_buttons a,
.theme_button,
.wc-proceed-to-checkout .checkout-button,
.buttons a,
button,
input[type="submit"] {
    position: relative;
    font-family: 'Open Sans', sans-serif;
    font-weight: bold;
}

.more-link,
.view-more {
    font-weight: bold;
    text-transform: uppercase;
    font-size: 14px;
    font-family: 'Open Sans', sans-serif;
}

select:invalid ~ .invalid-feedback.selectize-info {
    display: block;
}

pre.has-error {
    color: red;
    font-weight: bold;
}

.form-password {
    display: none;
}

.admin table {
    font-size: 12px;
}

/*.scroll-table{*/
/*    overflow-x: auto;*/

/*}*/

/*.scroll-table thead th{*/
/*    position: sticky;*/
/*    top: 0;*/
/*}*/

/*.scroll-table thead th:first-child {*/
/*    position: sticky;*/
/*    left: 0;*/
/*    z-index: 2;*/
/*    background: rgba(255,255,255,1);*/
/*}*/

/*.scroll-table  tbody td:first-child {*/
/*    position: sticky;*/
/*    left: 0;*/
/*    background: white;*/
/*    z-index: 1;*/
/*}*/


.form-city {
    display: none;
}

.form-zip {
    display: none;
}

.form-street {
    display: none;
}

#profile_preview {
    max-width: 100%;
    max-height: 300px;
}

#profile_preview[src="#"] {
    display: none;
}

.text-danger {
    color: #e85242;
}

.show_profile_picture {
    max-width: 400px;
}

.alert a {
    color: white;
}

img.members-profile {
    max-width: 150px;
    max-height: 150px;
}

.dtfh-floatingparent.dtfh-floatingparenthead {
    font-size: 12px
}

.hover tr:hover td {
    background: lightcyan;
}

.tables-reset-button {
    margin-left: 20px;
}

/*********************** adoption of design **********************/


/*HEADER/Navigation*/

/* burger menu */

#burger-menu {
    display: inline-block;
    color: white;
    background-color: var(--color-head-and-text);

}


.breadcrumb > li + li:before {
    color: #656565;
    color: var(--color-breadcrumbs);
    padding: 0 0.05em;
    font-size: 1.3em;
}

#original_toggle_menu {
    display: none;
}

#original_toggle_menu.mobile-active {
    display: block;
}

#cs_top_header {
    /* Layout Properties */
    top: 0px;
    left: 0px;
    /*width: 1920px;*/
    height: 43px;
    /* UI Properties */
    background: transparent linear-gradient(270deg, var(--unnamed-color-c3db66) 0%, #41C5E4 100%) 0% 0% no-repeat padding-box;
    background: transparent linear-gradient(270deg, #C3DB66 0%, #41C5E4 100%) 0% 0% no-repeat padding-box;
    opacity: 0.65;
    color: var(--unnamed-color-ffffff);

}

#cs_top_header .inline-list {
    margin-right: 0;
}

/*Link*/
.ds a.social-icon {
    color: var(--unnamed-color-ffffff);
}

.ds a {
    color: var(--unnamed-color-ffffff);
}

.ds {
    color: var(--unnamed-color-ffffff);
}

a.social-icon + a.social-icon, .tooltip + a.social-icon {
    margin-left: 11px;
}

#cs_top_header ul.inline-list.menu li {
    padding-right: 0;
}

#cs_top_header ul.inline-list.menu li:not(:first-child) a::before {
    content: '|';
    color: white !important;
    /*border-left: 1px solid white;*/
    margin-right: 10px;
}

/* logo */
@media (min-width: 1600px) {
    .logo img {
        max-width: 130px;
    }
}

.all-scr-crop .slide-image-wrap {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-size: auto;
    background-position: center;
}

#page_header_logo {
    padding: 0;
    height: 114px;

}

/* menu - column instead of table design */
.header_mainmenu.column-view {
    padding-left: 0;
}

.menu-button-container {
    margin-top: 30px;
}

@media (min-width: 1200px) {

    .header_mainmenu.column-view .sf-menu > li > a, .page_header:not(.affix):not(.bordered_items):not(.thin_header) .sf-menu > li > a {
        margin-left: 0;
        margin-right: 20px;
        font-size: 17px;
        line-height: 23px;
        font-weight: 600;
        color: #7a7a7a;
        color: var(--unnamed-color-7a7a7a);
        padding-top: 43px;
        padding-bottom: 48px;
    }


}

@media (min-width: 1300px) {
    .header_mainmenu.column-view .sf-menu > li > a, .page_header:not(.affix):not(.bordered_items):not(.thin_header) .sf-menu > li > a {
        margin-right: 30px;
    }
}


.menu-button {
    min-width: 175px;
    font-size: 15px;
    line-height: 20px;
    font-weight: 700;
    padding: 15px 15px;
    margin-left: 27px;
    margin-right: 0px;
}

.logo img {
    max-width: 130px;
}


a#burger-menu {
    height: 53px;
}

.cs-burger-menu {
    display: block;
    height: 0px;
    width: 36px;
    /* margin-bottom: 2px; */
    border-top: 4px solid white;
    position: relative;
    margin-top: 7px;
}

.cs-burger-menu::before {
    content: '';
    display: block;
    /* margin-bottom: 0px; */
    border-top: 4px solid white;
    height: 0px;
    width: 36px;
    top: -14px;
    position: absolute;
}

.cs-burger-menu::after {
    content: '';
    display: block;
    /* margin-bottom: 0px; */
    border-top: 4px solid white;
    height: 0px;
    width: 36px;
    bottom: -10px;
    position: absolute;
}

@media (max-width: 1599px) {
    .menu-logged-in .menu-button {
        min-width: 100px;
    }
}

@media (max-width: 1199px) {
    .menu-button, .menu-logged-in .menu-button {
        width: 66px;
        min-width: 66px;
    }

    a.menu-button {
        padding-top: 18px;
        padding-bottom: 17px;
        font-size: 18px;
        line-height: 18px;
    }
}

@media (max-width: 579px) {
    a.menu-button, .menu-logged-in a.menu-button {
        max-width: 33px;
        min-width: 33px;
        /* margin-left: 14px; */
        font-size: 14px;
        line-height: 14px;
        padding-top: 9px;
        padding-bottom: 8px;
        padding-left: 7px;
        padding-right: 8px;
        border-radius: 10px;
        margin-left: 5px;
    }

    a .rt-icon {
        margin-left: -1px;
    }

    .logo img {
        max-width: 90px;
    }

    #page_header_logo {
        height: 90px;
    }

    a#burger-menu {
        height: 31px;
        padding-left: 6px;
        padding-top: 8px;
    }

    .cs-burger-menu, .cs-burger-menu::before, .cs-burger-menu::after {
        width: 21px;
        border-top-width: 2px;
    }

    .cs-burger-menu::after {
        bottom: -6px;
    }

    .cs-burger-menu::before {
        top: -8px;
    }
}

.menu-top-slogan {
    font-size: 15px;
    font-weight: normal;
    line-height: 20px;
}


/******** containers for wide and small */
/* narrow device should have padding for easieness of reading */
@media (max-width: 992px) {
    /*.padding-sm .container, .padding-sm .container-fluid{*/
    /*    padding-left: 29px;*/
    /*    padding-right: 26px;*/
    /*}*/
}


/* content */
/* HOME - Slide - Introlayer */
.intro-main-container-col {
    text-align: center;
    padding-top: 87px;
}

.intro_section .slide_description_wrapper.intro-main-container {
    /* UI Properties */
    background: #FFFFFFBF 0% 0% no-repeat padding-box;
    border-radius: 20px;
    opacity: 1;
    width: 716px;
    /*height: 596px;*/
    display: inline-block;
    padding: 0;
    margin-bottom: 266px;
    padding-bottom: 31px;
}

.intro-layer {
    padding: 0px 70px 0px 70px;
}


@media (max-width: 767px) {
    .intro_section .slide_description_wrapper.intro-main-container {
        width: auto;
        margin-left: 8.5vw;
        margin-right: 9.2vw;
        margin-bottom: 48px;
    }

    .intro-main-container-col {
        padding-left: 0px;
        padding-right: 0px;
        padding-top: 0.72vw;
        margin-bottom: 0;
    }

    .intro-layer {
        padding: 0px 20px;
    }
}

#intro-main-service-1st {
    background: var(--unnamed-color-2ed1ea) 0% 0% no-repeat padding-box;
    background: #2ED1EA 0% 0% no-repeat padding-box;
    opacity: 1;
}

#intro-main-service-2nd {
    background: var(--unnamed-color-2ed1eacc) 0% 0% no-repeat padding-box;
    background: #2ED1EACC 0% 0% no-repeat padding-box;
    opacity: 1;
}

#intro-main-service-3rd {
    background: var(--unnamed-color-c3db66) 0% 0% no-repeat padding-box;
    background: #C3DB66 0% 0% no-repeat padding-box;
    opacity: 1;
}

#intro-main-service-4th {
    background: var(--unnamed-color-abdf79cc) 0% 0% no-repeat padding-box;
    background: #ABDF79CC 0% 0% no-repeat padding-box;
    opacity: 1;
}


#services div.wrapper {
    opacity: 1;
    background: white;
}

#services .media-body p {
    text-align: left;
    font: normal normal normal 30px/36px Pompiere;
    letter-spacing: 0px;
    color: #636363;
    text-transform: uppercase;
    opacity: 1;
}

@media (min-width: 768px) {
    .intro_section h2 {
        font-size: 50px;
        line-height: 1.2em;
    }

}

@media (min-width: 1200px) {
    .intro_section h2 {
        font-size: 60px;
        line-height: 1.2em;
    }

}

@media (min-width: 1600px) {
    .intro_section h2 {
        font-size: 60px;
        line-height: 1.2em;
    }

}

.intro_section .slide_description_wrapper:before {

    display: none;
    width: 0;
    height: 100%;
}


.intro_section.ds p {
    font-size: 18px;
    line-height: 29px;
    color: var(--color-head-and-text);
}

.slide_description .intro-layer:first-child {
    padding-top: 25px;
}

/* special icons */
.cs-icon {
    width: 100%;
    height: 100%;
    background-size: 50%;
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
    background-color: white;
}

.cs-icon-apfel {
    background-image: url("/assets/icons/icon-apfel.png");
}

.cs-icon-gruppe {
    background-image: url("/assets/icons/icon-gruppe.png");
}

.cs-icon-trophy {
    background-image: url("/assets/icons/icon-trophy.png");
}

.cs-icon-herz {
    background-image: url("/assets/icons/icon-herz.png");
}

/* headlines */

h1, h2, h3, h4, h5, h6 {
    font-family: Pompiere;
    font-weight: 400;
    text-transform: uppercase;
    color: var(--color-head-and-text);
}

.ds h1, .ds h2, .ds h3, .ds h4, .ds h5, .ds h6 {
    color: var(--color-head-and-text);
}

.ls h1, .ls h2, .ls h3, .ls h4, .ls h5, .ls h6 {
    color: var(--color-head-and-text);
}


/* buttons */

.theme_button, .buttons a, button, input[type="submit"] {
    border-radius: 20px;
}

.ds .theme_buttons.btn-color-blue a, .ds .theme_button.btn-color-blue,
.btn-color-blue {
    color: #ffffff;
    background-color: var(--unnamed-color-34cbe7);
    border-color: var(--unnamed-color-34cbe7);
}

.ds .theme_buttons.btn-color-green a, .ds .theme_button.btn-color-green,
theme_button.btn-color-green, .btn-color-green {
    color: #ffffff;
    background-color: var(--unnamed-color-c3db66);
    border-color: var(--unnamed-color-c3db66);
}

.ds .theme_buttons.btn-color-dark a, .ds .theme_button.btn-color-dark,
.theme_button.btn-color-dark {
    color: #A8DA7A;
    background-color: #656565;
}


/* home-page sections */
#about {
    /* UI Properties */
    /*background-color: #C3DB66;*/
    /*background-color: var(--unnamed-color-c3db66);*/
    /*linear-gradient(180deg, var(--unnamed-color-c3db66), #41C5E4),*/
    background: transparent url('/assets/images/home/Subtraction_use1.png') 0% 0% no-repeat border-box;
    opacity: 1;

    background-position-y: bottom;
    position: relative;
    background-size: 100vw auto;
    padding-bottom: 22vw;

}

#about::before {
    content: ' ';
    position: absolute;
    bottom: -150px;
    display: block;
    background: transparent url(/assets/images/background.png) 0% 0% no-repeat border-box;
    opacity: 1;
    /*background-size: contain;*/
    /* background-position-x: -200px; */
    background-size: 120vw;
    left: -184.9827880859375px;
    width: 2346px;
    height: 1486px;
    transform: matrix(0.98, -0.19, 0.19, 0.98, 0, 0);
}

#about::after {
    content: ' ';
    display: block;
    position: absolute;
    /* top: 0; */
    height: 100%;
    z-index: -1;
    width: 100vw;
    bottom: 25vmax;
    background-color: var(--color-gradient-start);

}

.margin-top-n10 {
    margin-top: -10px;
}

.margin-top-n15 {
    margin-top: -15px;
}

.margin-top-n20 {
    margin-top: -20px;
}

.margin-top-n25 {
    margin-top: -25px;
}

.margin-top-n30 {
    margin-top: -30px;
}

.margin-top-n35 {
    margin-top: -35px;
}

.margin-top-n40 {
    margin-top: -40px;
}

.margin-top-n45 {
    margin-top: -45px;
}

.margin-top-n50 {
    margin-top: -50px;
}

.margin-top-n55 {
    margin-top: -55px;
}

.margin-top-n60 {
    margin-top: -60px;
}


.margin-top-65 {
    margin-top: 65px;
}

.margin-top-n120 {
    margin-top: -120px;
}

@media (max-width: 767px) {
    .margin-top-sm-n50 {
        margin-top: -50px;
    }

    .margin-top-sm-n75 {
        margin-top: -75px;
    }
}


@media (max-width: 500px ) {

    .margin-top-n10-below-xxs {
        margin-top: -10px;
    }

    .margin-top-n20-below-xxs {
        margin-top: -20px;
    }

    .margin-top-n30-below-xxs {
        margin-top: -30px;
    }

    .margin-top-n40-below-xxs {
        margin-top: -40px;
    }

    .margin-top-0-below-xxs {
        margin-top: 0;
    }

    .margin-top-10-below-xxs {
        margin-top: 10px;
    }

    .margin-top-20-below-xxs {
        margin-top: 20px;
    }

    .margin-top-30-below-xxs {
        margin-top: 30px;
    }

    .margin-top-40-below-xxs {
        margin-top: 40px;
    }

    .margin-top-50-below-xxs {
        margin-top: 50px;
    }
}

@media (max-width: 768px ) {

    .margin-top-n10-below-xs {
        margin-top: -10px;
    }

    .margin-top-n20-below-xs {
        margin-top: -20px;
    }

    .margin-top-n30-below-xs {
        margin-top: -30px;
    }

    .margin-top-n40-below-xs {
        margin-top: -40px;
    }

    .margin-top-0-below-xs {
        margin-top: 0;
    }

    .margin-top-10-below-xs {
        margin-top: 10px;
    }

    .margin-top-20-below-xs {
        margin-top: 20px;
    }

    .margin-top-30-below-xs {
        margin-top: 30px;
    }

    .margin-top-40-below-xs {
        margin-top: 40px;
    }

    .margin-top-50-below-xs {
        margin-top: 50px;
    }

}

@media (max-width: 991px) {
    .margin-top-n10-below-sm {
        margin-top: -10px;
    }

    .margin-top-n20-below-sm {
        margin-top: -20px;
    }

    .margin-top-n30-below-sm {
        margin-top: -30px;
    }

    .margin-top-n40-below-sm {
        margin-top: -40px;
    }

    .margin-top-0-below-sm {
        margin-top: 0;
    }

    .margin-top-10-below-sm {
        margin-top: 10px;
    }

    .margin-top-20-below-sm {
        margin-top: 20px;
    }

    .margin-top-30-below-sm {
        margin-top: 30px;
    }

    .margin-top-40-below-sm {
        margin-top: 40px;
    }

    .margin-top-50-below-sm {
        margin-top: 50px;
    }
}

.section_header h2,
.section_header h3,
.section_header h4,
.section_header h5,
.section_header h6 {
    margin-top: 0px;
    margin-bottom: 0px;
    color: var(--color-head-and-text);
}

div.section_header {
    border-left: 7px solid white;
    padding-left: 20px;
}

div.section_header.color-blue {
    border-left: 7px solid var(--unnamed-color-34cbe7);
}


.intro-special-girls {
    left: calc(-1 * (min(40px, max(0px, 100vw - 1032px))));
    margin-right: 0px;
    padding-left: 0;
    padding-right: 0px;
    width: calc(100% + 2vw);
}

.intro-special-guy {
    left: calc(-1 * (min(40px, max(0px, 100vw - 1032px))));
    margin-right: 0px;
    padding-left: 0;
    padding-right: 0px;
    width: calc(95% + 2vw);
}

@media (min-width: 992px) {
    .intro-special-girls {
        left: calc(-1 * (min(40px, max(0px, 100vw - 1032px))));
    }
}

@media (min-width: 1200px) {
    .intro-special-girls {
        left: calc(-1 * (min(40px, max(0px, 100vw - 1240px))));
        width: calc(100% + min(5vw, 100px));
    }
}

@media (max-width: 991px) {
    .intro_section.section_header {
        text-align: left;
    }

    .intro-special-girls {
        right: 0;
        padding-left: inherit;
        padding-right: inherit;
        width: 100%;
    }
}

.big-text p {
    font-size: 20px;
    line-height: 28px;
    margin-bottom: 28px;
}


@media (max-width: 767px) {
    .intro_section h2 {
        font-size: 55px;
        line-height: 1.2em;
    }

    .intro_section h3 {
        font-size: 1.3rem;
        line-height: 2em;
    }

    .big-text p {
        font-size: 1rem;
        line-height: 1.4em;
        margin-bottom: 1.4em;
    }

    #services .media-body p {
        font-size: 1.25rem;
        line-height: 1.2em;
    }

    .teaser_icon.thick_border_icon[class*="_bg_color"].big_wrapper {
        width: calc(3.3rem + 20px);
        height: calc(3.3rem + 20px);
    }

    .section_padding_top_65 .container, #about.section_padding_top_65 .container, #about.section_padding_top_65 .container-fluid {
        padding-top: 2.76rem;
    }
}

@media (max-width: 579px) {
    .intro_section h2 {
        font-size: 9.8vw;
        line-height: 1.2em;
    }

    .intro_section h3 {
        font-size: 1.3rem;
        line-height: 2em;
    }
}


/* cartoon speaking bubble with help from https://codingislove.com/css-speech-bubbles/ */

.speech-box {
    width: 100%;
    margin: 50px auto;
    border: 4px solid #C3DB66;
    padding: 15px 27px 20px 27px;
    text-align: center;
    font-weight: 900;
    background-color: #C3DB66;
    position: relative;
    border-radius: 20px 20px;
    padding-top: 15px;

}


.speech-box p:first-child {
    border-bottom: 1px solid #717171;
    padding-bottom: 10px;
    margin-bottom: 14px;
}


/* speech bubble 11 */
.sb10:before {
    content: "";
    width: 0px;
    height: 0px;
    position: absolute;
    border-left: 18px solid transparent;
    border-right: 18px solid transparent;
    /* border-top: 0px solid white; */
    border-bottom: 30px solid #C3DB66;
    left: calc(50% - 18px);
    top: -30px;
}

/*.sb10:after {*/
/*    content: "";*/
/*    width: 0px;*/
/*    height: 0px;*/
/*    position: absolute;*/
/*    border-left: 10px solid transparent;*/
/*    border-right: 10px solid transparent;*/
/*    border-top: 10px solid transparent;*/
/*    border-bottom: 10px solid #C3DB66;*/
/*    right: 50%;*/
/*    top: -18px;*/
/*}*/

/* checklist */
ul.list2.checklist {
    padding-left: 30px;
    margin-bottom: 0px;
    padding-bottom: 10px;
}

.list2.checklist li:before {
    content: "\f00c";
    font-family: FontAwesome;
    font-size: 14px;
    line-height: 1em;
    left: -30px;
    width: auto;
    height: auto;
    color: inherit;
    background-color: transparent;
    font-size: 20px;
    font-weight: 100;
    line-height: 1.2em;
    top: 1px;
    transform: scaleX(0.75);
}

.speech-box .list2 li {
    font-size: 16px;
    line-height: 25px;
    font-weight: normal;
    margin: 0;
    padding: 0;
}


.home-page-advertising {
    line-height: 32px;
    text-align: center;
    padding-top: 22px;
}

.home-page-advertising .highlight-text {
    font-size: 40px;
    line-height: 28px;
    font-weight: bold;
}

#home-map {
    margin-top: -28vw;
    padding-top: 20vw;
    background-color: var(--color-background);
    /*z-index: -1;*/
}

/*#home-map::before{*/
/*    content : ' ';*/
/*    width: 100%;*/
/*    position: relative;*/
/*    height: 50vh;*/
/*    background-color: var(--color-background);*/
/*    z-index: -1;*/
/*}*/

@media (max-width: 1600px) {
    #home-map {
        margin-top: -34vw;
        padding-top: 30vw;
    }
}

@media (max-width: 1200px) {
    #home-map {
        margin-top: -30vw;
        padding-top: 30vw;

    }
}

@media (max-width: 991px) {
    #home-map {
        background-color: white;
    }

}

img.home-image-map {
    z-index: 1;
    position: relative;
    /*max-width: 116%;*/
    /*margin-left: -35px;*/
    margin-top: -65px;


}

img.home-image-winner {
    /*border: 1px solid cyan;*/
    margin-top: -167%;
    z-index: 0;
    opacity: 0.15 !important;
    max-width: 500%;
    width: 217%;
    margin-left: -10%;
}

@media (max-width: 991px) {

    img.home-image-winner {
        margin-top: -69vw;
        z-index: 0;
        opacity: 0.15 !important;
        max-width: 500%;
        width: 109vw;
        margin-left: 22vw;
        margin-bottom: -8.34vw;
    }
}

@media (max-width: 769px) {

    img.home-image-winner {
        margin-left: 14vw;
        margin-bottom: -8.34vw;
    }
}

@media (max-width: 579px) {

    img.home-image-winner {
        margin-left: 28vw;
        margin-bottom: -8.34vw;
    }
}


#blog {
    /* Layout Properties */
    z-index: 5;
    margin-top: -20vmin;
    /*width: 1920px;*/


    background: white linear-gradient(180deg, #C3DB66 0%, #41C5E4 100%) 0% 0% no-repeat padding-box;
    opacity: 1;
}

@media (min-width: 992px) {
    #blog {
        margin-top: -150px;
    }
}

@media (min-width: 1200px) {
    #blog {
        margin-top: -220px;
    }
}

#blog {
    padding-top: 8px;
}

#blog a.show-more {
    color: var(--color-head-and-text);
    background: transparent url(/assets/icons/arrow_2.png) 0% 0% no-repeat padding-box;
    background-position: center right;
    background-size: 1em;
    padding-right: 1.5em;
    text-transform: uppercase;
    font-size: 1.2em;
}

.columns_margin_top_0 {
    margin-top: 0;
}

.padding-left-50 {
    padding-left: 50px;
}

@media (max-width: 1199px) {
    .padding-left-lt-md-0 {
        padding-left: 0;
    }

    .columns_margin_top_lt_md_0 {
        margin-top: 0;
    }

}

@media (max-width: 991px) {
    .columns_margin_top_lt_sm_0 {
        margin-top: 0;
    }

    .padding-left-lt-sm-0 {
        padding-left: 0;
    }
}


.columns_margin_bottom_0 {
    margin-top: 0;
}

.post {
    background-color: white;
}


.bottom_color_border.color-blue::after {
    background-color: var(--unnamed-color-2ed1ea);
}

.bottom_color_border.color-dark-blue::after {
    background-color: var(--unnamed-color-34cbe7);
}

.bottom_color_border.color-green::after {
    background-color: var(--unnamed-color-c3db66);
}

@media (max-width: 1229px) {
    article.post.format-small-image img {
        height: 325px;
        object-fit: cover;
    }
}

@media (min-width: 1230px) {

    article.post.format-small-image img {
        width: 376px;
        height: 293px;
        object-fit: cover;
    }
}

#blog article.post h3 a, #blog article.post .entry-content {
    color: var(--color-blog);
    text-transform: none;
}

#blog article.post h3 a {
    font-size: 31px;
}

#blog article.post {
    box-shadow: 0px 3px 6px #00000029;
}

@media (min-width: 1230px) {

    #blog article .item-content {
        padding-left: 0px;
        padding-top: 22px;
        margin-left: -26px;
    }

    #blog article .right .item-content {
        padding-left: 29px;
        margin-left: 0px;
        padding-right: 0px;
        margin-right: -28px;
    }
}

/*#blog article .item-content {*/

/*}*/

.bottom_color_border::after {
    height: 7px;
}

@media (min-width: 992px) {
    #blog article:first-child .bottom_color_border::after {
        top: 0;
    }

    #blog .bottom_color_border::after {
        width: 7px;
    }

    #blog .side-item.side-md.bottom_color_border::after {
        width: 7px;
    }
}

/*}*/
/*@media (min-width: 1600) {*/

/*}*/

.entry-content::after {
    content: '';
    height: 35px;
    width: 100%;
    position: absolute;
    bottom: 0px;
    background: transparent linear-gradient(180deg, rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 1));
    left: 0px;
}

@media (min-width: 992px) {
    .md-content-4lines-ellipsis {
        display: block;
        display: -webkit-box;
        font-size: 18px;
        height: 140px;
        -webkit-line-clamp: 4;
        line-height: 28px;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .side-item.content-padding .item-content {
        padding-bottom: 0px;
    }

    .entry-content::after {
        content: none;
    }
}

#toTop {
    background-color: var(--unnamed-color-34cbe7);
    border: 1px solid rgba(255, 255, 255, 0.2);
    box-shadow: 1px 1px 1px lightgrey;
}


@media (max-width: 991px) {

    .item-content {
        max-height: 425px;
        overflow: hidden;
    }

    .entry-content {
        height: 95%;
        overflow: hidden;
    }

    .item-content .entry-content p {
        max-height: 100%;
    }

    article.post.format-small-image img {
        height: 325px;
        width: 100%;
    }
}

@media (min-width: 992px) {
    .no-border-right {
        border-right: 0;
    }

}

.fa.fa-calendar, .fa.fa-tags {
    color: var(--unnamed-color-34cbe7);
    border-color: var(--unnamed-color-34cbe7);
}

#blog::before {
    content: ' ';
    position: absolute;
    bottom: 150px;
    display: block;
    background: transparent url(/assets/images/background.png) 0% 0% no-repeat border-box;
    opacity: 1;
    /*background-size: contain;*/
    /* background-position-x: -200px; */
    background-size: 120vw;
    left: -184.9827880859375px;
    width: 2346px;
    height: 1486px;
    transform: matrix(0.98, -0.19, 0.19, 0.98, 0, 0);
}

#footer {
    background: transparent linear-gradient(180deg, #F8F8F8 0%, #D2D2D2 100%) 0% 0% no-repeat padding-box;
    background: transparent linear-gradient(180deg, var(--unnamed-color-f8f8f8) 0%, #D2D2D2 100%) 0% 0% no-repeat padding-box;
    z-index: 5;
    padding-bottom: 60px;
}

#footer div.newsletter-assign {
    background: var(--unnamed-color-bfd568);
}

/*@media (min-width: 1200px){*/
/*#footer*/

/*}*/

#footer {
    font-weight: 600;
    color: var(--color-blog)
}

#footer hr {
    background-color: white;
}

nav.footer_menu ul {
    padding-left: 0;
}

nav.footer_menu ul li {
    list-style: none;
    height: 28px;
}

nav.footer_menu ul li a {
    color: var(--color-blog);
}

@media (min-width: 992px) {

    nav.footer_menu li {
        border-bottom: 1px solid white;
    }

    nav.footer_menu li:last-of-type {
        border-bottom: none;

    }


    #footer .newsletter-assign h2 {
        font-size: 61px;
        line-height: 65px;
    }

}

#image-fitter-durch-sport img {
    margin-top: min(-6.5vw, -125px);
    max-width: 388px;
    width: 20vw;
}

@media (max-width: 991px) {
    #image-fitter-durch-sport img {
        margin-top: -130px;

        width: 388px;
    }

    #subscribe {
        padding-bottom: 112px;
    }
}

@media (max-width: 991px) {
    .section_padding_sm_40 .container {
        padding-top: 40px;
    }
}

@media (max-width: 499px) {
    #footer .container {
        margin-left: 15px;
        margin-right: 15px;
        margin-top: 40px;
    }

    #image-fitter-durch-sport img {
        margin-top: -24vw;
        width: 75vw;
    }
}

.list-unstyled .media {
    margin-bottom: 28px;
}

li.media {
    font-size: 16px;
    line-height: 28px;
}

@media (max-width: 991px) {
    hr.special-margin-sm {
        margin-top: 26px;
    }
}

.hidden-always {
    display: none !important;
}

#winner-mobile {
    position: absolute;
}

i.cs-icon-arrow {
    position: relative;
}

i.cs-icon-arrow::before {
    content: ' ';
    width: 37px;
    height: 58px;
    background-image: url(/assets/images/arrow.svg);
    /* transform: matrix(0.91, -0.42, 0.42, 0.91, 0, 0); */
    position: absolute;
    /* color: white; */
    left: -40px;
    bottom: 4px;
}

@media (min-width: 1200px) {
    i.cs-icon-arrow::before {
        left: -60px;
    }
}

@media (max-width: 499px) {
    i.cs-icon-arrow::before {
        left: -11.1vw;
        bottom: 15px;
    }

    p.home-page-advertising {
        font-size: 0.9rem;
    }
}


section.page_breadcrumbs {
}

.page_breadcrumbs div.is-content {
    background: rgba(255, 255, 255, 0.7);
    border-radius: 20px;
    padding: 26px 0;
}

.bg-center-small-left {
    background-position: center;
}

@media (max-width: 991px) {
    .bg-center-small-left {
        background-position: left;
    }
}

.breadcrumb > li > a {
    font-family: 'Open Sans';
    font-weight: 400;
    font-size: 18px;
    line-height: 29px;
}

.breadcrumb > .active, .breadcrumb > .last-item, .breadcrumb > .active a, .breadcrumb > .active a:visited,
.page_header:not(.affix):not(.bordered_items):not(.thin_header) .sf-menu > li.active > a {
    color: #2cc06d;
    color: var(--unnamed-color-2cc0d6);


}

#nutrition_intro h3, .no-transform {
    text-transform: none;
}

.section.full-white {
    background-color: #FFFFFF;
}

.cs-list .item-content {
    padding: 19px 25px 24px 28px;
    min-height: 284px;
    box-sizing: border-box;
}

.cs-list h3.card-capital-number {
    font-size: 62px;
    float: left;
    margin-left: -5px;
    margin-right: 20px;
    color: #636363;
    margin-bottom: 0;
    line-height: 62px;
    margin-top: 2px;
}

.cs-list .entry-header {
    height: 95px;
    padding-bottom: 10px;
    display: table;
    margin-bottom: 0;
}

.cs-list h3.card-titel {
    vertical-align: middle;
    display: table-cell;
    bottom: 0;
    margin-top: 0px;
    color: #636363;
    font-size: 35px;
    line-height: 42px;

}

.cs-list article.vertical-item {
    height: 100%;
    background-color: white;
    box-shadow: 0px 3px 6px #00000029;
}

.cs-list {
    background: transparent linear-gradient(180deg, var(--unnamed-color-c3db66) 0%, #41C5E4 100%) 0% 0% no-repeat padding-box;
    background: transparent linear-gradient(180deg, #C3DB66 0%, #41C5E4 100%) 0% 0% no-repeat padding-box;
}

.cs-list .container {
    margin-top: -110px;
    margin-bottom: -195px;
    position: relative;
    z-index: 2;
    padding-top: 0;
}

.cs-list::before {
    content: ' ';
    height: 100px;
    width: 100%;
    background-color: white;
    position: relative;
    z-index: 0;
    display: block;
}

.cs-list:target:before {
    margin-top: 0;
    height: 230px;

}

.cs-list::after {
    content: ' ';
    height: 175px;
    z-index: 0;
    position: relative;
    width: 100%;
    background-color: white;
    display: block;
}

.cs-list .container::before {
    content: ' ';
    position: absolute;
    bottom: 100px;
    display: block;
    background: transparent url(/assets/images/background.png) 0% 0% no-repeat border-box;
    opacity: 1;
    /* background-size: contain; */
    /* background-position-x: -200px; */
    background-size: 120vw;
    width: 2346px;
    height: 1486px;
    transform: matrix(0.98, -0.19, 0.19, 0.98, 0, 0);
    left: -600px;
}

/*div:nth-child(6n + 1) .loop-col:after, div:nth-child(6n + 3) .loop-col:after, div:nth-child(6n + 5) .loop-col:after{*/
/*    background-color: #c3db66 ;*/
/*    background-color: var(--unnamed-color-c3db66);*/
/*}*/

/*div:nth-child(6n + 2) .loop-col:after, div:nth-child(6n + 4) .loop-col:after, div:nth-child(6n + 6) .loop-col:after {*/
/*    background-color: #2ED1EA;*/
/*    background-color: var(--unnamed-color-2ed1ea);*/
/*}*/

/*div:nth-child(2) .loop-col:after{*/
/*    background-color: #2CC0D6;*/
/*    background-color: var(--unnamed-color-2cc0d6);*/
/*}*/

.cs-card .item-media img {
    width: 100%;
    object-fit: cover;
    max-height: 193px;
}

div.cs-card:nth-child(2n + 1) .loop-col:after {
    background-color: #c3db66;
    background-color: var(--unnamed-color-c3db66);
}

div.cs-card:nth-child(2n + 2) .loop-col:after {
    background-color: #2ED1EA;
    background-color: var(--unnamed-color-2ed1ea);
}


@media (max-width: 1199px) {
    div.cs-card:nth-child(4n + 1) .loop-col:after, div.cs-card:nth-child(4n +4) .loop-col:after {
        background-color: #c3db66;
        background-color: var(--unnamed-color-c3db66);
    }

    div.cs-card:nth-child(4n + 2) .loop-col:after, div.cs-card:nth-child(4n + 3) .loop-col:after {
        background-color: #2ED1EA;
        background-color: var(--unnamed-color-2ed1ea);
    }
}

@media (max-width: 767px) {
    div.cs-card:nth-child(2n + 1) .loop-col:after {
        background-color: #c3db66;
        background-color: var(--unnamed-color-c3db66);
    }

    div.cs-card:nth-child(2n + 2) .loop-col:after {
        background-color: #2ED1EA;
        background-color: var(--unnamed-color-2ed1ea);
    }

    .cs-list h3.card-capital-number {
        font-size: 48px;

    }

    .cs-list .entry-header {
        height: 88px;
        padding-bottom: 10px;
        display: table;
        margin-bottom: 0;
    }

    .cs-list h3.card-titel {
        vertical-align: middle;
        display: table-cell;
        bottom: 0;
        margin-top: 0px;
        color: #636363;
        font-size: 28px;
        line-height: 35px;

    }

}

/**********************************************************/
/****** widget with counter (go-further-box ***************/

.go-further-box .go-further-center .item-content {
    bottom: 15px;
    position: absolute;
    /*height: 171px;*/
    padding-top: 0;
    padding-bottom: 0;
}

.go-further-left .row, .go-further-left .row .vertical-item {
    max-height: 100%;
}

@media (min-width: 992px) {
    .go-further-center, .go-further-left, .go-further-right {
        max-height: 320px;
    }


    .go-further-center .item-media img {
        max-height: 320px;
        height: 320px;
        object-fit: cover;
    }

    .go-further-left .row > div .item-media img, .go-further-right .row > div .item-media img {
        width: 100%;
        object-fit: cover;
        height: 100%;
    }

    .go-further-box-content [class*='col-'] {
        margin: 0px;
        border: 0px;
        padding: 0px;
    }

    .go-further-left .row > div, .go-further-right .row > div {
        max-height: 160px;
        height: 160px;
    }

    .go-further-left .vertical-item, .go-further-right .vertical-item, .go-further-left .vertical-item .item-media, .go-further-right .vertical-item .item-media {
        height: 100%;;
    }


    .go-further-left .row > div:nth-child(2) .vertical-item .item-content, .go-further-right .row > div:nth-child(2) .vertical-item .item-content {
        padding-bottom: 15px;
    }
}

@media (min-width: 1200px) {
    .go-further-center .item-media img {
        max-height: 386px;
        height: 386px;
    }

    .go-further-center, .go-further-left, .go-further-right {
        max-height: 386px;
        height: 386px;
    }

    .go-further-left .row > div, .go-further-right .row > div {
        max-height: 193px;
        height: 193px;
    }


}

@media (min-width: 1230px) {
    .go-further-left .row > div:nth-child(2) .vertical-item .item-content, .go-further-right .row > div:nth-child(2) .vertical-item .item-content {
        padding-bottom: 20px;
    }

}

.go-further-box .go-further-center .item-content .entry-title {
    background-color: rgba(255, 255, 255, 0.8);
    border-radius: 20px;
    height: 9em;
    padding-top: 3.7em;
    margin-top: -55px;
    padding-left: 2em;
    padding-right: 2em;
}

.go-further-left .vertical-item .item-content, .go-further-right .vertical-item .item-content {
    padding: 0 15px 15px 15px;
}

.go-further-left .entry-title, .go-further-right .entry-title {
    background-color: rgba(255, 255, 255, 0.8);
    border-radius: 20px;
    padding: 10px 15px;

}

.go-further-left .entry-title h3, .go-further-right .entry-title h3 {

    font-size: 1.5em;
    line-height: 1.7em;
}

@media (max-width: 1229px) {
    .go-further-left .entry-title h3, .go-further-right .entry-title h3 {

        font-size: 1.3em;
        line-height: 1.5em;
    }
}

.go-further-box .item-media img {
    width: 100%;
    /*object-fit: cover;*/
}


/*.go-further-center .countdown-amonut{*/
/*    font-size: 25px;*/
/*    line-height: 26px;*/
/*}*/

.countdown-section {
    text-align: center;
}

.masonry-feed .closest-event .countdown-amount {
    font-size: 25px;
    line-height: 50px;
    box-shadow: 0px 3px 6px #00000029;
    width: 2em;
    height: 2em;
    vertical-align: middle;
    display: inline-block;
    font-weight: 700;
}

.countdown-section:nth-child(4n +1 ) .countdown-amount {
    color: #1DADC4;
}

.countdown-section:nth-child(4n +2 ) .countdown-amount {
    color: #57DAEE;
}

.countdown-section:nth-child(4n +3 ) .countdown-amount {
    color: #C3DB66;
    color: var(--unnamed-color-c3db66);
}

.countdown-section:nth-child(4n +4 ) .countdown-amount {
    color: #BBE593;
}

@media (max-width: 767px) {
    .go-further-box .go-further-center .item-content {
        bottom: -15px;
    }

}

@media (max-width: 579px) {
    .go-further-box .go-further-center .item-content {
        bottom: 15px;
    }

    .go-further-box .go-further-center .item-content .entry-title {
        height: 6rem;
        margin-top: -36px;
        padding-top: 2.7rem;
    }

    /*.go-further-center*/
    .go-further-box .item-content .entry-title h3 {
        font-size: 1.2rem;

    }

    .masonry-feed .go-further-center .vertical-item.content-absolute .item-content {
        padding-bottom: 0;
        padding-top: 0;

    }

    .countdown-period {
        font-size: 0.5rem;
        line-height: 1.2rem;
    }

    .masonry-feed .closest-event .countdown-amount {
        font-size: 1rem;
        line-height: 2rem;

    }
}

.ds .countdown-row .countdown-period, .ls .countdown-row .countdown-period {
    color: #636363;
    color: var(--color-head-and-text);
}

.selectize-input.required div {
    color: #3a3d44;
    font-weight: 600;
}

.selectize-control.single .selectize-input:after {
    color: #3a3d44;
}

.cs-private-challenge textarea {
    height: 289px;
}

.challenge-intro-text {
    padding: 15px;
    border: 1px solid gainsboro;
    box-shadow: 5px 5px 5px gainsboro;
}

@media (min-width: 1200px) {
    .go_further_card_less_padding .vertical-item.big-padding .item-content {
        padding: 19px 15px 55px 14px;
    }
}

.sf-menu ul a:hover,
.sf-menu ul li.active > a {
    color: #2cc06d;
    color: var(--unnamed-color-2cc0d6);
}

.cs-tabs .tab-pane {
    background-color: white;
    position: relative;
}

.cs-tabs .tab-pane .tab-pane-image img {
    margin-top: -6px; /* TODO solve the riddle of the white space above there display: block etc. didn't work */
}

.vertical-tabs .nav > li {
    margin-right: 30px;
    margin-bottom: 21px;
    transition: margin-right ease-in-out 0.5s;
    border-radius: 20px;
}

.vertical-tabs .nav > li.active {
    margin-right: -50px;
}

.vertical-tabs .nav > li > a {
    font-size: 15px;
    line-height: 20px;
    border-radius: 20px;
    padding-top: 20px;
    padding-bottom: 20px;
    font-weight: bold;
    padding-left: 10px;
}

.vertical-tabs .nav {
    margin-top: 36px;
}

.tab-content {
    padding: 0;
    transition: height ease-in-out 0.5s;
    box-shadow: 0px 3px 6px #00000029;
    border: 1px solid #F1F1F1;
    margin-bottom: 10px;
}

.tab-pane-content {
    padding: 34px 61px 41px 65px;
}

.tab-pane-content > h2 {
    display: inline;
    font-size: 65px;
    line-height: 72px;
    margin-bottom: 0;
}

.tab-pane-content > h3 {
    text-transform: none;
    display: inline-block;
    font-size: 35px;
    line-height: 42px;
    margin-bottom: 30px;
}


@media (max-width: 767px) {
    .tab-pane-content {
        padding: 18px 7px 21px 10px;
    }

    .ls h2 {
        font-size: 2.2rem;
        line-height: 2.3rem;
        margin-top: 0px;
        margin-bottom: 0;
    }

    .ls h3 {
        font-size: 1.8rem;
        line-height: 2.3rem;
        margin-top: 0px;
    }
}


.vertical-tabs > div {
    z-index: 1;
}

.vertical-tabs > div:first-child {
    z-index: 2;
}

section.home_section_1 div.container div.row > div {
    z-index: 1;
}

section.home_section_1 div.container div.row > div:first-child {
    z-index: 2;
}

.cs-tabs {

    position: relative;
}

.vertical-tabs, .vertical-tabs-mobile {
    position: relative;
    z-index: 5;
}

.cs-tabs::before {
    content: ' ';
    height: 420px;
    width: 100%;
    position: absolute;
    background-color: #ffffff;
}

.cs-tabs::after {
    content: ' ';
    height: calc(100% - 280px);
    width: 100%;
    position: absolute;
    background: transparent linear-gradient(180deg, #C3DB66 0%, #41C5E4 100%) 0% 0% no-repeat padding-box;
    background: transparent linear-gradient(180deg, var(--unnamed-color-c3db66) 0%, #41C5E4 100%) 0% 0% no-repeat padding-box;
    top: 420px;
    transition: height ease-in-out 0.5s;
}

.cs-section-gradient {
    position: relative;
}

.cs-section-gradient::after {
    content: ' ';
    height: calc(100% + 220px);
    width: 100%;
    position: absolute;
    background: transparent linear-gradient(180deg, #C3DB66 0%, #41C5E4 100%) 0% 0% no-repeat padding-box;
    background: transparent linear-gradient(180deg, var(--unnamed-color-c3db66) 0%, #41C5E4 100%) 0% 0% no-repeat padding-box;
    top: -80px;
    transition: height ease-in-out 0.5s;
}


.cs-tabs .container::after {
    content: ' ';
    position: absolute;
    bottom: -300px;
    display: block;
    background: transparent url(/assets/images/background.png) 0% 0% no-repeat border-box;
    opacity: 1;
    /* background-size: contain; */
    /* background-position-x: -200px; */
    background-size: 120vw;
    width: 2346px;
    height: 1486px;
    transform: matrix(0.98, -0.19, 0.19, 0.98, 0, 0);
    left: -300px;
    z-index: 1;
}

.vertical-tabs-mobile .panel-heading .panel-title > a.collapsed {
    border-radius: 20px;
}

.vertical-tabs-mobile .tab-content {
    border-radius: 20px 20px 0 0;
}

.vertical-tabs-mobile .tab-content:has( a.collapsed) {
    border-radius: 20px;
}

.vertical-tabs-mobile .panel-heading .panel-title > a {
    border-radius: 20px 20px 0 0;
}

html {
    scroll-behavior: smooth;
}

.article_frame h2.entry-title {
    display: inline;
    font-size: 65px;
    line-height: 72px;
    margin-bottom: 0;
    color: #636363;
}

.article_frame h3.entry-title {
    text-transform: none;
    display: inline-block;
    font-size: 35px;
    line-height: 42px;
    margin-bottom: 30px;
    color: #636363;
    margin-left: 10px;
    margin-bottom: 0;
    margin-top: 0;
    margin-bottom: 9px;
}

.article_frame article {
    box-shadow: 0px 3px 6px #00000029;
    border: 1px solid #F1F1F1;
    position: relative;
    z-index: 2;
}

.article_frame article .entry-content {
    height: initial;
}

.article_frame article .entry-thumbnail {
    height: 100%;
}

.article_frame article .entry-thumbnail img {
    height: 100%;

}

.article_frame article .side-item .item-content {
    padding-bottom: 40px;
    z-index: 5;
    background-color: white;
    position: relative;
    padding-right: 65px;
}

@media (min-width: 1230px) {
    .article_frame article .side-item .item-content {
        padding-left: 0;
    }
}

.article_frame article.cs_surround_plants:before {
    content: url(/assets/images/rezepte/04_plants_left.svg);
    position: absolute;
    bottom: 0;
    width: 29%;

    transform: translate(-71%, -37px);
    z-index: 0;
}

.article_frame article.cs_surround_plants:after {
    content: url(/assets/images/rezepte/05_plants_right.svg);
    position: absolute;
    bottom: 0;
    width: 315px;

    right: 0;
    transform: translate(245px, -37px);
    z-index: 0;
}

.article_frame article .side-item.bottom_color_border:after {
    z-index: 5;
}


@media (max-width: 991px) {
    .article_frame article .item-content {
        max-height: initial;
    }

    .article_frame article.cs_surround_plants:before {
        transform: translate(-71%, -10px);
    }

}

@media (max-width: 767px) {
    .article_frame article.cs_surround_plants:before {
        transform: translate(-178%, -37px);
    }
}

.cs_info_button_daily_changing_recipe div.side-item:before {
    content: "Täglich wechselnde Rezeptideen";
    word-wrap: normal;
    position: absolute;
    right: 0;
    z-index: 6;
    top: 5px;
    transform: matrix(0.97, 0.24, -0.24, 0.97, 0, 0) translate(62%, 0px);
    background-color: var(--unnamed-color-2ed1ea);
    width: 140px;
    height: 140px;
    color: white;
    padding-top: 32px;
    border-radius: 70px;
    text-align: center;
    line-height: 1.2em;
    vertical-align: middle;
    font-size: 1.1em;
}

@media (min-width: 992px) {
    .article_frame article .side-item.side-md.bottom_color_border:after {
        width: 7px;
    }

}

@media (max-width: 1299px) {
    .cs_info_button_daily_changing_recipe div.side-item:before {
        top: -30px;
        right: 69px;
    }
}

.cs_lost_weight_button {
    position: absolute;

}

.slide_description .cs_info_button_33_euro {
    position: absolute;
    z-index: 43;
    background-color: #2ed1ea;
    background-color: var(--unnamed-color-2ed1ea);
    color: white;
    opacity: 1;
    visibility: visible;
    word-break: normal;
    width: min(222px, 20vw);
    height: min(222px, 20vw);
    border-radius: 50%;
    display: table-cell;
    vertical-align: baseline;
    top: calc(min(222px, 20vw) * 0.11);
    right: calc(min(222px, 20vw) * -0.68);
    transform: matrix(0.97, 0.24, -0.24, 0.97, 0, 0);
    padding-top: calc(min(222px, 20vw) * 0.144);
    font-size: calc(min(222px, 20vw) * 0.108);
}

.cs_info_button_33_euro span {
    display: block;
    font-family: "Open Sans";
    font-weight: 600;
}

.header_left_logo {
    position: relative;
}

.cs_info_test_user {
    position: absolute;
    z-index: 43;
    background-color: lightgrey;
    color: white;
    opacity: 1;
    visibility: visible;
    word-break: normal;
    width: min(70px, 17vw);
    height: min(70px, 17vw);
    border-radius: 50%;
    display: table-cell;
    vertical-align: baseline;
    top: 20%;
    left: 0;
    transform: translateX(+177%) rotate(-20deg);
    /* padding-top: calc(min(222px, 20vw) * 0.144); */
    font-size: 15px;
    /* padding-left: 8px; */
    line-height: 15px;
    font-weight: bold;
    padding-top: 12px;
    text-align: center;
    z-index: 2;
    cursor: pointer;
}

.cs_test_mode_active {
    background-color: coral;
}

.cs_info_medium {
    font-size: 1.33em;
    line-height: 1em;
}

.cs_info_small {
    font-size: 1em;
    line-height: 1em;
}

.cs_info_smaller {
    font-size: 0.8em;
}

.cs_info_big {
    font-size: 3.3em;
    line-height: 1em;
}


.slide_description {
    position: relative;
}


.cs-dashboard-profile-bg:before {
    content: ' ';
    background-image: url(/assets/images/dashboard/01_profile_background.svg);
    width: min(100vw, 566px);
    height: calc(min(100vw, 566px) * 0.706);
    position: absolute;
    bottom: 0px;
    background-size: contain;
    background-repeat: no-repeat;
    transform: translateX(-50%);
    margin-left: 50%;
}

.cs-dashboard-profile-bg {
    width: 100%;

}

.cs-dashboard-profile-bg img {
    width: 100%;
    height: 290px;
    object-fit: cover;
}

.cs-dashboard-profile-picture-wrapper {
    width: min(376px, 80vw);
    height: 100%;
    margin-left: auto;
    margin-right: auto;
    z-index: 2;
    position: relative;
    box-shadow: 0px 3px 6px #00000029;
    border: 1px solid #F1F1F1;
}

.cs-dashboard-profile-bg .body {
    padding: 10px 25px 27px 25px;
    background-color: white;

}

.cs-dashboard-profile-bg .body h3 {
    font-size: 35px;
    line-height: 42px;
    color: #636363;
}

.cs-dashboard-profile-bg .body .slogan {
    margin-top: 10px;
    background-color: #F1F1F1;
    padding: 28px 20px 28px 28px;
    color: #636363;
    font-size: 14px;
    line-height: 20px;
    position: relative;
}

.cs-dashboard-profile-bg .body .slogan:before {
    content: ' ';
    background: url(/assets/images/dashboard/02_marks.svg);
    width: 20px;
    height: 37px;
    position: absolute;
    top: -26px;
    left: 4px;
}

.cs-dashboard-profile-bg .body .slogan:after {
    content: ' ';
    background: url(/assets/images/dashboard/02_marks.svg);
    width: 20px;
    height: 37px;
    position: absolute;
    bottom: -12px;
    right: 4px;
}

.cs_lost_weight_button {
    position: absolute;
    z-index: 43;
    background-color: #2ed1ea;
    background-color: var(--unnamed-color-2ed1ea);
    color: white;
    opacity: 1;
    visibility: visible;
    word-break: normal;
    width: min(140px, 20vw);
    height: min(140px, 20vw);
    border-radius: 70px;
    display: table-cell;
    vertical-align: baseline;
    top: calc(min(140px, 20vw) * 0.21);
    right: calc(min(140px, 20vw) * -0.614);
    transform: matrix(0.97, 0.24, -0.24, 0.97, 0, 0);
    padding-top: calc(min(140px, 20vw) * 0.13);
    text-align: center;
    font-size: calc(min(140px, 20vw) * 0.0857);
}

.cs_lost_weight_button span.cs_info_small {
    font-size: 1em;
    line-height: 1em;
    display: block;

}

.cs_lost_weight_button span.cs_info_medium {
    font-size: 2.5em;
    line-height: 1em;
    display: block;
    font-family: Pompiere;
    font-weight: 400;
    margin: calc(1em * 0.333) 0;
}

.cs-dashboard-profile-picture-wrapper:after {
    content: ' ';
    background-image: url(/assets/images/dashboard/03_ball.svg);
    width: 110px;
    height: 121px;
    position: absolute;
    bottom: 0px;
    background-size: contain;
    background-repeat: no-repeat;
    z-index: 5;
    left: -89px;
}

.cs-dashboard-profile-picture-wrapper .header {
    margin: 0 -1px 0 -1px;
}

.cs_normal_tabs .nav-tabs {
    display: flex;
    justify-content: space-between;
    z-index: 10;
}

.cs_normal_tabs .nav-tabs > li.cs_tab_header {
    display: flex;
    margin: 0;
}

.cs_normal_tabs .nav-tabs:before, .cs_normal_tabs .nav-tabs:after {
    display: none;
}

.cs_normal_tab_color .nav-tabs > li.cs_tab_header > a {
    background-color: white;
    text-transform: none;
}

.nav-tabs > li.cs_tab_header > a {
    border: 2px solid #DBDBDB;
    border-bottom: 0;
    border-radius: 20px 20px 0 0;
    font-size: 1.25em;
    line-height: 1.55em;
    color: #6D6D6D;
    text-transform: none;
    padding-top: 17px;
    padding-bottom: 14px;
}

.nav-tabs > li.cs_tab_header.active > a,
.nav-tabs > li.cs_tab_header > a:hover {
    background-color: #c3db66;
    background-color: var(--unnamed-color-c3db66);
    color: white;
    border: 2px solid #DBDBDB;
    border-bottom: 0;
}

.cs_normal_tabs .tab-content {
    border-top: 0;
    padding: 50px 28px 40px 33px;
    background-color: white;
    z-index: 8;
}

.cs_normal_tab_color .tab-content.top-color-border:before {
    background-color: #c3db66;
    background-color: var(--unnamed-color-c3db66);
    height: 7px;
}

.cs_normal_tab_color .tab-content .tab-pane a, .cs_normal_tab_color .tab-content .tab-pane a:visited {
    color: #57DAEE;
}

.cs_normal_tab_color .tab-content .tab-pane a:hover {
    color: #34CBE7;
}

.cs_normal_tab_color .tab-content .tab-pane hr {
    background-color: #707070;
}

table.cs_vertical_table tr td {
    border: 0;
    padding-top: 13px;
    padding-bottom: 13px;
    font-size: 15px;
    line-height: 26px;
}


table.cs_vertical_table tr:nth-of-type(odd) {
    background-color: #F1F1F1;
}

table.cs_vertical_table tr td:first-child {
    font-weight: bold;
    color: #636363;

    width: 38.2%;
    padding-left: 19px;
}

table.cs_vertical_table_even tr:nth-of-type(even) {
    background-color: #F1F1F1;
}


.cs_default_form .form-group {
    border: 0;
    background-color: #F1F1F1;
    padding: 5px 19px 30px 19px;
}

.cs_default_form label {

    font-size: 15px;
    line-height: 26px;
    color: #636363;
    margin-top: 9px;
}

@media (max-width: 520px) {
    .cs_default_form .form-group {
        padding: 5px 9px 10px 9px;
    }

    .cs_default_form label {
        margin-top: 6px;
    }

    .cs_default_form .form-group.cs-avatars {
        padding-bottom: 0;
    }
}


@media (max-width: 520px) {
    .cs_default_form, .cs_default_form label {
        font-size: 12px;
        line-height: 21px;
    }

}

.cs_default_form input, .cs_default_form textarea, cs_default_form div.textarea, .cs_default_form div.form-control {
    /*border: 1px solid blue;*/
    background-color: white;
    border-radius: 0;
    border: 0;
}

/*
checkbox/radiobutton stuff
found on https://moderncss.dev/pure-css-custom-styled-radio-buttons/
 */

.cs_default_form .form-control:focus-within {
    color: var(--unnamed-color-2ed1ea);
}

.cs_default_form input[type="radio"] {
    /* Add if not using autoprefixer */
    -webkit-appearance: none;
    /* Remove most all native input styles */
    appearance: none;
    /* For iOS < 15 */
    background-color: white;
    /* Not removed via appearance */
    margin: 0;

    font: inherit;
    color: currentColor;
    width: 1.63em;
    height: 1.63em;
    /*border: 1px solid currentColor;*/
    border-radius: 50%;
    transform: translateY(-0.075em);
    display: inline-block;
    position: relative;
    place-content: center;
    margin: 10px 19px 10px 0;
    float: left;
}

.cs_default_form .cs-avatars input[type="radio"] {
    margin: 0.626em 0.815em .626em 0;
}

.cs_default_form input[type="radio"]::before {
    content: "";
    width: 0.65em;
    height: 0.65em;
    border-radius: 50%;
    transform: scale(0);
    /*transition: 120ms transform ease-in-out;*/
    box-shadow: inset 1em 1em var(--unnamed-color-2ed1ea);
    /* Windows High Contrast Mode */
    background-color: white;
}

.cs_default_form input[type="radio"]:checked::before {
    transform: scale(1);
    width: 54%;
    height: 54%;
    /* content: ' '; */
    /* background-color: black; */
    /* z-index: 10; */
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.cs_default_form input[type="radio"]:hover {
    outline: max(2px, 0.15em) solid currentColor;
    outline-offset: max(2px, 0.15em);
    cursor: pointer;
}

.cs_default_form input[type="radio"]:focus {
    outline: none;
}

textarea.cs_slogan, textarea.cs_slogan[disabled] {
    min-height: 150px;
    font-size: 1em;
    resize: none;
    background-color: #F9F9F9;
    margin-bottom: 20px;
}

div.textarea {
    height: 100%;
    min-height: 0;
}

@media (max-width: 520px) {
    textarea.cs_slogan, textarea.cs_slogan[disabled], div.textarea {
        min-height: 200px;
    }
}

.cs_default_form .form-group label {
    font-weight: bold;
}

.cs-tabs.cs-tabs-n140:after {
    top: initial;
    bottom: 0;
}

.cs-tabs-n140 .container {
    padding-bottom: 140px;
}

.cs-tabs.cs-tabs-n180:after {
    top: initial;
    bottom: 0;
}

.cs-tabs-n180 .container {
    padding-bottom: 180px;
}

.cs-tabs.cs-tabs-n220:after {
    top: initial;
    bottom: 0;
}

.cs-tabs-n220 .container {
    padding-bottom: 220px;
}

.cs-tabs.cs-tab-margin-top-0:after {
    height: 100%;
}

.cs-tabs.cs-tab-margin-top-20:after {
    height: calc(100% - 20px);
}

.cs-tabs.cs-tab-margin-top-40:after {
    height: calc(100% - 40px);
}

.cs-tabs.cs-tab-margin-top-60:after {
    height: calc(100% - 60px);
}

.cs-tabs.cs-tab-margin-top-80:after {
    height: calc(100% - 80px);
}

.cs-tabs.cs-tab-margin-top-100:after {
    height: calc(100% - 100px);
}

.cs-tabs.cs-tab-margin-top-120:after {
    height: calc(100% - 120px);
}

.cs-tabs.cs-tab-margin-top-140:after {
    height: calc(100% - 140px);
}

.cs-tabs.cs-tab-margin-top-160:after {
    height: calc(100% - 160px);
}

.cs-tabs.cs-tab-margin-top-170:after {
    height: calc(100% - 170px);
}

.cs-tabs.cs-tab-margin-top-180:after {
    height: calc(100% - 180px);
}


div.cs-avatars {
    /*display: flex;*/
    /*flex-wrap: wrap;*/
    /*justify-content: space-between;*/
}


div.cs-avatars div.form-group > label:first-child {
    display: block;
}


div.cs-avatars div.form-group label {
    cursor: pointer;
}

div.cs-avatars div.form-group:hover {
    outline: max(2px, 0.15em) solid currentColor;
}

div.cs-avatars div.form-group.active {
    outline: max(2px, 0.15em) solid currentColor;
}

.cs-avatars img {
    width: 160px;
    height: auto;
    padding: 0;
    border-radius: 0;
    display: block;
}

.form-group input[type=radio] + label {
    cursor: pointer;
}

.cs-avatars.cs-short {
    display: inline-block;
    max-width: 100%;
}

.cs-avatars.cs-short .form-group {
    max-width: 100%;
    display: inline-block;
}

.cs-avatars.cs-short .form-group label,
.cs-avatars.cs-short .form-group figure,
.cs-avatars.cs-short .form-group img {
    max-width: 100%;
    display: inline-block;
}

.cs-avatars.cs-short .form-group label input {
    margin-top: 3px;
}

.cs-avatars.cs-short, .cs-avatars.cs-short .form-group {
    padding-bottom: 0;

}

.cs-avatars.cs-short .form-group label figure img {
    width: 205px;
}

.cs-avatars .swiper-wrapper {
    height: 100%;
}

.cs-avatars .swiper-wrapper .swiper-slide {
    height: 100%;
}

.swiper-button-prev, .swiper-button-next {
    font-size: 5em;
    color: #0dcaf0 !important;
    text-shadow: 1px 1px rgba(250, 250, 250, 0.4);
    top: 44% !important;
}

.swiper-button-prev:after, .swiper-button-next:after {
    display: none;
}

.clickable {
    cursor: pointer;
}

.glas {
    position: relative;
    z-index: 0;
}

.glas[disabled]:after {
    position: absolute;
    width: 100%;
    height: 100%;
    content: ' ';
    background-color: #0dcaf0;
}

.cs-margin-bottom-0 {
    margin-bottom: 0;
}

section.alert-container {
    position: fixed;
    top: 100px;
    z-index: 5000;
    left: 50%;
    background: transparent;
    transform: translateX(-50%);
}

.cs-table-blue table, .cs-table-blue table.table {
    table-layout: fixed;
}

.cs-table-blue table th, .cs-table-blue .table > thead > tr > th {
    background-color: #34CBE7;
    color: white;
    vertical-align: middle;
    text-align: center;
    word-break: normal;
    font-size: 1.25em;
    line-height: 1.35em;
}

.cs-table-blue table tr td, .cs-table-blue .table > tbody > tr > td {
    font-size: 0.9375em;
    line-height: 1.733em;
    color: #636363;
    padding: 10px 8px;
}

a.cs-profile-link, a.cs-profile-link:hover, a.cs-profile-link:active, a.cs-profile-link:visited {
    color: #C3DB66;
    text-decoration: underline;
}

a.cs-title-grey, a.cs-title-grey:hover, a.cs-title-grey:active, a.cs-title-grey:visited {
    color: #636363;
    text-decoration: underline;
}

.cs-sizeable-font {
    font-size: 16px;
}
.cs-sizeable-font.cs-font-15{
    font-size: 15px;
}

.cs-sizeable-font.cs-font-bigger {
    font-size: 20px;
}

@media (max-width: 1199px) {
    .cs-sizeable-font {
        font-size: 15px;
    }

    .cs-sizeable-font.cs-font-bigger {
        font-size: 18px;
    }
}

@media (max-width: 991px) {
    .cs-sizeable-font {
        font-size: 14px;
    }

    .cs-sizeable-font.cs-font-bigger {
        font-size: 16px;
    }
}

@media (max-width: 500px) {

    .cs-sizeable-font.cs-font-bigger {
        font-size: 13px;
    }
}


.swiper-button-prev.swiper-button-disabled, .swiper-button-next.swiper-button-disabled {
    opacity: 0 !important;
}


.cs-offer-wrapper {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-evenly;
    column-gap: 15px;

}

.cs-offer-wrapper .cs-offer {
    min-width: 350px;
    max-width: 572px;
    width: auto;
    aspect-ratio: 1.9 / 1;
    position: relative;
    border-radius: 20px;
    overflow: hidden;
    padding: 0px;
    margin-bottom: 20px;
    flex-grow: 1;
    flex-shrink: 1;
    font-size: 15px;
    line-height: 1.73em;

}

.cs-offer .cs-offer-image {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

.cs-offer .cs-offer-content-layer {
    padding: calc(2.33em - 4px) 1.866em 1.866em 1.866em;
    width: 100%;
    height: 100%;
    position: relative;
    top: 0;
    left: 0;
    color: white;
    transition: background-color 0.5s ease;
}

.cs-offer .cs-offer-content-layer.cs-darken-background.cs-darker-background-02:hover {
    background-color: rgba(0, 0, 0, 0.6);
}

.cs-offer .cs-offer-content-layer.cs-lighten-background.cs-lighter-background-02:hover {
    background-color: rgba(255, 255, 255, 0.6);
}

.cs-offer .cs-offer-content-layer.cs-darken-background:hover {
    background-color: rgba(0, 0, 0, 0.4);
}

.cs-offer .cs-offer-content-layer.cs-lighten-background:hover {
    background-color: rgba(255, 255, 255, 0.4);
}

.cs-offer .cs-offer-content-layer.cs-darker-background-02 {
    background-color: rgba(0, 0, 0, 0.2);
}

.cs-offer .cs-offer-content-layer.cs-lighter-background-02 {
    background-color: rgba(255, 255, 255, 0.2);
}

.cs-offer .cs-offer-content-layer.cs-lighten-background {
    color: black;
}

.cs-offer .cs-offer-content-layer.cs-blue-background {
    color: white;
    background-color: #34cbe7;
    background-color: var(--unnamed-color-34cbe7);
}

.cs-offer .cs-offer-content-layer .theme_button {
    color: white;
    background-color: transparent;
    height: 3.666em;
    border: 2px solid white;
    margin: 0;
    padding: 1.26em 2.266em;
    font-size: 0.93em;
}

.cs-offer .cs-offer-content-layer .theme_button:hover {
    background-color: rgba(0, 0, 0, 0.2);
}

.cs-offer-content-action {
    position: absolute;
    bottom: 1.866em;
    left: 1.866em;
}

.cs-offer-content {
    max-height: 5.2em;
    overflow: hidden;
}

.cs-offer .cs-offer-content-layer .cs-offer-content-logo {
    position: absolute;
    bottom: 1.33em;
    right: 1.33em;
    max-height: 4.13em;
    max-width: 50%;
    background-color: rgba(0, 0, 0, 0.2);
    object-fit: contain;
}

@media (max-width: 499px) {
    .cs-offer-wrapper .cs-offer {
        font-size: 12px;
        min-width: 330px;
        border-radius: 10px;
    }

    .cs-offer-content-action {
        font-size: 10px;
        bottom: 1.2em;
    }

    .cs-offer .cs-offer-content-layer .cs-offer-content-logo {
        font-size: 10px;
        bottom: 0.7em !important;
    }
}

@media (min-width: 904px) {
    .cs-offer-wrapper .cs-offer {
        min-width: max(45%, 421px);
        max-width: max(48%, 421px);
        font-size: 14px;
    }
}


@media (min-width: 1024px) {
    .cs-offer-wrapper .cs-offer {
        font-size: 15px;
        min-width: 450px;
        max-width: min(572px, 48%);
    }
}

@media (min-width: 1600px) {
    .cs-offer-wrapper .cs-offer {
        min-width: 480px;
        max-width: min(32%, 572px);
        font-size: 16px;
    }
}

@media (min-width: 2100px) {
    .cs-offer-wrapper .cs-offer {
        min-width: max(23%, 496px);
        max-width: 23%;
    }
}

.cs-offer-wrapper .cs-offer img.card-image {
    position: absolute;
    top: 0;
    left: 0;

    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;

}

.cs-offer-wrapper .cs-offer-content {
    width: 100%;
    position: relative;
    z-index: 1;
}

.cs-offer-wrapper .cs-offer-content .cs-offer-title {
    z-index: 1;
    position: relative;
}

.cs-offer-wrapper .cs-offer-title {
    position: relative;
    z-index: 1;
}

.cs-offer-wrapper .cs-offer-title h4 {
    color: inherit;
    font-size: 2.2em;
    line-height: 1.2em;
    margin-bottom: 0.33em;
}


.cs-appear-load {
    text-align: center;
}

.cs-load-first .cs-load-more {
    display: none;
}

.cs-quotes-wrapper {
    padding: 0;
    margin: 0;
    position: relative;
}

.cs-quotes:before {
    content: ' ';
    background: url(/assets/images/dashboard/02_marks.svg) no-repeat;
    position: absolute;
    width: 20px;
    height: 37px;
    bottom: -12px;
    right: 4px;
    z-index: 5;
    background-size: cover;
    background-position: center;
}

.cs-quotes:after {
    content: ' ';
    background: url(/assets/images/dashboard/02_marks.svg) no-repeat;
    position: absolute;
    width: 20px;
    height: 37px;
    bottom: -12px;
    right: 4px;
    z-index: 5;
    background-size: cover;
    background-position: center;
}

.cs-quotes-big:after {
    width: 52px;
    height: 65px;
    bottom: -51px;
    right: 25px;
    z-index: 10;
}

.cs-quotes-big:before {
    width: 52px;
    height: 65px;
    top: -13px;
    left: 25px;
    z-index: 10;
}


.cs-image-slide {
    position: relative;


}

.cs-image-slide-content {
    position: absolute;
    padding: 20px;
    top: 50%;
    max-height: 100%;
    transform: translateY(-50%);
    overflow: hidden;
}

.cs-image-slide {
    font-size: 25px;
    line-height: 1.25em;
}

@media (max-width: 767px) {
    .cs-image-slide {
        font-size: 15px;
    }
}

.cs-image-slide h2 {
    font-size: 2.4em;
    line-height: 1.2em;
}

@media (max-width: 499px) {
    .cs-image-slide {
        font-size: 12px;
    }

    .cs-image-slide h2 {
        font-size: 1.8em;

    }
}


.cs-image-slide-shadow-layer {


    width: 100%;
    position: absolute;
    height: 100%;
    top: 0px;
    z-index: 2;
    background: rgba(0, 0, 0, 0.34);
}

@media (max-width: 499px) {
    .cs-image-slide-action {
        position: absolute;
        bottom: -100px;
        width: 100%;
    }

    .cs-image-slide-action .theme_button {
        box-shadow: 1px 1px 1px grey;
    }

    .hidden-xxs {
        display: none;
    }

    .hidden-from-xxs {
        display: block;
    }
}

@media (min-width: 500px) {
    .hidden-from-xxs {
        display: none;
    }

    .hidden-xxs {
        display: block;
    }
}

.cs_default_form.cs_form_bg_white, .cs_default_form.cs_form_bg_white .form-group {
    background-color: white;
    color: #636363;
}

.cs_default_form.cs_form_bg_white input[type="radio"] {
    outline: max(2px, 0.15em) solid #707070;
}

.cs_default_form.cs_form_inputs_small input[type="radio"] {
    width: 0.933em;
    height: 0.933em;
}


.blocks-centered {
    text-align: center;
}

.blocks-centered div {
    text-align: left;
    display: inline-block;
    margin-right: 1.5em;
}

.cs_default_form select {
    border-radius: 0;
    height: 2.66em;
    padding: 0 0 0 1em;
    margin-left: 1em;
    font-size: 1em;
}

@media (max-width: 1199px) {
    .blocks-centered div {
        display: block;
        margin-right: 0;
        margin-top: 5px;
        clear: both;
        position: relative;
    }

    .blocks-centered div select.cs-offer-filter {
        position: absolute;
        left: 15.5em;;
    }
}

@media ( max-width: 499px) {
    form.cs_default_form, form.cs_default_form .form-group {
        padding-left: 0;
        padding-right: 0;
    }

    form.cs_default_form .form-group input[type="radio"] {
        margin-right: 0.5em;
        margin-top: 8px;
    }

    form.cs_default_form .form-group select.cs-offer-filter {
        padding-left: 0.3em;
        margin-left: 0.3em;
    }

    .blocks-centered div {
        padding-left: 0;
        padding-right: 0;
    }
}

#offers .cs_default_form .form-group {
    margin-bottom: 0;
    padding-bottom: 0;
}

.cs-intro-section .theme_button.form-control {
    height: auto;
}

.cs-ranking-page-timer-wrapper {
    background-color: #F1F1F1;
    border-radius: 20px;
    padding-top: 15px;
    padding-bottom: 20px;
}

.cs-ranking-page-timer-wrapper .countdown-amount {
    background-color: white;
}


.cs-ranking-page-tabs.cs_normal_tabs .nav-tabs {
    justify-content: flex-start;
    column-gap: 6px;
}


.scroll-table select {
    height: auto;
    padding: 5px;
    text-align: right;
}


/************** Ranking pages   *************/

table.cs-ranking-table.cs-sizeable-font {
    font-size: 20px;
    line-height: 1.35em;
}

table.cs-ranking-table.cs-sizeable-font tbody {
    font-size: 0.75em;
    line-height: 1.733em;
}

.cs-ranking-table thead tr {
    background-color: #34CBE7;
    text-align: center;
    color: white;
}

.cs-ranking-table thead tr th {
    border: 0;
    color: white;
    font-size: 1em;
    line-height: 1.35em;
}

.cs-ranking-table tbody tr {
    color: #636363;
}

.cs-ranking-table tbody tr.cs-ranking-table-first-rank {
    background: transparent linear-gradient(180deg, #C3DB66 0%, #41C5E4 100%) 0% 0% no-repeat padding-box;
}

.cs-ranking-table tbody tr:nth-child(2n) {
    background-color: #f1f1f1;
}

.cs-ranking-table tbody tr td {
    border: 0;
    border-left: 3px solid white;
    vertical-align: middle;
    padding-top: 1.133em;
    padding-bottom: 1.133em;
}

.cs-ranking-table tbody tr td:first-child, .cs-ranking-table tbody tr td:nth-child(2) {
    border-left: 0;
}

.cs-ranking-table tbody tr.cs-ranking-table-first-rank {
    color: white;
}

.cs-ranking-table a.theme_button.btn-color-green, .cs-ranking-table a.theme_button.btn-color-green:visited {
    color: #FFFFFF;
    margin-bottom: 0;
}

.cs-ranking-table a.theme_button.btn-color-green:hover {
    color: #C3DB66;
    background-color: white;
}

.cs-ranking-table tbody tr td:last-child, .cs-ranking-table thead tr th:last-child {
    text-align: center;
}

.cs-ranking-table tbody tr.cs-ranking-table-first-rank td:nth-child(2) {
    font-weight: bold;
}

.cs-ranking-table tbody tr td:nth-child(2) {
    text-decoration: underline;
}

.cs-ranking-table thead tr th:first-child {
    text-align: center;
}

.cs-ranking-table tbody tr td:first-child {
    padding-left: 0;
}

.cs-ranking-table-rank {
    position: relative;
    margin-left: 1.666em;
}

.cs-ranking-table-rank .cs-ranking-table-image {
    position: relative;
    height: 120px;
    width: 120px;
    border: 6px solid transparent;
    border-radius: 60px;
    overflow: hidden;
    display: inline-block;
    box-sizing: border-box;
    background: transparent linear-gradient(180deg, #C3DB66 0%, #41C5E4 100%) 0% 0% no-repeat border-box;
}

.cs-ranking-table tbody tr.cs-ranking-table-first-rank .cs-ranking-table-rank .cs-ranking-table-image {
    border: 6px solid white;
}

.cs-ranking-table-rank .cs-ranking-table-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.cs-ranking-table-rank .cs-ranking-table-number {
    position: absolute;
    top: -0.33em;
    left: -1em;
    width: 4em;
    height: 4em;
    border-radius: 30px;
    background-color: #2ed1ea;
    overflow: hidden;
    text-align: center;
    padding-top: 0.8em;
    line-height: 1.2em;
    color: white;
    transform: matrix(1, 0.02, -0.02, 1, 0, 0);
    letter-spacing: 0px
}

.cs-ranking-table-image-wrapper {
    position: relative;
    display: inline-block;
}

.cs-ranking-table tbody tr.cs-ranking-table-first-rank .cs-ranking-table-rank .cs-ranking-table-number {
    background-color: white;
    border: 3px solid white;
    top: 1.33em;
    height: 68px;
    width: 68px;
    border-radius: 34px;
    color: #34CBE7;
    font-size: 1.133em;
    line-height: 1.058em;
    transform: matrix(1, 0.02, -0.02, 1, 0, 0);
    letter-spacing: 0px;
    font-weight: bold;
    left: -1.2em;
}

.intro-special-girls.into-pic-smaller {
    max-width: 100%;
}

.btn_use_space_minimal_padding {
    width: 100%;
    padding: 1.6em 10px;
}

.cs-mass-data-readable {
    font-family: "Lucida Console", "Tahoma", "Helvetica", "Arial", sans-serif;
    font-size: 0.8em;
}


/************ prizes box *******************/

.cs-prizes-box {
    text-align: center;

}

.cs-prizes-box p {
    font-size: 0.7em;
    margin-bottom: 2.14em;
    line-height: 1em;
}

.cs-prizes-box .cs-prize-field {
    display: inline-block;
    margin-left: 2.5%;
    width: 29.4%;
}

.cs-prizes-box .cs-prize-field:first-child {
    margin-left: 0;
}

.cs-prizes-box .cs-prize-field .cs-prize-field-description {
    font-size: 0.7em;
    line-height: 1.733em;
    margin: 0;
    text-transform: uppercase;
    margin-top: 0.5em;
}

.cs-prizes-box .cs-prize-field .cs-prize-field-value {
    width: 100%;
    height: 2.65em;
    padding: 0.66em 0.4em;
    text-align: center;
    background-color: white;
    box-shadow: 0px 3px 6px #00000029;
    border-radius: 20px;
    margin: 0;
    font-weight: bold;
    line-height: 1.4em;
}

.visible-below-992 {
    display: none;
}

.normal-weight {
    font-weight: normal;
}

.no-decoration {
    text-decoration: none;
}

@media (max-width: 991px) {
    table.cs-ranking-table th {
        display: none;
    }

    table.cs-ranking-table tbody td, .cs-ranking-table tbody tr {
        display: inline-block;
        width: 100%;
        border: 0;
        text-align: center;
    }

    table.cs-ranking-table tbody td {
        padding: 0;
    }

    .cs-ranking-table-rank .cs-ranking-table-image {
        height: 30vw;
        width: 30vw;
        border-radius: 15vw;
    }

    .cs-ranking-table-rank {
        margin-left: 0;
    }

    .cs-ranking-table tbody tr td:nth-child(2) {
        text-decoration: none;
    }

    .cs-ranking-table tbody tr td:first-child {
        padding-top: 30px;
        padding-bottom: 20px;
    }

    .cs-ranking-table tbody tr td:last-child {
        padding-top: 1.5em;
        padding-bottom: 25px;
    }

    .bold-below-992 {
        font-weight: bold;
    }

    table.cs-ranking-table .visible-below-992 {
        display: inline-block;
    }

}

.button-multiline {
    line-height: 1.33em;
}

.cs-podest-wrapper {
    position: relative;
    padding: 0;
    margin: 20px;
    font-size: 15px; /* used for border thickness later*/
}

.cs-podest-wrapper.col-6-md {
    font-size: 15px;
}


.cs-podest-percentage {
    position: absolute;
    display: inline-block;
    width: 13.7%;
    padding-bottom: 13.7%;
    border-radius: 50%;
    background: #2ED1EA;
    z-index: 3;
    font-size: 1.33em;
}

.cs-podest-rank {
    position: absolute;
    display: inline-block;
    width: 23%;
    font-size: 1.7em;
    font-family: Pompiere;
    font-weight: normal;
    line-height: 1.2em;
    color: white;
    text-align: center;
}

.cs-podest-rank-0 {
    left: 38%;
    top: 58%;
}

.cs-podest-rank-0 span {
    font-size: 1.6em;
    line-height: 1.2em;
}

.cs-podest-rank-1 {
    left: 10%;
    top: 63%;
}

.cs-podest-rank-2 {
    left: 69%;
    top: 63%;
}


.cs-podest-percentage .cs-podest-percentage-value {
    position: absolute;
    color: white;
    line-height: 1.2em;
    text-align: center;
    width: 100%;
    top: 50%;
    transform: translateY(-50%);
}

.cs-podest-percentage-0 {
    width: 17.5%;
    padding-bottom: 17.5%;
    left: 43.3%;
    top: 1%;
}

.cs-podest-percentage-0 .cs-podest-percentage-value {
    font-size: 1.2em;

}

.cs-podest-percentage-1 {
    left: 15%;
    top: 22%;
}

.cs-podest-percentage-2 {
    left: 75.4%;
    top: 22%;
}

.cs-podest-below-text {
    font-size: 1em;
    color: white;
    line-height: 1.2em;
    width: 40%;
    position: absolute;
    left: 50%;
    top: 87%;
    transform: translateX(-50%);
    padding: 1em 1.33em 1em 1.33em;
    background-color: #F3702B;
    border-radius: 1.33em;
    text-align: center;
    z-index: 0;
}

@media (max-width: 1199px) {
    .cs-podest-percentage {
        font-size: 1.1em;
    }

    .cs-podest-rank {
        font-size: 1.4em;
    }
}

@media (max-width: 991px) {
    .cs-podest-wrapper.col-6-md {
        font-size: 10px;
    }

    .cs-podest-percentage {
        font-size: 1.8em;
    }

    .cs-podest-rank {
        font-size: 2em;
    }

    .cs-podest-below-text {
        font-size: 1.6em;
    }

}

@media (max-width: 767px) {
    .cs-podest-wrapper.col-6-md {
        font-size: 8px;
    }

    .cs-podest-rank {
        font-size: 2.2em;
    }
}

@media (max-width: 575px) {
    .cs-podest-wrapper.col-6-md {
        font-size: 6px;
    }

    .cs-podest-rank {
        font-size: 2em;
    }
}

@media (max-width: 450px) {
    .cs-podest-percentage {
        font-size: 1.6em;
    }
}

.cs-podest-item {
    display: inline-block;
    position: absolute;
    z-index: 2;
    box-sizing: content-box;
    background: transparent linear-gradient(180deg, #C3DB66 0%, #41C5E4 100%) 0% 0% no-repeat border-box;

}


.cs-podest-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
}

.cs-podest-background-image {
    width: 100%;
}

.cs-podest-item-0 {
    left: 35.6%;
    width: 27.5%;
    padding-bottom: 27.5%;
    top: 13%;
    position: absolute;
    border-radius: calc(50%);
    border: 1em solid transparent;
    overflow: hidden;
}

.cs-podest-item-1 {
    left: 10.8%;
    width: 19.3%;
    padding-bottom: 19.3%;
    top: 32%;
    position: absolute;
    border-radius: calc(50%);
    border: 0.66em solid transparent;
    overflow: hidden;
}

.cs-podest-item-2 {
    left: 70.8%;
    width: 19.3%;
    padding-bottom: 19.3%;
    top: 32%;
    position: absolute;
    border-radius: calc(50%);
    border: 0.66em solid transparent;
    overflow: hidden;
}


span.smaller-90 {
    font-size: 0.9em;
}

span.smaller-80 {
    font-size: 0.8em;
}

.underline {
    text-decoration: underline;
}

.cs-podest-special-width {
    width: calc(100% + min(5vw, 100px));
}

.cs-paginator {
    background: transparent;
    display: inline-block;
}

.cs-paginator .cs-paginator-prev, .cs-paginator .cs-paginator-next {
    color: white;
    display: inline-block;
}

.cs-paginator .cs-paginator-prev i, .cs-paginator .cs-paginator-next i {
    font-size: 2em;
    line-height: 0.8em;
    cursor: pointer;
}

.cs-paginator.cs-paginator-archive .cs-paginator-icon {
    padding-top: 0.2em;
}

.cs-paginator.cs-paginator-archive .cs-paginator-next, .cs-paginator.cs-paginator-archive .cs-paginator-prev {
    color: #636363;
    cursor: pointer;
    margin-top: 0.8em;
}

.cs-paginator.cs-paginator-archive .cs-paginator-prev {
    margin-right: 2.5em;
}

.cs-paginator *::selection {
    background: transparent;
    color: #636363;
}

.cs-paginator-archive .cs-paginator-next div, .cs-paginator-archive .cs-paginator-prev div {
    display: inline-block;
    vertical-align: top;
}

.cs-paginator .cs-paginator-dots {
    display: inline-block;
    max-width: calc(100% - 4em);
    float: left;
}

.cs-paginator .cs-paginator-dot:last-child {
    margin-right: 0;
}

.cs-paginator .cs-paginator-prev {
    float: left;
}

.cs-paginator .cs-paginator-dot {
    background: white;
    display: inline-block;
    width: 1em;
    height: 1em;
    margin-right: 0.6em;
    border-width: 0px;
    border-radius: 50%;
    cursor: pointer;
}

.cs-paginator .cs-paginator-dot.active {
    background: #2ED1EA;
}

.unshow {
    visibility: hidden;
}

.cs-paginator.cs-paginator-center {
    text-align: center;
    display: inline-block;
}

.cs-paginator-grey i {
    color: #D5D5D5;
}

.cs-paginator-grey .cs-paginator-dot {
    background: #D5D5D5;
}

tr.cs-row-canceled {
    background-color: #efaca5;
}

td:target {
    position: relative;
}

td:target:before {
    content: "\e110";
    font-family: 'rt-icons-2' !important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    position: absolute;
    right: -0.3em;
    top: 50%;
    transform: translateY(-50%);
    color: #20e824;
    font-size: 2em;
    height: auto;
    margin: 0;
}

td:target:after {
    content: "\e111";
    font-family: 'rt-icons-2' !important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    position: absolute;
    left: -0.3em;
    top: 50%;
    transform: translateY(-50%);
    color: #20e824;
    font-size: 2em;

}


.cs-recipie-underline{
    text-decoration: underline;
}
.cs-recipies{
    font-size: 1em;
    line-height: 1.73em;
}

.tab-pane:target{
    background: transparent;
}

.cs-sizeable-font select{
    font-size: inherit;
}

@media (max-width: 500px){
    .cs-small-center{
        text-align: center;
    }

}


input.blob-upload[type="file"] {
    display: none;
}

object#file_preview{
    height: auto;
    object-fit: scale-down;
}

.cs-profile-pic-swiper{
    padding-left: 10px !important;
padding-right: 10px !important;
padding-top: 10px !important;
    width: 100%;
}

.cs-avatars img.cs-avatars-full-width{
    width: 100%;
    object-fit: contain;
}
figure.item-media.cs-profile-picture{
    display: block !important;
    width: 100%;
}
figure.item-media.cs-profile-picture img{
    width: 100%;
    object-fit: contain;
}


div.active > .cs-delete-picture{
    display: none;
}

.cs-delete-picture{
    display: inline-block;
    float: right;
    font-size: 2em;
    margin-top: 0.2em;
}
.cs-delete-picture:hover{
    color: #e85242;
}

@media screen and (min-width: 768px) {
    .rmPopup.rmPopup--modal.rmLayout--vertical.rmBase{
        top: 150px !important;
    }
}

input[type="date"]{
    text-transform: lowercase;
}

.cs-private-challenge-table{

}
.cs-private-challenge-table tbody tr td .cs-show-small{
    display: none;
}

@media (max-width: 767px) {
    .cs-private-challenge-table th{
        display: none;
    }

    .cs-private-challenge-table tbody tr {
        border-bottom: 2px solid #ddd;
    }

    .cs-private-challenge-table tbody tr td{
        display: block;
        width: 100%;
        border: none;
    }

    .cs-private-challenge-table tbody tr td .cs-show-small{
        display: inline-block;
        width: 33%;
        height: 2em;
        float: left;
        font-weight: bold;
    }
}

input[type='number'] {
    -moz-appearance: auto;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: auto;
}

.cs_info_button_33_euro span.cs_info_big:before{
    content : ' ';
}
.cs_info_button_33_euro span.cs_info_big{

}

.home-page-advertising {
    background: transparent;
}

.home-page-advertising:before{
    content: '';

}
.home-page-advertising:after{
    content: '';

}