/* itrk-aside.css */

#Article > aside {
    margin: 3em 0em;
}

#Article > aside h2::after,
#Article > aside h3::after,
#Article > aside h4::after {
    content: none;
}


div.itrk-columns-3 {
    max-width   : 100%;
    white-space : nowrap;
}

div.itrk-columns-4 {
    max-width   : 100%;
    white-space : nowrap;
}

div.itrk-columns-2 {
    max-width   : 100%;
    white-space : nowrap;
}


div.itrk-columns-2 > * > *:first-child,
div.itrk-columns-3 > * > *:first-child,
div.itrk-columns-4 > * > *:first-child {
    margin-top : 0 !important;
}

div.itrk-columns-2 > * > *:last-child,
div.itrk-columns-3 > * > *:last-child,
div.itrk-columns-4 > * > *:last-child {
    margin-bottom : 0 !important;
}

div.itrk-columns-2 > div img,
div.itrk-columns-3 > div img,
div.itrk-columns-4 > div img {
    max-width : 100%;
}


div.itrk-columns-2 > * {
    display     : inline-block;
    width       : 50%;

    white-space : normal;
    box-sizing  : border-box;
}

div.itrk-columns-2 > *:first-child {
    padding-right : 5px;
}

div.itrk-columns-2 > *:last-child {
    padding-left : 5px;
}

div.itrk-columns-2.golden-cut > *:first-child {
    width : 62% !important;
}

div.itrk-columns-2.golden-cut > *:last-child {
    width : 38% !important;
}

div.itrk-columns-2.golden-cut.reverse > *:first-child {
    width : 38% !important;
}

div.itrk-columns-2.golden-cut.reverse > *:last-child {
    width : 62% !important;
}

div.itrk-columns-2.size-60-40 > *:first-child {
    width : 60% !important;
}

div.itrk-columns-2.size-60-40 > *:last-child {
    width : 40% !important;
}

div.itrk-columns-2.size-40-60 > *:first-child {
    width : 40% !important;
}

div.itrk-columns-2.size-40-60 > *:last-child {
    width : 60% !important;
}

div.itrk-columns-2.size-70-30 > *:first-child {
    width : 70% !important;
}

div.itrk-columns-2.size-70-30 > *:last-child {
    width : 30% !important;
}

div.itrk-columns-2.size-30-70 > *:first-child {
    width : 30% !important;
}

div.itrk-columns-2.size-30-70 > *:last-child {
    width : 70% !important;
}

div.itrk-columns-2.size-80-20 > *:first-child {
    width : 80% !important;
}

div.itrk-columns-2.size-80-20 > *:last-child {
    width : 20% !important;
}

div.itrk-columns-2.size-25-75 > *:first-child {
    width : 25% !important;
}
div.itrk-columns-2.size-25-75 > *:last-child {
    width : 75% !important;
}

div.itrk-columns-2.size-20-80 > *:first-child {
    width : 20% !important;
}
div.itrk-columns-2.size-20-80 > *:last-child {
    width : 80% !important;
}

div.itrk-columns-2.size-85-15 > *:first-child {
    width : 85% !important;
}

div.itrk-columns-2.size-85-15 > *:last-child {
    width : 15% !important;
}

div.itrk-columns-2.size-15-85 > *:first-child {
    width : 15% !important;
}

div.itrk-columns-2.size-15-85 > *:last-child {
    width : 85% !important;
}

div.itrk-columns-2.h-gap-20 > *:first-child {
    padding-right : 10px !important;
}

div.itrk-columns-2.h-gap-20 > *:last-child {
    padding-left : 10px !important;
}

div.itrk-columns-2.h-gap-30 > *:first-child {
    padding-right : 15px !important;
}

div.itrk-columns-2.h-gap-30 > *:last-child {
    padding-left : 15px !important;
}

div.itrk-columns-2.h-gap-40 > *:first-child {
    padding-right : 20px !important;
}

div.itrk-columns-2.h-gap-40 > *:last-child {
    padding-left : 20px !important;
}

div.itrk-columns-2.h-gap-50 > *:first-child {
    padding-right : 25px !important;
}

div.itrk-columns-2.h-gap-50 > *:last-child {
    padding-left : 25px !important;
}


div.itrk-columns-3 > * {
    display     : inline-block;
    width       : 33.3%;

    white-space : normal;
    box-sizing  : border-box !important;
}

div.itrk-columns-3 > *:first-child {
    padding-right : 5px;
}

div.itrk-columns-3 > *:last-child {
    padding-left : 5px;
}

div.itrk-columns-3.size-40-20-40 > * {
    width : 20% !important;
}
div.itrk-columns-3.size-40-20-40 > *:first-child,
div.itrk-columns-3.size-40-20-40 > *:last-child {
    width : 40% !important;
}

div.itrk-columns-3 > div h1,
div.itrk-columns-3 > div h2,
div.itrk-columns-3 > div h3,
div.itrk-columns-3 > div h4,
div.itrk-columns-3 > div h5 {
    margin-top : 0 !important;
}

div.itrk-columns-3.h-gap-20 > *:first-child {
    padding-right : 10px !important;
}

div.itrk-columns-3.h-gap-20 > *:last-child {
    padding-left : 10px !important;
}

div.itrk-columns-3.h-gap-30 > *:first-child {
    padding-right : 15px !important;
}

div.itrk-columns-3.h-gap-30 > *:last-child {
    padding-left : 15px !important;
}

div.itrk-columns-3.h-gap-40 > *:first-child {
    padding-right : 20px !important;
}

div.itrk-columns-3.h-gap-40 > *:last-child {
    padding-left : 20px !important;
}

div.itrk-columns-3.h-gap-50 > *:first-child {
    padding-right : 25px !important;
}

div.itrk-columns-3.h-gap-50 > *:last-child {
    padding-left : 25px !important;
}


div.itrk-columns-4 > * {
    display     : inline-block;
    width       : 25%;

    white-space : normal;
    box-sizing  : border-box !important;
}

div.itrk-columns-2.vertically-aligned > *,
div.itrk-columns-3.vertically-aligned > *,
div.itrk-columns-4.vertically-aligned > * {
    vertical-align: middle !important;
}

@media all and (max-width : 767px) {
    div.itrk-columns-2.auto-wrap,
    div.itrk-columns-3.auto-wrap {
        white-space : unset;
    }

    div.itrk-columns-2.auto-wrap > *,
    div.itrk-columns-2.size-25-75.auto-wrap > *,
    div.itrk-columns-2.size-20-80.auto-wrap > *,
    div.itrk-columns-2.size-30-70.auto-wrap > *,
    div.itrk-columns-2.size-40-60.auto-wrap > *,
    div.itrk-columns-2.size-60-40.auto-wrap > *,
    div.itrk-columns-2.size-70-30.auto-wrap > *,
    div.itrk-columns-2.size-80-20.auto-wrap > *,
    div.itrk-columns-2.size-85-15.auto-wrap > *,
    div.itrk-columns-2.golden-cut.auto-wrap > *,
    div.itrk-columns-2.golden-cut.reverse.auto-wrap > *,
    div.itrk-columns-3.auto-wrap > *,
    div.itrk-columns-3.size-20-80.auto-wrap > *,
    div.itrk-columns-3.size-25-75.auto-wrap > *,
    div.itrk-columns-3.size-30-70.auto-wrap > *,
    div.itrk-columns-3.size-40-60.auto-wrap > *,
    div.itrk-columns-3.size-60-40.auto-wrap > *,
    div.itrk-columns-3.size-70-30.auto-wrap > *,
    div.itrk-columns-3.size-80-20.auto-wrap > *,
	div.itrk-columns-3.size-40-20-40.auto-wrap > *,
    div.itrk-columns-3.golden-cut.auto-wrap > *,
    div.itrk-columns-3.golden-cut.reverse.auto-wrap > * {
        /* display       : block; */
        width         : 100% !important;
        padding-left  : 0 !important;
        padding-right : 0 !important;
    }

    div.itrk-columns-2.auto-wrap.v-gap-10 > *:first-child {
        margin-bottom : 10px;
    }

    div.itrk-columns-2.auto-wrap.v-gap-15 > *:first-child {
        margin-bottom : 15px;
    }

    div.itrk-columns-2.auto-wrap.v-gap-20 > *:first-child {
        margin-bottom : 20px;
    }

    div.itrk-columns-2.auto-wrap.v-gap-30 > *:first-child {
        margin-bottom : 30px;
    }

    div.itrk-columns-2.auto-wrap.v-gap-40 > *:first-child {
        margin-bottom : 40px;
    }

    div.itrk-columns-2.auto-wrap.v-gap-50 > *:first-child {
        margin-bottom : 50px;
    }

    div.itrk-columns-2.auto-wrap.v-gap-60 > *:first-child {
        margin-bottom : 60px;
    }

    div.itrk-columns-3.auto-wrap.v-gap-10 > * {
        margin-bottom : 10px;
    }

    div.itrk-columns-3.auto-wrap.v-gap-10 > *:last-child {
        margin-bottom : 0;
    }

    div.itrk-columns-3.auto-wrap.v-gap-15 > * {
        margin-bottom : 15px;
    }

    div.itrk-columns-3.auto-wrap.v-gap-15 > *:last-child {
        margin-bottom : 0;
    }

    div.itrk-columns-3.auto-wrap.v-gap-20 > * {
        margin-bottom : 20px;
    }

    div.itrk-columns-3.auto-wrap.v-gap-20 > *:last-child {
        margin-bottom : 0;
    }

    div.itrk-columns-3.auto-wrap.v-gap-30 > * {
        margin-bottom : 30px;
    }

    div.itrk-columns-3.auto-wrap.v-gap-30 > *:last-child {
        margin-bottom : 0;
    }

    div.itrk-columns-3.auto-wrap.v-gap-40 > * {
        margin-bottom : 40px;
    }

    div.itrk-columns-3.auto-wrap.v-gap-40 > *:last-child {
        margin-bottom : 0;
    }

    div.itrk-columns-3.auto-wrap.v-gap-50 > * {
        margin-bottom : 50px;
    }

    div.itrk-columns-3.auto-wrap.v-gap-50 > *:last-child {
        margin-bottom : 0;
    }

    div.itrk-columns-3.auto-wrap.v-gap-60 > * {
        margin-bottom : 60px;
    }

    div.itrk-columns-3.auto-wrap.v-gap-60 > *:last-child {
        margin-bottom : 0;
    }


    div.itrk-columns-2.auto-wrap.h-gap-20 > * {
        padding-left  : 0 !important;
        padding-right : 0 !important;
    }

    div.itrk-columns-2.auto-wrap.h-gap-30 > * {
        padding-left  : 0 !important;
        padding-right : 0 !important;
    }

    div.itrk-columns-2.auto-wrap.h-gap-40 > * {
        padding-left  : 0 !important;
        padding-right : 0 !important;
    }

    div.itrk-columns-2.auto-wrap.h-gap-50 > * {
        padding-left  : 0 !important;
        padding-right : 0 !important;
    }

    div.itrk-columns-3.auto-wrap.h-gap-20 > * {
        padding-left  : 0 !important;
        padding-right : 0 !important;
    }

    div.itrk-columns-3.auto-wrap.h-gap-30 > * {
        padding-left  : 0 !important;
        padding-right : 0 !important;
    }

    div.itrk-columns-3.auto-wrap.h-gap-40 > * {
        padding-left  : 0 !important;
        padding-right : 0 !important;
    }

    div.itrk-columns-3.auto-wrap.h-gap-50 > * {
        padding-left  : 0 !important;
        padding-right : 0 !important;
    }

}

div.itrk-columns-2 > div h3[tinytext]:before,
div.itrk-columns-3 > div h3[tinytext]:before {
    margin-top : 5px !important;
}


/* itrk-colors.css */

:root {
    --primary-color                  : #ef7d00;
    --secondary-color                : #0c6ec6;
    --tertiary-color                 : #585858;
    
    --orange-color                   : var(--primary-color);
    --dark-orange-color              : #cc6600;
    --red-color                      : #cc3333;
    --green-color                    : #009500;
    --easysafe-blue                  : #16b8ff;
    --light-blue                     : #dbe9f2;
    --blue-color                     : var(--secondary-color);
    --dark-blue                      : #005aa0;
    --color-ocean                    : #23abe3;
    --yellow-color                   : #fcc52a;
    
    --white                          : #ffffff;
    --lightgray                      : var(--lightgray-2);
    --lightgray-1                    : #fafafa;
    --lightgray-1-hover              : #e5e5e5;
    --lightgray-2                    : #f5f5f5;
    --lightgray-2-transparent        : #f5f5f5ef;
    --lightgray-3                    : #f1f1f1;
    --lightgray-4                    : #9e9e9e;
    --lightgray-border               : #d0d0d0;
    --darkgray                       : #585858;
    --darkgray-2                     : #333333;
    --background-blue                : #e6f0f9;
    --background-gray                : #f7f7f7;
    --background-primary             : #ffecd8;
    --background-primary2            : #f8c48c;
    --background-primary2-hover      : #F5B770;
    
    --form-input-disabled-background : rgba(0, 0, 0, 0.03);
    
    /* Small preparations for semantic color properties that we wanna introduce soon */
    --color-info                     : var(--blue-color);
    --color-success                  : var(--green-color);
    --color-warning                  : var(--orange-color);
    --color-error                    : var(--red-color);
}

.itrk-bg-primary {
    background-color : var(--primary-color) !important;
}

.itrk-bg-secondary {
    background-color : var(--secondary-color) !important;
}

.itrk-bg-tertiary {
    background-color : var(--tertiary-color) !important;
}

.itrk-bg-orange {
    background-color : var(--orange-color) !important;
}

.itrk-bg-dark-orange {
    background-color : var(--dark-orange-color) !important;
}

.itrk-bg-red {
    background-color : var(--red-color) !important;
}

.itrk-bg-green {
    background-color : var(--green-color) !important;
}

.itrk-bg-lightblue {
    background-color : var(--light-blue) !important;
}

.itrk-bg-blue {
    background-color : var(--blue-color) !important;
}

.itrk-bg-dark-blue {
    background-color : var(--dark-blue) !important;
}

.itrk-bg-ocean {
    background-color : var(--color-ocean) !important;
}

.itrk-bg-white {
    background-color : var(--white) !important;
}

.itrk-bg-gray {
    background-color : var(--background-gray) !important;
}

.itrk-bg-lightgray {
    background-color : var(--lightgray) !important;
}

.itrk-bg-lightgray-1 {
    background-color : var(--lightgray-1) !important;
}

.itrk-bg-lightgray-2 {
    background-color : var(--lightgray-2) !important;
}

.itrk-bg-lightgray-3 {
    background-color : var(--lightgray-3) !important;
}

.itrk-bg-lightgray-4 {
    background-color : var(--lightgray-4) !important;
}

.itrk-bg-darkgray {
    background-color : var(--darkgray) !important;
}

.itrk-bg-darkgray-2 {
    background-color : var(--darkgray-2) !important;
}

.itrk-bg-yellow {
    background-color : var(--yellow-color) !important;
}

/* Text colors */

.color-primary {
    color : var(--primary-color) !important;
}

.color-secondary {
    color : var(--secondary-color) !important;
}

.color-tertiary {
    color : var(--tertiary-color) !important;
}

.color-orange {
    color : var(--orange-color) !important;
}

.color-dark-orange {
    color : var(--dark-orange-color) !important;
}

.color-red {
    color : var(--red-color) !important;
}

.color-green {
    color : var(--green-color) !important;
}

.color-lightblue {
    color : var(--light-blue) !important;
}

.color-blue {
    color : var(--blue-color) !important;
}

.color-dark-blue {
    color : var(--dark-blue) !important;
}

.color-ocean {
    color : var(--color-ocean) !important;
}

.color-lightgray {
    color : var(--lightgray) !important;
}

.color-lightgray-1 {
    color : var(--lightgray-1) !important;
}

.color-lightgray-2 {
    color : var(--lightgray-2) !important;
}

.color-lightgray-3 {
    color : var(--lightgray-3) !important;
}

.color-lightgray-4 {
    color : var(--lightgray-4) !important;
}

.color-darkgray {
    color : var(--darkgray) !important;
}

.color-darkgray-2 {
    color : var(--darkgray-2) !important;
}

.color-yellow {
    color : var(--yellow-color) !important;
}

/* Border Colors */

.border-color-primary {
    border-color : var(--primary-color) !important;
}

.border-color-secondary {
    border-color : var(--secondary-color) !important;
}

.border-color-tertiary {
    border-color : var(--tertiary-color) !important;
}

.border-color-orange {
    border-color : var(--primary-color) !important;
}

.border-color-dark-orange {
    border-color : var(--dark-orange-color) !important;
}

.border-color-red {
    border-color : var(--red-color) !important;
}

.border-color-green {
    border-color : var(--green-color) !important;
}

.border-color-lightblue {
    border-color : var(--light-blue) !important;
}

.border-color-blue {
    border-color : var(--blue-color) !important;
}

.border-color-dark-blue {
    border-color : var(--dark-blue) !important;
}

.border-color-ocean {
    border-color : var(--color-ocean) !important;
}

.border-color-lightgray {
    border-color : var(--lightgray) !important;
}

.border-color-lightgray-1 {
    border-color : var(--lightgray-1) !important;
}

.border-color-lightgray-2 {
    border-color : var(--lightgray-2) !important;
}

.border-color-lightgray-3 {
    border-color : var(--lightgray-3) !important;
}

.border-color-lightgray-4 {
    border-color : var(--lightgray-4) !important;
}

.border-color-darkgray {
    border-color : var(--darkgray) !important;
}

.border-color-darkgray-2 {
    border-color : var(--darkgray-2) !important;
}

.border-color-white {
    border-color : #ffffff !important;
}

.border-color-black {
    border-color : #000000 !important;
}

.border-color-light {
    border-color : var(--lightgray) !important;
}

.border-color-dark {
    border-color : var(--darkgray) !important;
}

.border-color-yellow {
    border-color : var(--yellow-color) !important;
}


.border-info {
    border-color : var(--color-info);
}

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

.border-warning {
    border-color : var(--color-warning);
}

.border-error, .border-danger {
    border-color : var(--color-error);
}


div.itrk-flex-columns {
    --col-min: 200px;
    --col-gap: 10px;
    --row-gap: var(--col-gap, 10px);
    --col-basis: calc(50% - var(--col-gap)/2);
    display: flex;
    gap: var(--col-gap, 10px);
    row-gap: var(--row-gap, 10px);
    max-width: 100%;
    align-items: stretch;
    hyphens: auto;
    overflow-wrap: break-word;
    word-break: break-word;
}

.itrk-flex-columns > * { min-width: 0; overflow-wrap: anywhere; }

div.itrk-flex-columns.vertically-aligned { align-items: center }
div.itrk-flex-columns.horizontally-aligned { justify-content: center }

div.itrk-flex-columns > div img {
    max-width: 100%; height: auto;
}

.itrk-flex-columns.size-60-40,
.itrk-flex-columns.size-40-60 {
    --col-min: calc(350px - (var(--col-gap) / 2));
}

.itrk-flex-columns.size-70-30,
.itrk-flex-columns.size-30-70 {
    --col-min: calc(250px - (var(--col-gap) / 2));
}

.itrk-flex-columns.size-80-20,
.itrk-flex-columns.size-20-80 {
    --col-min: calc(150px - (var(--col-gap) / 2));
}

.itrk-flex-columns.size-25-75,
.itrk-flex-columns.size-75-25 {
    --col-min: calc(200px - (var(--col-gap) / 2));
}

.itrk-flex-columns.size-85-15,
.itrk-flex-columns.size-15-85 {
    --col-min: calc(120px - (var(--col-gap) / 2));
}

.itrk-flex-columns.golden-cut,
.itrk-flex-columns.golden-cut.reverse {
    --col-min: calc(3300px - (var(--col-gap) / 2));
}

.itrk-flex-columns.size-40-20-40 {
    --col-min: calc(100px - 2*var(--col-gap));
}
.itrk-flex-columns.size-33-33-33 {
    --col-min: calc(200px - var(--col-gap));
}

.itrk-flex-columns.size-25-25-25-25 {
    --col-min: calc(250px - var(--col-gap));
}

.itrk-flex-columns.col-min-85, .itrk-flex-columns > .col-min-85  { --col-min: 85px }
.itrk-flex-columns.col-min-100, .itrk-flex-columns > .col-min-100 { --col-min: 100px }
.itrk-flex-columns.col-min-150, .itrk-flex-columns > .col-min-150 { --col-min: 150px }
.itrk-flex-columns.col-min-300, .itrk-flex-columns > .col-min-300 { --col-min: 300px }
.itrk-flex-columns.col-min-450, .itrk-flex-columns > .col-min-450 { --col-min: 450px }

.itrk-flex-columns.col-max-400, .itrk-flex-columns > .col-max-400 { --col-max: 400px }
.itrk-flex-columns.col-max-450, .itrk-flex-columns > .col-max-450 { --col-max: 450px }
.itrk-flex-columns.col-max-500, .itrk-flex-columns > .col-max-500 { --col-max: 500px }
.itrk-flex-columns.col-max-550, .itrk-flex-columns > .col-max-550 { --col-max: 550px }
.itrk-flex-columns.col-max-600, .itrk-flex-columns > .col-max-600 { --col-max: 600px }


/* 2-spaltig: Prozentbasis */
div.itrk-flex-columns.size-60-40 > *:first-child { --col-basis: calc(60% - var(--col-gap)/2); }
div.itrk-flex-columns.size-60-40 > *:last-child  { --col-basis: calc(40% - var(--col-gap)/2); }

div.itrk-flex-columns.size-40-60 > *:first-child { --col-basis: calc(40% - var(--col-gap)/2); }
div.itrk-flex-columns.size-40-60 > *:last-child  { --col-basis: calc(60% - var(--col-gap)/2); }

div.itrk-flex-columns.size-70-30 > *:first-child { --col-basis: calc(70% - var(--col-gap)/2); }
div.itrk-flex-columns.size-70-30 > *:last-child  { --col-basis: calc(30% - var(--col-gap)/2); }

div.itrk-flex-columns.size-30-70 > *:first-child { --col-basis: calc(30% - var(--col-gap)/2); }
div.itrk-flex-columns.size-30-70 > *:last-child  { --col-basis: calc(70% - var(--col-gap)/2); }

div.itrk-flex-columns.size-80-20 > *:first-child { --col-basis: calc(80% - var(--col-gap)/2); }
div.itrk-flex-columns.size-80-20 > *:last-child  { --col-basis: calc(20% - var(--col-gap)/2); }

div.itrk-flex-columns.size-25-75 > *:first-child { --col-basis: calc(25% - var(--col-gap)/2); }
div.itrk-flex-columns.size-25-75 > *:last-child  { --col-basis: calc(75% - var(--col-gap)/2); }

div.itrk-flex-columns.size-20-80 > *:first-child { --col-basis: calc(20% - var(--col-gap)/2); }
div.itrk-flex-columns.size-20-80 > *:last-child  { --col-basis: calc(80% - var(--col-gap)/2); }

div.itrk-flex-columns.size-85-15 > *:first-child { --col-basis: calc(85% - var(--col-gap)/2); }
div.itrk-flex-columns.size-85-15 > *:last-child  { --col-basis: calc(15% - var(--col-gap)/2); }

div.itrk-flex-columns.golden-cut > *:first-child { --col-basis: calc(62% - var(--col-gap)/2); }
div.itrk-flex-columns.golden-cut > *:last-child  { --col-basis: calc(38% - var(--col-gap)/2); }

div.itrk-flex-columns.golden-cut.reverse > *:first-child { --col-basis: calc(38% - var(--col-gap)/2); }
div.itrk-flex-columns.golden-cut.reverse > *:last-child  { --col-basis: calc(62% - var(--col-gap)/2); }

div.itrk-flex-columns.size-33-33-33 > * {
    --col-basis : calc(33% - var(--col-gap));
}

/* 3-spaltig 40–20–40 */
div.itrk-flex-columns.size-40-20-40 > * {
    --col-basis: calc(20% - var(--col-gap)); /* mittlere Spalte */
}
div.itrk-flex-columns.size-40-20-40 > *:first-child,
div.itrk-flex-columns.size-40-20-40 > *:last-child {
    --col-basis: calc(40% - ((var(--col-gap)/2))); /* äußere Spalten */
}
div.itrk-flex-columns.size-25-25-25-25 > * {
    --col-basis: calc(25% - ((var(--col-gap))));
}
div.itrk-flex-columns.size-25-25-25-25 > *:first-child,
div.itrk-flex-columns.size-25-25-25-25 > *:last-child {
    --col-basis: calc(25% - var(--col-gap)/2);
}

div.itrk-flex-columns > * {
    flex: 1 1 var(--col-basis, 100%);
    min-width: 0;
    box-sizing: border-box;
}

div.itrk-flex-columns.auto-wrap {
    flex-wrap: wrap;
}

div.itrk-flex-columns.auto-wrap > * {
    box-sizing: border-box;
    min-width: 0;
    max-width: var(--col-max, 100%);
    flex: 1 1 auto;
    flex-basis: clamp(var(--col-min, 320px), var(--col-basis, 100%), var(--col-max, 9999px));
}

div.itrk-flex-columns > div.fixed-col-80  { flex: 0 0 80px;}
div.itrk-flex-columns > div.fixed-col-100 { flex: 0 0 100px;}
div.itrk-flex-columns > div.fixed-col-200 { flex: 0 0 200px;}
div.itrk-flex-columns > div.fixed-col-350 { flex: 0 0 350px;}

div.itrk-flex-columns > div.fixed-col
{
    flex: 0 0 var(--fixed-col-width, 200px);
}

div.itrk-flex-columns.h-gap-20 { --col-gap: 20px; }
div.itrk-flex-columns.h-gap-30 { --col-gap: 30px; }
div.itrk-flex-columns.h-gap-40 { --col-gap: 40px; }
div.itrk-flex-columns.h-gap-50 { --col-gap: 50px; }

div.itrk-flex-columns.v-gap-0 { row-gap: 0!important; }
div.itrk-flex-columns.v-gap-10 { --row-gap: 10px; }
div.itrk-flex-columns.v-gap-15 { --row-gap: 15px; }
div.itrk-flex-columns.v-gap-20 { --row-gap: 20px; }
div.itrk-flex-columns.v-gap-30 { --row-gap: 30px; }
div.itrk-flex-columns.v-gap-40 { --row-gap: 40px; }
div.itrk-flex-columns.v-gap-50 { --row-gap: 50px; }
div.itrk-flex-columns.v-gap-60 { --row-gap: 60px; }

@media (max-width: 1000px) {
    div.itrk-flex-columns.break-all-ld > * {
        flex-basis : 100%;
    }
}
@media (max-width: 768px) {
    div.itrk-flex-columns.break-all-md > * {
        flex-basis : 100%;
    }
}
@media (max-width: 550px) {
    div.itrk-flex-columns.break-all-sd > * {
        flex-basis : 100%;
    }
}
@media (max-width: 400px) {
    div.itrk-flex-columns.break-all-xs > * {
        flex-basis : 100%;
    }
}

div.itrk-flex-columns > div h3[tinytext]::before { margin-top: 5px !important; }
#Content div.itrk-flex-columns > div > h3 { margin-top:0;}


:root {

    --font-family-sans-fallback : Arial, Verdana, sans-serif;
    --font-family-bitter        : "Bitter", var(--font-family-sans-fallback);
    --font-family-sans          : "Fira Sans", var(--font-family-sans-fallback);
    --font-family-code          : "Fira Code", "Courier New", monospace;
    --font-family-heading       : var(--font-family-bitter);
    
    --font-h1        : normal normal normal 1.75rem/1.4 var(--font-family-heading);   /* 28px */
    --font-h2        : normal normal normal 1.5rem/1.4 var(--font-family-heading);    /* 24px */
    --font-h3        : normal normal normal 1.25rem/1.4 var(--font-family-heading);   /* 20px */
    --font-h4        : normal normal 400 1.125rem/1.5 var(--font-family-heading);     /* 18px */
    --font-h5        : normal normal 500 1rem/1.6 var(--font-family-heading);       /* 16px */
    --font-h6        : normal normal 500 0.875rem/1.6 var(--font-family-heading);   /* 14px */
    
    --font-normal    : normal normal normal 1rem/1.6 var(--font-family-sans);       /* 16px */
    --font-small     : normal normal normal 0.875rem/1.6 var(--font-family-sans);   /* 14px */
    --font-xs        : normal normal normal 0.75rem/1.58 var(--font-family-sans);   /* 12px */
    
    --font-code      : normal normal normal 0.875rem/1.6 var(--font-family-code);   /* 14px */
}

@media all and (max-width : 768px) {
    :root {
        --font-h1 : normal normal normal 24px/1.2 var(--font-family-heading);
        --font-h2 : normal normal normal 22px/1.3 var(--font-family-heading);
    }
}

h1, h2, h3, h4, h5, h6,
.font-h1, .font-h2, .font-h3, .font-h4, .font-h5, .font-h6 {
    color      : var(--darkgray-2);
    display    : block;
    max-height : 100%;
    padding    : 0;
}

h5, h6,
.font-h5, .font-h6 {
    color : var(--tertiary-color);
}

/* h3, h4, h5, h6,
.font-h3, .font-h4, .font-h5, .font-h6 {
    color: #333;
} */

#Content h1,
#Content h2,
#Content h3,
.font-h1,
.font-h2,
.font-h3,
#Content .font-h1,
#Content .font-h2,
#Content .font-h3
{
    margin-top    : 2em;
    margin-bottom : 1em;
}

#Content h1 {
    font       : var(--font-h1);
    margin-top : 0px !important;
}

#Content h2 {
    font           : var(--font-h2);
    text-transform : none;
}
#Content h2 { font: var(--font-h2); }
#Content h3 { font: var(--font-h3); }
#Content h4 { font: var(--font-h4); margin-bottom : 15px; }
#Content h5 { font: var(--font-h5); margin-bottom : 15px; }
#Content h6 { font: var(--font-h6); margin-bottom : 15px; }

#Portal h1,
.with-line {
    margin-bottom: 20px !important;
}
#Portal h1:after,
h1.with-line:after,
h2.with-line:after,
h3.with-line:after {
    content       : "" !important;
    clear         : both;
    display       : block;
    width         : 100px;
    margin-top    : 20px;
    margin-bottom : 30px;
    border-bottom : 5px solid var(--primary-color);
}
#Portal h1.center:after,
h1.with-line.center:after,
h1.with-line.text-center:after,
h2.with-line.center:after,
h2.with-line.text-center:after,
h3.with-line.center:after,
h3.with-line.text-center:after {
    margin-left  : auto;
    margin-right : auto;
}

/* Font-Klassen */

.font-h1 {
    font          : var(--font-h1) !important;
    margin-top    : 0;
    margin-bottom : 40px;
}

.font-h2 {
    font : var(--font-h2) !important;
}

.font-h3 {
    font : var(--font-h3) !important;
}

.font-h4 {
    font : var(--font-h4) !important;
}

.font-h5 {
    font : var(--font-h5) !important;
}

h2.font-h1.with-line {
    /* margin-top: 80px !important;
    text-transform: uppercase !important; */
}

h2.font-h1.with-line:first-of-type {
    margin-top : 0px !important;
}


.bold,
a.bold,
.bold {
    font-weight : 500 !important;
}

a.font-bold,
.font-bold {
    font-weight : 500 !important;
}

a.font-medium,
.font-medium {
    font-weight : 500 !important;
}

a.font-normal,
.font-normal {
    font-weight : 400 !important;
}

strong, b {
    font-weight : 500;
}

.underline,
a.underline {
    text-decoration : underline;
}

.text-center, .text-center > p {
    text-align : center !important;
}

.text-start, .text-start > p {
    text-align : start !important;
}

.text-end, .text-end > p {
    text-align : end !important;
}
.text-left {
    text-align : left !important;
}

.text-right {
    text-align : right !important;
}

.text-justify {
    text-align : justify !important;
}

.text-justify-all {
    text-align : justify-all !important;
}

.center {
    text-align   : center !important;
    margin-left  : auto !important;
    margin-right : auto !important;
}

/** Fonts **/

.font-bitter {
    font-family : var(--font-family-heading) !important;
}

.font-fira {
    font-family : var(--font-family-sans) !important;
}

.itrk-ui h3[tinytext]:before {
    display       : block;
    font          : normal normal 500 12px/14px var(--font-family-heading) !important;
    align-items   : center !important;

    color         : var(--secondary-color) !important;
    border        : 0 !important;
    border-left   : 31px solid var(--secondary-color) !important;
    height        : 3px;
    line-height   : 4px !important;
    white-space   : nowrap;

    overflow      : visible;
    content       : attr(tinytext);
    padding-left  : 10px !important;

    margin-top    : 40px !important;
    margin-bottom : 20px !important;
}

.itrk-ui h3.align-right[tinytext]:before {
    border        : 0 !important;
    border-right  : 31px solid var(--secondary-color) !important;
    margin-right  : 0 !important;
    padding-right : 10px !important;
}


div.overline,
div.subline {
    font-weight : 500;
}

div.subline {
    margin-bottom : 20px;
}

div.overline + h1,
div.overline + h2,
div.overline + h3 {
    margin-top : 0 !important;
}

h1 + div.subline,
h2 + div.subline,
h3 + div.subline {
    margin-top : -20px;
}


/** itrk-icons.css **/

.itrk-icon {
    display       : inline-block;
    text-align    : center;
    padding       : 0;
    border-radius : 50%;
    position      : relative;
    color         : white !important;
}

.itrk-icon > * {
    line-height : inherit !important;
}

.itrk-icon > img {
    max-width  : 70%;
    max-height : 70%;
    position   : absolute;
    top        : 50%;
    right      : 50%;
    transform  : translate(50%, -50%);
}

/* SIZES */

.itrk-icon.minimal {
    min-width   : 10px !important;
    min-height  : 10px !important;
    width       : 10px !important;
    height      : 10px !important;
    line-height : 10px !important;
    font-size   : 6px;
}

.itrk-icon.mini {
    min-width   : 15px !important;
    min-height  : 15px !important;
    width       : 15px !important;
    height      : 15px !important;
    line-height : 15px !important;
    font-size   : 8px;
}

.itrk-icon,
.itrk-icon.smaller {
    min-width     : 20px !important;
    min-height    : 20px !important;
    width         : 20px !important;
    height        : 20px !important;
    line-height   : 20px !important;
}

.itrk-icon.small {
    width       : 25px !important;
    height      : 25px !important;
    line-height : 25px !important;
    font-size   : 16px;
}

.itrk-icon.medium {
    width       : 48px !important;
    height      : 48px !important;
    line-height : 48px !important;
    font-size   : 24px;
}

.itrk-icon.large {
    width       : 110px !important;
    height      : 110px !important;
    line-height : 110px !important;
    font-size   : 55px;
}


/* COLORS */

.itrk-icon,
.itrk-icon.gray {
    background    : var(--darkgray) !important;
}
.itrk-icon.invert,
.itrk-icon.invert.gray {
    background : white !important;
    border     : 1px solid var(--itrk-border) !important;
    color      : var(--darkgray) !important;
}

.itrk-icon.orange {
    background : var(--orange-color) !important;
}
.itrk-icon.invert.orange {
    background : white !important;
    color : var(--orange-color) !important;
}

.itrk-icon.primary {
    background : var(--primary-color) !important;
}
.itrk-icon.invert.primary {
    background : white !important;
    color : var(--primary-color) !important;
}

.itrk-icon.blue {
    background : var(--blue-color) !important;
}
.itrk-icon.invert.blue {
    background : white !important;
    color : var(--blue-color) !important;
}

.itrk-icon.secondary {
    background : var(--secondary-color) !important;
}
.itrk-icon.invert.secondary {
    background : white !important;
    color : var(--secondary-color) !important;
}

.itrk-icon.tertiary {
    background : var(--tertiary-color) !important;
}
.itrk-icon.invert.tertiary {
    background : white !important;
    color : var(--tertiary-color) !important;
}

.itrk-icon.red {
    background : var(--red-color) !important;
}
.itrk-icon.invert.red {
    background : white !important;
    color : var(--red-color) !important;
}

.itrk-icon.yellow {
    background : var(--yellow-color) !important;
}
.itrk-icon.invert.yellow {
    background : white !important;
    color : var(--yellow-color) !important;
}

.itrk-icon.green {
    background : var(--green-color) !important;
}
.itrk-icon.invert.green {
    background : white !important;
    color : var(--green-color) !important;
}

.itrk-icon.lightgray-4 {
    background : var(--lightgray-4) !important;
}
.itrk-icon.invert.lightgray-4 {
    background : white !important;
    color : var(--lightgray-4) !important;
}

/** itrk-logos.css **/

i.easyscan:not(.fa) {
    font-size      : inherit;
    line-height    : inherit;
    text-transform : uppercase;
    font-style     : normal;
    font-weight    : bold;
    white-space    : nowrap;
}

i.easyscan:not(.fa)::before {
    line-height      : inherit;
    display          : inline-block;
    content          : "";
    height           : 1em;
    width            : 1em;
    margin-top       : -0.2em;
    margin-right     : 0.2em;
    background-image : url('/gfx/radar.svg');
    background-size  : 1em 1em;
    vertical-align   : middle;
}


:root {
	--itrk-border: #D9D9D9;
	--itrk-border-radius: 7px;
	--itrk-border-radius-outer: 9px;

    --itrk-fa-font-family: 'Font Awesome 6 Free';

	--fa-icon-thumb: '\f164';
	--fa-icon-info: '\f129';
	--fa-icon-warning: '\f12a';
	--fa-icon-error: '\f00d';
	--fa-icon-plus: '\f055';
	--fa-icon-x: '\f00d';
	--fa-icon-minus: '\f056';
	--fa-icon-pen: '\f304';
	--fa-icon-check: '\f00c';
	--fa-icon-hourglass: '\f252';
}

@keyframes fadein {
    0% {
        opacity : 0;
    }
    100% {
        opacity : 100%;
    }
}

@keyframes fadeout {
    0% {
        opacity : 100%;
    }
    100% {
        opacity : 0;
    }
}

@keyframes spinleft {
    0% {
        transform : rotate(360deg);
    }
    100% {
        transform : rotate(0deg);
    }
}

@keyframes spinright {
    0% {
        transform : rotate(0deg);
    }
    100% {
        transform : rotate(360deg);
    }
}

/* Remove blue background on element click */
* {
    -webkit-tap-highlight-color : transparent;
    box-sizing                  : border-box;
}

/* Images */

img {
    max-width  : 100%;
    max-height : 100%;
}

/* Hyperlinks */

a {
    /*color : var(--tertiary-color);*/
}

a.external::after {
    display      : inline-block;
    content      : "↗";
    padding-left : 2px;
}

.basic-text {
    text-align  : left !important;
    font-weight : normal !important;
    font-size   : 14px !important;
}

/* Margins und Paddings */

.mb-0{margin-bottom: 0;}
.ml-0{margin-left: 0;}
.p-0{padding: 0;}

/* Borders */
.no-border { border: none !important; }

/* Round container borders */

div.rounded,
img.rounded {
    border-radius : var(--itrk-border-radius);
}

.font-small {
	font: var(--font-small);
}

.font-xs {
    font : var(--font-xs);
}

.font-weight-light {
    font-weight : 100;
}

.bold {
    font-weight : bold;
}
.italic {
    font-style : italic;
}

.font-weight-normal {
    font-weight : normal;
}

.itrk-ui h1.align-right,
.itrk-ui h2.align-right,
.itrk-ui h3.align-right {
    text-align : right !important;
}

.itrk-divider {
    height        : 1px;
    border-bottom : 1px solid var(--lightgray-border);
    margin        : 80px 0;
}

/* DESKTOP */
@media screen and (min-width : 768px) {
    .itrk-tablet {
        display : none !important;
    }

    .itrk-mobile {
        display : none !important;
    }

    .itrk-desktop.itrk-tablet,
    .itrk-desktop.itrk-mobile {
        display : initial !important;
    }
}

/* TABLET */
@media screen and (max-width : 767px) and (min-width : 461px) {
    .itrk-desktop {
        display : none !important;
    }

    .itrk-mobile {
        display : none !important;
    }

    .itrk-tablet.itrk-desktop,
    .itrk-tablet.itrk-mobile {
        display : initial !important;
    }

    div.itrk-tablet.itrk-desktop,
    div.itrk-tablet.itrk-mobile {
        display : block;
    }
}

/* MOBILE */
@media screen and (max-width : 460px) {
    .itrk-desktop {
        display : none !important;
    }

    .itrk-tablet {
        display : none !important;
    }

    .itrk-mobile.itrk-desktop,
    .itrk-mobile.itrk-tablet {
        display : initial !important;
    }

    div.itrk-mobile.itrk-desktop,
    div.itrk-mobile.itrk-tablet {
        display : block !important;
    }
}

.itrk-flex-horizontal {
    display         : flex !important;
    justify-content : space-between !important;
    flex-direction  : row;
    flex-wrap       : nowrap;
    align-items     : center;
    column-gap      : 5px;
}

@media all and (max-width : 767px) {
    .itrk-flex-horizontal.auto-wrap {
        flex-direction : column;
        align-items    : center;
        row-gap        : 5px;
    }

    .itrk-flex-horizontal.auto-wrap > * {
        width : 100% !important;
    }
}

.itrk-flex-horizontal.h-gap-10 {
    column-gap : 10px;
}

.itrk-flex-horizontal.h-gap-15 {
    column-gap : 15px;
}

.itrk-flex-horizontal.h-gap-20 {
    column-gap : 20px;
}

.itrk-flex-horizontal.h-gap-30 {

    column-gap : 30px;
}

.itrk-flex-horizontal.h-gap-40 {
    column-gap : 40px;
}

.itrk-flex-horizontal.h-gap-50 {
    column-gap : 50px;
}

.itrk-flex-horizontal.h-gap-60 {
    column-gap : 60px;
}

.itrk-flex-horizontal.v-gap-10 {
    row-gap : 10px;
}

.itrk-flex-horizontal.v-gap-15 {
    row-gap : 15px;
}

.itrk-flex-horizontal.v-gap-20 {
    row-gap : 20px;
}

.itrk-flex-horizontal.v-gap-30 {
    row-gap : 30px;
}

.itrk-flex-horizontal.v-gap-40 {
    row-gap : 40px;
}

.itrk-flex-v-center {
    display     : flex;
    align-items : center;
}

.itrk-tooltip {
    position : relative;
    display  : inline-block;
}

itrk-input-content itrk-input-wrapper.info .itrk-tooltip,
itrk-checkbox-content itrk-checkbox-wrapper.info .itrk-tooltip {
    position     : absolute;
    /* height: 100%; */
    width        : 15px;
    margin-right : 10px;
    top          : 0;
    right        : -3px;
}

itrk-checkbox-content itrk-checkbox-wrapper.info .itrk-tooltip {
    top   : 1px;
    right : -35px;
}

itrk-input-content itrk-input-wrapper.action .itrk-tooltip,
itrk-input-content itrk-input-wrapper.action.regex .itrk-tooltip {
    right : 36px;
}

itrk-input-content .itrk-tooltip i.fa-info-circle {
    margin-top : 10px;
}

.inline.itrk-tooltip, span.itrk-tooltip {
    display             : inline-block;
    cursor              : default;
    -moz-user-select    : none;
    -webkit-user-select : none;
    -ms-user-select     : none;
    user-select         : none;
    -webkit-user-drag   : none;
}

.itrk-tooltip .itrk-tooltip-text {
    min-width        : 260px;
    max-width        : 260px;
    left             : 50%;
    transform        : translate(-50%, 0);
    padding          : 10px 20px;
    color            : #444444;
    background-color : #ffffff;
    font-weight      : normal;
    font-size        : 13px;
    border-radius    : 8px;
    position         : absolute;
    z-index          : 100;
    box-sizing       : border-box;
    display          : none;
    margin-top       : 25px;
    box-shadow       : 3px 3px 10px #00000029;
}

.itrk-tooltip:hover .itrk-tooltip-text {
    display : block;
}

.itrk-tooltip-text > .tooltip-text-inner {
    overflow       : hidden;
    text-overflow  : ellipsis;
    text-transform : uppercase;
}

.itrk-tooltip .itrk-tooltip-text::before {
	font-family : var(--itrk-fa-font-family);
    font-weight : 900;

    content     : "\f0d8";
    position    : absolute;
    font-size   : 50px;
    line-height : 30px;
    left        : 50%;
    top         : 0;
    margin-top  : -17px;
    margin-left : -15px;

    color       : white;
    background  : none;
    text-shadow : 0 -3px 3px #00000029;
}

.itrk-tooltip .itrk-tooltip-text.tooltip-top {
    margin-top : 0;
    top        : 0;
    left       : 50%;
    transform  : translateX(-50%) translateY(-100%) translateY(-25px);
}

.itrk-tooltip .itrk-tooltip-text.tooltip-top::before {
    content       : "\f0d7";

    top           : initial;
    margin-top    : initial;
    bottom        : 0;
    margin-bottom : -17px;
    text-shadow   : 0 3px 3px #00000029
}

.itrk-tooltip .itrk-tooltip-text.more-right {
    transform : translateX(-25%) translateY(0%) translateY(0px);
}

.itrk-tooltip .itrk-tooltip-text.more-right::before {
    left : 90px;
}

input[type=radio],
input[type=checkbox] {
    accent-color : var(--primary-color);
}

/* ITRK More Element */
itrk-more a.show-more {
    cursor      : pointer;
    color       : inherit;
    font-weight : bold;
    margin      : 5px 0;
}

itrk-more a.show-more:before {
	font-family  : var(--itrk-fa-font-family);
    color        : inherit;
    font-weight  : 900;
    content      : "\f078";
    margin-right : 5px;
}

itrk-more.visible a.show-more:before {
    content : "\f077";
}

span.itrk-tag {
    display       : inline-block;
    cursor        : default;

    font-size     : 90%;
    line-height   : inherit;

    background    : var(--lightgray-2);
    border-radius : 50px;
    padding       : 1px 4px;
    min-width     : 2em;

    text-align    : center;
    margin-top    : -1px;
    margin-bottom : -2px;
}

span.itrk-tag.fa {
    border      : 0;
    height      : 20px;
    min-height  : 20px;
    max-height  : 20px;
    width       : 20px;
    min-width   : 20px;
    max-width   : 20px;
    line-height : 20px;
    padding     : 0;
    font-size   : 10px;
    overflow    : hidden;
    display     : inline-block;
}

span.itrk-tag.fa.fa-exclamation-triangle {
    line-height : 19px;
}

span.itrk-tag.red {
    background : var(--red-color);
    color      : white;
}
span.itrk-tag.yellow {
	background: var(--yellow-color);
}

span.itrk-tag.orange {
    background : var(--primary-color);
    color      : white !important;
}

span.itrk-tag.green {
    background : var(--green-color);
    color      : white;
}

span.itrk-tag.blue {
    background : var(--secondary-color);
    color      : white;
}

span.itrk-tag.gray {
    background : var(--lightgray-border);
    color      : white;
}

span.itrk-tag.easysafe-blue {
    background : var(--easysafe-blue);
    color      : white;
}

span.itrk-tag i {
    color       : inherit;
    font-size   : 90%;
    line-height : inherit;
}

/* ITRK Slider */
itrk-slider {
    display : block;
}

itrk-slider itrk-slider--header {
    display          : block;
    cursor           : pointer;
    background-color : var(--lightgray);
    border-radius    : 7px;
    color            : var(--darkgray);
    height           : 40px;
    line-height      : 40px;
    font-weight      : 500;
    padding          : 0 20px 0 20px;
}

itrk-slider itrk-slider--header i.itrk-slider--rotated-icon {
    line-height : inherit;
    transition  : transform 0.5s;
    transform   : rotate(0deg);
}

itrk-slider.visible itrk-slider--header i.itrk-slider--rotated-icon {
    transform : rotate(180deg);
}

itrk-slider itrk-slider--header span {
    margin-left : 15px;
}

itrk-slider itrk-slider--body {
    display : block;
}

div.itrk-scrollable {
    overflow-y : scroll;
    max-height : 50vh;
}

/**
 * ================================================================
 * Abgeschrägte Kanten
 * ================================================================
 */

:root {
    --sloped-edge-skew-asc  : -4deg;
    --sloped-edge-skew-desc : 4deg;
}

.sloped-edge.sloped-edge:before,
.sloped-edge.sloped-edge:after {
    background       : inherit;
    content          : '';
    z-index          : -1;
    left             : 0;
    right            : 0;
    height           : 100%;
    position         : absolute;
    transform-origin : 0;
    width            : 100%;
    display          : none;
}

/* Schräg oben und unten aufsteigend (quasi "//") */
.sloped-edge.synced.ascending:before {
    display   : block;
    top       : 0;
    transform : skewY(var(--sloped-edge-skew-asc));
}

.sloped-edge.synced.ascending:after {
    display          : block;
    transform-origin : 100%;
    top              : 0;
    transform        : skewY(var(--sloped-edge-skew-asc));
}

/* Schräg oben und unten absteigend (quasi "\\") */
.sloped-edge.synced.descending:before {
    display          : block;
    top              : 0;
    transform-origin : 100%;
    transform        : skewY(var(--sloped-edge-skew-desc));
}

.sloped-edge.synced.descending:after {
    display   : block;
    top       : 0;
    transform : skewY(var(--sloped-edge-skew-desc));
}

/* Schräg oben aufsteigend */
.sloped-edge.top-edge.ascending:before {
    display   : block;
    top       : 0;
    transform : skewY(var(--sloped-edge-skew-asc));
}

/* Schräg oben absteigend */
.sloped-edge.top-edge.descending:before {
    display          : block;
    top              : 0;
    transform-origin : 100%;
    transform        : skewY(var(--sloped-edge-skew-desc));
}

/* Schräg unten aufsteigend */
.sloped-edge.bottom-edge.ascending:after {
    display          : block;
    bottom           : 0;
    transform-origin : 100%;
    transform        : skewY(var(--sloped-edge-skew-asc));
}

/* Schräg unten absteigend */
.sloped-edge.bottom-edge.descending:after {
    display   : block;
    bottom    : 0;
    transform : skewY(var(--sloped-edge-skew-desc));
}

/* Breite Seite links (oben und unten absteigend, quasi ">") */
.sloped-edge.sloped-both-left:before {
    display          : block;
    top              : 0;
    transform-origin : 100%;
    transform        : skewY(var(--sloped-edge-skew-desc));
}

.sloped-edge.sloped-both-left:after {
    display          : block;
    bottom           : 0;
    transform-origin : 100%;
    transform        : skewY(var(--sloped-edge-skew-asc));
}

/* Breite Seite rechts (oben und unten aufsteigend, quasi "<") */
.sloped-edge.sloped-both-right:before {
    display   : block;
    top       : 0;
    transform : skewY(var(--sloped-edge-skew-asc));
}

.sloped-edge.sloped-both-right:after {
    display   : block;
    bottom    : 0;
    transform : skewY(var(--sloped-edge-skew-desc));
}

/* Optional: debug Klasse hinzufügen um Darstellung zu testen */

.sloped-edge.debug {
    background-color : rgba(0, 0, 255, 0.25) !important;
}

.sloped-edge.debug:before,
.sloped-edge.debug:after {
    color            : #cc0022 !important;
    font-size        : 24px !important;
    background-color : rgba(255, 32, 32, 0.25) !important;
    outline          : 1px solid #cc0022 !important;
}

/**
 * ================================================================
 * A simpler approach for bevelled edges using skew transformation
 * ================================================================
 */

:root {
    --diagonal-angle : 3deg;
}

.diagonal {
    /* Adjust the content's inner boundaries to not flow beyond the closer container height */
    --diag-padding : calc(100% * tan(var(--diagonal-angle)) / 2);
    padding-top    : var(--diag-padding);
    padding-bottom : var(--diag-padding);
}

.diagonal.asc {
    transform : skewY(calc(var(--diagonal-angle) * -1));
}

.diagonal.asc > .content {
    transform : skewY(var(--diagonal-angle));
}

.diagonal.desc {
    transform : skewY(var(--diagonal-angle));
}

.diagonal.desc > .content {
    transform : skewY(calc(var(--diagonal-angle) * -1));
}

/**
 * ================================================================
 * Individual bevelled edges that can be placed before or after
 * a Html container.
 * ----------------------------------------------------------------
 * Tip: use `vw` unit to keep the angle degree value for
 * all device widths.
 * ================================================================
 */

:root {
    --bevel-bg : var(--lightgray-2);
}

.bevel {
    margin : 0;
}

/* Right before a container: ◢ */
.bevel.top-asc {
    background : linear-gradient(to top left, var(--bevel-bg) 50%, transparent 50%);
}

/* Right before a container: ◣ */
.bevel.top-desc {
    background : linear-gradient(to top right, var(--bevel-bg) 50%, transparent 50%);
}

/* Right after a container: ◤ */
.bevel.bottom-asc {
    background : linear-gradient(to bottom right, var(--bevel-bg) 50%, transparent 50%);
}

/* Right after a container: ◥ */
.bevel.bottom-desc {
    background : linear-gradient(to bottom left, var(--bevel-bg) 50%, transparent 50%);
}


/**
 * ================================================================
 * Even easier approach for diagonal background
 * ================================================================
 */

.diagonal-asc,
.diagonal-desc{
    --diagonal-angle: 3deg;
    --diagonal-height: calc(100% * tan(var(--diagonal-angle)));
    --diagonal-color: var(--background-gray);
    background-color: unset !important;
}

.diagonal-asc::before,
.diagonal-asc::after,
.diagonal-desc::before,
.diagonal-desc::after {
    display: block;
    width: 100%;
    content: "";
    padding-bottom: var(--diagonal-height) !important;
}

.diagonal-asc::before {
    background: linear-gradient(to top left, var(--diagonal-color) 50%, transparent 50%);
}

.diagonal-asc::after {
    background: linear-gradient(to bottom right, var(--diagonal-color) 50%, transparent 50%);
}

.diagonal-desc::before {
    background: linear-gradient(to top right, var(--diagonal-color) 50%, transparent 50%);
}

.diagonal-desc::after {
    background: linear-gradient(to bottom left, var(--diagonal-color) 50%, transparent 50%);
}

.diagonal-asc>div,
.diagonal-desc>div {
    background-color: var(--diagonal-color);
    width: 100% !important;
    /* height: 100% !important; */
    display: block;
    margin: 0 !important;
    padding: 30px 0 !important;
}

.diagonal-asc>div:first-child>div:first-child,
.diagonal-asc>div:first-child>div:first-child>*:first-child,
.diagonal-asc>div:first-child>div:first-child>*:first-child>*:first-child {
    margin-top: 0 !important;
}

.diagonal-asc.py-40>div,
.diagonal-desc.py-40>div {
    padding: 40px 0 !important;
}

.diagonal-asc.py-75>div,
.diagonal-desc.py-75>div {
    padding: 75px 0 !important;
}

.parallelogram {
    overflow: hidden;
}

.parallelogram .parallelogram-content {
    background-color: var(--background-gray);
    padding: 2.5em 9em;
    position: relative;
    clip-path: polygon(
        7em 0,
        100% 0,
        calc(100% - 7em) 100%,
        0 100%
    );
    margin: 0 -9em;
}

@media screen and (max-width : 1400px) {
    .parallelogram .parallelogram-content {
        clip-path: polygon(
            6em 0,
            100% 0,
            calc(100% - 6em) 100%,
            0 100%
        );
        padding: 4em 6em;
        margin: 0 -6em;
    }
}

/* div/p with-icon */
div.with-icon,
p.with-icon {
    position     : relative;
    padding-left : 30px;
    min-height   : 20px;
}

div.with-icon::before,
p.with-icon::before {
    position         : absolute;
    left             : 0;
    top              : 0;
    font-size        : 11px;
    font-family      : "Font Awesome 6 Free", sans-serif;
    content          : var(--fa-icon-x);
    display          : inline-block;
    width            : 20px;
    height           : 20px;
    padding          : 0;
    line-height      : 20px;
    color            : white;
    background-color : var(--tertiary-color);
    border-radius    : 50%;
    text-align       : center;
    font-weight      : 900;
    box-sizing       : border-box;
}

div.with-icon.large,
p.with-icon.large {
    padding-left : 36px;
    min-height   : 26px;
}

div.with-icon.large::before,
p.with-icon.large::before {
    top         : -6px;
    font-size   : 16px;
    width       : 30px;
    height      : 30px;
    line-height : 30px;
}

div.with-icon.orange::before,
p.with-icon.orange::before {
    background-color : var(--primary-color);
}

div.with-icon.easysafe-blue::before,
p.with-icon.easysafe-blue::before {
    background-color : var(--easysafe-blue);
}

div.with-icon.red::before,
p.with-icon.red::before {
    background-color : var(--red-color);
}

div.with-icon.green::before,
p.with-icon.green::before {
    background-color : var(--green-color);
}

div.with-icon.lightgray-4::before,
p.with-icon.lightgray-4::before {
    background-color : var(--lightgray-4);
}

div.with-icon.icon-info::before,
p.with-icon.icon-info::before {
    content : var(--fa-icon-info);
}

div.with-icon.icon-warning::before,
p.with-icon.icon-warning::before {
    content : var(--fa-icon-warning);
}

div.with-icon.icon-thumb::before,
p.with-icon.icon-thumb::before {
    content : var(--fa-icon-thumb);
}

/* Widths and heights */
.full-width     {width : 100% !important;}
.full-height    {height : 100% !important;}
.auto-width     {width : auto;}
.auto-height    {height : auto;}
.wmax           {max-width : 100% !important;}
.hmax           {max-height : 100% !important;}

/* Floating and Clearing */
.clearfix       {overflow : auto; clear : both;}
.clear          {clear : both !important; display: block !important; float: none !important}
.clear-left     {clear : left !important;}
.clear-right    {clear : right !important;}

.float-left     {float : left;}
.float-right    {float : right;}
.no-float       {float : none;}

/* Wrapping and Breaking */
.nowrap         {white-space :      nowrap !important;}
.normal-wrap    {white-space :      normal;}
.pre-wrap       {white-space :      pre-wrap;}
.pre            {white-space :      pre;}
.break-words    {overflow-wrap :    break-word;}

/* Overflow and Scrolling */
.scroll         {overflow   : scroll;}
.scroll-x       {overflow-x : scroll;}
.scroll-y       {overflow-y : scroll;}
.scrollable     {overflow   : auto;}
.overflow-hide  {overflow   : hidden;}
.overflow-show  {overflow   : visible;}

/* Itrk Angular Styles */
.itrk-bg-angular {
    background    : var(--lightgray-1) !important;
    margin-top    : 25px;
    margin-bottom : 50px;
}

.itrk-bg-angular:before,
.itrk-bg-angular:after {
    display          : block;
    height           : 50px;
    width            : 100%;
    background-color : white;
    content          : '';
    background-size  : 100% 100%;
}

.itrk-bg-angular:before {
    background-image : url(/gfx/Banner2024/angular-bg-top.svg);
}

.itrk-bg-angular:after {
    background-image : url(/gfx/Banner2024/angular-bg-bottom.svg);
}

.itrk-bg-angular div.Wrapper {
    margin : 20px auto 10px auto;
}

/* Fügt tief- bzw. hochgestellte Anführungszeichen am Anfang bzw am Ende hinzu */
span.quoted::before {content: "„";}
span.quoted::after  {content: "”";}



/* itrk-tooltip.css */

itrk-tooltip {
    line-height : inherit;
    font-size   : inherit;
    font-weight : inherit;
}

itrk-tooltip.checkbox {
    vertical-align : top;
}

itrk-tooltip i.fa,
itrk-tooltip i.fas,
.itrk-tooltip i.fa,
.itrk-tooltip i.fas {
    color: #9E9E9E;
    margin-left : 6px;
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    font-style: normal;
    line-height: inherit;
}

itrk-tooltip .hover-item {
    line-height: inherit;
}

itrk-tooltip .hover-item > * {
    line-height: inherit;
}

itrk-tooltip .itrk-tooltip {
    position      : absolute;
    background    : #ffffff;
    max-width     : 350px;
    min-width     : 200px;
    border        : 1px solid var(--lightgray-border);
    border-radius : var(--itrk-border-radius);
    font          : var(--font-normal) !important;
    color         : var(--darkgray);
    font-weight   : 400;
    z-index       : 1000;
    will-change   : transform;
    padding       : 10px 20px;
    text-align    : left;
}

/* Remove margin of last element */
itrk-tooltip .itrk-tooltip > *:not(.headline):last-child {
    margin-bottom : 0 !important;
}

itrk-tooltip .itrk-tooltip > .headline {
    background    : var(--lightgray-2);
    font-weight   : 400;
    margin        : -10px -20px 10px -20px;
    border-radius : 6px 6px 0 0;
    padding       : 10px 20px;
}

itrk-tooltip .itrk-tooltip .arrow,
itrk-tooltip .itrk-tooltip .arrow::before {
    content  : "";
    position : absolute;
    border   : 12px solid var(--itrk-border);
}

itrk-tooltip .itrk-tooltip.--top .arrow,
itrk-tooltip .itrk-tooltip.--top .arrow::before {
    border-color : var(--itrk-border) transparent transparent transparent;
    bottom       : -24px;
    left         : 50%;
    transform    : translateX(-50%);
}

itrk-tooltip .itrk-tooltip.--top .arrow::before {
    border-color : white transparent transparent transparent;
    bottom       : -10px;
}

itrk-tooltip .itrk-tooltip.--right .arrow,
itrk-tooltip .itrk-tooltip.--right .arrow::before {
    border-color : transparent var(--itrk-border) transparent transparent;
    left         : -12px;
    top          : 50%;
    transform    : translateX(-50%) translateY(-12px);
}

itrk-tooltip .itrk-tooltip.--right .arrow::before {
    border-color : transparent white transparent transparent;
    left         : 2px;
}

itrk-tooltip .itrk-tooltip.--bottom .arrow,
itrk-tooltip .itrk-tooltip.--bottom .arrow::before {
    border-color : transparent transparent var(--itrk-border) transparent;
    top          : -24px;
    left         : 50%;
    transform    : translateX(-50%);
}

itrk-tooltip .itrk-tooltip.--bottom .arrow::before {
    border-color : transparent transparent white transparent;
    top          : -10px;
}

itrk-tooltip .itrk-tooltip.--bottom.--has-headline .arrow::before {
    border-color : transparent transparent var(--lightgray-2) transparent;
}

itrk-tooltip .itrk-tooltip.--left .arrow,
itrk-tooltip .itrk-tooltip.--left .arrow::before {
    border-color : transparent transparent transparent var(--itrk-border);
    right        : -36px;
    top          : 50%;
    transform    : translateX(-50%) translateY(-12px);
}

itrk-tooltip .itrk-tooltip.--left .arrow::before {
    border-color : transparent transparent transparent white;
    right        : -22px;
}

itrk-tooltip .itrk-tooltip.--small {
    background : var(--darkgray);
    border     : none;
    color      : white;
    padding    : 10px;
}

itrk-tooltip .itrk-tooltip.--small .arrow::before,
itrk-tooltip .itrk-tooltip.--small > .headline {
    display : none;
}

itrk-tooltip .itrk-tooltip.--small .arrow {
    border-width : 5px;
}

itrk-tooltip .itrk-tooltip.--small.--top .arrow {
    bottom       : -10px;
    border-color : var(--darkgray) transparent transparent transparent;
}

itrk-tooltip .itrk-tooltip.--small.--right .arrow {
    left         : -5px;
    transform    : translateX(-50%) translateY(-5px);
    border-color : transparent var(--darkgray) transparent transparent;
}

itrk-tooltip .itrk-tooltip.--small.--bottom .arrow {
    top          : -10px;
    border-color : transparent transparent var(--darkgray) transparent;
}

itrk-tooltip .itrk-tooltip.--small.--left .arrow {
    right        : -15px;
    transform    : translateX(-50%) translateY(-5px);
    border-color : transparent transparent transparent var(--darkgray);
}

itrk-checkbox itrk-checkbox-wrapper .tooltip-wrapper {
    display      : inline-block;
    margin-right : 10px;
}

@media all and (max-width: 480px) {
  itrk-tooltip .itrk-tooltip {
    max-width: 250px;
    min-width: 200px;
    width: auto;
  }
}


/** Itrk Ul */

.itrk-ul {
    margin-left : 0 !important;
}
.itrk-ul.columns-2 {
    columns         : 2;
    -webkit-columns : 2;
    -moz-columns    : 2;
}

.itrk-ul.itrk-ul-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2em 4em;
}
@media (max-width: 767px) {
    .itrk-ul.itrk-ul-grid {
        grid-template-columns: 1fr;
    }
}

.itrk-ul.ul-reset {
    list-style    : none !important;
    margin-bottom : 0 !important;
}

.itrk-ul > li {
    position        : relative;
    list-style-type : none;
    font-weight     : normal;
    margin-bottom   : 0 !important;
    margin-left     : 0 !important;
}

.itrk-ul > li::before {
    position    : absolute;
    left        : 0;
	font-family : var(--itrk-fa-font-family) !important;
    color       : var(--primary-color) !important;
    font-weight : bold !important;
    display     : inline-block !important;
}

.itrk-ul.itrk-li-icon-dot,
.itrk-ul.itrk-li-icon-check,
.itrk-ul.itrk-li-icon-cross,
.itrk-ul.itrk-li-icon-star,
.itrk-ul.itrk-li-icon-chevron {
	list-style: none !important;
	list-style-image: none !important;
}

.itrk-ul.itrk-li-icon-dot > li,
.itrk-ul.itrk-li-icon-check > li,
.itrk-ul.itrk-li-icon-cross > li,
.itrk-ul.itrk-li-icon-star > li,
.itrk-ul.itrk-li-icon-chevron > li,
.itrk-ul.itrk-li-blue > li,
.itrk-ul.itrk-li-white > li,
.itrk-ul.itrk-li-darkgray > li,
.itrk-ul.itrk-li-lightgray > li,
.itrk-ul.itrk-li-black > li {
	list-style-image: none !important;
	padding-left: 20px !important;
}
.itrk-ul.itrk-li-icon-check	> li,
.itrk-ul.itrk-li-icon-cross	> li,
.itrk-ul.itrk-li-icon-star	> li,
.itrk-ul.itrk-li-icon-chevron > li {
    padding-left: 25px !important;
}
.itrk-ul.itrk-li-inline-icon > li {
	list-style-image: none !important;
    list-style: none;
    position: relative;
    padding-left: 35px !important;
}

.itrk-ul.itrk-li-inline-icon > li::before {
    content: "";
    background-image: var(--inline-icon);
    background-size: contain;
    background-repeat: no-repeat;
    width: 25px;
    height: 25px;
    position: absolute;
    left: 0;
    top: -3px;
}

.itrk-ul.itrk-li-icon-dot	  > li::before { content : "\2022"; }
.itrk-ul.itrk-li-icon-check	  > li::before { content : "\f00c"; }
.itrk-ul.itrk-li-icon-cross	  > li::before { content : "\f00d"; }
.itrk-ul.itrk-li-icon-star	  > li::before { content : "\f005"; }
.itrk-ul.itrk-li-icon-chevron > li::before { content : "\203A"; }

.itrk-ul.itrk-li-white		> li::before { color : #fff !important; }
.itrk-ul.itrk-li-primary    > li::before { color : var(--primary-color) !important; }
.itrk-ul.itrk-li-black		> li::before { color : var(--tertiary-color) !important; }
.itrk-ul.itrk-li-blue		> li::before { color : var(--secondary-color) !important; }
.itrk-ul.itrk-li-darkgray	> li::before { color : var(--darkgray) !important; }
.itrk-ul.itrk-li-lightgray  > li::before { color : var(--lightgray-4) !important; }






/** Itrk List */

ul.itrk-list {
    margin : 0 !important;
}

ul.itrk-list > li {
    list-style-type            : none;
    display                    : block;
    box-sizing                 : border-box;

    border-top-left-radius     : var(--itrk-border-radius);
    border-bottom-right-radius : var(--itrk-border-radius);
    background-color           : #f7f8fa;
    position                   : relative;

    margin                     : 5px 0 0;
    min-height                 : 33px;
    padding                    : 7px 25px;

    color                      : var(--darkgray);
    font                       : normal normal normal 14px/17px Fira Sans;
}

ul.itrk-list.check > li::before {
    content : "\f00c";
    color   : var(--secondary-color);
}

ul.itrk-list.cross > li::before {
    content : "\f00d";
    color   : var(--primary-color);
}

ul.itrk-list > li::before {
    margin-bottom : 0.8em;
    margin-right  : 10px;
	font          : normal normal normal 14px/19 var(--itrk-fa-font-family);
    font-weight   : 900;
}

ul.nostyle,
ul.nostyle > li {
    list-style : none !important;
}



itrk-faq {
    display : block;
	margin-left: auto;
	margin-right: auto;
	margin-top: 1em;
	margin-bottom: 1em;
}

itrk-faq itrk-faq-entry {
    display          : block;
    box-sizing       : border-box;
    background-color : var(--lightgray-1);
    padding          : 20px 30px;
    margin-top    : 15px;
    margin-bottom : 15px;
}

itrk-faq itrk-faq-entry:first-child {
    margin-top : 0;
}
itrk-faq itrk-faq-entry:last-child {
    margin-bottom : 0;
}

itrk-faq itrk-faq-entry itrk-faq-question {
    display       : block;
    box-sizing    : border-box;
    position      : relative;
    /*padding: 13px 20px;*/
    color         : var(--darkgray);
    font          : normal normal 600 16px/19px Fira Sans;
    transition    : border-radius 1s ease-in;
    border-radius : 20px;
}

itrk-faq.light itrk-faq-entry itrk-faq-question {
    font-weight: 500;
}

itrk-faq itrk-faq-entry.open itrk-faq-question {
    border-radius : var(--itrk-border-radius) 0 0 0 !important;
    transition    : border-radius 0s ease-in;
}

itrk-faq itrk-faq-entry.open itrk-faq-question:before {
    content : var(--fa-icon-minus); /*content: "-"*/
}

itrk-faq itrk-faq-entry itrk-faq-question:before {
	font          : normal normal 600 17px/0 var(--itrk-fa-font-family);
    content       : var(--fa-icon-plus); /* "+"; */
    line-height   : inherit;
    color         : var(--primary-color);
    font-size     : 22px;
    float         : right;
    cursor        : pointer;
    margin-bottom : 10px;
    margin-left   : 10px;
}

itrk-faq itrk-faq-entry itrk-faq-question[icon] {
    padding-left : 40px;
}

itrk-faq itrk-faq-entry itrk-faq-question span {
    margin-left  : -15px;
    margin-right : 10px;
    width        : 15px;
    position     : absolute;
    color        : var(--secondary-color);
}

itrk-faq itrk-faq-entry itrk-faq-question i {
    margin-left  : -25px;
    margin-right : 10px;
    width        : 15px;
    position     : relative;
}

itrk-faq itrk-faq-entry itrk-faq-question i:before {
    position : absolute;
    top      : 2px;
}

itrk-faq itrk-faq-entry.blue itrk-faq-question i {
    color : var(--secondary-color);
}

itrk-faq itrk-faq-entry itrk-faq-details {
    margin-top                 : 16px;
    clear                      : both;
    display                    : block;
    overflow                   : hidden;
    border-bottom-left-radius : var(--itrk-border-radius);
    border-bottom-right-radius : var(--itrk-border-radius);
}


itrk-faq itrk-faq-entry itrk-faq-question {
    text-align : left;
}

itrk-faq itrk-faq-entry itrk-faq-details > div {
    font       : var(--font-normal);
    color      : var(--darkgray);
    text-align : left;
    background: white;
    padding: 2em;
    overflow: hidden;
    margin-top: 5px;
}
itrk-faq itrk-faq-entry itrk-faq-details > div > .title:first-child * {
    margin-top: 0px !important;
}

itrk-faq itrk-faq-entry.has-icon itrk-faq-details > div {
    padding-left    : 40px !important;
    padding-right   : 20px !important;
}

itrk-faq itrk-faq-entry.has-count itrk-faq-question {
    padding-left : 30px;
}

itrk-faq itrk-faq-entry itrk-faq-details > div img {
    max-width : 100%;
}

itrk-faq itrk-faq-entry itrk-faq-details > div *:last-child {
    margin-bottom : 0 !important;
}


/* itrk-alerts.css */
.itrk-alert {
    position         : relative;
    text-align       : start;
    padding          : 20px 20px 20px 44px;
    font             : var(--font-normal);
    border-radius    : var(--itrk-border-radius);
    border           : 1px solid var(--green-color);
    background-color : var(--lightgray-1);
    color            : var(--green-color);
    margin           : 1.5em 0;
    width            : 100%;
    box-sizing       : border-box;
}

.itrk-alert > *:last-child {
    margin-bottom : 0 !important;
}
.itrk-alert > h2:first-child,
.itrk-alert > h3:first-child,
.itrk-alert > h4:first-child,
.itrk-alert > div > h2:first-child,
.itrk-alert > div > h3:first-child,
.itrk-alert > div > h4:first-child,
#Content .itrk-alert > h2:first-child,
#Content .itrk-alert > h3:first-child,
#Content .itrk-alert > h4:first-child,
#Content .itrk-alert > div > h2:first-child,
#Content .itrk-alert > div > h3:first-child,
#Content .itrk-alert > div > h4:first-child {
    font-size: 18px;
    margin-top: 0;
    border-bottom: 1px solid var(--green-color);
    color: var(--green-color);
}

.itrk-alert ul {
    font-size : inherit !important;
}

.itrk-alert ul li {
    margin-bottom : 0.2em !important;
}

.itrk-alert .itrk-button-bar.with-text .itrk-text {
    float : left;
}

.itrk-alert .itrk-button-bar .itrk-button:first-of-type {
    margin-right : 0;
}

.itrk-alert.no-icon {
    padding : 20px;
}

.itrk-alert.no-icon::before {
    content : "";
    display : none;
}

.itrk-alert > .itrk-card {
    margin-left : -20px;
    margin-top  : 20px;
    border      : none;
}

.itrk-alert.no-icon > .itrk-card {
    margin-left : 0;
}

.itrk-alert.action-alert > .itrk-alert-table {
    display : table;
}

.itrk-alert > .itrk-switch {
    margin : 0 0 0 10px;
}

.itrk-alert a:not(.itrk-button) {
    color           : inherit;
    text-decoration : underline;
    font-weight     : 500;
}

.itrk-alert::before {
    position      : absolute;
    content       : var(--fa-icon-thumb);
    font-family   : var(--itrk-fa-font-family);
    font-size     : 11px;
    font-weight   : 900 !important;
    margin-right  : 10px;
    color         : white;
    background    : var(--green-color);
    text-align    : center;
    border-radius : 50%;
    top           : 21px;
    left          : 14px;
    width         : 20px;
    height        : 20px;
    line-height   : 20px;
}

.itrk-alert .itrk-button-bar .itrk-button {
    color        : var(--green-color);
    border-color : var(--green-color);
}

.itrk-alert.action-alert .itrk-button {
    padding-right : 28px;
    padding-left  : 28px;
    color         : var(--green-color);
    border-color  : var(--green-color);
}

.itrk-alert.action-alert > *.itrk-button {
    line-height : 17px;
}

/** important-alert */
.itrk-alert.important-alert .itrk-button-bar .itrk-button,
.itrk-alert.action-alert.important-alert .itrk-button,
.itrk-alert.important-alert {
    color        : var(--tertiary-color);
    border-color : var(--tertiary-color);
}

.itrk-alert.important-alert::before {
    background : var(--tertiary-color);
    content    : var(--fa-icon-info);
}

/** warning-alert */
.itrk-alert.warning-alert .itrk-button-bar .itrk-button,
.itrk-alert.action-alert.warning-alert .itrk-button,
.itrk-alert.warning-alert {
    color        : var(--primary-color);
    border-color : var(--primary-color);
}

.itrk-alert.warning-alert::before {
    background : var(--primary-color);
    content    : var(--fa-icon-warning);
}
.itrk-alert.warning-alert > h2:first-child,
.itrk-alert.warning-alert > h3:first-child,
.itrk-alert.warning-alert > h4:first-child,
.itrk-alert.warning-alert > div > h2:first-child,
.itrk-alert.warning-alert > div > h3:first-child,
.itrk-alert.warning-alert > div > h4:first-child,
#Content .itrk-alert.warning-alert > h2:first-child,
#Content .itrk-alert.warning-alert > h3:first-child,
#Content .itrk-alert.warning-alert > h4:first-child,
#Content .itrk-alert.warning-alert > div > h2:first-child,
#Content .itrk-alert.warning-alert > div > h3:first-child,
#Content .itrk-alert.warning-alert > div > h4:first-child {
    border-bottom-color: var(--primary-color);
    color: var(--primary-color);
}

/** error-alert */
.itrk-alert.error-alert .itrk-button-bar .itrk-button,
.itrk-alert.action-alert.error-alert .itrk-button,
.itrk-alert.error-alert {
    color        : var(--red-color);
    border-color : var(--red-color);
}

.itrk-alert.error-alert::before {
    background : var(--red-color);
    content    : var(--fa-icon-error);
}
.itrk-alert.error-alert > h2:first-child,
.itrk-alert.error-alert > h3:first-child,
.itrk-alert.error-alert > h4:first-child,
.itrk-alert.error-alert > div > h2:first-child,
.itrk-alert.error-alert > div > h3:first-child,
.itrk-alert.error-alert > div > h4:first-child,
#Content .itrk-alert.error-alert > h2:first-child,
#Content .itrk-alert.error-alert > h3:first-child,
#Content .itrk-alert.error-alert > h4:first-child,
#Content .itrk-alert.error-alert > div > h2:first-child,
#Content .itrk-alert.error-alert > div > h3:first-child,
#Content .itrk-alert.error-alert > div > h4:first-child {
    border-bottom-color: var(--red-color);
    color: var(--red-color);
}

/** todo-alert */
.itrk-alert.todo-alert .itrk-button-bar .itrk-button,
.itrk-alert.action-alert.todo-alert .itrk-button,
.itrk-alert.todo-alert {
    color        : var(--secondary-color);
    border-color : var(--secondary-color);
}

.itrk-alert.todo-alert::before {
    background : var(--secondary-color);
    content    : var(--fa-icon-pen);
}
.itrk-alert.todo-alert > h2:first-child,
.itrk-alert.todo-alert > h3:first-child,
.itrk-alert.todo-alert > h4:first-child,
.itrk-alert.todo-alert > div > h2:first-child,
.itrk-alert.todo-alert > div > h3:first-child,
.itrk-alert.todo-alert > div > h4:first-child,
#Content .itrk-alert.todo-alert > h2:first-child,
#Content .itrk-alert.todo-alert > h3:first-child,
#Content .itrk-alert.todo-alert > h4:first-child,
#Content .itrk-alert.todo-alert > div > h2:first-child,
#Content .itrk-alert.todo-alert > div > h3:first-child,
#Content .itrk-alert.todo-alert > div > h4:first-child {
    border-bottom-color: var(--secondary-color);
    color: var(--secondary-color);
}
/** easysafe-alert */
.itrk-alert.easysafe-alert {
    background : rgba(65, 197, 255, 5%);
}

.itrk-alert.easysafe-alert .itrk-button-bar .itrk-button,
.itrk-alert.action-alert.easysafe-alert .itrk-button,
.itrk-alert.easysafe-alert {
    color        : var(--easysafe-blue);
    border-color : var(--easysafe-blue);
}

.itrk-alert.easysafe-alert::before {
    content         : "";
    background      : transparent url(/gfx/radar.svg) no-repeat;
    background-size : 20px 20px;
    height          : 20px;
    width           : 20px;
}
.itrk-alert.easysafe-alert > h2:first-child,
.itrk-alert.easysafe-alert > h3:first-child,
.itrk-alert.easysafe-alert > h4:first-child,
.itrk-alert.easysafe-alert > div > h2:first-child,
.itrk-alert.easysafe-alert > div > h3:first-child,
.itrk-alert.easysafe-alert > div > h4:first-child,
#Content .itrk-alert.easysafe-alert > h2:first-child,
#Content .itrk-alert.easysafe-alert > h3:first-child,
#Content .itrk-alert.easysafe-alert > h4:first-child,
#Content .itrk-alert.easysafe-alert > div > h2:first-child,
#Content .itrk-alert.easysafe-alert > div > h3:first-child,
#Content .itrk-alert.easysafe-alert > div > h4:first-child {
    border-bottom-color: var(--easysafe-blue);
    color: var(--easysafe-blue);
}

/** description-alert */
.itrk-alert.description-alert {
    background : white;
}

.itrk-alert.description-alert .itrk-button-bar .itrk-button,
.itrk-alert.action-alert.description-alert .itrk-button,
.itrk-alert.description-alert {
    color        : var(--darkgray);
    border-color : var(--itrk-border);
}

.itrk-alert.description-alert::before {
    content         : "";
    background      : transparent url(/gfx/easysafe/warning-sign.svg) no-repeat;
    background-size : contain;
    height          : 20px;
    width           : 20px;
}

.itrk-alert > :last-child,
.itrk-alert > :last-child > :last-child,
.itrk-alert div:last-of-type {
    margin-bottom : 0 !important;
}

.itrk-alert.slim-alert {
    padding-top    : 10px;
    padding-bottom : 10px;
    margin-top     : 10px;
    margin-bottom  : 10px;
}

.itrk-alert.slim-alert::before {
    top : 11px;
}

.itrk-alert > .itrk-switch {
    float : right;
}

@media all and (max-width : 767px) {
    .itrk-alert .itrk-button-bar .itrk-button {
        margin-top   : 1em;
        margin-right : 0;
        margin-left  : 0;
        display      : block;
        float        : none;
    }
    
    .itrk-alert .itrk-button-bar .itrk-button.left {
        float : none;
    }
}

.itrk-alert.no-box {
  border: 0;
  background: none;
  padding-left: 35px;
}

.itrk-alert.no-box::before {
  left: 0;
}


/* itrk-banner.css */

.itrk-banner {
    background : var(--lightgray-1);
}

.itrk-banner > .Wrapper {
    display         : flex;
    flex-direction  : column;
    justify-content : space-between;
    min-height      : 175px;
    gap             : 20px;
    box-sizing      : border-box;
}

.itrk-banner.small-header > .Wrapper {
    height : 175px;
}

.itrk-banner > .Wrapper > .itrk-banner-content {
    display : flex;
    gap     : 20px;
}

.itrk-banner > .Wrapper > .itrk-banner-content > .itrk-banner-left-content {
    color       : var(--tertiary-color) !important;
    flex        : 1;
    align-items : flex-end;
    margin      : 20px 0;
}

.itrk-banner > .Wrapper > .itrk-banner-content > .itrk-banner-right-content {
    color      : var(--tertiary-color) !important;
    flex       : 1;
    text-align : right;
    margin     : 20px 0;
}

.itrk-banner > .Wrapper > .itrk-banner-content > .itrk-banner-left-content > *:last-child,
.itrk-banner > .Wrapper > .itrk-banner-content > .itrk-banner-right-content > *:last-child {
    margin-bottom : 0 !important;
}

.itrk-banner h1, .itrk-banner .text {
    font-size      : 36px !important;
    line-height    : 44px !important;
    padding-top    : 40px !important;
    margin-bottom  : 5px !important;
    text-align     : center;
    text-transform : uppercase;
}

.itrk-banner h1::after,
.itrk-banner h2::after,
.itrk-banner .text::after {
    text-align   : center;
    margin-left  : auto;
    margin-right : auto;
}

.itrk-banner .itrk-banner-image-wrapper {
    text-align     : center;
    padding-bottom : 20px;
}

.itrk-banner.itrk-banner-bottom .itrk-banner-image-wrapper {
    padding-bottom : 0;
}

.itrk-banner .itrk-banner-image-wrapper img {
    height     : auto !important;
    max-height : 140px;
}

@media all and (max-width : 768px) {
    .itrk-banner > .Wrapper {
        height : auto;
    }
    
    .itrk-banner > .Wrapper > .itrk-banner-content {
        display : block;
    }
    
    .itrk-banner .itrk-banner-image-wrapper img {
        width : 100%;
    }
    
    .itrk-banner .itrk-banner-image-wrapper img[src$=".png"] {
        width : auto;
    }
    
    .itrk-banner h1, .itrk-banner .font-h1 {
        font      : var(--font-h1) !important;
        font-size : 26px !important;
    }
}

.itrk-banner.bg-with-city {
    background-size     : cover;
    background-position : bottom center;
    background-repeat   : no-repeat;
    background-image    : url(/gfx/Banner2024/header.svg);
    min-height          : 275px;
}

.itrk-banner.header-small h1 {
    font: var(--font-h2)!important;
}

.itrk-banner.topic-background {
    background-position : center;
    background-repeat   : no-repeat;
    background-color    : var(--light-blue);
    background-image    : url('/gfx/Banner/banner-partnernetzwerk.svg');
}

.itrk-banner.topic-background-with-circle {
    background-image    : url(/gfx/Banner/banner-partnernetzwerk.svg), url(/gfx/Banner2024/header.svg);
    background-size     : auto, 1320px;
    background-repeat   : no-repeat, no-repeat;
    background-position : calc((100vw - 1200px) - ((100vw - 1320px) / 2)) top, center -522px !important;
}

.itrk-banner.highlight-box {
    background : white;
    margin     : 7px 0;
}

.itrk-banner.highlight-box > .Wrapper {
    padding    : 0;
    min-height : auto;
    margin     : 0 0 3px;
}

.itrk-banner.highlight-box > .Wrapper:last-child {
    margin-bottom : 0;
}

.itrk-banner.highlight-box > .Wrapper a {
    background      : var(--lightgray-1);
    color           : var(--tertiary-color);
    display         : flex;
    flex-direction  : row;
    height          : auto;
    min-height      : auto;
    padding         : 13px 20px;
    gap             : 5px;
    justify-content : inherit;
    align-items     : center;
}

.itrk-banner.highlight-box > .Wrapper .h2 {
    font-family    : var(--font-family-heading);
    font-weight    : bold;
    font-size      : 16px;
    line-height    : 20px;
    margin-bottom  : 0;
    text-transform : uppercase;
}

.itrk-banner.highlight-box > .Wrapper .banner-news-body {
    flex : 1;
}

.itrk-banner.highlight-box > .Wrapper .banner-news-body span.font-small {
    display     : inline-block;
    line-height : initial;
    margin-top  : 3px;
}

.itrk-banner.highlight-box > .Wrapper .banner-news-image {
    width      : 50px;
    text-align : center;
}

.itrk-banner.highlight-box > .Wrapper .banner-news-btn .itrk-button {
    font-size  : 12px;
    background : white;
}

.itrk-banner.highlight-box > .Wrapper .banner-news-btn a {
    min-width : 52px;
}

@media all and (max-width : 768px) {
    .itrk-banner.bg-with-city {
        min-height : auto;
    }
    
    .itrk-banner.bg-with-city > .Wrapper {
        padding-bottom : 30px;
    }
}


/* itrk-toolbar.css */

.itrk-toolbar {
    background-color : var(--lightgray-1);
    border-top       : 3px solid white;
    border-bottom    : 1px solid #e8e8e8;
    box-sizing       : border-box;
    padding          : 25px 0;
}

.itrk-toolbar > .Wrapper form.itrk-form {
    margin : 0;
}

@media all and (max-width : 768px) {
    .itrk-toolbar {
        padding : 20px 0;
    }
}


/* itrk-page-banner.css */

.itrk-page-banner {
    padding-top     : 25px;
    padding-bottom  : 25px;
    display         : flex;
    justify-content : center;
    width           : 100%;
    align-items     : center;
    margin          : 100px 0;
}

.itrk-page-banner > div {
    font-size   : 25px;
    font-weight : 500;
    text-align  : center;
    line-height : 1.4em;
}


/* itrk-buttons.css */
.itrk-button,
input[type="submit"].itrk-button,
form.default input[type="submit"].itrk-button,
form.itrk-form input[type=submit]  {
    background: white;
	color: var(--primary-color);
	font-family: 'Fira Sans', Arial, verdana, sans-serif;
	text-transform: uppercase;
	border: 1px solid var(--primary-color);
	padding: 9px 1.2em;
	font-weight: normal;
	line-height: 17px;
	display: inline-block;
	text-align: center;
	width: auto;
	white-space: nowrap;
	cursor: pointer;
	user-select: none;
	border-radius: 7px;
	box-sizing: border-box;
}

.itrk-button:disabled,
form.itrk-form input[type=submit]:disabled {
    cursor  : unset;
    opacity : 0.4;
}

.itrk-button.small,
form.itrk-form input[type=submit].small  {
    font: normal normal normal 12px/14px Fira Sans;
	padding: 4px 1em;
}

.itrk-button.full-width {
    display : block;
}

.itrk-button i {
    padding-right : 5px;
    line-height   : inherit;
}

.itrk-button.ghost,
form.itrk-form input[type=submit].ghost {
    background: transparent !important;
    border: none !important;
}

.itrk-button.blue,
form.itrk-form input[type=submit].blue {
	border-color: var(--secondary-color);
	color: var(--secondary-color);
}

.itrk-button.black,
form.itrk-form input[type=submit].black {
	border-color: #333;
	color: black !important;
}

.itrk-button.gray,
form.itrk-form input[type=submit].gray {
    --btn-bg-color: #aaa;
    background: white !important;
	border-color: var(--btn-bg-color);
	color: #777 !important;
}

.itrk-button.green,
form.itrk-form input[type=submit].green {
	border-color: var(--green-color);
	color: var(--green-color) !important;
}

.itrk-button.red,
form.itrk-form input[type=submit].red {
	border-color: var(--red-color);
	color: var(--red-color) !important;
}


.itrk-button.invert,
input[type="submit"].itrk-button.invert,
form.itrk-form input[type=submit].invert {
	background: var(--primary-color);
	color: white !important;
	border: 1px solid var(--primary-color);;
}

.itrk-button.green.invert,
form.itrk-form input[type=submit].green.invert {
	background: var(--green-color);
	border-color: var(--green-color);
}

.itrk-button.red.invert,
form.itrk-form input[type=submit].red.invert {
    background   : var(--red-color);
    border-color : var(--red-color);
}

.itrk-button.blue.invert,
form.itrk-form input[type=submit].blue.invert {
    background   : var(--secondary-color);
    border-color : var(--secondary-color);
}

.itrk-button.black.invert,
form.itrk-form input[type=submit].black.invert {
    background   : #333333;
    border-color : #333333;
}

.itrk-button.gray.invert,
form.itrk-form input[type=submit].gray.invert {
	background: var(--btn-bg-color) !important;
	border-color: var(--btn-bg-color) !important;
}

.itrk-button.light-gray {
    --btn-bg-color: var(--lightgray-border);
    background-color: var(--lightgray-3);
    color: var(--darkgray);
    border: 1px solid var(--lightgray-border);
}

.itrk-button i {
    line-height : inherit;
    padding     : 0 5px;
}

.itrk-button.disabled {
    opacity        : 0.6;
    pointer-events : none;
}

.itrk-button.button-loading {
    position: relative;
    overflow: visible;
    pointer-events: none;
}
.itrk-button.button-loading::before {
    content: "";
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    opacity: 1;
    width: 100%;
    height: 100%;
    border-radius: inherit;
    background-color: inherit;
    background-image: inherit;
    box-shadow: inherit;
    transition: opacity .3s ease-out;
}
.itrk-button.button-loading::after {
    content: '';
    display: block;
    position: absolute;
    z-index: 1;
    top: 50%;
    left: 50%;
    width: 23px;
    height: 23px;
    margin-top: -12px;
    margin-left: -12px;
    animation: fadein 100ms 1 linear, spinright 750ms infinite linear;
    background-color: var(--primary-color);
    mask-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' height='100' width='100' viewBox='0 0 100 100' fill='none' stroke-width='8'%3E%3Ccircle cx='50' cy='50' r='46' stroke-linecap='round' stroke-dasharray='217 72' stroke='%230a1c2e'/%3E%3C/svg%3E");
    mask-position: center center;
    mask-repeat: no-repeat;
    mask-size: cover;
}
.itrk-button.small.button-loading::after {
    mask-size: 18px;
}
.itrk-button.blue.button-loading::after {
    background-color: var(--secondary-color);
}
.itrk-button.black.button-loading::after {
    background-color: black;
}
.itrk-button.gray.button-loading::after {
    background-color: var(--btn-bg-color);
}
.itrk-button.light-gray.button-loading::after {
    background-color: var(--btn-bg-color);
}
.itrk-button.green.button-loading::after {
    background-color: var(--green-color);
}
.itrk-button.red.button-loading::after {
    background-color: var(--red-color);
}
.itrk-button.invert.button-loading::after {
    background-color: white;
}


/* itrk-button-bar.css */

.itrk-button-bar {
    margin-top : 20px;
    text-align : right;
    clear      : both;
}

.itrk-button-bar:after {
    content : "";
    display : block;
    clear   : both;
}

.itrk-button-bar a.itrk-button {
    margin-left : 0.5em;
}

.itrk-button-bar a.itrk-button:first-child {
    margin-left : 0;
}

.itrk-button-bar .itrk-button.left {
    float       : left;
    margin-left : 0;
}

/**
 * Das sorgt dafür, dass die Buttons innerhalb dieser Button-Bar gleichmäßig auf die
 * verfügbare Breite verteilt werden, egal wieviele Buttons es sind.
 */
.itrk-button-bar.equal-distribution {
    display               : grid;
    grid-template-columns : repeat(auto-fit, minmax(0, 1fr));
}

/**
 * Die folgenden Zeilen definieren Split-Buttons.
 * In der Form werden die Buttons direkt aneinander gehängt ohne Abstand,
 * und gerundete Ecken haben nur der erste Button links und der letzte Button rechts.
 */
.itrk-button-bar.equal-distribution.split-buttons .itrk-button {
    margin        : 0;
    border-radius : 0;
}

.itrk-button-bar.equal-distribution.split-buttons .itrk-button:first-child {
    border-top-left-radius    : var(--itrk-border-radius);
    border-bottom-left-radius : var(--itrk-border-radius);
}

.itrk-button-bar.equal-distribution.split-buttons .itrk-button:last-child {
    border-top-right-radius    : var(--itrk-border-radius);
    border-bottom-right-radius : var(--itrk-border-radius);
}

.itrk-button-bar.equal-distribution.split-buttons .itrk-button:not(:last-child) {
    border-right : none;
}


/* itrk-button-bar.css */

.itrk-toggle-bar {
    margin-top: 20px;
    margin-bottom: 12px
}

/**
 * Das sorgt dafür, dass die Buttons innerhalb dieser Button-Bar gleichmäßig auf die
 * verfügbare Breite verteilt werden, egal wieviele Buttons es sind.
 */
.itrk-toggle-bar.equal-distribution {
    display               : grid;
    grid-template-columns : repeat(auto-fit, minmax(0, 1fr));
}

/**
 * Die folgenden Zeilen definieren Split-Buttons.
 * In der Form werden die Buttons direkt aneinander gehängt ohne Abstand,
 * und gerundete Ecken haben nur der erste Button links und der letzte Button rechts.
 */
.itrk-toggle-bar.equal-distribution .itrk-button {
    margin : 0;
    border-radius: 0;
    overflow: hidden;
}
.itrk-toggle-bar.equal-distribution .itrk-button:first-child {
    border-top-left-radius    : var(--itrk-border-radius);
    border-bottom-left-radius : var(--itrk-border-radius);
}
.itrk-toggle-bar.equal-distribution .itrk-button:last-child {
    border-top-right-radius    : var(--itrk-border-radius);
    border-bottom-right-radius : var(--itrk-border-radius);
}
.itrk-toggle-bar.equal-distribution .itrk-button:not(:last-child) {
    border-right : none;
}

@media screen and (max-width:767px) {
    .itrk-toggle-bar.equal-distribution .itrk-button {
        padding-left: 1em;
        padding-right: 1em;
    }
}

/* ITRK Business Card */
itrk-business-card {
    position      : relative;
    display       : grid;
    background    : white !important;
    text-align    : left;
    align-content : space-between;
    max-width     : 350px;
    min-width     : 300px;
    min-height    : 175px;
    border        : 1px solid var(--lightgray-border);
    border-radius : var(--itrk-border-radius);
    padding       : 14px 12px;
    box-sizing    : border-box;
    margin        : auto;
    font-family   : 'Fira Sans', Arial, verdana, sans-serif;
}

itrk-business-card .top,
itrk-business-card .bottom {
    color        : var(--tertiary-color);
    margin-right : 115px;
    line-height  : 18px !important;
    font-size    : 12px !important;
}

itrk-business-card .img {
    position            : absolute;
    right               : 13px;
    top                 : 13px;
    bottom              : 13px;
    max-height          : 147px;
    height              : auto;
    width               : 110px;
    border-radius       : 5px;
    background-size     : cover;
    background-position : 50% 0;
}

itrk-business-card a,
itrk-business-card span {
    display : inline-block;
    font-size: 13px;
}

itrk-business-card .name {
    font: var(--font-small);
    padding-bottom: 5px;
    font-weight : bold;
    font-family : inherit;
}

itrk-business-card .title {
    width       : 180px;
    line-height : 1.25em;
    white-space : pre-wrap;
}

itrk-business-card.small {
    height     : 100px;
    min-height : auto;
}

itrk-business-card.small .top,
itrk-business-card.small .bottom {
    margin-right : 75px;
    font-size    : 12px !important;
    line-height  : 16px !important;
}

itrk-business-card.small .title {
    font           : normal normal 600 14px/18px Fira Sans;
    text-transform : uppercase;
}

itrk-business-card.small .name {
    font-size   : 13px !important;
    font-weight : normal;
}

itrk-business-card.small .img {
    position                  : absolute;
    right                     : 0;
    top                       : 0;
    bottom                    : 0;
    max-height                : 98px;
    max-width                 : 73px;
    border-radius             : 6px;
    border-top-left-radius    : 0 !important;
    border-bottom-left-radius : 0 !important;
}

itrk-business-card.small a.link {
    width : 75px;
}


/* itrk-cards.css */
.itrk-card {
    font          : var(--font-normal);
    color         : var(--darkgray);
    text-align    : left;
    background    : white;
    border-radius : var(--itrk-border-radius);
    border        : 1px solid var(--lightgray-border);
    box-sizing    : border-box;
    padding       : 20px;
}

.itrk-card.gray {
    background : var(--lightgray-1);
}

.itrk-card.no-border {
    border : 0;
}

a > .itrk-card:hover {
    border-color : var(--primary-color);
}

.itrk-card::after {
    content : "";
    display : block;
    clear   : both;
}

.itrk-card > *:not(.itrk-card-header):first-child {
    margin-top : 0 !important;
}

.itrk-card > *:not(.itrk-card-footer):last-child {
    margin-bottom : 0 !important;
}

.itrk-card .itrk-card-header {
    margin-right  : -20px;
    margin-left   : -20px;
    margin-bottom : 20px;
    padding       : 0 20px 20px 20px;
    border-bottom : 1px solid var(--lightgray-border);
}

.itrk-card .itrk-card-header::after {
    content : "";
    display : block;
    clear   : both;
}

.itrk-card .itrk-card-header *:first-child {
    margin-top : 0 !important;
}

.itrk-card .itrk-card-header *:last-child {
    margin-bottom : 0 !important;
}

.itrk-card .itrk-card-header.itrk-bg-lightgray {
    margin-top              : -20px;
    padding-top             : 20px;
    border-top-left-radius  : var(--itrk-border-radius);
    border-top-right-radius : var(--itrk-border-radius);
}

.itrk-card .itrk-card-header h1,
.itrk-card .itrk-card-header h2,
.itrk-card .itrk-card-header h3,
.itrk-card .itrk-card-header h4 {
    border : 0 !important;
    font   : normal normal 500 19px/27px Bitter !important;
}

.itrk-card .itrk-card-body {
    padding-top    : 20px;
    padding-bottom : 0;
}

.itrk-card .itrk-card-footer {
    margin-right : -20px;
    margin-left  : -20px;
    padding      : 20px 20px 0 20px;
    margin-top   : 20px;
    border-top   : 1px solid var(--lightgray-border);
}

.itrk-card .itrk-card-footer .itrk-button-bar:first-child {
    margin-top : 0 !important;
}

.itrk-card div.stretched {
    margin-left  : -20px !important;
    margin-right : -20px !important;
}

itrk-expandable .itrk-card {
    border : 0;
}

.itrk-card.p-5 {
    padding : 5px;
}

.itrk-card.p-5 .itrk-card-header {
    margin-right  : -5px;
    margin-left   : -5px;
    padding       : 0 5px 5px 5px;
    border-bottom : 1px solid var(--lightgray-border);
}

.itrk-card.p-10 {
    padding : 10px;
}

.itrk-card.p-10 .itrk-card-header {
    margin-right  : -10px;
    margin-left   : -10px;
    padding       : 0 10px 10px 10px;
    border-bottom : 1px solid var(--lightgray-border);
}

.itrk-card.p-20 {
    padding : 20px;
}

.itrk-card.p-20 .itrk-card-header {
    margin-right  : -20px;
    margin-left   : -20px;
    margin-bottom : 20px;
    padding       : 0 20px 20px 20px;
    border-bottom : 1px solid var(--lightgray-border);
}

.itrk-card.p-20 .itrk-card-body {
    padding-top    : 20px;
    padding-bottom : 20px;
}

.itrk-card.p-20 .itrk-card-footer {
    margin-right : -20px;
    margin-left  : -20px;
    padding      : 20px 20px 0 20px;
}

.itrk-card.p-30 {
    padding : 30px;
}

.itrk-card.p-30 .itrk-card-header {
    margin-right  : -30px;
    margin-left   : -30px;
    margin-bottom : 30px;
    padding       : 0 30px 30px 30px;
    border-bottom : 1px solid var(--lightgray-border);
}

.itrk-card.p-30 .itrk-card-body {
    padding-top    : 30px;
    padding-bottom : 30px;
}

.itrk-card.p-30 .itrk-card-footer {
    margin-right : -30px;
    margin-left  : -30px;
    padding      : 30px 30px 0 30px;
}

.itrk-card.p-40 {
    padding : 40px;
}

.itrk-card.p-40 .itrk-card-header {
    margin-right  : -40px;
    margin-left   : -40px;
    padding       : 0 40px 40px 40px;
    margin-bottom : 40px;
    border-bottom : 1px solid var(--lightgray-border);
}

.itrk-card.p-40 .itrk-card-body {
    padding-top    : 40px;
    padding-bottom : 40px;
}

.itrk-card.p-40 .itrk-card-footer {
    margin-right : -40px;
    margin-left  : -40px;
    padding      : 40px 40px 0 40px;
}

.itrk-card .itrk-card-header.gray {
    background              : var(--lightgray) !important;
    border-top-left-radius  : var(--itrk-border-radius);
    border-top-right-radius : var(--itrk-border-radius);
    margin-top              : -20px;
    padding-top             : 20px;
}

.itrk-card.p-10 .itrk-card-header.gray {
    margin-top  : -10px;
    padding-top : 10px;
}

.itrk-card.p-20 .itrk-card-header.gray {
    margin-top  : -20px;
    padding-top : 20px;
}

.itrk-card.p-30 .itrk-card-header.gray {
    margin-top  : -30px;
    padding-top : 30px;
}

.itrk-card.p-40 .itrk-card-header.gray {
    margin-top  : -40px;
    padding-top : 40px;
}

.itrk-card.itrk-bg-secondary,
.itrk-card.itrk-bg-secondary * {
    color : white !important;
}


@media (max-width : 768px) {
    .itrk-card.p-40 {
        padding : 20px !important;
    }
    
    .itrk-card.p-40 .itrk-card-header {
        margin-right : -20px;
        margin-left  : -20px;
        padding      : 0 20px 20px 20px !important;
    }
    
    .itrk-card.p-40 .itrk-card-body {
        padding-top    : 20px;
        padding-bottom : 20px;
    }
    
    .itrk-card.p-40 .itrk-card-footer {
        margin-right : -20px;
        margin-left  : -20px;
        padding      : 20px 20px 0 20px !important;
    }
}

.itrk-card.itrk-card-product {
    width      : 25%;
    text-align : center;
    position   : relative;
}

.itrk-card.itrk-card-product ul.itrk-card-list li {
    list-style-image : none !important;
}

.itrk-card.itrk-card-product .itrk-card-header h3 {
    color          : var(--darkgray-2);
    font-size      : 18px!important;
    text-transform : uppercase;
    margin         : 0 !important;
    padding        : 0 !important;
}

.itrk-card.itrk-card-product .itrk-card-header .description {
    margin-top  : 10px;
    font-size   : 14px;
    line-height : 1.2rem;
    color       : var(--darkgray);
}

.itrk-card.itrk-card-product .itrk-card-header .price {
    font-size   : 18px;
    line-height : 1em;
    font-family : var(--font-family-sans);
    font-weight : 500;
    padding     : 15px 0;
}

.itrk-card.itrk-card-product .itrk-card-header .icon {
    margin-top : 10px;
}

.itrk-card.itrk-card-product .itrk-card-header .icon img {
    max-height : 110px;
}

.itrk-card.product.selectedProduct,
.itrk-card.itrk-card-product-small.selectedProduct,
.itrk-card.itrk-card-product-horizontal.selectedProduct,
.itrk-card.itrk-card-product.selectedProduct {
    border : 2px solid var(--primary-color);
}

.itrk-card.itrk-card-product.bestseller::before {
    position                : absolute;
    z-index                 : 20;
    top                     : -8px;
    right                   : -7px;
    bottom                  : 0;
    height                  : 100px;
    width                   : 100px;
    content                 : "";
    background              : url(/gfx/Banner2021/banderole.svg) no-repeat;
    -ms-background-size     : cover;
    -o-background-size      : cover;
    -moz-background-size    : cover;
    -webkit-background-size : cover;
    background-size         : cover;
}

@media (max-width : 768px) {
    .itrk-card .itrk-card-header {
        height : auto !important;
    }
    
    .itrk-card.itrk-card-product {
        max-width : 350px;
    }
}

/** .itrk-card-product-small **/
.itrk-card.itrk-card-product-small {
    background : white;
    position   : relative;
    padding    : 20px 10px;
}

.itrk-card.itrk-card-product-small.selectedProduct {
    padding : 18px 10px 20px 10px;
}

.itrk-card-product-small .itrk-icon {
    position  : absolute;
    top       : 0;
    left      : 50%;
    transform : translate(-50%, -50%);
}

.itrk-card.itrk-card-product-small h5 {
    font       : normal normal 600 16px/21px Bitter;
    color      : var(--darkgray);
    margin-top : 10px;
}

.itrk-card.itrk-card-product-small .price {
    font   : normal normal 600 18px/19px Fira Sans;
    color  : var(--darkgray);
    margin : 10px 0;
}

.itrk-card.itrk-card-product-horizontal .itrk-icon {
    margin-bottom : 5px;
}

.itrk-card.itrk-card-product-horizontal h5 {
    font        : normal normal 600 14px/18px Bitter;
    font-weight : 500 !important;
    color       : var(--darkgray-2);
    margin      : 0 !important;
}

.itrk-card.itrk-card-product-horizontal .price {
    font        : normal normal 600 14px/19px Fira Sans;
    font-size   : 16px;
    font-weight : 500;
    color       : var(--darkgray);
    margin      : 5px 0;
}

/** .itrk-card-list **/
.itrk-card-list-standard,
.itrk-card-list {
    transition       : none !important;
    color            : var(--darkgray);
    position         : relative;
    list-style-type  : none;
    list-style-image : unset;
    margin-bottom    : 10px !important;
}

.itrk-card-list-standard li > i,
.itrk-card-list-standard li > span {
    line-height : inherit;
}

.itrk-card-list-standard li {
    padding : 0.5em 0 7px 25px !important;
    font    : normal normal normal 14px/17px Fira Sans;
}

.itrk-card-list li {
    margin-left   : 0;
    margin-right  : 0;
    padding       : 10px 10px 9px 36px !important;
    border-bottom : 1px solid var(--itrk-border);
}

.itrk-card-list-standard li:first-child,
.itrk-card-list li:first-child {
    padding-top : 0 !important;
    border-top  : 0;
}

.itrk-card-list-standard li:last-child,
.itrk-card-list li:last-child {
    padding-bottom : 0 !important;
    border-bottom  : 0;
}

.itrk-card-list li {
    position: relative;
}

.itrk-card-list li i.fa-circle {
    position    : absolute;
    left        : 21px;
    top         : 1em;
    font-size   : 8px;
    color       : var(--primary-color);
    line-height : inherit;
}

.itrk-card-list li i.fa-star {
    position    : absolute;
    left        : 21px;
    margin-top  : 0px;
    font-size   : 14px;
    color       : var(--primary-color);
    line-height : inherit;
}

.itrk-card-list {
    transition       : none !important;
    color            : var(--darkgray);
    position         : relative;
    list-style-type  : none;
    list-style-image : unset;
}

.itrk-card-list.--no-border {
    list-style : none !important;
}

#Article ul.itrk-card-list li {
    margin-left    : 0.5em;
    margin-bottom  : 0;
    padding-top    : 5px !important;
    padding-bottom : 5px !important;
    border-bottom  : none;
}


/* itrk-info.css */

.itrk-info {
    display       : block;
    font          : var(--font-normal) !important;
    color         : var(--darkgray) !important;
    padding       : 20px !important;
    margin        : 20px 0;
    border        : 1px solid var(--itrk-border) !important;
    border-radius : var(--itrk-border-radius) !important;
    background    : var(--lightgray) !important;
}

.itrk-info > hr {
    margin     : 20px -20px !important;
    border     : none !important;
    border-top : 1px solid var(--itrk-border) !important;
}

.itrk-info.white {
    background   : white !important;
}

.itrk-info.orange {
    background   : white !important;
    border-color : var(--primary-color) !important;
}
.itrk-info.orange > hr {
    border-color : var(--primary-color) !important;
}

itrk-expandable .itrk-info {
    background-color: white !important;
}

div.itrk-intro {
    text-align : center;
    margin     : 30px auto;
    max-width  : 700px;
    font       : var(--font-normal);
}

div.itrk-intro > div {
    margin-bottom: 1em;
}

div.itrk-intro > div:last-child {
    margin-bottom: 0;
}


/* itrk-rich-list.css */
.itrk-rich-list {
    display       : block;
    border        : 1px solid var(--itrk-border);
    background    : white;
    border-radius : var(--itrk-border-radius);
}

.itrk-rich-list > .itrk-rich-list-header {
    background              : var(--lightgray);
    padding                 : 20px;
    border-top-left-radius  : var(--itrk-border-radius);
    border-top-right-radius : var(--itrk-border-radius);
    border-bottom           : 1px solid var(--lightgray-border);
    margin: 0!important;
    font: var(--font-normal)!important; ;
}

.itrk-rich-list > .itrk-rich-list-header:after {
    display : block;
    clear   : both;
    content : "";
}

.itrk-rich-list > ul {
    display          : block !important;
    width            : auto !important;
    list-style-type  : none !important;
    list-style-image : none !important;
    padding          : 0 !important;
    margin           : 0 !important;
}

.itrk-rich-list > ul > li {
    position         : relative;
    margin           : 0 20px !important;
    padding          : 20px 0 !important;
    list-style-image : none !important;
    border-bottom    : 1px solid var(--lightgray-border);
}

.itrk-rich-list > ul > li:last-child {
    border-bottom : 0;
}


/* itrk-dropdown.css */

div.itrk-dropdown {
    position         : relative;
    display          : block;
    width            : 100%;
    background-color : white !important;
    border           : 1px solid var(--lightgray-4);
    color            : var(--darkgray);
    border-radius    : var(--itrk-border-radius);
    margin-bottom    : 10px;
    padding          : 9px;
    height           : 37px;
    font             : var(--font-normal);
    line-height      : 17px;
    white-space      : nowrap;
    box-sizing       : border-box;
}

.itrk-dropdown[label]:after {
    position         : absolute;
    background-color : white;
    top              : -8px;
    left             : 6px;
    padding          : 0 4px;
    font-size        : 11px;
    color            : var(--darkgray);
    text-transform   : uppercase;
    font-family      : 'Fira Sans', Arial, verdana, sans-serif;
    content          : attr(label);
    z-index          : 2;
}


div.itrk-dropdown.inline {
    display : inline-block;
    width   : auto;
}

div.itrk-dropdown::before {
    position       : absolute;
    right          : 10px;
    margin-top     : 1px !important;
    color          : var(--darkgray);
    font-family    : var(--itrk-fa-font-family);
    font-weight    : 900 !important;
    line-height    : inherit;
    content        : "\f078";
    pointer-events : none;
}

div.itrk-dropdown select {
    appearance         : none;
    -webkit-appearance : none;
    width              : 100%;
    box-sizing         : border-box;
    padding-right      : 25px;
    background         : none;
    color              : inherit;
    border             : 0;
    outline            : 0;
    line-height        : inherit;
}

div.itrk-dropdown:has(select:focus) {
    border-color : var(--primary-color);
}

div.itrk-dropdown select.error {
    color : var(--red-color);
}

div.itrk-dropdown select:focus {
    outline : 0;
}

div.itrk-dropdown select option {
    font-family : inherit;
}

div.itrk-dropdown-list ul {
    display               : inline-block;
    width                 : auto;
    min-width             : 152px;
    font                  : var(--font-normal);
    border-radius         : var(--itrk-border-radius);
    color                 : var(--darkgray);
    border                : 1px solid var(--lightgray-4);
    margin-left           : 0px !important;
    box-sizing            : border-box;
    white-space           : nowrap;
    position              : relative;
    list-style            : none;
    background            : white;
    z-index               : 10;
    padding               : 6px 10px !important;
    height                : 37px;
    user-select           : none;
    -ms-user-select       : none; /* Internet Explorer/Edge */
    -moz-user-select      : none; /* Old versions of Firefox */
    -khtml-user-select    : none; /* Konqueror HTML */
    -webkit-user-select   : none; /* Safari */
    -webkit-touch-callout : none; /* iOS Safari */
}

div.itrk-dropdown-list ul li {
    background  : inherit;
    list-style  : none;
    white-space : nowrap;
    display     : none;
    margin      : 0 !important;
    height      : initial !important;
    padding     : 0 5px;
    color       : inherit;
    line-height : 23px;
}

div.itrk-dropdown-list.inline {
    display : inline-block;
}

.itrk-dropdown-list {
    position : relative;
    height   : 37px;
}

.itrk-dropdown-list ul {
    color    : var(--darkgray);
    overflow : visible;
}

div.itrk-dropdown-list ul li:first-child {
    display : block;
}

div.itrk-dropdown-list ul li:first-child::after {
    font        : normal normal normal 14px/1 var(--itrk-fa-font-family);
    font-weight : 900 !important;
    content     : "\f078";
    float       : right;
    margin-left : 25px;
    line-height : inherit;
}

div.itrk-dropdown-list.open ul {
    position      : relative;
    width         : 100%;
    height        : initial !important;
    margin-bottom : 52px;
    z-index       : 20;
}

div.itrk-dropdown-list.open ul li {
    display        : block;
    padding-bottom : 10px;
}

div.itrk-dropdown-list.open ul li:last-of-type {
    padding-bottom : 0 !important;
}

div.itrk-dropdown-list.open ul li:first-child::after {
    font        : normal normal normal 14px/1 var(--itrk-fa-font-family);
    font-weight : 900 !important;
    content     : "\f077";
    float       : right;
    margin-left : 25px;
    line-height : inherit;
}

@media (hover : hover) and (pointer : fine) {
    div.itrk-dropdown-list ul:hover {
        position      : relative;
        width         : 100%;
        height        : initial;
        margin-bottom : 52px;
        z-index       : 20;
    }

    div.itrk-dropdown-list ul:hover li {
        display        : block;
        padding-bottom : 10px;
    }

    div.itrk-dropdown-list ul:hover {
        height : initial !important;
    }

    div.itrk-dropdown-list ul:hover li:last-of-type {
        padding-bottom : 0 !important;
    }

    div.itrk-dropdown-list ul:hover li:first-child::after {
        font        : normal normal normal 14px/1 var(--itrk-fa-font-family);
        font-weight : 900 !important;
        content     : "\f077";
        float       : right;
        margin-left : 25px;
        line-height : inherit;
    }
}

div.itrk-dropdown-list ul li a {
    color : inherit;
}

div.itrk-dropdown-list ul li .fa,
div.itrk-dropdown-list ul li img {
    line-height  : 23px;
    height       : 23px;
    width        : auto;
    margin-right : 5px;
}

div.itrk-dropdown-list ul li .fa {
    margin-right : 8px;
}

div.itrk-dropdown-list.with-shadow ul {
    box-shadow   : 2px 2px 6px 0 rgba(0, 0, 0, 0.2);
    border-color : #f7f7f8;
}

.SideBarItem div.itrk-dropdown-list ul {
    display : block;
    padding : 5px 15px;
    height  : initial !important;
}

.SideBarItem div.itrk-dropdown-list ul li:first-child {
    margin-top : 0;
}


/* itrk-twolevel-select.css */

itrk-twolevel-select {
    display       : inline-block;
    border        : 1px solid var(--lightgray-4);
    border-radius : 7px;
}

itrk-twolevel-select div.valueContainer {
    min-height    : 35px;
    background    : #f1f1f1;
    border-radius : 7px;
    padding       : 9px 10px 9px 10px;
    box-sizing    : border-box;
    font          : normal normal 600 14px/17px "Fira Sans";
    color         : var(--darkgray);
    cursor        : pointer;
    overflow      : hidden;
}

itrk-twolevel-select div.valueContainer:before {
	font        : normal normal normal 14px/1 var(--itrk-fa-font-family);
    font-weight : 900 !important;
    content     : "\f078";
    float       : right;
    margin-left : 25px;
    line-height : inherit;
}

itrk-twolevel-select div.valueContainer.opened:before {
    content : "\f077";
}

itrk-twolevel-select > div.flyoutContainer {
    padding-top    : 10px;
    padding-bottom : 10px;
}

div.flyoutContainer > level-one-items > div,
div.flyoutContainer > level-two-items > div {
    height      : auto;
    font-family : var(--font-family-sans);
    font-size   : 14px;
    line-height : 1.2em;
    color       : var(--darkgray);
    padding     : 9px 18px;
    cursor      : pointer;
}

div.flyoutContainer > level-one-items > div.selected,
div.flyoutContainer > level-two-items > div.selected {
    background    : var(--lightgray-3) 0% 0% no-repeat padding-box;
	font-weight   : bold;
	border-radius : 7px;
}

div.flyoutContainer > level-one-items > div.selected:before,
div.flyoutContainer > level-two-items > div.selected:before {
	font        : normal normal 900 14px/17px var(--itrk-fa-font-family);
    content     : "\f00c";
    color       : var(--green-color);
    float       : right;
    margin-left : 25px;
    line-height : inherit;
}

div.flyoutContainer > level-one-items > div > span,
div.flyoutContainer > level-two-items > div > span {
    color : var(--lightgray-4);
}

itrk-twolevel-select > div.flyoutContainer button.showLevelTwoItems {
    margin-top       : 10px;
    margin-left      : 18px;
    border           : unset;
    background-color : unset;
    font             : normal normal 600 14px/22px "Fira Sans";
    color            : var(--darkgray);
}

itrk-twolevel-select > div.flyoutContainer button.showLevelTwoItems:before {
	font         : normal normal normal 14px/1 var(--itrk-fa-font-family);
    font-weight  : 900 !important;
    content      : "\f077";
    float        : left;
    line-height  : inherit;
    transform    : matrix(0, 1, -1, 0, 0, 0);
    margin-right : 6px;
}

itrk-twolevel-select > div.flyoutContainer button.showLevelTwoItems.opened:before {
    content   : "\f078";
    transform : none;
}

div.flyoutContainer > level-two-items {
    padding-top : 10px;
}


/* itrk-form.css */

form.itrk-form {
    margin-bottom : 2em;
}

.itrk-form input[type="file"]::file-selector-button {
    color            : var(--primary-color);
    text-transform   : uppercase;
    background-color : white;
    border           : 1px solid var(--primary-color);
    border-radius    : 7px;
    margin-bottom    : 10px;
    margin-right     : 10px;
    padding          : 9px;
    height           : 37px;
    font             : normal normal normal 14px/17px Fira Sans;
    white-space      : nowrap;
}

.itrk-form .itrk-input,
.itrk-form itrk-input {
    margin-bottom : 10px !important;
    display       : block;
    position      : relative;
}

.itrk-form itrk-input-wrapper input,
.itrk-form itrk-input-wrapper textarea {
    border  : none;
    outline : none;
    width   : 100%;
    height  : 100%;
}

.itrk-form itrk-twolevel-select[disabled] div.valueContainer,
.itrk-form itrk-twolevel-select[readonly] div.valueContainer {
    color : #999999;
}

.itrk-form itrk-twolevel-select[disabled],
.itrk-form itrk-twolevel-select[readonly],
.itrk-form itrk-input[type="text"][disabled] itrk-input-wrapper,
.itrk-form itrk-textarea[disabled] itrk-input-wrapper,
.itrk-form itrk-input[type="text"][readonly] itrk-input-wrapper,
.itrk-form itrk-textarea[readonly] itrk-input-wrapper {
    background : rgba(0, 0, 0, 0.03);
    color      : #999999;
}

.itrk-form itrk-input[type="text"][disabled] itrk-input-wrapper input[disabled],
.itrk-form itrk-textarea[disabled] itrk-input-wrapper textarea[disabled],
.itrk-form itrk-input[type="text"][readonly] itrk-input-wrapper input[readonly],
.itrk-form itrk-textarea[readonly] itrk-input-wrapper textarea[readonly] {
    background : none;
}

.itrk-form itrk-input-content {
    display : block;
    height  : 100%;
}

.itrk-form itrk-input-content itrk-input-wrapper.action {
    padding-right : 42px;
}

.itrk-form > input.itrk-input,
.itrk-form itrk-input-wrapper {
    background-color : white;
    border           : 1px solid var(--lightgray-4);
    color            : var(--tertiary-color);
    border-radius    : 7px;
    padding          : 9px 10px;
    width            : 100%;
    display          : inline-block;
    height           : 37px;
    position         : relative;
    box-sizing       : border-box;
    line-height      : 17px;
}

.itrk-form itrk-textarea {
    display       : block;
    margin-bottom : 10px;
    box-sizing    : border-box;
    position      : relative;
}

.itrk-form itrk-textarea itrk-input-wrapper {
    height : 100%;
}

.itrk-form itrk-textarea textarea {
    border     : none;
    resize     : none;
    box-sizing : border-box;
    height     : 100%;
}

.itrk-form textarea {
    height : auto;
}

.itrk-form > input.itrk-input:hover,
.itrk-form > input.itrk-input:has(input:focus),
.itrk-form itrk-input-wrapper:hover,
.itrk-form itrk-input-wrapper:has(:is(input, textarea):focus) {
    border-color : var(--primary-color);
    outline      : none;
}

.itrk-form itrk-textarea.error itrk-input-wrapper,
.itrk-form itrk-input.error itrk-input-wrapper,
.itrk-form .itrk-dropdown.error {
    border-color : #cb2e25;
    background   : #fff5f5;
}

.itrk-form itrk-textarea.error itrk-input-wrapper input,
.itrk-form itrk-input.error itrk-input-wrapper input {
    background : none;
}

.itrk-form itrk-input-error {
    color       : var(--lightgray-4);
    display     : none;
    margin-left : 8px;
    margin-top  : 5px;
    font-size   : 12px;
}

.itrk-form itrk-input-error:empty {
    display:none !important;
}

.itrk-form itrk-input-error {
    color : #cb2e25;
}

.itrk-form itrk-input-wrapper.info,
.itrk-form itrk-input-content.error itrk-input-wrapper,
.itrk-form itrk-input-content.success itrk-input-wrapper {
    padding-right : 30px;
}

.itrk-form itrk-input-wrapper.regex.action.info,
.itrk-form itrk-input-content.error itrk-input-wrapper.regex.action,
.itrk-form itrk-input-content.success itrk-input-wrapper.regex.action {
    padding-right : 60px;
}

.itrk-form itrk-input-content.error itrk-input-wrapper.regex i.info,
.itrk-form itrk-input-content.success itrk-input-wrapper.regex i.info,
.itrk-form itrk-input-content itrk-input-wrapper.regex i.error,
.itrk-form itrk-input-content itrk-input-wrapper.regex i.success {
    display : none;
}

/* .itrk-form itrk-input-wrapper.info.regex i.info,  */
.itrk-form itrk-input-content.error itrk-input-wrapper.regex i.error,
.itrk-form itrk-input-content.error itrk-input-error.error,
.itrk-form itrk-input-content.success itrk-input-wrapper.regex i.success {
    display : inline-block;
}

.itrk-form itrk-input-content.error itrk-input-wrapper.regex i.error {
    color : #cb2e25;
}

.itrk-form itrk-input-content.error itrk-input-wrapper {
    border-color : #cb2e25;
}

.itrk-form itrk-input-content.success itrk-input-wrapper.regex i.success {
    color : var(--secondary-color);
}

.itrk-form itrk-input-content itrk-input-wrapper i.success {
    display : none;
}

.itrk-form itrk-input-content.success itrk-input-wrapper i.success {
    animation-fill-mode : forwards;
    animation-delay     : 1.5s;
}

.itrk-form itrk-input-wrapper i.prepend-icon {
    position : absolute;
    width    : 14px;
    left     : 7px;
    color    : var(--lightgray-4);
}

.itrk-form itrk-input-wrapper.prepend-icon {
    padding-left : 25px;
}

.itrk-form itrk-input-content.error itrk-input-wrapper.regex.action i.error,
.itrk-form itrk-input-content.success itrk-input-wrapper.regex.action i.success,
.itrk-form itrk-input-content.error itrk-input-wrapper.regex i.error,
.itrk-form itrk-input-content.success itrk-input-wrapper.regex i.success {
    position : absolute;
    width    : 14px;
    right    : 40px;
    top      : 10px;
}

.itrk-form itrk-input[type="text"] itrk-input-content.error itrk-input-wrapper.regex.action i.error,
.itrk-form itrk-input[type="text"] itrk-input-content.success itrk-input-wrapper.regex.action i.success,
.itrk-form itrk-input[type="text"] itrk-input-content.error itrk-input-wrapper.regex i.error,
.itrk-form itrk-input[type="text"] itrk-input-content.success itrk-input-wrapper.regex i.success,
.itrk-form itrk-input[type="url"] itrk-input-content.error itrk-input-wrapper.regex.action i.error,
.itrk-form itrk-input[type="url"] itrk-input-content.success itrk-input-wrapper.regex.action i.success,
.itrk-form itrk-input[type="url"] itrk-input-content.error itrk-input-wrapper.regex i.error,
.itrk-form itrk-input[type="url"] itrk-input-content.success itrk-input-wrapper.regex i.success {
    top       : 50%;
    transform : translateY(-50%);
}


.itrk-form itrk-input-content.error itrk-input-wrapper.regex i.error,
.itrk-form itrk-input-content.success itrk-input-wrapper.regex i.success {
    right : 5px;
}

.itrk-form itrk-input-wrapper itrk-input-button {
    position         : absolute;
    height           : 100%;
    width            : 37px;
    top              : 0;
    right            : -1px;
    box-sizing       : border-box;
    display          : flex;
    justify-content  : center;
    align-items      : center;
    border-radius    : 0 7px 7px 0;
    background-color : var(--tertiary-color);
    color            : white;
}

.itrk-form itrk-input-wrapper itrk-input-button:active {
    opacity : 0.9;
}

.itrk-form itrk-input-wrapper itrk-input-button i {
    position : static;
}

.itrk-form input[type="password"]::placeholder,
.itrk-form input[type="text"]::placeholder,
.itrk-form textarea::placeholder {
    color : var(--lightgray-4);
}

.itrk-form input[type="password"]:focus::placeholder,
.itrk-form input[type="text"]:focus::placeholder,
.itrk-form textarea:focus::placeholder {
    color : transparent;
}

.itrk-form textarea {
    padding : 0;
}

/* Tooltip in Formular */
itrk-input-content itrk-input-wrapper .tooltip-wrapper {
    display  : inline-block;
    position : absolute;
    right    : 7px;
}

itrk-input-content itrk-input-wrapper.action .tooltip-wrapper {
    right : 42px;
}

itrk-input-content.error itrk-input-wrapper .tooltip-wrapper {
    display : none;
}

.itrk-form-placeholder {
    width      : 100%;
    height     : 215px;
    display    : block;
    margin     : auto;
    position   : relative;
    background : #ffffff;
    box-sizing : border-box;
}

.itrk-form-placeholder::after {
    content             : '';
    width               : calc(100% - 30px);
    height              : calc(100% - 15px);
    top                 : 15px;
    left                : 15px;
    position            : absolute;
    background-image    : linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.5) 50%, transparent 100%),
    linear-gradient(#eeeeee 30px, transparent 0),
    linear-gradient(#eeeeee 20px, transparent 0),
    linear-gradient(#eeeeee 80px, transparent 0),
    linear-gradient(#eeeeee 16px, transparent 0),
    linear-gradient(#eeeeee 50px, transparent 0);
    background-repeat   : no-repeat;
    background-size     : 75px 175px, 100% 35px, 100% 25px, 100% 40px, 100% 16px, 100% 30px;
    background-position : -185px 0, center 0, center 40px, center 72px, center 125px, center 155px;
    box-sizing          : border-box;
    animation           : itrk-form-placeholder-animation 1s linear infinite;
}

@keyframes itrk-form-placeholder-animation {
    to {
        background-position : 100% 0, center 0, center 40px, center 72px, center 125px, center 155px;
    }
}

itrk-input-wrapper.inline-label {
    position   : relative;
    margin-top : 5px;
}

itrk-input-wrapper.inline-label label {
    position         : absolute;
    top              : -8px;
    left             : 6px;
    padding          : 0 4px;
    font-size        : 11px;
    color            : var(--darkgray);
    text-transform   : uppercase;
    font-family      : 'Fira Sans', Arial, verdana, sans-serif;
    z-index: 2;
}

itrk-select select {
    border: none;
}

itrk-select itrk-input-wrapper {
    padding-right: 20px!important;
}

itrk-input-wrapper label:before {
    display: inline-block;
    content: "";
    height: 50%;
    position: absolute;
    width: 100%;
    bottom: 2px;
    left: 0px;
    overflow: show;
    background-color: white;
    z-index: -1;
}

.itrk-form .error itrk-input-wrapper.inline-label label:before {
    background-color: #fff5f5;
}

itrk-group-flex {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.itrk-ckeck-radio-button {
    display: inline-block;
    padding: 20px 40px;
    border: 1px solid var(--itrk-border);
    background: var(--lightgray);
    border-radius: var(--itrk-border-radius);
    overflow: hidden;
}

itrk-group-flex .itrk-ckeck-radio-button {
    flex: 1 0 auto;
}

.itrk-ckeck-radio-button input {
    display: none;
}

.itrk-ckeck-radio-button span {
    display: block;
}

.itrk-ckeck-radio-button img {
    height: 43px;
    width: auto;
}



itrk-checkbox {
    display: inline-block;
}

itrk-checkbox itrk-checkbox-wrapper,
itrk-radio itrk-radio-wrapper {
    position : relative;
}

itrk-checkbox input[type="checkbox"],
itrk-radio input[type="radio"] {
    transition       : all 300ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
    appearance       : none;
    background-color : transparent;
    margin           : 0;
    font             : inherit;
    color            : currentColor;
    width            : 1.15em;
    height           : 1.15em;
    border           : 0.12em solid var(--lightgray-4);;
    border-radius    : 0.15em;
    transform        : translateY(-0.075em);
    vertical-align: middle !important;
}

itrk-radio input[type="radio"] {
    border-radius : 100%;
}

itrk-checkbox input[type="checkbox"]:disabled,
itrk-radio input[type="radio"]:disabled {
    background : var(--form-input-disabled-background);
    cursor     : not-allowed;
}

itrk-checkbox input[type="checkbox"]:not(:disabled):focus,
itrk-checkbox input[type="checkbox"]:not(:disabled):hover,
itrk-radio input[type="radio"]:not(:disabled):focus,
itrk-radio input[type="radio"]:not(:disabled):hover {
    border-color : var(--primary-color);
}

itrk-checkbox.secondary input[type="checkbox"]:not(:disabled):focus,
itrk-checkbox.secondary input[type="checkbox"]:not(:disabled):hover,
itrk-radio.secondary input[type="radio"]:not(:disabled):focus,
itrk-radio.secondary input[type="radio"]:not(:disabled):hover {
    border-color : var(--secondary-color);
}

itrk-checkbox input[type="checkbox"]::before,
itrk-radio input[type="radio"]::before {
    transition       : inherit;
    display          : block;
    background-color : var(--primary-color);
    content          : '';
    position         : relative;
    box-sizing       : border-box;
    transform        : scale(0);
}

itrk-checkbox input[type="checkbox"]::before {
    width     : 100%;
    height    : 100%;
    clip-path : polygon(22% 44%, 44% 62%, 79% 14%, 94% 25%, 47% 88%, 10% 59%);
}

itrk-radio input[type="radio"]::before {
    width         : 50%;
    height        : 50%;
    margin        : 25%;
    border-radius : 100%;
}

itrk-checkbox.secondary input[type="checkbox"]::before,
itrk-radio.secondary input[type="radio"]::before {
    background-color : var(--secondary-color);
}

itrk-checkbox input[type="checkbox"]:checked::before,
itrk-radio input[type="radio"]:checked::before {
    transform : scale(1);
}

itrk-checkbox input[type="checkbox"]:disabled::before,
itrk-checkbox.secondary input[type="checkbox"]:disabled::before,
itrk-radio input[type="radio"]:disabled::before,
itrk-radio.secondary input[type="radio"]:disabled::before {
    background-color : var(--lightgray-4);
}

itrk-checkbox label > *,
itrk-radio label > * {
    vertical-align: middle;
}

itrk-checkbox label > input[type="checkbox"],
itrk-radio label > input[type="radio"] {
    margin-right : 0.35em;
}

/* Tooltips after checkbox and radio */
itrk-checkbox .tooltip-wrapper,
itrk-radio .tooltip-wrapper {
    display  : inline-block;
    position : relative;
}


itrk-loading {
  display: none;
  align-items: center;
  justify-content: center;
  position: fixed;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  background: rgba(255, 255, 255, 0.7);
  z-index: 99;
}

itrk-loading.show {
  display: flex !important;
}

.itrk-loading > div,
itrk-loading > div {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
}

itrk-loading > div > img {
    width: 100px;
    max-width: 140px;
}

.itrk-loading .itrk-ellipsis,
itrk-loading .itrk-ellipsis {
  display: inline-block;
  position: relative;
  width: 75px;
  height: 80px;
}
.itrk-loading .itrk-ellipsis div,
itrk-loading .itrk-ellipsis div {
  position: absolute;
  top: 33px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--primary-color);
  animation-timing-function: cubic-bezier(0, 1, 1, 0);
}
.itrk-loading .itrk-ellipsis div:nth-child(1),
itrk-loading .itrk-ellipsis div:nth-child(1) {
  left: 8px;
  animation: itrk-ellipsis1 0.6s infinite;
}
.itrk-loading .itrk-ellipsis div:nth-child(2),
itrk-loading .itrk-ellipsis div:nth-child(2) {
  left: 8px;
  animation: itrk-ellipsis2 0.6s infinite;
}
.itrk-loading .itrk-ellipsis div:nth-child(3),
itrk-loading .itrk-ellipsis div:nth-child(3) {
  left: 32px;
  animation: itrk-ellipsis2 0.6s infinite;
}
.itrk-loading .itrk-ellipsis div:nth-child(4),
itrk-loading .itrk-ellipsis div:nth-child(4) {
  left: 56px;
  animation: itrk-ellipsis3 0.6s infinite;
}
@keyframes itrk-ellipsis1 {
  0% {
    transform: scale(0);
  }
  100% {
    transform: scale(1);
  }
}
@keyframes itrk-ellipsis3 {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(0);
  }
}
@keyframes itrk-ellipsis2 {
  0% {
    transform: translate(0, 0);
  }
  100% {
    transform: translate(24px, 0);
  }
}


.itrk-overlay {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.4);
  display: none;
  align-items: center;
  justify-content: center;
  z-index: -10;
}
.itrk-overlay.open {
  display: flex;
  z-index: 90;
}
.itrk-overlay #news-comment-form .errorMsg {
  color: var(--red-color);
}
.itrk-overlay .card {
  background: white;
  padding: 16px 20px 20px 20px;
  min-width: 410px;
  position: relative;
  max-width: 1000px;
}
@media all and (max-width: 767px) {
  .itrk-overlay .card {
    background: white;
    padding: 10px;
    min-width: 360px;
    position: relative;
  }
}
.itrk-overlay .card .close {
  position: absolute;
  font-size: 20px;
  right: 40px;
  cursor: pointer;
}
.itrk-overlay .card .header {
  text-transform: uppercase;
  font-weight: 500;
  border-bottom: 1px solid var(--itrk-border);
  padding-bottom: 20px;
}
.itrk-overlay .card .content {
  text-align: right;
}
.itrk-overlay .card .title {
  font: var(--font-h1);
  margin-top: 10px;
  text-transform: uppercase;
}
.itrk-overlay .card .subTitle {
  font: normal normal 500 14px/22px Fira Sans;
  margin-top: 5px;
}

/** make content of overlay scrollable */
.itrk-overlay.overlay .--overlay-wrapper {
  overflow-y: scroll;
  height: 100vh;
  width: 100vw;

  display: flex;
  justify-content: center;
  align-items: center;
}

.itrk-overlay.overlay .--overlay-wrapper > .--overlay-wrapper-inner {
  padding: 60px;
  margin: auto;
}

.itrk-overlay.overlay .--overlay-wrapper .card.--overlay-center {
  margin: auto;
}
@media all and (max-width: 767px) {
  .itrk-overlay .card,
  .itrk-overlay.overlay .card {
    padding: 20px !important;
    min-width: auto !important;
  }
  .itrk-overlay .card .close {
    right: 20px;
  }

  .itrk-overlay.overlay .--overlay-wrapper > .--overlay-wrapper-inner {
    padding: 60px 20px;
  }
}

/* itrk-popup.css */
itrk-popup,
.itrk-popup {
    -ms-user-select       : none; /* Internet Explorer/Edge */
    -moz-user-select      : none; /* Old versions of Firefox */
    -khtml-user-select    : none; /* Konqueror HTML */
    -webkit-user-select   : none; /* Safari */
    -webkit-touch-callout : none; /* iOS Safari */
    user-select           : none;
    display               : none;
    font-size             : 1.1rem;
    line-height           : 1.4rem;
}


/* allows usage in headlines */
itrk-popup,
.itrk-popup,
h1 itrk-popup *,
h2 itrk-popup *,
h3 itrk-popup *,
h4 itrk-popup *,
h5 itrk-popup *,
h6 itrk-popup * {
    font-weight           : normal;
    font-family           : 'Fira Sans', Arial, verdana, sans-serif;
}

itrk-popup.visible,
.itrk-popup.visible {
    position                : fixed;
    top                     : 0;
    bottom                  : 0;
    left                    : 0;
    right                   : 0;

    box-sizing              : border-box;
    background              : rgba(0, 0, 0, 0.5);
    z-index                 : 10000;

    display                 : block;
    -webkit-backdrop-filter : blur(2px);
    backdrop-filter         : blur(2px);
}

itrk-popup > itrk-popup-frame,
.itrk-popup > .itrk-popup-frame {
    margin           : 50vh auto 50vh auto;
    transform        : translateY(-50%);
    -ms-transform    : translateY(-50%);
    z-index          : 10001;
    width            : 90%;
    max-width        : 800px;
    box-shadow       : 3px 3px 10px #00000029;
    border-radius    : var(--itrk-border-radius-outer);
    opacity          : 1;
    box-sizing       : border-box;
    padding          : 20px;
    background-color : white;
    overflow         : hidden;
    text-align       : left;
}

itrk-popup.visible > itrk-popup-frame,
.itrk-popup.visible > .itrk-popup-frame {
    display : block;
}

itrk-popup > itrk-popup-frame:before,
.itrk-popup > .itrk-popup-frame:before {
    color          : var(--darkgray);
    font-family    : var(--font-family-sans);
    font-size      : 110%;
    font-weight    : 500;
    content        : attr(popupTitle);
    display        : block;
    border-bottom  : 1px solid #ededed;
    padding-bottom : 15px;
    margin-bottom  : 15px;
}

itrk-popup itrk-popup-frame > close-btn,
.itrk-popup .itrk-popup-frame > .close-btn {
    position    : absolute;
    top         : 16px;
    right       : 17px;

    padding     : 3px;
    color       : #707070;
    text-align  : center;

	font        : normal normal normal 14px/1 var(--itrk-fa-font-family);
    font-weight : 900 !important;
    content     : "\f00d";
    font-size   : 20px;
}

itrk-popup.visible > itrk-popup-frame > itrk-popup-content,
.itrk-popup.visible > .itrk-popup-frame > .itrk-popup-content {
    color: var(--darkgray);
    overflow   : auto;
    z-index    : -10;
    display    : block;
    max-height : calc(80vh - 90px);
}
itrk-popup.visible > itrk-popup-frame > itrk-popup-content > *:last-child,
.itrk-popup.visible > .itrk-popup-frame > .itrk-popup-content > *:last-child{
    margin-bottom : 0px !important;
}


itrk-popup.with-title-bar > itrk-popup-frame:before {
    overflow   : hidden;
    background : var(--lightgray-2);
    padding    : 20px 40px 20px 20px;
    margin     : -20px -20px 20px -20px;
    bottom     : 0 !important;
}

itrk-popup-frame close-btn .fa-times {
    color: var(--darkgray)!important;
}


/* itrk-switch.css */

div.itrk-switch {
    position            : relative;
    display             : inline-block;
    width               : 42px;
    height              : 18px;
    -moz-user-select    : -moz-none;
    -khtml-user-select  : none;
    -webkit-user-select : none;
    -ms-user-select     : none;
    user-select         : none;
    -khtml-user-drag    : none;
    -webkit-user-drag   : none;
}

div.itrk-switch.active.green a {
    background-color : var(--green-color);
}

div.itrk-switch.active.blue a {
    background-color : var(--secondary-color);
}

div.itrk-switch a {
    position           : absolute;
    cursor             : pointer;
    top                : 0;
    left               : 0;
    right              : 0;
    bottom             : 0;
    background-color   : #cccccc;
    -webkit-transition : .4s;
    transition         : .4s;
    border-radius      : 12px;
    overflow           : hidden;
}

div.itrk-switch a::before {
    position           : absolute;
    content            : "";
    left               : 1px;
    bottom             : 1px;
    background-color   : white;
    -webkit-transition : .4s;
    transition         : .4s;
    height             : 16px;
    width              : 16px;
    border-radius      : 9px;
}

input.itrk-switch.small,
div.itrk-switch.small,
itrk-switch.small {
    width  : 39px;
    height : 18px;
}

/*input.itrk-switch.small a::before, */
input.itrk-switch.small:before,
itrk-switch.small a::before {
    height : 14px !important;
    width  : 14px !important;
}


button.like-btn-switch {
    width            : 100px;
    height           : 24px;
    border-radius    : 7px;
    background-color : #9e9e9e;
    border           : 0;
    
    color            : white;
    text-transform   : uppercase;
    font-size        : 12px;
    text-align       : center;
    line-height      : 24px;
}


div.itrk-switch.active a {
    background-color : #ef7d00;
}

div.itrk-switch.active a:before {
    -webkit-transform : translateX(23px);
    -ms-transform     : translateX(23px);
    transform         : translateX(23px);
}

div.itrk-switch.small,
itrk-switch.small {
    width  : 28px;
    height : 12px;
}

div.itrk-switch.small a:before {
    position           : absolute;
    content            : '';
    left               : 1px;
    bottom             : 1px;
    background-color   : white;
    -webkit-transition : .4s;
    transition         : .4s;
    height             : 10px;
    width              : 10px;
    border-radius      : 6px;
}

div.itrk-switch.active.small a::before {
    -webkit-transform : translateX(15px);
    -ms-transform     : translateX(15px);
    transform         : translateX(15px);
}

div.itrk-switch.small.active a {
    border-radius : 6px;
}

div.itrk-switch.large,
itrk-switch.large {
    width  : 58px;
    height : 24px;
}

div.itrk-switch.large a:before {
    position           : absolute;
    content            : "";
    left               : 1px;
    bottom             : 1px;
    background-color   : white;
    -webkit-transition : .4s;
    transition         : .4s;
    height             : 22px;
    width              : 22px;
    border-radius      : 50%;
}

div.itrk-switch.large.active a:before {
    -webkit-transform : translateX(33px);
    -ms-transform     : translateX(33px);
    transform         : translateX(33px);
}


input.itrk-switch {
    font-size           : 10px;
    line-height         : 20px;
    font-family         : 'Arial', sans-serif;
    position            : relative;
    width               : 45px;
    height              : 24px;
    appearance          : unset;
    background          : var(--lightgray-border);
    
    cursor              : pointer;
    
    box-sizing          : border-box;
    border-radius       : 50px;
    border              : 2px solid #bbbbbb;
    overflow            : hidden;
    
    -moz-user-select    : -moz-none;
    -khtml-user-select  : none;
    -webkit-user-select : none;
    -ms-user-select     : none;
    user-select         : none;
    
    -webkit-transition  : .4s;
    transition          : .4s;
}

input.itrk-switch.with-label:after {
    font-size    : inherit;
    line-height  : inherit;
    color        : white;
    content      : "JA";
    font-weight  : 500;
    padding-left : 5px;
}

input.itrk-switch:before {
    position           : absolute;
    top                : 0;
    left               : 0;
    display            : inline-block;
    content            : "";
    height             : 20px;
    width              : 20px;
    
    background         : white;
    border-radius      : 50px;
    
    -webkit-transition : .4s;
    transition         : .4s;
}

input.itrk-switch[disabled] {
    opacity      : 0.25;
    cursor       : not-allowed;
    border-color : #999999;
}

input.itrk-switch:checked:before {
    left : 21px;
}

input.itrk-switch.large {
    width : 58px;
}

input.itrk-switch.large:checked:before {
    left : 34px;
}

input.itrk-switch:checked {
    background   : var(--primary-color);
    border-color : var(--primary-color);
}

input.itrk-switch.blue:checked {
    background   : var(--secondary-color);
    border-color : var(--secondary-color);
}

input.itrk-switch.red:checked {
    background   : var(--red-color);
    border-color : var(--red-color);
}

input.itrk-switch.green:checked {
    background   : var(--green-color);
    border-color : var(--green-color);
}

input.itrk-switch.easysafe-blue {
    /* Easysafe hat immer einen farbigen Rand und leicht farbigen Hintergrund */
    background   : #a9dff7;
    border-color : var(--easysafe-blue);
}

input.itrk-switch.easysafe-blue:checked {
    background   : var(--easysafe-blue);
    border-color : var(--easysafe-blue);
}


/* itrk-tables.css */

table.itrk-table {
    width      : 100%;
    max-width  : 100%;
    margin-top : 1em;
    font       : var(--font-normal) !important;
}

table.itrk-table tr th {
    font        : inherit;
    background  : var(--lightgray);
    font-weight : 500 !important;
    padding     : 14px 20px !important;
}

table.itrk-table tr th,
table.itrk-table tr td {
    width : auto;
}

table.itrk-table tr th,
table.itrk-table tr td {
    font       : inherit;
    text-align : left;
    padding    : 10px 20px;
}

table.itrk-table tr th:first-child {
    overflow                  : hidden;
    border-top-left-radius    : 7px;
    border-bottom-left-radius : 7px;
}

table.itrk-table tr th:last-child {
    overflow                   : hidden;
    border-top-right-radius    : 7px;
    border-bottom-right-radius : 7px;
}

table.itrk-table tr:last-child td {
    padding-bottom : 20px;
}

table.itrk-table tr th.center,
table.itrk-table tr td.center {
    text-align : center;
}

table.itrk-table tr td.center .itrk-icon {
    margin : auto;
}

table.itrk-table tr td i {
    line-height : inherit;
}

table.itrk-table tr td .fa-times {
    color : var(--red-color);
}

table.itrk-table.with-lines tr td {
    padding       : 20px;
    border-bottom : 1px solid var(--itrk-border);
}

table.itrk-table tr:last-child td {
    border-bottom  : none !important;
    padding-bottom : 20px;
}


table.itrk-table th h2 {
    font          : var(--font-h4) !important;
    margin-bottom : 0 !important;
}

table.itrk-table th h3 {
    font          : var(--font-h5) !important;
    margin-bottom : 0 !important;
}


@media screen and (max-width : 767px) {
    table.itrk-table {
        margin-left  : -6px;
        margin-right : -6px;
        width        : auto;
        max-width    : initial;
        min-width    : 100%;
    }
    
    table.itrk-table tr th,
    table.itrk-table tr td {
        padding : 10px 6px !important;
    }
    
    table.itrk-table.md-collapsable tr th {
        display : none !important;
    }
    
    table.itrk-table.md-collapsable td:last-child,
    table.itrk-table.md-collapsable td:first-child,
    table.itrk-table.md-collapsable tr td {
        display       : block;
        border-radius : 0 !important;
        position      : relative;
        text-align    : left !important;
        padding-left  : 120px !important;
    }
    
    table.itrk-table.md-collapsable tr td::before {
        position    : absolute;
        left        : 0;
        top         : 0;
        bottom      : 0;
        width       : 100px;
        box-sizing  : border-box;
        content     : attr(data-label);
        word-wrap   : break-word;
        background  : var(--itrk-border) !important;
        display     : inline-block;
        line-height : inherit;
        font-weight : 500;
        text-align  : left;
        padding     : 20px 20px;
    }
}


/* ITRK Tabbar */

itrk-tabbar {
    position : relative;
    display  : block;
}

itrk-tabbar nav {
    color         : white;
    display       : flex;
    margin-bottom : -2px;
    position      : relative;
}

@media all and (max-width : 550px) {
    itrk-tabbar nav {
        overflow-y : hidden;
        overflow-x : auto;
    }
}

itrk-tabbar nav a.itrk-tabbar-tab.active {
    background    : white;
    border-bottom : unset;
    color         : #333333;
    padding       : 10px 20px 15px;
    margin-bottom : -5px;
    position      : relative;
    z-index       : 10;
}

itrk-tabbar nav a.itrk-tabbar-tab.active div {
    position   : absolute;
    width      : 100%;
    left       : 1px;
    background : #ffffff;
    height     : 7px;
    bottom     : -1px;
}

itrk-tabbar nav a.itrk-tabbar-tab.active:not(:first-of-type) div {
    left  : -1px;
    width : calc(100% + 2px);
}

itrk-tabbar nav a.itrk-tabbar-tab {
    font-size     : 14px;
    display       : inline-block;
    white-space   : nowrap;
    padding       : 10px 20px 9px;
    font-family   : var(--font-family-sans);
    border-radius : 7px 7px 0 0;
    background    : #f5f5f5;
    color         : var(--tertiary-color);
    border        : 1px solid var(--lightgray-border);
    margin-right  : 5px;
    margin-bottom : 1px;
}

itrk-tabbar itrk-tabbar-tabs itrk-tabbar-tab-content {
    display : none;
    font    : var(--font-normal);
}

itrk-tabbar itrk-tabbar-tabs itrk-tabbar-tab-content.active {
    display : block;
}

itrk-tabbar itrk-tabbar-tabs itrk-tabbar-tab-content {
    padding       : 40px 20px;
    border        : 1px solid var(--lightgray-border);
    border-radius : 0 7px 7px 7px;
}

itrk-tabbar itrk-tabbar-tabs itrk-tabbar-tab-content *:first-child {
    margin-top : 0 !important;
}

itrk-tabbar itrk-tabbar-tabs itrk-tabbar-tab-content div.white-space {
    height           : 7px;
    position         : absolute;
    width            : calc(100% - 10px);
    background-color : #ffffff;
    top              : 38px;
    left             : 1px;
}


/* itrk-common.css */

.block {
    display : block !important;
}

.inline-block {
    display : inline-block !important;
}

.selectable {
    cursor              : text;
    -moz-user-select    : initial;
    -khtml-user-select  : initial;
    -webkit-user-select : initial;
    -ms-user-select     : initial;
    user-select         : initial;
    -khtml-user-drag    : initial;
    -webkit-user-drag   : initial;
}

.unselectable {
    cursor              : default;
    -moz-user-select    : -moz-none;
    -khtml-user-select  : none;
    -webkit-user-select : none;
    -ms-user-select     : none;
    user-select         : none;
    -khtml-user-drag    : none;
    -webkit-user-drag   : none;
}

.hide, .hidden {
    display : none !important;
}

/* Komplett deaktiviertes Element das visuell transparent gemacht wird und nicht klick- oder sonst wie auswählbar ist */
.off {
    opacity        : 0.5 !important;
    pointer-events : none !important;
    user-select    : none !important;
}


.grid {
    display               : grid;
    grid-template-columns : repeat(12, 1fr);
    align-items           : start;
}

.grid.evenly {
    grid-template-columns : repeat(auto-fit, minmax(0, 1fr));
}

/* Individuelle Einteilungen */
.grid.grid-2                    {grid-template-columns : 1fr 1fr;}
.grid.grid-3                    {grid-template-columns : 1fr 1fr 1fr;}
.grid.grid-4                    {grid-template-columns : 1fr 1fr 1fr 1fr;}

/* Vordefinierte Einteilungen */
.grid.grid-7-3                  {grid-template-columns : 7fr 3fr;}
.grid.grid-2-6-2                {grid-template-columns : 2fr 6fr 2fr;}

.grid > .col-1                  {grid-column : span 1;}
.grid > .col-2                  {grid-column : span 2;}
.grid > .col-3                  {grid-column : span 3;}


/* itrk-responsive.css */

.responsive-test:after {
    display          : block;
    z-index          : 90;
    color            : #ffffff;
    background-color : #cc0022;
    font-size        : 12px;
    padding          : 4px 12px;
    border           : none !important;
    border-radius    : 90px;
    display          : block;
    position         : fixed;
    top              : 8px;
    left             : 8px;
    z-index          : 90;
    opacity          : 0.9;
}

/* 768px und größer */
@media screen and (min-width : 768px) {
    .responsive-test:after {
        content : 'Breakpoint: LD (>= 768px)';
    }

    .ld-hide, .ld-hidden {
        display : none !important;
    }

    .ld-block {
        display : block !important;
    }
}

/* 1400px und kleiner */
@media all and (max-width : 1400px) {
    .responsive-test:after {
        content : 'Breakpoint: XXL (<= 1400px)';
    }
}

/* 1200px und kleiner */
@media screen and (max-width : 1200px) {
    .responsive-test:after {
        content : 'Breakpoint: XL (<= 1200px)';
    }

    .xl-hide, .xl-hidden {
        display : none !important;
    }

    .grid > .col-xl-3 {
        grid-column : span 3;
    }

    .grid.xl-grid-3 {
        grid-template-columns : 1fr 1fr 1fr;
    }
}


/* 992px und kleiner */
@media screen and (max-width : 992px) {
    .responsive-test:after {
        content : 'Breakpoint: LG (<= 992px)';
    }

    .lg-hide {
        display : none !important;
    }

    .grid.lg-grid-2 {
        grid-template-columns : 1fr 1fr;
    }

    /* Spaltenbreiten individuell bestimmten */
    .grid > .col-lg-1 {
        grid-column : span 1;
    }

    .grid > .col-lg-2 {
        grid-column : span 2;
    }
}


/* Tablet (Medium Device)  */
@media screen and (min-width : 481px) and (max-width : 767px) {
    .responsive-test:after {
        content : 'Breakpoint: MD (481px-767px)';
    }

    .md-hide, .md-hidden {
        display : none !important;
    }

    .md-block {
        display : block !important;
    }

    /* Spaltenbreiten individuell bestimmten */
    .grid > .col-md-1 {
        grid-column : span 1;
    }
    .grid > .col-md-12 {
        grid-column : span 12;
    }
}

@media all and (max-width : 576px) {
    .responsive-test:after {
        content : 'Breakpoint: SM (<= 576px)';
    }

    .sm-hide, .sm-hidden {
        display : none !important;
    }

    .sm-block {
        display : block !important;
    }
}

/* Mobile (Small Device) */
@media screen and (max-width : 480px) {
    .responsive-test:after {
        content : 'Breakpoint: SD (<= 480px)';
    }

    .sd-hide, .sd-hidden {
        display : none !important;
    }

    .sd-block {
        display : block !important;
    }

    .sd-text-justify {
        text-align : justify;
    }

    /* Spaltenbreiten individuell bestimmten */
    .grid > .col-sd-1 {
        grid-column : span 1;
    }
}

itrk-pager {
    display               : inline-block;
    position              : relative;
    width                 : auto;
    min-width             : 152px;
    border-radius         : var(--itrk-border-radius);
    color                 : var(--darkgray);
    background            : white;
    /* border: 1px solid var(--lightgray-4); */
    border                : none;
    box-sizing            : border-box;
    white-space           : nowrap;
    list-style            : none;
    z-index               : 10;

    padding               : 0;
    margin-top            : 3em;
    overflow              : hidden;

    user-select           : none;
    -ms-user-select       : none; /* Internet Explorer/Edge */
    -moz-user-select      : none; /* Old versions of Firefox */
    -khtml-user-select    : none; /* Konqueror HTML */
    -webkit-user-select   : none; /* Safari */
    -webkit-touch-callout : none; /* iOS Safari */
}

itrk-pager div.itrk-dropdown {
    display : inline-block !important;
    color   : var(--lightgray-4);
    border  : 1px solid var(--lightgray-4);
    width   : auto;
    margin  : 0 10px;
}

itrk-pager div.itrk-dropdown::before {
    margin-top : 1px !important;
    color      : var(--lightgray-4);
}

itrk-pager-item {
    background  : inherit;
    list-style  : none;
    white-space : nowrap;
    font-family : var(--font-family-sans);
    display     : none;
    margin      : 0;
    height      : initial !important;
}
itrk-pager-item {
	font-weight    : 300;
    text-align     : center;
	text-transform : uppercase;
	display        : inline-block;
    color          : var(--lightgray-4);
    line-height    : 37px;
    min-width      : 37px;
    height         : 37px !important;
    box-sizing     : border-box;
    margin         : 0;
    padding        : 0 10px;
}

itrk-pager-item.nav-item {
    font-size   : 18px;
    line-height : inherit;
}

itrk-pager-item.selected {
    color         : white;
    border-radius : 7px;
    background    : var(--secondary-color);
}

itrk-pager-item:first-child {
    padding-left : 0;
    border-left  : 0;
    min-width    : unset;
}

itrk-pager-item:last-child {
    padding-right : 0;
    min-width     : unset;
}

itrk-pager-item:first-child a {
    border : 0;
}

itrk-pager-item[href] {
    color  : var(--secondary-color);
    cursor : pointer;
}

itrk-pager itrk-pager-first {
	font        : normal normal normal 14px/1 var(--itrk-fa-font-family);
    font-weight : 900 !important;
    color       : inherit;
    content     : "\f078";
}

@media screen and (max-width : 480px) {
    itrk-pager-item + div.itrk-dropdown {
        display : inline-block !important;
        height  : 30px;
        padding : 7px 9px;
    }

    itrk-pager-item + div.itrk-dropdown select {
        width         : 40px;
        padding-right : 5px;
    }

    itrk-pager-item {
        padding     : 0 5px;
        line-height : 30px;
        min-width   : 30px;
        height      : 30px !important;
    }
}


itrk-search {
    position         : relative;
    box-sizing       : border-box;
    border-radius    : 7px;
    background-color : white;
    border           : 1px solid var(--lightgray-4);
    display          : inline-block;
    height           : 37px;
    line-height      : 35px;
    width            : 100%;
    padding-left     : 10px;
    padding-right    : 45px;
}

itrk-search button[type=submit]:active {
    opacity : 0.9;
}

div.itrk-search {
    position         : relative;
    box-sizing       : border-box;
    overflow         : hidden;
    padding-left     : 10px;
    padding-right    : 45px;
    height           : 37px;
    line-height      : 35px;
    border           : 1px solid var(--lightgray-4);
    border-radius    : 7px;
    background-color : white;
    width            : 100%;
}

div.itrk-search:after {
    position    : absolute;
    display     : inline-block;
    right       : 0;
    top         : -1px;
    bottom      : 0;
    width       : 37px;
    height      : 37px;
    background  : var(--primary-color);

	font        : normal normal normal 14px/38px var(--itrk-fa-font-family);
    font-weight : 900;
    color       : white;
    text-align  : center;
    content     : "\f002";
	cursor      : pointer;
}

div.itrk-search.error:after {
    background-color : #cb2e25;
}

div.itrk-search input[type="search"],
itrk-search input[type=search] {
    width      : 100%;
    border     : 0;
    background : none;
    color      : var(--tertiary-color);
    box-sizing : border-box;
}

itrk-search button[type=submit] {
    position         : absolute;
    right            : 0;
    width            : 37px;
    line-height      : inherit !important;
    border           : unset;
    color            : #ffffff;
    border-radius    : 0 6px 6px 0;
    background-color : var(--primary-color);
}

itrk-search button[type=submit] i {
    vertical-align : middle;
    font-size      : 16px;
}

div.itrk-search input[type="search"]:focus,
itrk-search input[type="search"]:focus {
    outline : none;
}

div.itrk-search input[type="search"]:focus::placeholder,
itrk-search input[type="search"]:focus::placeholder {
    color : transparent;
}

div.itrk-search:hover,
itrk-search:hover,
itrk-search:focus,
div.itrk-search:focus {
    border-color : var(--primary-color);
    outline      : none;
}

itrk-search itrk-search-wrapper.error,
div.itrk-search.error {
    border-color : #cb2e25;
    background   : #fff5f5;
}

itrk-search-wrapper.error input,
div.itrk-search.error input {
    background : none;
}


itrk-sample-url {
    position      : relative;
    background    : white;
    border-radius : var(--itrk-border-radius);
    border        : 1px solid var(--itrk-border);
    padding       : 10px 40px 10px 20px;
    display       : block;
    margin        : 10px 0;
    cursor        : pointer;
    word-break    : break-all;
}

itrk-sample-url::before {
    font-family : var(--itrk-fa-font-family) !important;
    font-weight : 900 !important;
    content     : "\f35d";
    position    : absolute;
    font-size   : 18px;
    line-height : 18px;
    right       : 10px;
    top         : 50%;
    transform   : translateY(-50%);
    color       : var(--lightgray-border);
}

itrk-sample-url.with-copy {
    padding-right : 60px;
}

itrk-sample-url .itrk-code-copy {
    position  : absolute;
    right     : 28px;
    top       : 50%;
    height    : 20px;
    transform : translateY(-50%);
    padding   : 0 10px;
}

itrk-sample-url .itrk-code-copy:before {
    position    : relative;
    font-family : var(--itrk-fa-font-family) !important;
    font-weight : 900 !important;
    font-size   : 18px;
    line-height : 18px;
    content     : "\f0c5";
    color       : var(--lightgray-border);
}

itrk-sample-url .itrk-code-copy.clicked {
    animation : button-click 400ms ease-in-out;
}


itrk-expandable {
    display       : block;
    padding       : 12px 20px;
    border        : 1px solid var(--itrk-border);
    background    : var(--lightgray);
    border-radius : var(--itrk-border-radius);
    font          : var(--font-normal);
    overflow      : hidden;
    transition    : max-height 0.5s cubic-bezier(0, 1, 0, 1);
}

itrk-expandable itrk-expandable-header {
    display               : block;
    cursor                : pointer;
    position              : relative;
    padding               : 0 22px 0 0;
    min-height            : 25px;

    -webkit-touch-callout : none;
    -webkit-user-select   : none;
    -khtml-user-select    : none;
    -moz-user-select      : none;
    -ms-user-select       : none;
    user-select           : none;

    -webkit-transition    : 1s ease-in-out;
    -moz-transition       : 1s ease-in-out;
    -o-transition         : 1s ease-in-out;
    transition            : 1s ease-in-out;
}
itrk-expandable:not(.open) > itrk-expandable-header .hidden-when-closed {
    display: none !important;
}
itrk-expandable.not-toggle itrk-expandable-header {
	cursor: default;
}
itrk-expandable.not-toggle itrk-expandable-header:after {
	content: "";
    display: block;
}
itrk-expandable itrk-expandable-header.with-icon {
    padding-left : 30px;
}

itrk-expandable itrk-expandable-header.with-icon > i:first-child,
itrk-expandable itrk-expandable-header.with-icon > img:first-child {
    position      : absolute;
    left          : 0;
    right         : 0;
    top           : 2px;
    width         : 20px;
    height        : 20px;
    
    box-sizing    : border-box;
    text-align    : center;
}

itrk-expandable itrk-expandable-header.with-icon > i:first-child {
    font-size     : 12px;
    line-height   : 12px;
    padding       : 4px;
    
    color         : white;
    background    : var(--darkgray);
    border-radius : 30px;
}

itrk-expandable itrk-expandable-header.with-icon > i.easysafe-logo {
    width       : 20px;
    height      : 20px;
    margin-top  : 0;
    margin-left : -2px;
}

itrk-expandable itrk-expandable-header i.itrk-icon {
    float         : left;
    margin-top    : 0;
    margin-bottom : 0;
}

itrk-expandable itrk-expandable-header span.itrk-tag {
    float       : right;
    margin-top  : 2px;
    margin-left : 0.5em;
    font-size   : 11px;
    line-height : 21px;
    padding     : 0 3px;
}


itrk-expandable itrk-expandable-header:after {
    position           : absolute;
    line-height        : inherit;
    top                : 0;
    right              : 0;
    font-family        : var(--itrk-fa-font-family);
    font-weight        : 900;
    content            : "\f078";
    transform          : scaleY(1);
    -webkit-transition : 0.4s ease-in-out;
    -moz-transition    : 0.4s ease-in-out;
    -o-transition      : 0.4s ease-in-out;
    transition         : 0.4s ease-in-out;
}

itrk-expandable.open itrk-expandable-header:after {
    top : -1px;
}

itrk-expandable.open > itrk-expandable-header:after {
    transform : scaleY(-1);
}

itrk-expandable.body-white > itrk-expandable-body {
    width: auto !important;
    background: white !important;
    margin: 12px -20px -12px -20px !important;
    padding: 12px 20px !important;
    border-top: 1px solid var(--itrk-border) !important;
}

itrk-expandable.body-white > itrk-expandable-body:before {
    margin-top: 0 !important;
}

itrk-expandable.minified-italic {
	border: none;
	border-radius: 0;
	padding: 0px;
	background: transparent;
	margin-top: 0px;
}
itrk-expandable.minified-italic itrk-expandable-header {
	padding: 1px 0;
	padding-right: 30px;
	border-radius: 5px;
	background: transparent;
	display: inline-block;
}
itrk-expandable.minified-italic itrk-expandable-header div {
	font-style: italic;
}
itrk-expandable.minified-italic itrk-expandable-header:after {
	top: 1px;
	right: 7px;
}
itrk-expandable.minified-italic itrk-expandable-body:before {
	margin-top: 0;
}
itrk-expandable.minified-italic itrk-expandable-body .itrk-space-between {
	padding: 3px 0;
}

itrk-expandable.minified {
	display: block;
	border: none;
	border-radius: 0;
	padding: 0px;
	background: transparent;
	margin-top: 0px;
}

itrk-expandable.minified itrk-expandable-header {
    padding       : 1px 30px 1px 9px;
    border-radius : 5px;
    background    : #ededed;
    display       : inline-block;
}

itrk-expandable.minified itrk-expandable-header:after {
    top   : 1px;
    right : 7px;
}

itrk-expandable.minified.open itrk-expandable-body {
    background : transparent;
}

itrk-expandable.minified itrk-expandable-body:before {
    content    : "";
    display    : block;
    margin-top : 10px;
}

itrk-expandable.minified itrk-expandable-body > div.document {
    margin : 5px 0;
}

itrk-expandable.open > itrk-expandable-body {
    display : block !important;
}

itrk-expandable itrk-expandable-body .test-grid.full {
    width : 100%;
}

itrk-expandable table.itrk-table {
    margin-top : 10px;
}

itrk-expandable table.itrk-table td {
    padding : 20px;
}

itrk-expandable itrk-expandable.minified itrk-expandable-header {
    background : #dddddd;
}

itrk-expandable itrk-expandable-body {
    position : relative;
    display  : none;
    padding  : 0;
    width    : 100%;
}

itrk-expandable itrk-expandable-body:before {
    content    : "";
    display    : block;
    margin-top : 20px;
}

itrk-expandable itrk-expandable-body > *:last-child {
    margin-bottom: 0 !important;
}

itrk-expandable .itrk-expandable-footer {
	padding: 20px;
	box-sizing: border-box;
	border-top: 1px solid var(--itrk-border);
	margin: 20px -20px -10px -20px;
}
itrk-expandable .itrk-expandable-footer:after {
    content: "";
    display: block;
}


itrk-expandable table.itrk-table tr th {
    background : var(--itrk-border);
}

itrk-expandable table.itrk-table > tr:nth-child(2n + 1) td,
itrk-expandable table.itrk-table > tbody > tr:nth-child(2n) td {
    background : white;
}

itrk-expandable table.itrk-table th:first-child,
itrk-expandable table.itrk-table td:first-child {
    border-top-left-radius    : 10px;
    border-bottom-left-radius : 10px;
}

itrk-expandable table.itrk-table th:last-child,
itrk-expandable table.itrk-table td:last-child {
    border-bottom-right-radius : 10px;
    border-top-right-radius    : 10px;
}

/** div.itrk-scrollable **/
itrk-expandable div.itrk-scrollable {
    margin-left  : -15px;
    margin-right : -15px;
    padding      : 0 15px;
}

/* ################################################################
   ITRK Expandable Group
   Das wird alle expandables aneinander hängen ohne
   Abstand dazwischen. Zudem wird der border radius für alle
   expandables die nicht das erste und letzte sind entfernt.
   ################################################################ */


.itrk-expandable-group itrk-expandable:not(:first-child):not(:last-child) {
    border-radius : 0;
    border-bottom : none;
}

.itrk-expandable-group:not(.with-separators) itrk-expandable:not(:first-child):not(:last-child) {
    border-top    : none;
}

.itrk-expandable-group:not(.with-separators) itrk-expandable:not(:first-child):not(:last-child) {
    border-radius : 0;
    border-top    : none;
    border-bottom : none;
}

.itrk-expandable-group itrk-expandable:first-child {
    border-bottom-left-radius  : 0;
    border-bottom-right-radius : 0;
    border-bottom              : none;
}
.itrk-expandable-group itrk-expandable:last-child {
    border-top-left-radius  : 0;
    border-top-right-radius : 0;
}

.itrk-expandable-group:not(.with-separators) itrk-expandable:last-child {
    border-top              : none;
}


.itrk-progress-bar {
    position      : relative !important;
    border-radius : var(--itrk-border-radius) !important;
    border        : 1px solid var(--itrk-border) !important;
    background    : var(--lightgray-1) !important;
    overflow      : hidden !important;
    transition    : all 1s ease !important;
    padding       : 0 !important;
    
    color         : black !important;
    font-weight   : bold !important;
    text-shadow   : #ffffff 0 0 2px !important;
    
    height        : 35px !important;
}

.itrk-progress-bar .loader-status,
.itrk-progress-bar .loader-bar {
    border-top-left-radius    : var(--itrk-border-radius) !important;
    border-bottom-left-radius : var(--itrk-border-radius) !important;
    border                    : 0 !important;
    line-height               : 35px !important;
    position                  : absolute !important;
    box-sizing                : border-box !important;
    top                       : 0 !important;
    left                      : 0 !important;
    bottom                    : 0 !important;
    margin                    : 0 !important;
    padding                   : 0 !important;
    
    text-align                : center !important;
    -webkit-font-smoothing    : antialiased !important;
}

.itrk-progress-bar .loader-status {
    width   : 100% !important;
    z-index : 2 !important;
}

.itrk-progress-bar .loader-bar {
    z-index : 1 !important;
    width   : 50%;
}

.itrk-progress-bar .loader-bar > img {
    display : none !important;
}

/* Small */

.itrk-progress-bar.small {
    height : 28px !important;
}

.itrk-progress-bar.small .loader-status,
.itrk-progress-bar.small .loader-bar {
    line-height : 28px !important;
}

/* Status left */

.itrk-progress-bar .loader-status.align-left {
    text-align   : left !important;
    padding-left : 12px !important;
}

/* With Image */

.itrk-progress-bar.with-img {
    overflow : visible !important;
}

.itrk-progress-bar.with-img .loader-bar > img {
    display    : block !important;
    margin     : 0 !important;
    padding    : 0 !important;
    position   : absolute !important;
    max-height : 170% !important;
    top        : 50% !important;
    left       : 100% !important;
    transform  : translate(-50%, -50%) !important;
}

/* Colors */

.itrk-progress-bar .loader-bar,
.itrk-progress-bar.gray .loader-bar {
    background-color : #c0c0c0 !important;
}

.itrk-progress-bar.green .loader-bar {
    background-color : green !important;
}

.itrk-progress-bar.red .loader-bar {
    background-color : #cc0000 !important;
}

.itrk-progress-bar.blue .loader-bar {
    background-color : var(--secondary-color) !important;
}

.itrk-progress-bar.orange .loader-bar {
    background-color : var(--primary-color) !important;
}

.itrk-progress-bar.blue,
.itrk-progress-bar.orange {
    color       : white !important;
    text-shadow: none!important;
}

/* Animation */

.itrk-progress-bar.no-animation .loader-bar {
    background-image : none !important;
}

.itrk-progress-bar .loader-bar {
    background-image : linear-gradient(
        -45deg, rgba(255, 255, 255, 0.2) 25%,
        transparent 25%,
        transparent 50%,
        rgba(255, 255, 255, 0.2) 50%,
        rgba(255, 255, 255, 0.2) 75%,
        transparent 75%,
        transparent
    ) !important;
    background-size  : 50px 50px !important;
    animation        : move 3s linear infinite !important;
}

@keyframes move {
    0% {
        background-position : 0 0;
    }
    100% {
        background-position : 50px 50px;
    }
}


/* itrk-quick-select.css */

.itrk-quick-select div {
    display         : flex;
    justify-content : space-between;
}

.itrk-quick-select span {
    display         : flex;
    justify-content : center;
    align-items     : center;
    font-size       : 14px;
    min-width       : 27px;
    height          : 27px;
    border-radius   : 5px;
    background      : var(--lightgray-4);
    color           : #ffffff;
    margin-right    : 2px;
    margin-bottom   : 2px;
    cursor          : pointer;
}

.itrk-quick-select span:active {
    background-color : var(--secondary-color);
}

@media all and (max-width : 767px) {
    .itrk-quick-select {
        display    : flex;
        width      : 100%;
        padding    : 0 20px;
        box-sizing : border-box;
    }
    
    .itrk-quick-select div {
        overflow   : scroll;
        column-gap : 5px;
    }
    
    .itrk-quick-select::before,
    .itrk-quick-select::after {
        font-weight : 900;
        font-size   : 24px;
        color       : var(--lightgray-4);
	    font        : normal normal normal 14px/1 var(--itrk-fa-font-family);
    }
    
    .itrk-quick-select::before {
        content      : '\f104';
        margin-right : 5px;
    }
    
    .itrk-quick-select::after {
        content     : '\f105';
        margin-left : 5px;
    }
}


itrk-code {
    --itrk-code-padding-hor: 20px;
    --itrk-code-padding-ver: 10px;
    --itrk-p_fix-margin: 10px;

    display          : block;
    background-color : var(--lightgray-1);
    border           : 1px solid var(--lightgray-border);
    border-radius    : var(--itrk-border-radius);
    position         : relative;
}
itrk-code::after {
    content : "";
    clear   : both;
    display : block;
}

itrk-code>div {
    overflow-x: auto;
    box-sizing: border-box;
    padding-top: var(--itrk-code-padding-ver);
    padding-right: 40px;
    padding-bottom: var(--itrk-code-padding-ver);
    padding-left: var(--itrk-code-padding-hor);
    max-height: 600px;
}

itrk-code .itrk-code-prefix,
itrk-code .itrk-code-postfix {
    color     : var(--lightgray-4);
    font-size : 12px !important;
}
itrk-code .itrk-code-prefix {
    margin        : 0;
    padding       : 0;
    margin-bottom : var(--itrk-p_fix-margin);
}
itrk-code .itrk-code-postfix {
    margin     : 0;
    padding    : 0;
    margin-top : var(--itrk-p_fix-margin);
}

itrk-code .itrk-code-content {
    white-space : pre-wrap;
    font: var(--font-code);
}

itrk-code .itrk-code-copy {
    position  : absolute;
    top       : var(--itrk-code-padding-ver);
    right     : 0px;
    height    : 20px;
    padding-left : var(--itrk-code-padding-ver);
    padding-right : var(--itrk-code-padding-ver);
    cursor    : pointer;
}

itrk-code .itrk-code-copy:before {
    position    : relative;
    font-family : var(--itrk-fa-font-family) !important;
    font-weight : 900 !important;
    font-size   : 18px;
    line-height : 18px;
    content     : "\f0c5";
    color       : var(--lightgray-border);
}
itrk-code .itrk-code-copy.clicked {
    animation : button-click 400ms ease-in-out;
}

itrk-expandable itrk-expandable-body > itrk-code {
    border: 1px solid var(--itrk-border);
    background-color : var(--white);
}

.copy-feedback {
    font-size: 0.75rem;
    color: var(--lightgray-4);
    font-weight: bold;
    position: absolute;
    top: -20px;
    right: 9px;
}

itrk-stepper {
    display: block;
    padding: 0;
}

itrk-stepper itrk-stepper-step {
    display: block;
}

itrk-stepper>.itrk-stepper-header {
    margin-bottom: 40px;
}

itrk-stepper>.itrk-stepper-header>.itrk-progress-bar {
    margin-bottom: 60px !important;
}

itrk-stepper>.itrk-button-bar {
    margin-top: 40px !important;
}

/* ITRK-Badge */
.itrk-badge {
    display          : inline-block;
    font-size        : 10px;
    color            : var(--primary-color);
    background-color : white;
    border-color     : var(--primary-color);
    border-radius    : 2em;
    border-width     : 1px;
    border-style     : solid;
    padding          : 0.4em 0.8em;
    line-height      : 1em;
    vertical-align   : middle;
    margin           : 0 5px;
    cursor           : pointer;
}

.itrk-badge.invert {
    background: var(--primary-color);
    color: white;
    border: 1px solid var(--primary-color);
}

.itrk-badge.blue {
    border-color: var(--secondary-color);
    color: var(--secondary-color);
}
.itrk-badge.blue.invert {
    background   : var(--secondary-color);
    border-color : var(--secondary-color);
    color: white;
}

.itrk-badge.black {
    border-color: #333;
    color: black;
}
.itrk-badge.black.invert {
    background   : #333333;
    border-color : #333333;
    color: white !important;
}

.itrk-badge.gray {
    background: white !important;
    border-color: var(--lightgray-4);
    color: var(--lightgray-4);
}
.itrk-badge.gray.invert {
    background: var(--lightgray-border) !important;
    border-color: var(--lightgray-border);
    color: var(--darkgray-2);
}


.itrk-badge.light-gray {
    background-color: var(--lightgray-3);
    color: var(--darkgray);
    border: 1px solid var(--lightgray-border);
}

.itrk-badge.green  {
    border-color: var(--green-color);
    color: var(--green-color);
}
.itrk-badge.green.invert {
    background: var(--green-color);
    border-color: var(--green-color);
    color: white;
}

.itrk-badge.red {
    border-color: var(--red-color);
    color: var(--red-color);
}
.itrk-badge.red.invert {
    background   : var(--red-color);
    border-color : var(--red-color);
    color: white;
}


/* ITRK-chip */
.itrk-chip, .itrk-chip.enabled {
    display          : inline-block;
    font-size        : 12px;
    color            : var(--primary-color) !important;
    background-color : white !important;
    border-color     : var(--lightgray-border) !important;
    border-radius    : 2em !important;
    border-width     : 1px !important;
    border-style     : solid !important;
    padding          : 0.5em 1em !important;
    line-height      : 1em !important;
    vertical-align   : middle !important;
    margin           : 0 5px !important;
    cursor           : pointer !important;
}

.itrk-chip.selected {
    background-color : var(--primary-color) !important;
    border-color     : var(--primary-color) !important;
    color            : white !important;
}

.itrk-chip.disabled {
    background-color : var(--lightgray) !important;
    border-color     : var(--lightgray) !important;
    color            : var(--lightgray-4) !important;
    cursor           : default !important;
}

.itrk-chip.locked {
    background-color : var(--secondary-color) !important;
    border-color     : var(--secondary-color) !important;
    color            : white !important;
    cursor           : default !important;
}

.itrk-chip.locked::after {
    content     : "\f023" !important;
    font-family : "Font Awesome 6 Free", sans-serif !important;
    margin-left : 0.5em !important;
    font-weight : 900 !important;
    display     : inline-block !important;
    width       : 1em !important;
    height      : 1em !important;
    text-align  : center !important;
    line-height : inherit !important;
}


itrk-color-picker {
    display: inline-block;
    position: relative;
    width: 37px;
    height: 37px;
    min-width: 37px;
    min-height: 37px;
    border-radius: var(--itrk-border-radius);
    border-style: solid;
    border-color: var(--lightgray-4);
    border-width: 1px;
    background-color: #0c6ec6;
}

itrk-color-picker:hover {
    cursor: pointer;
}

itrk-color-picker > .itrk-color-picker-container {
    display          : none;
    border-radius    : var(--itrk-border-radius);
    background-color : white;
    padding          : 20px;
    position         : absolute;
    border           : 1px solid var(--lightgray-border);
    width            : max-content !important;
    z-index          : 9999;
}

itrk-color-picker > i.icon {
    vertical-align : middle;
    text-align     : center;
    width          : 100%;
    height         : 100%;
    line-height    : 37px;
    color          : white;
}

itrk-color-picker .pane {
    display          : inline-block;
    width            : 235px;
    height           : 235px;
    position         : relative;
    background-color : transparent !important;
}

itrk-color-picker .pane > * {
    position      : absolute;
    width         : 100%;
    height        : 100%;
    top           : 0;
    left          : 0;
    border-radius : var(--itrk-border-radius);
}

itrk-color-picker .pane > .color {
    background-color : red;
}

itrk-color-picker .pane > .whiteness {
    background : linear-gradient(90deg, white, transparent);
}

itrk-color-picker .pane > .blackness {
    background : linear-gradient(0deg, black, transparent);
}

itrk-color-picker .itrk-color-picker-bar {
    display       : inline-block;
    width         : 20px;
    height        : 235px;
    border        : 1px solid var(--lightgray-border);
    border-radius : 10px;
    box-sizing    : border-box;
    position      : relative;
    margin-left   : 10px;
}

itrk-color-picker .itrk-color-picker-bar.hue {
    background : transparent linear-gradient(0deg, #cc3333 0%, #d453cf 19%, #2e44ea 35%, #21dbf2 48%, #1aff4d 69%, #b4ff14 76%, #ff7600 92%, #cc3333 100%) 0 0 no-repeat padding-box;
}

itrk-color-picker itrk-color-picker-cursor {
    display  : inline-block;
    position : absolute;
    width    : 0 !important;
    height   : 0 !important;
}

itrk-color-picker itrk-color-picker-cursor > cursor-element {
    display    : inline-block;
    width      : 11px;
    height     : 11px;
    box-sizing : border-box;
    background : transparent !important;
    position   : absolute;
}

itrk-color-picker itrk-color-picker-cursor > cursor-element:first-child {
    border-radius : 5px;
    border        : 2px solid white;
}

itrk-color-picker itrk-color-picker-cursor > cursor-element:last-child {
    border-radius : 5px;
    border        : 0.5px solid black;
}

itrk-color-picker .predefined-color-circle {
    display       : inline-block;
    height        : 22px;
    width         : 22px;
    border-radius : 50%;
}

itrk-color-picker .itrk-color-picker-line-wrapper {
    width         : 100%;
    height        : 100%;
    margin-bottom : 10px;
}

itrk-color-picker .itrk-color-picker-line-wrapper:last-of-type {
    margin-bottom : 0;
}

itrk-color-picker select {
    background-color : transparent;
    font             : var(--font-normal);
    border-style     : none;
    vertical-align   : middle;
}

itrk-color-picker option {
    background-color : transparent;
    border-style     : none;
}

itrk-color-picker .display-field {
    appearance     : none;
    display        : inline-block;
    font           : var(--font-normal);
    border         : none;
    border-bottom  : 1px solid var(--lightgray-4);
    color          : var(--lightgray-4);
    vertical-align : middle;
    resize         : none;
    height         : 1lh;
    text-align     : center;
}

itrk-color-picker .display-field:invalid {
    border-color : var(--red-color) !important;
}

itrk-color-picker .display-field:hover {
    border-color : var(--primary-color);
}

itrk-color-picker .display-field.hex {
    width : 78px;
}

itrk-color-picker .display-field.dec {
    width        : 46px;
    margin-right : 5px;
}

itrk-color-picker .display-field.dec:last-child {
    margin-right : 0;
}



.carousel {
    display               : grid;
    width                 : 100%;
    box-sizing            : border-box;
    position              : relative;
}

/**
 * ----------------------------------------------------------------
 * Carousel arrows, um nach links oder rechts zu navigieren
 * ----------------------------------------------------------------
 */

.carousel .arrow-left,
.carousel .arrow-right {
    position    : absolute;
    height      : 100%;
    transition  : all 200ms ease;
    font-size   : 40px;
    cursor      : pointer;
    opacity     : 0.4;
    text-align  : center;
    z-index     : 46;
    align-items : center;
}
.carousel .arrow-left::before,
.carousel .arrow-right::before {
    display        : inline-block;
    height         : 100%;
    content        : "";
    vertical-align : middle;
}
.carousel .arrow-left > i,
.carousel .arrow-right > i {
    vertical-align : middle;
    display        : inline-block;
}

.carousel .arrow-left:hover,
.carousel .arrow-right:hover {
    transition : all 200ms ease;
    opacity    : 1;
}

.carousel .arrow-left {
    left: 0;
}

.carousel .arrow-right {
    right: 0;
}

.carousel .carousel-items {
    display               : grid;
    grid-template-columns : repeat(auto-fit, minmax(0, 1fr));
    align-items           : center;
    grid-gap              : 1rem;
    box-sizing            : border-box;
}

.carousel .carousel-items > .carousel-item {
    height     : 100%;
    overflow   : hidden;
    max-height : 90vh;
    background : white;
    border-radius: 20px;
}

.carousel .carousel-items > .carousel-item > .itrk-card {
    height : 100%;
}

.carousel .carousel-items > .carousel-item > .itrk-card img {
    max-width : 100%;
}

/* Carousel Items bei Mouseover */
.carousel .carousel-items > .carousel-item:hover {
    box-shadow : 0 2px 12px -4px rgba(0, 0, 0, 0.4);
}


/**
 * ----------------------------------------------------------------
 * Festlegen, wieviele Carousel Items sichtbar sein sollen.
 * Mögliche Werte sind 3, 4, 5, 6 und 7
 * ----------------------------------------------------------------
 */

.carousel[data-carousel-size="3"] .carousel-items > .carousel-item:nth-child(n+4),
.carousel[data-carousel-size="4"] .carousel-items > .carousel-item:nth-child(n+5),
.carousel[data-carousel-size="5"] .carousel-items > .carousel-item:nth-child(n+6),
.carousel[data-carousel-size="6"] .carousel-items > .carousel-item:nth-child(n+7),
.carousel[data-carousel-size="7"] .carousel-items > .carousel-item:nth-child(n+8) {
    display : none;
}


/* Überlappung */
.carousel.with-overlap .carousel-items {
    grid-gap : 0;
}
.carousel.with-overlap .carousel-items > .carousel-item {
    display: none;
}


/* Überlappung für Carousel mit 3 Items */
.carousel.with-overlap[data-carousel-size="3"] .carousel-items > .carousel-item:nth-last-child(1) {
    display: inline-block;
    grid-column: 1 / 2;
    grid-row: 1 / 2;
    transform : translateX(25%) scale(0.86);
    z-index   : 44;
}
.carousel.with-overlap[data-carousel-size="3"] .carousel-items > .carousel-item:nth-child(1) {
    display: inline-block;
    grid-column: 2 / 3;
    z-index : 45;
}
.carousel.with-overlap[data-carousel-size="3"] .carousel-items > .carousel-item:nth-child(2) {
    display: inline-block;
    grid-column: 3 / 4;
    transform : translateX(-25%) scale(0.86);
    z-index   : 44;
}

/* Überlappung für Carousel mit 4 Items */
.carousel.with-overlap[data-carousel-size="4"] .carousel-items > .carousel-item:nth-last-child(1) {
    display: inline-block;
    grid-column: 1 / 2;
    grid-row: 1 / 2;
    transform : translateX(25%) scale(0.9);
    z-index   : 44;
}
.carousel.with-overlap[data-carousel-size="4"] .carousel-items > .carousel-item:nth-child(1) {
    display: inline-block;
    grid-column: 2 / 3;
    z-index : 45;
}
.carousel.with-overlap[data-carousel-size="4"] .carousel-items > .carousel-item:nth-child(2) {
    display: inline-block;
    grid-column: 3 / 4;
    z-index : 45;
}
.carousel.with-overlap[data-carousel-size="4"] .carousel-items > .carousel-item:nth-child(3) {
    display: inline-block;
    grid-column: 4 / 5;
    transform : translateX(-25%) scale(0.9);
    z-index   : 44;
}

/* Überlappung für Carousel mit 5 Items */
.carousel.with-overlap[data-carousel-size="5"] .carousel-items > .carousel-item:nth-last-child(2) {
    display: inline-block;
    grid-column: 1 / 2;
    grid-row: 1 / 2;
    transform : translateX(60%) scale(0.8);
    z-index   : 43;
}
.carousel.with-overlap[data-carousel-size="5"] .carousel-items > .carousel-item:nth-last-child(1) {
    display: inline-block;
    grid-column: 2 / 3;
    grid-row: 1 / 2;
    transform : translateX(25%) scale(0.9);
    z-index   : 44;
}
.carousel.with-overlap[data-carousel-size="5"] .carousel-items > .carousel-item:nth-child(1) {
    display: inline-block;
    grid-column: 3 / 4;
    z-index : 45;
}
.carousel.with-overlap[data-carousel-size="5"] .carousel-items > .carousel-item:nth-child(2) {
    display: inline-block;
    grid-column: 4 / 5;
    transform : translateX(-25%) scale(0.9);
    z-index   : 44;
}
.carousel.with-overlap[data-carousel-size="5"] .carousel-items > .carousel-item:nth-child(3) {
    display: inline-block;
    grid-column: 5 / 6;
    transform : translateX(-60%) scale(0.8);
    z-index   : 43;
}

/* Überlappung für Carousel mit 6 Items */
.carousel.with-overlap[data-carousel-size="6"] .carousel-items > .carousel-item:nth-last-child(2) {
    display: inline-block;
    grid-column: 1 / 2;
    grid-row: 1 / 2;
    transform : translateX(60%) scale(0.8);
    z-index   : 43;
}
.carousel.with-overlap[data-carousel-size="6"] .carousel-items > .carousel-item:nth-last-child(1) {
    display: inline-block;
    grid-column: 2 / 3;
    grid-row: 1 / 2;
    transform : translateX(25%) scale(0.9);
    z-index   : 44;
}
.carousel.with-overlap[data-carousel-size="6"] .carousel-items > .carousel-item:nth-child(1) {
    display: inline-block;
    grid-column: 3 / 4;
    z-index : 45;
}
.carousel.with-overlap[data-carousel-size="6"] .carousel-items > .carousel-item:nth-child(2) {
    display: inline-block;
    grid-column: 4 / 5;
    z-index : 45;
}
.carousel.with-overlap[data-carousel-size="6"] .carousel-items > .carousel-item:nth-child(3) {
    display: inline-block;
    grid-column: 6 / 7;
    transform : translateX(-25%) scale(0.9);
    z-index   : 44;
}
.carousel.with-overlap[data-carousel-size="6"] .carousel-items > .carousel-item:nth-child(4) {
    display: inline-block;
    grid-column: 8 / 9;
    transform : translateX(-60%) scale(0.8);
    z-index   : 43;
}

/* Überlappung für Carousel mit 7 Items */
.carousel.with-overlap[data-carousel-size="7"] .carousel-items > .carousel-item:nth-last-child(3) {
    display: inline-block;
    grid-column: 1 / 2;
    grid-row: 1 / 2;
    transform : translateX(100%) scale(0.76);
    z-index   : 42;
}
.carousel.with-overlap[data-carousel-size="7"] .carousel-items > .carousel-item:nth-last-child(2) {
    display: inline-block;
    grid-column: 2 / 3;
    grid-row: 1 / 2;
    transform : translateX(60%) scale(0.84);
    z-index   : 43;
}
.carousel.with-overlap[data-carousel-size="7"] .carousel-items > .carousel-item:nth-last-child(1) {
    display: inline-block;
    grid-column: 3 / 4;
    grid-row: 1 / 2;
    transform : translateX(25%) scale(0.92);
    z-index   : 44;
}
.carousel.with-overlap[data-carousel-size="7"] .carousel-items > .carousel-item:nth-child(1) {
    display: inline-block;
    grid-column: 4 / 5;
    z-index : 45;
}
.carousel.with-overlap[data-carousel-size="7"] .carousel-items > .carousel-item:nth-child(2) {
    display: inline-block;
    grid-column: 5 / 6;
    transform : translateX(-25%) scale(0.92);
    z-index   : 44;
}
.carousel.with-overlap[data-carousel-size="7"] .carousel-items > .carousel-item:nth-child(3) {
    display: inline-block;
    grid-column: 6 / 7;
    transform : translateX(-60%) scale(0.84);
    z-index   : 43;
}
.carousel.with-overlap[data-carousel-size="7"] .carousel-items > .carousel-item:nth-child(4) {
    display: inline-block;
    grid-column: 7 / 8;
    transform : translateX(-100%) scale(0.76);
    z-index   : 42;
}

/**
 * Dahinterliegende Carousel Items verblassen
 */

.carousel.with-overlap[data-carousel-size="3"] .carousel-items > .carousel-item:not(:nth-child(1)) > *,
.carousel.with-overlap[data-carousel-size="4"] .carousel-items > .carousel-item:not(:nth-child(1)):not(:nth-child(2)) > *,
.carousel.with-overlap[data-carousel-size="5"] .carousel-items > .carousel-item:not(:nth-child(1)) > *,
.carousel.with-overlap[data-carousel-size="6"] .carousel-items > .carousel-item:not(:nth-child(1)):not(:nth-child(2)) > *,
.carousel.with-overlap[data-carousel-size="7"] .carousel-items > .carousel-item:not(:nth-child(1)) > * {
    opacity : 0.4;
}



@media all and (max-width : 767px) {
    .carousel .carousel-items {
        display     : block !important;
        overflow-x  : hidden;
        white-space : nowrap;
        width       : 100%;
        height      : 100%;
        padding     : 12px !important;
    }

    .carousel .carousel-items .carousel-item {
        display      : inline-block !important;
        transform    : none !important;
        width        : 94%;
        margin-left  : 3%;
        margin-right : 3%;
        opacity      : 1 !important;
        margin-right : 12px !important;
        white-space  : initial;
    }

    .carousel .carousel-items .carousel-item > * {
        opacity : 1 !important;
    }

}

.timeline {
    position   : relative;
    max-width  : 1200px;
    margin     : 1rem auto;
    box-sizing : border-box;
}

/* Vertical line */
.timeline::after {
    content          : '';
    position         : absolute;
    width            : 2px;
    background-color : #dddddd;
    top              : 0;
    bottom           : 0;
    left             : 50%;
    margin-left      : -1px;
}

.timeline > div {
    padding          : 0 50px;
    position         : relative;
    background-color : inherit;
    width            : 50%;
    box-sizing       : border-box;
}

/* Timeline circles */
.timeline > div::after {
    content          : '';
    position         : absolute;
    width            : 40px;
    height           : 40px;
    right            : -21px;
    border           : 1px solid rgba(0, 0, 0, 0.25);
    background-color : #ffffff;
    top              : 0;
    border-radius    : 50%;
    z-index          : 1;
}

/* You may want to place some icon or background image in the circles */
.timeline > div:nth-child(1)::after {
    /*background: #ffffff url(".....") no-repeat center;*/
}

/* Stick container to left */
.timeline :nth-child(odd) {
    left : 0;
}

/* Stick container to right */
.timeline :nth-child(even) {
    left : 50%;
}

/* Adjust circles on the right side */
.timeline :nth-child(even)::after {
    left : -21px;
}

.timeline.text-align-middle > :nth-child(odd) {
    text-align : right;
}

.timeline.text-align-middle > :nth-child(even) {
    text-align : left;
}

.timeline > div {
    font-size   : 14px !important;
    line-height : 22px !important;
    color       : var(--tertiary-color) !important;
}

.timeline.text-align-middle .caption {
    margin      : 0 !important;
    padding     : 0 !important;
    font-family : "Fira Sans", "Bitter", Arial, verdana, sans-serif !important;
    font-size   : 17px !important;
    line-height : 21px !important;
    color       : var(--darkgray) !important;
}

/* Alternate timeline content containers */

.timeline.text-align-middle > :nth-child(odd) .caption {
    text-align : right;
}

.timeline.text-align-middle > :nth-child(even) .caption {
    text-align : left;
}

/* Media queries - Responsive timeline on screens less than 600px wide */
@media screen and (max-width : 600px) {
    /* Place the timelime to the left */
    .timeline::after {
        left : 22px;
    }
    
    /* Full-width containers */
    .timeline > div {
        width      : 100%;
        padding    : 0 25px 25px 60px !important;
        text-align : left !important;
    }
    
    .timeline > div .caption {
        text-align : left !important;
    }
    
    /* Align circles */
    .timeline > div::after {
        left : 0 !important;
    }
    
    /* All containers stick to the left side */
    .timeline > :nth-child(even) {
        left : 0;
    }
}


/* itrk-date-picker */

itrk-date-picker {
    border: 1px var(--lightgray-4) solid;
    padding: 9px 27px 9px 10px;
    border-radius: var(--itrk-border-radius);
    line-height: 17px;
    position: relative;
    background: white;
    color: var(--tertiary-color);
}
itrk-date-picker.invalid {
    border-color: var(--red-color);
}
itrk-date-picker input[type=date] {
    visibility: hidden;
    width: 0;
    height: 0;
    padding: 0;
    border: 0;
    margin: 0;
    position: absolute;
    right: 10px;
}
itrk-date-picker input[type=text] {
    outline: none;
    border: none;
    width: 100%;
    padding: 0; 
}
itrk-date-picker i {
    position: absolute;
    right: 10px;
    line-height: inherit;
    cursor: pointer;
    color: var(--lightgray-4)
}

/* itrk-visiblity-toggle.css */

itrk-visibility-toggle {
    display: inline;
    cursor: pointer;
}

itrk-visibility-toggle:after {
    display            : inline-block;  
    font-family        : var(--itrk-fa-font-family);
    font-weight        : 900;
    content            : "\f078";
    transform          : scaleY(1);
    -webkit-transition : 0.4s ease-in-out;
    -moz-transition    : 0.4s ease-in-out;
    -o-transition      : 0.4s ease-in-out;
    transition         : 0.4s ease-in-out;
}

itrk-visibility-toggle.active:after {
    margin-top: -1px;
    margin-bottom: 1px;
    transform : scaleY(-1);
}

itrk-visibility-toggle.disabled {
    cursor: default;
}

itrk-visibility-toggle.disabled:after {
    content: ''
}

itrk-animation[type=ellipsis] {
    display  : inline-block;
    position : relative;
    width    : 80px;
    height   : 13px;

    --pos1: 8px;
    --pos2: 32px;
    --pos3: 56px;
}
itrk-animation[type=ellipsis] span {
    position                  : absolute;
    display                   : inline-block;
    width                     : 13px;
    height                    : 13px;
    border-radius             : 50%;
    background                : var(--tertiary-color);
    animation-timing-function : cubic-bezier(0, 1, 1, 0);
}
itrk-animation[type=ellipsis] span:nth-child(1) {
    left      : var(--pos1);
    animation : lds-ellipsis1 0.6s infinite;
}
itrk-animation[type=ellipsis] span:nth-child(2) {
    left      : var(--pos1);
    animation : lds-ellipsis2 0.6s infinite;
}
itrk-animation[type=ellipsis] span:nth-child(3) {
    left      : var(--pos2);
    animation : lds-ellipsis2 0.6s infinite;
}
itrk-animation[type=ellipsis] span:nth-child(4) {
    left      : var(--pos3);
    animation : lds-ellipsis3 0.6s infinite;
}
@keyframes lds-ellipsis1 {
    0% { transform : scale(0); }
    100% { transform : scale(1); }
}
@keyframes lds-ellipsis2 {
    0% { transform : translate(0, 0); }
    100% { transform : translate(24px, 0); }
}
@keyframes lds-ellipsis3 {
    0% { transform : scale(1); }
    100% { transform : scale(0); }
}
@keyframes button-click {
    0%   { opacity : 100%; }
    50%  { opacity : 50%;  }
    100% { opacity : 100%; }
}


/* itrk-cta.css */
a.itrk-cta {
    color            : var(--primary-color);
    background-color : var(--lightgray-1);
    border           : 2px solid var(--lightgray-1);
    border-radius    : 20px;
    transition       : 0.2s ease-in-out;
    display          : flex;
    align-items      : center;
    text-transform   : uppercase;
    padding          : 20px 40px;
    cursor           : pointer;
    max-width        : 100%;
    white-space      : normal;
}

a.itrk-cta:hover {
    border : 2px solid var(--primary-color);
}

a.itrk-cta img {
    max-height   : 30px;
    max-width    : 30px;
    margin-right : 15px;
}

a.itrk-cta span {
    font          : normal normal 500 19px/23px Bitter;
    color         : var(--darkgray-2);
    word-wrap     : break-word;
    word-break    : normal;
    overflow-wrap : break-word;
    hyphens       : auto;
    flex-grow     : 1;
    min-width     : 0;
}

a.itrk-cta::after {
    content      : '\f054';
    font-family  : 'Font Awesome 6 Free', sans-serif;
    font-weight  : 900;
    margin-left  : auto;
    padding-left : 10px;
    font-size    : 22px;
    display      : inline-block;
}


.itrk-slider {
    --itrk-slider-width   : 33.333%;
    --itrk-slider-width-m : 50%;
    --itrk-slider-width-s : 100%;
    position              : relative;
    margin                : auto;
    display               : grid;
    grid-template-columns : 50px 1fr 50px;
    align-items           : center;
    padding               : 0;
}

.itrk-slider .nav-icon {
    margin-top  : -25px;
    cursor      : pointer;
    user-select : none;
    z-index     : 10;
    display     : flex;
    align-items : center;
    width       : 50px;
    height      : 50px;
    top         : 50%;
    color       : var(--lightgray-4);
    font-size   : 45px;
}

.itrk-slider .nav-icon.disabled {
    color  : var(--itrk-border);
    cursor : default;
}

.itrk-slider .prev-icon {
    left            : -35px;
    justify-content : start;
}

.itrk-slider .next-icon {
    right           : -35px;
    justify-content : end;
}

.itrk-slider .slider-container {
    margin-left        : 0px !important;
    margin-bottom      : 0 !important;
    display            : flex;
    overflow           : scroll;
    scroll-snap-type   : x mandatory;
    flex-grow          : 1;
    scroll-behavior    : smooth;
    -ms-overflow-style : none;
    scrollbar-width    : none;
    container          : itrk-slider / inline-size;
    position           : relative;
    width              : auto;
}

.itrk-slider .slider-container::-webkit-scrollbar {
    display : none;
}

.itrk-slider .slide {
    padding           : 0;
    scroll-snap-align : start;
    flex              : 0 0 var(--itrk-slider-width);
    display           : flex;
    justify-content   : center;
    align-items       : stretch;
    list-style-type   : none;
    margin            : 0;
}

@media all and (max-width : 767px) {
    .itrk-slider .slide, .itrk-slider .slide {
        flex : 0 0 var(--itrk-slider-width-m);
    }
}

@media all and (max-width : 600px) {
    .itrk-slider .slide, .itrk-slider .slide, .itrk-slider .slide {
        flex : 0 0 var(--itrk-slider-width-s);
    }

    .itrk-slider .slide > div {
        padding : 0 20px;
    }

    .itrk-slider.with-line li {
        padding: 0 5px 0 4px;
    }
}

.itrk-slider.with-line li {
    border-left : 1px solid var(--itrk-border);
    padding     : 0 30px 0 29px;
    box-sizing  : border-box;
}

.itrk-slider.with-line .slider-container {
    margin : 0 -2px !important;
}

@media all and (max-width : 767px) {
    .itrk-slider {
        grid-template-columns: 30px 1fr 30px;
    }
    .itrk-slider .nav-icon {
        width: 30px;
    }
}




/* itrk-panel.css */

.itrk-panel {
    --itrk-panel-padding : 20px;
    display              : block;
    border               : 1px solid var(--itrk-border);
    background           : white;
    border-radius        : var(--itrk-border-radius);
    font                 : var(--font-normal);
}

.itrk-panel > * {
    padding : 0 var(--itrk-panel-padding);
    margin  : var(--itrk-panel-padding) 0;
}

.itrk-panel > h2,
.itrk-panel > h3,
.itrk-panel > h4,
.itrk-panel > header {
    background              : var(--lightgray);
    border-top-left-radius  : var(--itrk-border-radius);
    border-top-right-radius : var(--itrk-border-radius);
    border-bottom           : 1px solid var(--lightgray-border);
    margin-top              : 0 !important;
    margin-bottom           : 0 !important;
    padding                 : 15px 20px !important;
    font                    : var(--font-normal) !important;
    text-transform          : uppercase;
}

@media all and (max-width : 767px) {
    .itrk-panel {
        --itrk-panel-padding : 20px !important;
    }
}


.itrk-filterlist {
    position      : relative;
}

.itrk-filterlist ul {
    margin-bottom : 0;
}

.itrk-filterlist > button {
    display : none;
}

.itrk-filterlist .counter {
    color : var(--lightgray-4);
}

.itrk-filterlist ul {
    list-style : none !important;
}

.itrk-filterlist li {
    padding       : 0;
    margin: 0!important;
    display       : block;
}

@media screen and (min-width : 768px) {
    .itrk-filterlist {
        height : auto;
    }

    .itrk-filterlist ul {
        height          : auto;
        border          : none;
        display         : flex;
        margin-left     : 0;
        flex-wrap       : wrap;
        justify-content : flex-start;
        gap             : 0.625em;
    }

    .itrk-filterlist a {
        display          : block;
        background-color : var(--lightgray-1);
        padding          : 0.4em 0.7em 0.4em 2.5em;
        color            : var(--darkgray);
        font             : var(--font-small);
        line-height      : 1.8em;
        border-radius    : var(--itrk-border-radius);
        position         : relative;
        transition       : all 0.3s ease-in-out;
    }

    .itrk-filterlist a:before {
        content          : "";
        background-color : var(--lightgray-4);
        border-radius    : 50%;
        position         : absolute;
        width            : 15px;
        height           : 15px;
        left             : 0.6em;
        top              : 50%;
        transform        : translateY(-50%);
    }

    .itrk-filterlist.small a {
        padding          : 0.2em 0.7em 0.2em 2.5em;
        font             : var(--font-xs);
    }

    .itrk-filterlist.small a:before {
        width            : 12px;
        height           : 12px;
    }

    .itrk-filterlist .active a {
        background-color : var(--background-primary2);
    }

    .itrk-filterlist .active a:before {
        font-family      : "Font Awesome 6 Free";
        color            : var(--primary-color);
        background-color : var(--white);
        font-size        : 0.9em;
        line-height      : 1.2;
        font-weight      : 900;
        content          : "\f00c";
        display          : flex;
        align-items      : center;
        justify-content  : center;
    }

    .itrk-filterlist.small .active a:before {
        font-size: 0.8em;
    }

    .itrk-filterlist .active .counter {
        color : var(--darkgray);
    }

    .itrk-filterlist a:hover {
        background-color : var(--lightgray-1-hover);
    }

    .itrk-filterlist .active a:hover {
        background-color : var(--background-primary2-hover);
    }

    .itrk-filterlist .selected-filter {
        display : none;
    }
}

@media screen and (max-width : 767px) {
    .itrk-filterlist {
        height        : auto;
        margin-bottom : 2.5em;
        width         : 100%;
        list-style    : none !important;
        margin-left   : 0;
    }

    .itrk-filterlist > button {
        position: relative;
        color            : var(--lightgray-4);
        background-color : white;
        border           : 1px solid var(--lightgray-4);
        border-radius    : var(--itrk-border-radius);
        width            : 100%;
        display          : flex;
        justify-content  : space-between;
        align-items      : center;
        gap              : 2px;
        padding          : 0.625em 1.25em;
    }

    .itrk-filterlist button:after {
        color       : var(--lightgray-4);
        font        : normal normal normal 14px/1 var(--itrk-fa-font-family);
        font-weight : 900 !important;
        content     : "\f078";
        transition  : transform 0.3s ease;
    }

    .itrk-filterlist.open button {
        z-index: 5;
    }

    .itrk-filterlist.open button:after {
        transform: rotate(180deg);
    }

    .itrk-filterlist ul {
        opacity: 0;
        display: none;
        transition: opacity 0.1s ease-in-out;
        z-index:2;
        position         : absolute;
        top: 0;
        background-color : var(--lightgray-1);
        border           : 1px solid var(--lightgray-4);
        border-radius    : var(--itrk-border-radius);
        width: 100%;
        padding: 4em 1.25em 1.25em!important;
    }

    .itrk-filterlist.open ul {
        opacity: 1;
        display: block;
    }

    .itrk-filterlist li {
        margin-bottom : 0;
        padding       : 0;
        width         : 100%;
    }

    .itrk-filterlist ul a {
        display       : block;
        color         : var(--darkgray);
        line-height   : 1.75em;
        padding       : 0.4em 0em;
        transition    : all ease-in-out 0.2s;
        white-space   : normal;
        word-break    : break-word;
        overflow-wrap : anywhere;
    }

    .itrk-filterlist .active a {
        font-weight : 500;
    }

    .itrk-filterlist ul a:hover {
        color : var(--primary-color);
    }

    div.itrk-filterlist.open .active {
        display         : flex;
        justify-content : space-between;
        align-items     : center;
        gap             : 0.5em;
    }

    .itrk-filterlist .active:after {
        font-family : "Font Awesome 6 Free";
        color       : var(--primary-color);
        font-size   : 1em;
        font-weight : 900;
        content     : "\f00d";
    }

    .itrk-filterlist .selected-filter {
        display     : flex;
        flex-wrap   : wrap;
        align-items : flex-end;
        gap         : 1em;
    }

    .itrk-filterlist .selected-filter a {
        color       : var(--darkgray);
        display     : flex;
        align-items : center;
        gap         : 0.25em;
    }

    .itrk-filterlist .selected-filter a:first-of-type {
        margin-top : 1em;
    }

    .itrk-filterlist .selected-filter a:after {
        font-family     : "Font Awesome 6 Free";
        color           : var(--primary-color);
        font-size       : 1em;
        font-weight     : 900;
        content         : "\f00d";
        display         : flex;
        align-items     : center;
        justify-content : center;
    }
}




.itrk-link-bar {
    display: block;
    margin-top: 2em;
    text-align: right;
}

.itrk-link-bar > a {
    display: inline-block;
    padding-left: 1.2em;
    line-height: 1.6em;
    margin-left: 1em;
    text-align: left;
}
.itrk-link-bar > a:first-child {
    margin-left: 0em;
}
.itrk-link-bar > a i {
    position: absolute;
    font-size: inherit;
    line-height: inherit;
    vertical-align: baseline;
    margin-left: -1.2em;
}