/*
 * Header Warenkorb
 */
#itm-header-links{display: flex; order: 3; z-index: 1}
#itm-header-links > a{
    display: grid !important;
    color: var(--pdv-group-200);
    background: #fff;
    place-content: center;
    font-size: 32px;
    width: 1.5em;
    height: 1.5em;
    box-shadow: 0 0 0 2px var(--pdv-blue-200);
    line-height: 1;
    border-radius: 50%;
    position: relative;
    margin: 0 0 0 .5em;
    transition: .2s;
}
#itm-header-links #itm-header-warenkorb-icon::after {
    content: attr(data-cart-amount);
    color: #fff;
    background: red;
    font-weight: bold;
    position: absolute;
    top: -.5em;
    right: -.5em;
    font-size: .5em;
    width: 1.5em;
    height: 1.5em;
    display: grid;
    place-content: center;
    border-radius: 50%;
    line-height: 1;
}

@media only screen and (max-width: 990px){
    #itm-header-links{
        position: absolute;
        top: 50%;
        right: 90px;
        translate: 0 -40%;
    }
    #itm-header-links > a{font-size: 20px;}
}



/*
 * itm Warenkorb (cart) + Mein Profil (user account)
 */
itemkg_connect-cart,
itemkg_connect-user_account{
    --blue: var(--pdv-blue) !important;
    --primary: var(--pdv-blue) !important;
}

itemkg_connect-cart,
itemkg_connect-user_account{font-family: 'Roboto', sans-serif !important; font-size: var(--step-0) !important; font-weight: 400 !important; line-height: 1.6 !important}
itemkg_connect-cart p,
itemkg_connect-user_account p{margin: 0 0 1em !important;}
itemkg_connect-cart h1,
itemkg_connect-user_account h1,
itemkg_connect-cart h2,
itemkg_connect-user_account h2,
itemkg_connect-cart h3,
itemkg_connect-user_account h3,
itemkg_connect-cart h4,
itemkg_connect-user_account h4,
itemkg_connect-cart h5,
itemkg_connect-user_account h5,{font-family: 'Roboto', sans-serif !important; font-weight: 900 !important; line-height: 1.2 !important; letter-spacing: 0 !important; text-transform: inherit !important; margin: 0 0 .4em 0 !important;}


#top itemkg_connect-cart [class*="fa-"]:before,
#top itemkg_connect-user_account [class*="fa-"]:before{
	font-family: 'cc_egov-fontello';
	-webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-weight: normal;
}

#top itemkg_connect-cart label.btn-secondary span,
#top itemkg_connect-user_account label.btn-secondary span{
    color: #fff;
    font-size: 1rem;
}

#top itemkg_connect-cart .vhsc-cart__stepper ul{list-style: none; margin: 0}
#top itemkg_connect-cart .vhsc-cart__stepper ul li{margin: 0}
#top itemkg_connect-cart .vhsc-cart__stepper ul li a{padding: .25em 1em}

#top itemkg_connect-cart .fa-shopping-cart:before,
#top itemkg_connect-user_account .fa-shopping-cart:before{content: '\e879';}
#top itemkg_connect-cart .fa-trash:before,
#top itemkg_connect-user_account .fa-trash:before{content: '\e900';}
#top itemkg_connect-cart .fa-user-edit:before,
#top itemkg_connect-user_account .fa-user-edit:before{content: '\e909'}
#top itemkg_connect-cart .fa-credit-card:before,
#top itemkg_connect-user_account .fa-credit-card:before{content: '\e892'}
#top itemkg_connect-cart .fa-handshake:before,
#top itemkg_connect-user_account .fa-handshake:before{content: '\e8e6'}
#top itemkg_connect-cart .fa-times:before,
#top itemkg_connect-user_account .fa-times:before{content: '\e800'}
#top itemkg_connect-cart .fa-calendar:before,
#top itemkg_connect-user_account .fa-calendar:before{content: '\e82b'}
#top itemkg_connect-cart .fa-bars:before,
#top itemkg_connect-user_account .fa-bars:before{content: '\e88a'}

#top itemkg_connect-user_account .bg-light{background: #f6f6f6 !important}
#top itemkg_connect-user_account .navbar-collapse ul{margin: 0; list-style: none;}
#top itemkg_connect-user_account .navbar-collapse ul > li{margin: 0}
#top itemkg_connect-user_account h5{color: inherit; font-size: var(--step-0); line-height: 1.6;}
#top itemkg_connect-user_account .collapse{background: #fff !important}
#top itemkg_connect-user_account .div-table[_ngcontent-ng-c1615398325] .table-row.table-header[_ngcontent-ng-c1615398325],
#top itemkg_connect-user_account .div-table[_ngcontent-ng-c408431499] .table-row.table-header[_ngcontent-ng-c408431499]{background: #dedde0; border-color: #000000;}
#top itemkg_connect-user_account .div-table[_ngcontent-ng-c408431499] .item.clickable[_ngcontent-ng-c408431499]:hover *{color: #fff}
#top itemkg_connect-user_account .vhsc-orders__course-item[_ngcontent-ng-c408431499] + .vhsc-orders__course-item[_ngcontent-ng-c408431499]{border-color: #fff}

#top itemkg_connect-user_account .nav-pills .nav-link.active{background-color: var(--pdv-blue-200)}

#top itemkg_connect-user_account ul.pagination{list-style: none; list-style: none; margin: 24px 0;
    padding: 4px;}
#top itemkg_connect-user_account ul.pagination li.page-item{margin: 0 2px; padding: 0;}
#top itemkg_connect-user_account ul.pagination li.page-item .page-link{
    position: relative;
    display: block;
    padding: .5rem .75rem;
    margin-left: -1px;
    line-height: 1.25;
    color: var(--pdv-blue-200);
    background-color: #fff;
    border: 1px solid #dee2e6;
    height: auto;
    width: auto;
    border-radius: 4px;
    font-size: 14px;
}
#top itemkg_connect-user_account ul.pagination li.page-item.active .page-link{
    z-index: 1;
    color: #fff;
    background-color: var(--pdv-blue-200);
    border-color: var(--pdv-blue-200);
}
#top itemkg_connect-user_account ul.pagination li.page-item.disabled .page-link{
    color: #6c757d;
    pointer-events: none;
    cursor: auto;
    background-color: #fff;
    border-color: #dee2e6;
}
#top itemkg_connect-user_account ul.pagination span{
    display: inline-block;
    float: unset;
    font-size: 14px;
    line-height: inherit;
    padding: 0;
    width: inherit;
}
#top itemkg_connect-cart .form-check,
#top itemkg_connect-user_account .form-check{display: flex; padding: 0; line-height: 1.2}
#top itemkg_connect-cart .form-check *,
#top itemkg_connect-user_account .form-check *{position: static; margin: 0; line-height: 1.2; font-size: var(--step-0);}
#top itemkg_connect-cart .form-check input,
#top itemkg_connect-user_account .form-check input{left: 0; top: .2em}

#top itemkg_connect-cart .form-check.text-danger label *,
#top itemkg_connect-user_account .form-check.text-danger label *{color: #dc3545}

#top itemkg_connect-user_account form.vhsc-register + lib-content-link {
    display: none;
}

/* In den Bereichen "Anmeldedaten" und "Benutzerprofil" sollen Vor- und Nachname schreibgeschützt sein */
#top itemkg_connect-user_account vhsconnect-login-details input#vhsc-firstname,
#top itemkg_connect-user_account vhsconnect-login-details input#vhsc-lastname,
#top itemkg_connect-user_account vhsconnect-edit-person input[formcontrolname="firstName"],
#top itemkg_connect-user_account vhsconnect-edit-person input[formcontrolname="lastName"]{opacity: .2; pointer-events: none}

/* "Abmelden" als Button */
#top itemkg_connect-user_account vhsconnect-user-account-profil ul li[ngbnavitem="logout"] > a{background-color: rgb(170 39 47 / 10%); color: var(--pdv-red);}


/*
 * Kurs single Template
 */
.itm_course--template{
    display: flex; 
    flex-wrap: wrap; 
    gap: 0 2rem; 
    flex-direction: column-reverse;
    align-items: flex-start;
    padding-bottom: 50px;
    max-width: 990px !important;
}
.itm_course--template:after{display: none}
.itm_course--template > aside{
    padding-left: 1rem;
    border-left: 1px dashed var(--pdv-blue-200);
    font-size: var(--step--1);
}
.itm_course--template > aside ul{line-height: 1.2;}
.itm_course--template > aside ul li{margin: 0 !important;}
.itm_course--template > aside ul li > a{opacity: .5}
.itm_course--template > aside ul li:hover > a,
.itm_course--template > aside ul li.__current > a{opacity: 1; color: var(--pdv-blue-200)}

.itm_course--template > main{width: 100%; padding-top: 0}

@media (min-width: 990px){
    .itm_course--template{flex-direction: row}
    .itm_course--template > *{flex-basis: 0; flex-grow: 1;}
    .itm_course--template > main{flex-grow: 3; padding: 0;}
}

.itm_course--template > main > .__cat{
    margin: 0 0 .5em 0;
}

.itm_course--template > main > .__cat > span{ 
    padding: 0.2em 0.6em; 
    border-radius: 0.5em; 
    color: var(--pdv-blue-200); 
    font-weight: 700; 
    font-size: var(--step--1);
    position: relative;
    overflow: hidden;
    display: inline-block;
}
.itm_course--template > main > .__cat > span:before{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: currentColor;
    opacity: .1;
}

.itm_course--template > main > h1{}

.itm_course--template > main > .__content{
    display: flex;
    flex-wrap: wrap;
    gap: 2rem 4rem;
    align-items: flex-start;
    margin: 4rem 0;
}
.itm_course--template > main > .__content > div{
    flex-basis: 100%;
}
.itm_course--template > main > .__content > div:nth-child(2){
    display: flex;
    flex-direction: column;
    gap: 1em;
}
.itm_course--template > main > .__content > div:nth-child(2) > div{font-size: var(--step--1); max-width: 100%}

@media (min-width: 990px){
    .itm_course--template > main > .__content > div:nth-child(1){flex-grow: 2; flex-basis: 0;}
    .itm_course--template > main > .__content > div:nth-child(2){flex-grow: 1; flex-basis: 0;}
}



/*
 * Kurstermine Layout: List
 */
#top .__itm_course_date--wrap[data-layout="list"]{margin: 2em 0 4em}
#top .__itm_course_date--wrap[data-layout="list"] > .entry{display: -webkit-box;display: -ms-flexbox;display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: 0 0 1rem 0; width: 100%;}
#top .__itm_course_date--wrap[data-layout="list"] > .entry:hover{text-decoration: none; color: inherit;}
#top .__itm_course_date--wrap[data-layout="list"] > .entry figure{display: none !important; margin: 0; aspect-ratio: 1/1; max-width: 6rem; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; -ms-flex-preferred-size: 0; flex-basis: 0}
#top .__itm_course_date--wrap[data-layout="list"] > .entry figure img{margin: 0; display: block; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover;}
#top .__itm_course_date--wrap[data-layout="list"] > .entry .__content{
    position: relative; 
    padding: 1rem 1rem 1rem 6rem; 
    background: #fff; 
    border-radius: 1rem; 
    -webkit-box-flex: 1; 
    -ms-flex-positive: 1; 
    flex-grow: 1;
    -ms-flex-preferred-size: 0; 
    flex-basis: 0;
    box-shadow: 0 8px 8px rgb(0 0 0 / 10%);
    transition: .2s;
}
#top .__itm_course_date--wrap[data-layout="list"] > .entry .__content:hover{translate: 0 -2px;}
#top .__itm_course_date--wrap[data-layout="list"] > .entry .__content:before{content: '\e82b'; font-family: 'cc_egov-fontello'; position: absolute; left: .5em; line-height: 1; font-size: 3rem; color: #000;}
#top .__itm_course_date--wrap[data-layout="list"] > .entry .__content h4{color: var(--pdv-group-200); margin: 0 !important;}
#top .__itm_course_date--wrap[data-layout="list"] > .entry .__content .__excerpt p{font-size: .8rem; margin: 0; color: #000}
#top .__itm_course_date--wrap[data-layout="list"] > .entry .__content .__meta--infos{
    font-size: var(--step--1);  
    margin: 0 0 1rem 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1rem;
}

#top .__itm_course_date--wrap[data-layout="list"] > .entry .__content .__meta--infos p{margin: 0}
#top .__itm_course_date--wrap[data-layout="list"] > .entry .__content .__meta--infos a.avia-button{width: 100%;}
#top .__itm_course_date--wrap[data-layout="list"] > .entry .__content .__meta--infos span{
    padding: 0.2em 0.6em;
    border-radius: 0.5em;
    color: var(--pdv-blue-200);
    font-weight: 700;
    position: relative;
    overflow: hidden;
    display: inline-block;
}
#top .__itm_course_date--wrap[data-layout="list"] > .entry .__content .__meta--infos span:before{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: currentColor;
    opacity: .1;
}

@media (min-width: 768px){
    #top .__itm_course_date--wrap[data-layout="list"] > .entry .__content .__meta--infos{
        flex-direction: row;
        align-items: center;
    }
    #top .__itm_course_date--wrap[data-layout="list"] > .entry .__content .__meta--infos a.avia-button{margin: 0 0 0 auto; width: auto}
}

#top .__itm_course_date--wrap[data-layout="list"] > .entry .__content .__aviability span{display: inline-flex; gap: .5em; align-items: center}
#top .__itm_course_date--wrap[data-layout="list"] > .entry .__content .__aviability span:before{
    content: '';
    display: inline-block;
    width: 1em;
    height: 1em;
    border-radius: 50%;
    background: green
}
#top .__itm_course_date--wrap[data-layout="list"] > .entry.__fully--booked .__content .__aviability span:before{background: red;}
#top .__itm_course_date--wrap[data-layout="list"] > .entry.__almost--full .__content .__aviability span:before{background: orange;}



/*
 * itm Loader
 */
.__itm--loader{
    max-height: 2rem; 
    overflow: hidden;
    display: flex;
    justify-content: center;
    transition: .3s;
    pointer-events: none;
}
.__itm--loader.loaded{max-height: 0}
.__itm--loader > div{
  width: 60px;
  aspect-ratio: 4;
  --_g: no-repeat radial-gradient(circle closest-side,var(--pdv-blue-200) 90%,#0000);
  background: 
    var(--_g) 0%   50%,
    var(--_g) 50%  50%,
    var(--_g) 100% 50%;
  background-size: calc(100%/3) 100%;
  animation: l7 1s infinite linear;
}
@keyframes l7 {
    33%{background-size:calc(100%/3) 0%  ,calc(100%/3) 100%,calc(100%/3) 100%}
    50%{background-size:calc(100%/3) 100%,calc(100%/3) 0%  ,calc(100%/3) 100%}
    66%{background-size:calc(100%/3) 100%,calc(100%/3) 100%,calc(100%/3) 0%  }
}



/*
 * itm course shortcode
 */
#top .__itm--course--grid{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 1rem 2rem;
    margin: 0 0 4em 0;
}
#top .__itm--course--grid > a{
    font-weight: 700; 
    font-size: var(--step-0) !important;
    margin: 0 !important;
    text-align: center;
}
#top .__itm--course--grid > a i{
    display: block;
    line-height: 1;
    font-size: var(--step-4);
    margin: .5em 0 !important;
}



/*
 * itm course shortcode [itm_kurse_list]
 */
#top .__itm--course--list{
    display: flex;
    flex-direction: column;
    gap: 2rem;
}
#top .__itm--course--list > .entry{
    background: #fff;
    border-radius: 1rem;
    overflow: hidden;
    box-shadow: 0 8px 8px rgb(0 0 0 / 10%);
    transition: .2s;
}
#top .__itm--course--list > .entry > .__content{
    position: relative;
    padding: 0 0 0 4rem;
    flex-grow: 1;
    cursor: pointer;
    pointer-events: none;
}
#top .__itm--course--list > .entry > .__content i{
    position: absolute;
    left: .5em;
    line-height: 1;
    font-size: 2rem;
    color: #000;
}
#top .__itm--course--list > .entry > .__content .__meta--infos{
    display: flex;
    gap: 1rem;
    font-size: var(--step--1);
    margin: 0 0 .5em 0;
}
#top .__itm--course--list > .entry > .__content .__meta--infos span{
    padding: 0.2em 0.6em;
    border-radius: 0.5em;
    color: var(--pdv-blue-200);
    font-weight: 700;
    position: relative;
    overflow: hidden;
    display: inline-block;
}
#top .__itm--course--list > .entry > .__content .__meta--infos span:before{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: currentColor;
    opacity: .1;
}
#top .__itm--course--list > .entry > .__content .__meta--infos span:nth-child(2){display: none;}
#top .__itm--course--list > .entry .__title{
    color: var(--pdv-group-200);
    margin: .75em 0 0 !important;
    font-weight: 400 !important;
    font-size: var(--step-1)
}
#top .__itm--course--list > .entry > .__description{
    display: none; 
    padding: 1rem 1rem 2rem 4rem;
    background-color: #fff; 
}
#top .__itm--course--list > .entry > .__description ul.__dates{
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: .5em;
    font-size: var(--step--1);
    margin: 1em 0 2em;
}
#top .__itm--course--list > .entry > .__description ul.__dates > li .__date:before{content:'\e82b'; font-family: 'cc_egov-fontello'; margin: 0 .5em 0 0}
#top .__itm--course--list > .entry > .__description ul.__dates > li .__time{margin: 0 0 0 .5em}
#top .__itm--course--list > .entry > .__description ul.__dates > li .__time:before{content:'\e830'; font-family: 'cc_egov-fontello'; margin: 0 .5em 0}
#top .__itm--course--list > .entry > .__description ul.__dates > li{border-bottom: 1px solid; margin: 0; padding: .2em 0; max-width: 100%}
#top .__itm--course--list > .entry > .__content.active + .__description{display: block}
