/* =========================================== */

/* ============== Chatbot (CB) ============== */

/* =========================================== */



/* ============== Chatbot Button (CBB) ============== */


.chatbot-button {
    border-radius: 50%;
    height: 100px;
    width: 100px;
    background-color: #00457d;
    transition: all 0.25s ease-in;
    border: 0px;
    margin:0 !important; padding:0 !important;
    position: absolute;
    z-index: 999 !important;
}



.chatbot-button:hover {

    background-color: #ccc;

    cursor: pointer;

}



.chatbot-button:focus,

.chatbox-button:active {

    outline: 0;

}

.chatbot-button:before {content:"Avatar";}




/* === Chatbot Button - Animation === */



.chatbot-button__anim-container {

    height: 100%;

    width: 100%;

    transition: .5s;

    justify-content: center;



    position: relative;

    cursor: pointer;

    display: flex;

    align-items: center;

}



.chatbot-button__anim-container img {
    transition: .3s;
    position: absolute;
    font-size: 4em !important;
    height: 50%;
    width: 50%;
    top:0;
}



.chatbot-button__anim-container .chatbot-button__icon--opened {
    transform: rotate(0) !important;
    opacity: 0;
}



.chatbot-button__anim-container.morphed {
    transform: rotate(0);
}



.chatbot-button__anim-container.morphed .chatbot-button__icon--opened {

    opacity: 1;

}



.chatbot-button__anim-container.morphed .chatbot-button__icon--closed {

    opacity: 0;

}



.chatbot-button__anim-container.small {

    height: 2rem;

    width: 2rem;

    font-size: .5rem;

}





/* === Chatbot Button - Position === */



.chatbot-button[data-chatposition="inline"] {

    position: static;

}



.chatbot-button[data-chatposition="br"] {

    position: fixed;

    bottom: 5%;

    right: 3%;

}



.chatbot-button[data-chatposition="bl"] {

    position: fixed;

    bottom: 5%;

    left: 3%;

}



.chatbot-button[data-chatposition="cr"] {

    position: fixed;

    top: 50%;

    right: 3%;

    transform: translateY(-50%);

}



.chatbot-button[data-chatposition="cl"] {

    position: fixed;

    top: 50%;

    left: 3%;

    transform: translateY(-50%);

}



.chatbot-button[data-chatposition="tr"] {

    position: fixed;

    top: 5%;

    right: 3%;

}



.chatbot-button[data-chatposition="tl"] {

    position: fixed;

    top: 5%;

    left: 3%;

}





/* ============== Chatbot Modal or Layer ============== */





/* === Chatbot - CHAT WIN POSITION === */

/* Data Attribut: chatwinposition

*  br = Unten Rechts

*  c = Mittig

*  cr = Mittig Rechts

*/

/*

.chatbot-layer[data-chatwinposition="br"] .chatbot-layer__dialog.modal-dialog-centered {margin: 0 10px 0 auto;align-items: flex-end;}

.chatbot-layer[data-chatwinposition="c"] .chatbot-layer__dialog {margin: 0 auto;display: flex;align-items: center;}

.chatbot-layer[data-chatwinposition="cr"] .chatbot-layer__dialog {margin: 0 10px 0 auto;}

*/



/* === Chatbot Layer - CHAT SIZE === */

/* Data Attribut = chatsize 

 * s = Kompakt

 * m = Medium

 * l = Volle Display Größe

 */



.chatbot-layer {

    display: flex;

    align-items: center;

    flex-direction: row;

}



.chatbot-layer[data-chatsize="s"] .chatbot-layer__dialog {

    padding: 30px;

}



.chatbot-layer[data-chatsize="m"] .chatbot-layer__dialog {
    max-width: 60%;
    max-width: 1200px;
    flex-basis: 60%;
    margin:auto !important;
}



.chatbot-layer[data-chatsize="l"] .chatbot-layer__dialog {

    max-width: 100%;

    width: 100%;

    height: 100%;

    margin: 0;

    padding: 0;

    flex-basis: 100%;

}



.chatbot-layer[data-chatsize="l"] .chatbot-layer__dialog .chatbot-layer__content {

    height: auto;

    min-height: 100%;

    border-radius: 0;

}





/* ============== Chatbot Layer (CBL) ============== */



.chatbot-layer {
    box-shadow: none !important;
}


.chatbot-layer__content {

    border: 0px !important;

}



/* === Chatbot Layer - Size === */



.modal-dialog.modal-md {

    max-width: 680px;

}



/* Important part */



.modal-dialog {

    overflow-y: initial !important;

}



.modal-body {

    height: 550px;

    height: 60vh;

    overflow-y: auto;

    padding: 20px !important;

}



.modal-content {
    border: 0px;
    border-radius: 0px !important;
}





/* ============== Chatbot - Header ============== */



.chatbot-header {
    background: #3c6099;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 8px 1rem;
    border-bottom: 0px solid #dee2e6;
    border-top-left-radius: none;
    border-top-right-radius: none;
}

.chatbot-header__avatar img {
    max-height: 50px;
    border-radius: 50%;
    border: #ccc 0px solid;
}



.chatbot-header__title {
    color: #fff;
    padding: 14px 12px 6px 12px;
    font-size: 120%;
}



.chatbot-header__title h5 {

    font-size: 100%;

    font-weight: bold;

    color: #4a4a4a;

    text-transform: none;

    margin: 0;

}



.chatbot-header .close {
    float: right;
    font-size: 3rem;
    font-weight: 700;
    line-height: 1;
    color: #2980b9;
    opacity: 1;
    background: #00457d;
    padding: 1rem 2rem !important;
}







/* ============== Chatbot - Footer ============== */

/* === Container === */

.chatbot-footer {
    border-top: 0px solid #eaf0f6 !important;
}



.chatbot-footer__type-message {
    width: 100%;
    margin: 0 !important;
    padding: 20px 20px !important;
    display: flex;
}


/* === Input Field === */



.chatbot__input {
    flex-basis: 90%;
    flex: auto;
    outline: 0;
    border: 0px solid #fff !important;
    color: rgba(255, 255, 255, 1) !important;
    padding: 10px 60px 10px 20px !important;
    background: #00457B !important;
    border-radius: 0px !important;
    transition: background 0.2s ease-in;
}

.chatbot__input::placeholder {color: #fff !important; opacity: 1 !important;}
.chatbot__input::-ms-input-placeholder {color: #fff !important; opacity: 1 !important;}
.chatbot__input:-ms-input-placeholder {color: #fff !important; opacity: 1 !important;}

.chatbot__input:hover {
    margin: 0;
    border: 0px solid #ccc;
}

.chatbot__input:focus {
    color: rgba(255, 255, 255, 1) !important;
}






/* === Submit Button ===*/



.chatbot__submit {
    outline: 0;
    background: rgba(13, 71, 120, 0.1) !important;
    border: 0px solid #2980b9;
    color: #00457d !important;
    cursor: pointer;
    font-size: 18px;
    /*height: 46px;
    width: 46px;*/
    position: relative;
    /*right: 15px;*/
    -webkit-transition: 0.3s all ease;
    -o-transition: 0.3s all ease;
    transition: 0.3s all ease;
    /* border-radius: 0 .3rem .3rem 0;*/
    border-radius: 50%;
    padding: 40px !important;
}


.chatbot__submit:hover {
    background: #00457d !important;
    border: 0px solid #000;
    outline: 0;
}


.chatbot__submit:focus,
.chatbot__submit:active {
    outline: 0;
}


.chatbot__submit i {
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    left: 50%;
    padding-right: 2px;
    color: #00457d !important;
}

#chatbot__submit:hover i::before {
    color: #fff !important;
}



/* ============== Chatbot - Body ============== */


.chatbot__body .chatbot__messages {

    padding: 0;

    display: flex;

    flex-wrap: wrap;

    flex-direction: column;

    align-items: flex-start;

}





.animation:last-child {

    animation: fadein 0.25s;

    animation-timing-function: all 200ms cubic-bezier(0.55, 0.055, 0.675, 0.19);

}



/* ============== Chatbot - Spinner ============== */

.spinme-right {

    display: inline-block;

    padding: 15px 20px;

    font-size: 14px;

    border-radius: 30px;

    line-height: 1.25em;

    font-weight: 100;

    opacity: 0.2;

}



.spinme-left {

    display: inline-block;

    padding: 15px 20px;

    font-size: 14px;

    color: #ccc;

    border-radius: 30px;

    line-height: 1.25em;

    font-weight: 100;

    opacity: 0.2;

}



.spinner {

    margin: 0;

    width: 100%;

    text-align: center;

}



.spinner>div {

    width: 10px;

    height: 10px;

    border-radius: 100%;

    display: inline-block;

    -webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;

    animation: sk-bouncedelay 1.4s infinite ease-in-out both;

    background: rgba(0, 0, 0, 1);

}



.spinner .bounce1 {

    -webkit-animation-delay: -0.32s;

    animation-delay: -0.32s;

}



.spinner .bounce2 {

    -webkit-animation-delay: -0.16s;

    animation-delay: -0.16s;

}



@-webkit-keyframes sk-bouncedelay {



    0%,

    80%,

    100% {

        -webkit-transform: scale(0)
    }



    40% {

        -webkit-transform: scale(1.0)
    }

}



@keyframes sk-bouncedelay {



    0%,

    80%,

    100% {

        -webkit-transform: scale(0);

        transform: scale(0);

    }



    40% {

        -webkit-transform: scale(1.0);

        transform: scale(1.0);

    }

}





/* ============== Chatbot - Speech Bubbles ============== **/

.bubble {
    font-weight: 400;
    min-width: 60%;
    /*box-shadow: 0px 20px 13px -24px rgba(0, 0, 0, 0.6);*/
}



.bubble p {

    margin: 0;

}



.bubble-chatbot a,

.bubble-chatbot a:link,

.bubble-chatbot a:visited {

    text-decoration: underline;

    color: #eaf0f6;

}



.bubble-chatbot a:hover {

    text-decoration: none;

    color: #fff;

}



.bubble-chatbot {
    margin: 20px 30px 15px 0px !important;
    border: 4px solid #00457d;
    border-radius: 85px 85px 85px 0px;
    padding: 40px 30px !important;
    text-align: left;
    color: #5e5e5e;
    position: relative;
    background: transparent;
    left: 0;
}

/*.bubble-chatbot::before {
    content: "";
    width: 0px;
    height: 0px;
    position: absolute;
    border-left: 10px solid transparent;
    border-right: 10px solid #00457d;
    border-top: 10px solid #00457d;
    border-bottom: 10px solid transparent;
    right: 19px;
    bottom: -20px;
  }*/


.bubble-chatbot h5 {

    color: #fff;

}







.bubble-chatbot:first-child {

    margin: 0px 30px 10px 0px;



}



.bubble-chatbot .date {

    color: #333;

}



.bubble-user {
    right: 0;
    align-self: flex-end;
    margin: 20px 30px 15px 0px !important;
    border: 0px solid #00457d;
    border-radius: 85px 85px 0px 85px;
    padding: 40px 30px !important;
    text-align: left;
    color: #fff;
    position: relative;
    background: #00457d;
}



/* === Chatbot Answer - Selection === */



.chatbot-selection span {

    background: #ffffff;

    border: 2px solid #3a5571;

    border-radius: 30px;

    padding: 15px;

    -webkit-box-shadow: 2px 4px 15px -5px rgba(186, 186, 186, 0.8);

    -moz-box-shadow: 2px 4px 15px -5px rgba(186, 186, 186, 0.8);

    box-shadow: 2px 4px 15px -5px rgba(186, 186, 186, 0.8);

    transition: all 0.3s ease-in;

}



.chatbot-selection span:hover {

    background: #3a5571;

    color: #fff;

}





/* ============== Chatbot - Loader ============== */



.loader {

    margin-bottom: -2px;

    text-align: center;

    opacity: 0.3;

}



.loader__dot {

    display: inline-block;

    vertical-align: middle;

    width: 6px;

    height: 6px;

    margin: 0 1px;

    background: white;

    border-radius: 50px;

    animation: loader 0.45s infinite alternate;

}



.loader__dot:nth-of-type(2) {

    animation-delay: 0.15s;

}



.loader__dot:nth-of-type(3) {

    animation-delay: 0.35s;

}



@keyframes loader {

    0% {

        transform: translateY(0);

    }

    100% {

        transform: translateY(-5px);

    }

}



@keyframes fadein {

    from {

        opacity: 0;

        margin-top: 10px;

        margin-bottom: 0;

    }

    to {

        opacity: 1;

        margin-top: 0;

        margin-bottom: 10px;

    }

}



* {

    box-sizing: border-box;

}



/*Loading */



#is-loading {
    text-align: center;
    min-width: 10%;
}



/* ============== Chatbot - Wetter ============== */





h4.wtilo {
    color: #fff;
    font-size: 200%;
}



.weatherBox {

    padding: 2px;

}



.weatherBox img {

    float: right;

}



.weatherBox .date {
    font-weight: bold;
    color: #5e5e5e;
}



.weatherBox .wi-stack {

    font-size: 300%;

}



.weatherBox .iv-stack {

    font-size: 500%;

}



.bubble-chatbot .weatherBox * {

    background-color: transparent;

}



.weatherBox .kopf .iv-stack {

    float: right;

    margin: 0 0 25px 0;

}



.weatherBox .title {

    font-weight: bold;

    font-size: 1.5rem;

}



.weatherBox .date {

    font-weight: bold;

    font-size: 1.2rem;

}



.weatherBox .bez {

    font-weight: bold;

}



.weatherBox .bez:after {

    content: ":";

}



.weatherBox .rumpf>div {

    display: flex;

}



.weatherBox .rumpf > div > .bez {

    flex-basis: 35%;

}
.weatherBox .rumpf .temperature .bez {flex-basis: 38% !important;}


.weatherBox .rumpf {

    padding-bottom: 0px;

    padding-top: 15px;

}



.weatherBox .forecasts {

    padding-top: 20px;

    border-top: 1px solid #ccc;

}



.weatherBox .forecasts .forecast {

    border-bottom: 1px solid #ccc;

    padding-bottom: 20px;

}



.weatherBox .forecasts .forecast:last-child {

    border-bottom: 0px solid #ccc !important;

}



.weatherBox .forecasts .iv-stack {

    float: left;

    margin: 0 25px 0 0;

}



.weatherBox .forecasts .forecastDate {

    font-weight: bold;

    font-size: 1.2rem;

}



/* ============== Chatbot - Antwort | Buttons ============== */



.chatbot__message button,
.chatbot__message .btn-ortena {
    border: 4px solid rgba(60, 96, 153, 0.25) !important;
    padding: .225rem 4.125rem !important;
    /*border-radius: 1rem !important;*/
    background: #fff;
    color: #00457d !important;
    transition: all 0.3s ease-in;
    margin-bottom: 1rem !important;
    width: 100%;
    text-align: left;
}


a.btn-ortena {
    text-decoration: none !important;
}



.chatbot__message button:hover,
.chatbot__message .btn-ortena:hover,
.chatbot__message button:focus,
.chatbot__message .btn-ortena:focus,
.chatbot__message button.btn-ortena.oeffnungszeiten:hover,
.chatbot__message button.btn-ortena.oeffnungszeiten:focus,
.chatbot__message button.btn-ortena.orgleistung:hover,
.chatbot__message button.btn-ortena.orgleistung:focus {
    background: rgba(60, 96, 153, 0.25) !important;
}


.chatbot__message button.btn-ortena.oeffnungszeiten,
.chatbot__message button.btn-ortena.orgleistung {
    border: 4px solid rgba(60, 96, 153, 0.25) !important;
    padding: .225rem 2.125rem !important;
    /*border-radius: 1rem !important;*/
    background: #fff !important;
    color: #00457d !important;
    transition: all 0.3s ease-in;
    margin-bottom: 1rem !important;
    width: 100%;
    text-align: left;
}


.chatbot__message .card-footer {
    background-color: transparent !important;
    border-top: 0px solid rgba(0,0,0,.125) !important;
    margin: 40px 0 !important;
}

.fa-clock::before {
	content: "\f017" !important;
}

.chatbot__message .btn-primary {
    color: #00457c !important;
    background-color: #fff !important;
    border: 0px !important;
}

.chatbot__message .btn-primary:hover,
.chatbot__message .btn-primary:focus {
    background: #ffed00 !important;
    border-radius: 0px !important;
    border: 0px !important;
}


.chatbot_message .fflink {
    color: #eaf0f6;
}



/* ============== Chatbot - Antwort | Details and Summary ============== */

summary {

    background: #9DADBC;

    padding: 10px 15px;

    border: 2px solid #9DADBC;

    color: #000;

    border-radius: 0.75rem;

    text-decoration: none;

}



summary:hover,

summary:focus {

    background: #8CAFCE;

    padding: 10px 15px;

    border: 2px solid #8CAFCE;

    color: #fff;

    border-radius: 0.75rem;

    text-decoration: none;

}



details {

    padding-bottom: 15px;

}

/* ============== RSS ============== */

.rssBox .date {
    font-size: 130%;
    padding: 0;
}

/* ============== Sonstiges ============== */



/* Gabi Server */

#main .chatbot__message a {
    font-size: 100%;
    white-space: normal;
    text-align: left;
}

.bubble-chatbot .card,
.bubble-chatbot .card,
.bubble-chatbot .card,
.bubble-chatbot .card div {

    border: none !important;

    background: transparent !important;

}



.feedback {
    width: 40px;
    z-index: 2222;
    position: absolute;
    right: 0px !important;
    bottom: 0px;
}


.chatbot__message .feedback__buttons button:hover {
    background: transparent !important;
    border: 0px;
}


.feedback__buttons {
    list-style: none !important;
}

.feedback__buttons li {
    margin: 0 !important;
    padding: 0 !important;
}

.feedback__buttons i::before {
	font-size: 3rem !important;
}



.feedback button {
    margin-top: 5px;
    outline: 0;
    background: transparent !important;
    border: 0px solid #fff !important;
    color: #3c6099 !important;
    cursor: pointer;
    font-size: 28px;
    /*height: 42px;
    width: 42px;*/
    right: 16px;
    /*border-radius: 50%;*/
    transition: 0.3s ease all;
}

.feedback button:hover {
    color: #00457d !important;
}

.feedback__antwort {
    text-align: center;
}

.feedback__button-wrapper {
    text-align: center;
    margin-top: 20px;
}

.bubble-chatbot a.feedback__button,
.bubble-chatbot a.feedback__button:link{
    text-decoration: none;
    color: #000;
    border: 0px;
    background: #fff;
    transition: 0.3s ease all;
}

.bubble-chatbot a.feedback__button:after {

    font-family: "FontAwesome";
    font-weight: 400;
    font-size: 1.5625rem !important;
    content: "\f105";
    margin-left: 10px;

}

.bubble-chatbot a.feedback__button:hover,
.bubble-chatbot a.feedback__button:focus {
    background: #ffed00;
    border-radius: 0px !important;
    border: 0px !important;
    /*color: #fff;*/
}



/*	==================================================
    COMPONENTS / chatbot / chatbot_feedback
==================================================*/

/*
.knot_zmselbstNEU {padding:0 !important;}
    

.knot_zmselbstNEU label {
      display: inline-block !important;
      margin-bottom: 0.5rem !important;
      font-weight: normal !important;
}

.knot_zmselbstNEU input {
        margin: 0 !important;
        font-family: inherit !important;
        font-size: inherit !important;
        line-height: inherit !important;
}

.knot_zmselbstNEU textarea { 
        width: 100%; 
        padding: 1rem; 
}

.knot_zmselbstNEU label.control-label { width: 100%;}
    
.knot_zmselbstNEU .zmeditor { font-size: 130%; }

.knot_zmselbstNEU .select2-container--bootstrap .select2-selection input {
        -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0) !important;
        box-shadow: inset 0 1px 1px rgba(0,0,0,0) !important;
        background-color: #fff !important;
        border: 0px solid #000 !important;
        border-radius: 0px !important;
        color: #000 !important;
        font-size: 14px !important;
        outline: 0 !important;
}
.knot_zmselbstNEU span.select2-container--bootstrap .select2-selection { 
        border: 1px solid #000; 
        border-radius: 0px !important; 
        -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0);
        box-shadow: inset 0 1px 1px rgba(0,0,0,0); 
}

.knot_zmselbstNEU .knot_zmselbstNEU .fisets {
        width: 50%;
}



/* Es werden zwei verschiedene Versionen Bootstrap verwendet -> Deshalb bei Aufruf des Feedback-Formular -> Alle Schriften des Layouts zu klein. Sollte bei Update behoben sein.*/ 
/*
.knot_zmselbstNEU footer.l-footer, .knot_zmselbstNEU .footer  { 
    font-size: 130%;
    margin-top: 2rem;
}

.knot_zmselbstNEU .l-footer__copyright {
    font-size: 70%;
}

.knot_zmselbstNEU .footer button {
    font-size: 100%;
}

.knot_zmselbstNEU .l-header__funktionslinks { 
    font-size: 130% !important;
}

.knot_zmselbstNEU .c-breadcrumb .breadcrumb, .knot_zmselbstNEU div.wayhome .breadcrumb { 
    font-size: 120%;
    padding: 1.75rem 0rem;
}

.knot_zmselbstNEU .l-side, .knot_zmselbstNEU .l-contentfooter nav.funcnav { display: none; }

.knot_zmselbstNEU #col_743636 {
    padding: 0;
}

.knot_zmselbstNEU .l-nav-footer  a { padding: 0; }
.knot_zmselbstNEU .l-nav-footer a:hover, .knot_zmselbstNEU .l-nav-footer a:focus {
	        text-decoration: underline !important;
            background: none !important;
}


.knot_zmselbstNEU .service ul {
	line-height: inherit;
}

*/

/* ============== Chatbot - CARD LAYOUT ============== **/



.chatbot-card {
    padding: 0px;
}

.chatbot-card__header {
    padding: 0px;
    background-color: transparent;
    border: 0;
}

.chatbot-card__title {
    margin-bottom: 20px !important;
    font-weight: bold !important;
    color: #00457c !important;
}

.chatbot-card__title .gcsxTitle {
    font-size: 1em !important;
    line-height: 1.5em !important;
    font-weight: bold !important;
}

.chatbot-card__body {
    padding: 1.25rem 0 0 0;
}

.chatbot-card__body .chatbot-intro {
    margin-bottom: 1.25rem !important;
}

.chatbot-card__body .vCard .bez {
	width: 5em !important;
}

.chatbot-card__body .mail {
	margin-top: 20px !important;
}

.chatbot-card__body .mail i, .chatbot-card__body .phone i {
	margin-right: 10px !important;
}



.chatbot-card__thema {
    background: transparent;
    padding: 20px;
    font-weight: bold;
    border-bottom: 3px solid #ccc;
    font-size: 120%;
}

.chatbot-card__selection {
    background: transparent !important;
    padding: 0 !important;
    margin: 20px 0 0 0 !important;
    color: #fff;
}

.selection__items,
.accordion__items {
    list-style: none;
    padding: 0 !important;
    margin: 0 !important;
}



.selection__item,
.accordion__item {
    border-bottom: 0px solid #ccc;
    padding: 0 !important;
    margin: 0 !important;
}

.selection__items a,
.accordion__items a {
    font-weight: normal !important;
}

.chatbot-card__selection .selection__item .btn-ortena {
    position: relative;
    background: transparent !important;
    color: #00457d !important;
    width: 100%;
    border: 0px;
    text-align: left;
    border: 4px solid rgba(60, 96, 153, 0.25) !important;
    padding: .625rem 2.125rem !important;
    margin-bottom: 10px !important;
    white-space: normal;
    /*border-radius: 1rem !important;*/
}

.chatbot-card__accordion .accordion__item .btn-ortena {
    position: relative;
    background: transparent !important;
    color: #00457d !important;
    width: 100%;
    border: 0px;
    text-align: left;
    border: 4px solid rgba(60, 96, 153, 0.25) !important;
    padding: .625rem 2.125rem !important;
    margin-bottom: 10px !important;
    /*border-radius: 1rem !important;*/
}



.chatbot-card__weitereInformationen {
    padding: 20px;
}

.chatbot-card--weitereInformatione {
    margin-top: 20px !important;
}

.card-header button {
    background: transparent !important;
    color: #00457d !important;
    white-space: normal;
}


.selection__item .btn-ortena:hover,
.selection__item .btn-ortena:focus,
.selection__item .btn-ortena:active {
    border: 0;
    background: rgba(60, 96, 153, 0.25) !important;
    text-decoration: underline !important;
}





.chatbot-card__selection .selection__item .btn-ortena:after,
.chatbot-card__accordion .accordion__item .btn-ortena:after {
    position: absolute;
    right: 15px;
    /*top: 15px;*/
    font-family: "FontAwesome";
    font-weight: 400;
    font-size: 24px;
}



.chatbot-card__selection .selection__item .btn-ortena:after {
    content: "\f105";
}

.chatbot-card__accordion .accordion__item .btn-ortena:after {
    /*content: "\f067";*/
    content: "\f105";
}

.chatbot-card__accordion .accordion__item:first-of-type {
    border-top: 0px solid #ccc;
}



/*Veranstaltungen*/
.chatbot-card__selection li.vkitem { 
    background-color: rgba(60, 96, 153, 0.25) !important;
    margin-bottom: 10px !important;
    padding: 20px !important;
}
.chatbot-card__selection li.vkitem a {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 20px;
    text-decoration: none !important;
}

.chatbot-card__selection a div.von {
    text-decoration: none;
}
.chatbot-card__selection a div.bis {
    text-decoration: none;
}

.chatbot-card__selection .bis::before {
    content: "bis  ";
}

.chatbot-card__selection li .titel {
	width: 100%;
}
.chatbot-card__selection li a .titel {
    text-decoration: underline !important;
}

.chatbot-card.chatbot-card--sbw {
    padding: 0px;
}

.chatbot__message details {
    margin-top: 0px;
}

.chatbot__message summary {
    border: 0;
    border-radius: 0px;
    background: transparent;
    color: #00457d;
    -webkit-transition: 0.3s all ease;
    -o-transition: 0.3s all ease;
    transition: 0.3s all ease;
    padding: 15px;
    margin-bottom: 20px !important;
}



/*.chatbot__message summary:after {
    font-family: "FontAwesome";
    font-weight: 400;
    font-size: 24px;
    content: "\f105";
}*/



.chatbot__message summary:hover {
    background: #ffed00 !important;
}





/* Sonstiges TEMP */
.chatbot__message h1 {
    font-size: 1.875rem !important;
    line-height: 2.1875rem !important;
    margin: 1.25rem 0 !important;
}


.chatbot__message img {
    max-width: 400px;
    height: auto;
}



.chatbot__message .odd,

.chatbot__message .even,

.rssBox .date {

    color: #fff;

    background-color: transparent !important;

}

.rssBox .title {
	font-weight: bold;
	color: #00457c;
}


.bubble {

    max-width: 70%
}

.gcsxTitle,
.osmTitle {
    font-size: medium !Important;
    font-weight: normal !important;
}


/*SSL-Ergänzungen*/
.pull-right {float: left;}
.pull-right a {margin-left: 0 !important;}
.pull-right a::before {
	content: "\e910";
    font-family: 'LRN_iconfont_set' !important;
    font-style: normal;
}
.card-body p {padding: .225rem 2.125rem !important;}

.vCard a.vCard::before {
	content: "\f007";
    font-family: 'FontAwesome' !important;
    font-style: normal;
    color: #3c6099;
    font-size: 1.875rem !important;
}
.vCard img {display: none;}

/*Loader Dots*/
@keyframes dot-keyframes {
    0% {
      opacity: .4;
      transform: scale(1, 1);
    }
  
    50% {
      opacity: 1;
      transform: scale(1.2, 1.2);
    }
  
    100% {
      opacity: .4;
      transform: scale(1, 1);
    }
  }
  
.loading-dots {
    text-align: center;
    width: 100%;
}

.loader__dot {
    animation: dot-keyframes 1.5s infinite ease-in-out;
    background-color: #00457d !important;
    border-radius: 10px;
    display: inline-block;
    height: 10px;
    width: 10px;
    margin-right: 5px !important;
}

.loader__dot:nth-child(2) {
    animation-delay: .5s;
}

.loader__dot:nth-child(3) {
    animation-delay: 1s;
}








@media only screen 
   and (max-width : 768px) {
   /* Styles here */
   .chatbot__message h1 {
        font-size: inherit !important;
        line-height: inherit !important;
        margin: inherit !important;
   }
   .vCard a.vCard::before {
       font-size: inherit !important;
   }
   .chatbot-card__selection .selection__item .btn-ortena,
   .chatbot-card__accordion .accordion__item .btn-ortena,
   .chatbot__message button.btn-ortena.oeffnungszeiten, 
   .chatbot__message button.btn-ortena.orgleistung {
       border: 2px solid rgba(60, 96, 153, 0.25) !important;
       padding: 10px !important;
   }

   .chatbot-card__selection .selection__item .btn-ortena::after, .chatbot-card__accordion .accordion__item .btn-ortena::after {
	    right: 3px;
	    top: 3px;
    }
   .bubble {
	    max-width: unset !important;
        width: 90% !important;
    }
    .chatbot__submit {
        width: 50px !important;
    }
    .feedback__buttons i::before {
        font-size: 2em !important;
    }
    .feedback {
        z-index: 2222;
        position: absolute;
        right: -45px !important;
        bottom: 15px;
    }
    .feedback__buttons li {
        margin: 0 !important;
        padding: 10px 0 0 0 !important;
    }
}

.bubble-chatbot {
   
    color: #5e5e5e!important;
    
}
.bubble-chatbot  .rss {
     color: #5e5e5e!important;
}


/*SVG Avatar*/

.st0{opacity:0.1;}
	.st1{fill:#0F4778;}
	.st2{fill:#456FAA;}
	.st3{fill:#E5E7F3;stroke:#0F4778;stroke-width:4;stroke-miterlimit:10;}
	.st4{fill:#0F4778;stroke:#0F4778;stroke-miterlimit:10;}
	.st5{fill:none;stroke:#0F4778;stroke-width:4;stroke-miterlimit:10;}
	.st6{fill:#E5E7F3;}
	.st7{fill:#FFFFFF;}
	.st8{fill:#00A5D3;}
	.st9{opacity:0.45;}
	.st10{fill:#FCEB23;}

  .hst0{clip-path:url(#SVGID_00000033339204234461085290000016682012738444120230_);}
  .hst1{opacity:0.1;}
  .hst2{fill:#0F4778;}
  .hst3{fill:#E5E7F3;}
  .hst4{opacity:0.3;fill:#0F4778;enable-background:new    ;}
  .hst5{fill:#456FAA;}
  .hst6{fill:#E5E7F3;stroke:#0F4778;stroke-width:4;stroke-miterlimit:10;}
  .hst7{fill:#0F4778;stroke:#0F4778;stroke-miterlimit:10;}
  .hst8{fill:none;stroke:#0F4778;stroke-width:4;stroke-miterlimit:10;}
  .hst9{fill:#FFFFFF;}
  .hst10{fill:#00A5D3;}
  .hst11{opacity:0.45;}
  .hst12{fill:#FCEB23;}


#eyes {
    animation: move 7s infinite ease-in-out;

    @media screen and (prefers-reduced-motion: reduce) {
      animation:none;
      opacity: 0;
    }
}

.karlo__container {
  position: fixed;
  right:20px;
  bottom:30px;
  display: block;
 z-index: 1040;
}


.karlo__container:hover .karlo {display:none;}

.karlo__container:hover .karlo--hover {display:block;}

.karlo {position: absolute;}
.karlo--hover {position: absolute;display: none;}


@keyframes move {
  4%, 100% {opacity: 0;}
  0% {opacity: 0;}
  1% {opacity: 1;}
  3% {opacity:1;}
}



.home #main .ym-col2 #content #chatbot * {
    /*line-height: 2.1875rem;*/
    line-height: 140%;
}

