/* Bootstrap-Aufhebungen */

.pagination>li>a {
  color: #000000;
}
div.list-pagination {
  height: 37px;
}

.pagination>li>a:hover, .pagination>li>span:hover, .pagination>li>a:focus, .pagination>li>span:focus {
    background-color: #fff;
}

.pagination li span.inactive {
  margin-left: 5px;
  margin-right: 5px;
  border: 0px solid;
  color: #DDDDDD;
}

.pagination > li > span.sr-only {
  position: absolute;
}

.btn {
	font-size: 18px;
}

.btn:focus, .btn:active:focus, .btn.active:focus, .btn.focus, .btn:active.focus, .btn.active.focus {
    outline: 0px auto -webkit-focus-ring-color; 
}

.label {
  color: #000000;
  padding: 0;
  font-size: 100%;
  font-weight: 400;
  text-align: left;
}

.open>.dropdown-menu {
    display: none;
}

label {
    font-weight: inherit;
}

.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
  position: relative;
    padding-right: 20px;
    padding-left: 20px;
}

/* Ende Bootstrap-Aufhebungen */



.header-palette {
  /*display: none !important;*/
}

.kw-palette {
  display: block !important;
}

.area-header .header-palette .palette-option>a .fa-user.loggedIn {
	color: #00ba7d;
    text-shadow: none;
}


.btn span.details,
a.btn {
  font-size: 18px;
}

.seiteblaettern a, .seiteblaettern span {
    display: inline-block;
    position: relative;
    background-color: #fff;
    border: none;
    margin-left: 5px;
    margin-right: 5px;
    color: #000;
    text-align: center;
    text-decoration: none;
    padding: 5px 12px;
    line-height: 1.5;
    min-width: calc(2.7rem + 10px);
    font-size: 1.8rem;
    color: #007dba;
}

.seiteblaettern span, .seiteblaettern a:hover {
  display: inline-block;
  color: #fff;
  background-color: #000;
  border-color: #000;
}

li.seiten {
   margin-bottom: -5px;
}

.open-close > a:after {
    transform: rotate(0deg) translate(0, 0) !important;
}

.btn.kwwidth {
   font-size: 16px;
}


@media (max-width: 1114px) and (min-width: 764px){
.btn.kwwidth {
   min-width: 240px;
}
}

.area-header .header-palette .palette-option.palette-basket {
    display: block !important;
}

.styled-form .input input[type="radio"] {
    width: auto !important;
    -webkit-appearance: radio;
    -moz-appearance: radio;
    appearance: radio;
    margin-top: 7px;
}

.styled-form label {
    display: inline-block;
}

.addweiteren {
    border-radius: 50%; 
    background-color: #007DBA;
    color: #FFFFFF;
    padding: 5px;
    border: 0px solid #FFFFFF;
    height: 45px;
    width: 45px;
    min-width: 45px;
}

.error, .alert  {
	font-weight: 400;
}

.error ul {
    margin: 0;
    padding: 0;
}

.error li {
    list-style-type: none;;
}

.warnungpflichtfelder, .wbl_status.wbl_error {
	color: inherit;
}

.ls-bullets.custom-icon.blackItem li.fa-angle-right::before {
	color: #000000;
	border-color: #000000;
}

.kw-meine-kurse .collapse.in {
    display: block !important;
}

.topmargin {
  margin-top: 80px;
}

.eingabeWeiterer .form-control, .eingabeWeiterer .checkbox i, .seingabeWeiterer .icon-append, .eingabeWeiterer .icon-prepend, .eingabeWeiterer .input input, .eingabeWeiterer .radio i, .eingabeWeiterer .select select, .eingabeWeiterer .textarea textarea {
    border-color: #444;
}

.styled-form .checkbox input, .styled-form .radio input {
    position: relative;
    left: auto;
}

.input.col-md-1, .input.col-md-2, .input.col-md-3, .input.col-md-4, .input.col-md-5,
.input.col-md-6, .input.col-md-7, .input.col-md-8, .input.col-md-9, .input.col-md-10,
.input.col-md-11, .input.col-md-12,
.input.col-xs-1, .input.col-xs-2, .input.col-xs-3, .input.col-xs-4, .input.col-xs-5,
.input.col-xs-6, .input.col-xs-7, .input.col-xs-8, .input.col-xs-9, .input.col-xs-10,
.input.col-xs-11, .input.col-xs-12{
    padding-right: 10px;
    padding-left: 10px;
  
}

label.validierung, label.pflicht {
    color: #dc5563;
}

@media (max-width: 1013.98px) {
.ext-event-wrapper .ext-event-item-wrapper .btn-add {
    padding-left: 10px;
  }
}

.hauptseite_status, .kurs-titel {
  color: #000000 !important;
}

/*Anpassungen Farbschema*/

/*GrÃ¼n:
https://programm.bildungswerk-ev.de/bildungsforum-kreis-mettmann/webbasys/
https://programm.bildungswerk-ev.de/bildungsforum-leverkusen/webbasys/
https://programm.bildungswerk-ev.de/bildungsforum-rhein-erft/webbasys/index.php
*/
div.theme_bildungsforum-kreis-mettmann .btn.color-blue,
div.theme_bildungsforum-leverkusen .btn.color-blue,
div.theme_bildungsforum-rhein-erft .btn.color-blue {
  background-color: #43b02a;
}

div.theme_bildungsforum-kreis-mettmann span.statusmeldung,
div.theme_bildungsforum-leverkusen span.statusmeldung,
div.theme_bildungsforum-rhein-erft span.statusmeldung {
  color: #43b02a;
}

/*Dunkelblau:
https://programm.bildungswerk-ev.de/bw-erzdioezese-koeln-ev/webbasys/index.php
https://programm.bildungswerk-ev.de/mitarbeiterfortbildung/webbasys/*/

div.theme_bw-erzdioezese-koeln-ev .btn.color-blue,
div.theme_mitarbeiterfortbildung .btn.color-blue {
  background-color: #002f5f;
}

div.theme_bw-erzdioezese-koeln-ev span.statusmeldung,
div.theme_mitarbeiterfortbildung span.statusmeldung {
  color: #002f5f;
}

/*Orange:
https://programm.bildungswerk-ev.de/fbs-bergisch-gladbach/webbasys/index.php
https://programm.bildungswerk-ev.de/fbs-bonn/webbasys/index.php
https://programm.bildungswerk-ev.de/fbs-euskirchen/webbasys/index.php
https://programm.bildungswerk-ev.de/fbs-wipperfuerth/webbasys/index.php
https://programm.bildungswerk-ev.de/fbs-wuppertal/webbasys/index.php
https://programm.bildungswerk-ev.de/fbw-rhein-sieg-kreis/webbasys/index.php*/

div.theme_fbs-bergisch-gladbach .btn.color-blue,
div.theme_fbs-bonn .btn.color-blue,
div.theme_fbs-euskirchen .btn.color-blue,
div.theme_fbs-wipperfuerth .btn.color-blue,
div.theme_fbs-wuppertal .btn.color-blue,
div.theme_fbw-rhein-sieg-kreis .btn.color-blue {
  background-color: #ea7600;
}

div.theme_fbs-bergisch-gladbach span.statusmeldung,
div.theme_fbs-bonn span.statusmeldung,
div.theme_fbs-euskirchen span.statusmeldung,
div.theme_fbs-wipperfuerth span.statusmeldung,
div.theme_fbs-wuppertal span.statusmeldung,
div.theme_fbw-rhein-sieg-kreis span.statusmeldung {
  color: #ea7600;
}

/*Graublau
https://programm.familienbildung-koeln.de/webbasys/*/


div.theme_familienbildung-koeln.de .btn.color-blue {
  background-color: #1f4e79;
}

div.theme_familienbildung-koeln.de span.statusmeldung {
  color: #1f4e79;
}





/* frühere common.css */

.area-header .header-palette .palette-option.palette-basket
{
    display : none;
}

.container
{
    /*background-color : #DDDDDD;*/
}

.blue-header
{
    background-color : #007DBA;
    color            : #FFFFFF;
    padding-left     : 16px;
    padding-top      : 16px;
    padding-bottom   : 14px;
}

.blue-header > .main-line
{
    font-size      : 20pt;
    text-transform : uppercase;
}

.blue-header > .sub-line
{
    font-size : 14pt;
}

.input input
{
    width : 100%;
}

.white-box
{
    padding-left     : 15px;
    padding-right    : 15px;
    padding-top      : 15px;
    padding-bottom   : 15px;
    background-color : #FFFFFF;
}

.formrow.kennwort
{
    margin-top : 27px;
}

.formrow.button
{
    margin-top : 22px;
}

.formrow.vergessen
{
    margin-top     : 19px;
    padding-bottom : 114px;
}

.gast
{
    margin-top : 19px;
}

.link.registrieren
{
    margin-top : 25px;
}

.link.gast
{
    margin-top    : 19px;
    margin-bottom : 19px;
}

.white-box.sicherheit
{
    margin-top     : 30px;
    margin-left    : 20px;
    margin-right   : 20px;
    padding-bottom : 1px;
}

.formrow.pegasus
{
    margin-top : 19px;
}

.anrede.firma,
.anrede.herr,
.anrede.frau
{
    margin-right : 30px;
}

.anrede.divers
{
    margin-right : 0px;
}

input.plz
{
    width        : 6em !important;
    margin-right : 15px;
}

input.ort
{
    width : calc(100% - 6em - 15px) !important;
}

input.vorwahl,
input.nummer
{
    float : left;
}

input.vorwahl
{
    width        : 10em !important;
    margin-right : 15px;
}

input.nummer
{
    width : calc(100% - 10em - 15px) !important;
}

input.geb-tag,
input.geb-monat,
input.geb-jahr
{
    width : 6em !important;
}

input.geb-tag,
input.geb-monat
{
    margin-right : 15px;
}

.white-box.headline
{
    padding-bottom : 0px;
}

.headline
{
    font-size : 17pt;
}

.headline-small
{
    font-size      : 16pt;
    padding-left   : 20px;
    padding-top    : 20px;
    text-transform : uppercase;
}

.text.headline
{
    font-size      : 20pt;
    text-transform : uppercase;
    font-weight    : 400;
}

.info .text.headline
{
    text-transform : none;
}

.benutzer,
.kontaktdaten,
.kontodaten,
.kind,
.person
{
    margin-bottom : 30px;
}

.pegasus-contet form
{
    background-color : transparent;
    /*background-color : #444444;*/
}

#registrirung label.label
{
    display        : inline-block !important;
    vertical-align : bottom;
    line-height    : 1 !important;
    margin-bottom  : 0px;
}

.pegasus-contet
{
    background-color : transparent !important;
}

#anmelden
{
    padding-bottom : 68px;
}

div.message > div.text > p,
div.error > div.text > p,
div.warning > div.text > p
{
    display        : inline-block;
    vertical-align : middle;
    margin-bottom  : 0px;
}

.portal div.message,
.portal div.error,
.portal div.warning,
.open-close
{
    margin-right : 20px;
    margin-left  : 20px;
}

.open-close
{
    opacity    : 1;
    transition : opacity 1s;
    width      : 100%;
}

.open-close.hide
{
    opacity : 0;
}

.open-close > a:after
{
    position    : relative;
    float       : right;
    display     : inline-block;
    font-family : FontAwesome;
    font-weight : 400;
    font-size   : 1.8rem;
    line-height : 1.2;
    content     : "\f078";
    right       : 20px;
    transform   : rotate(-180deg) translate(0, 0);
    transition  : transform .33s;
}

.open-close > a.active:after
{
    transform : rotate(0deg) translate(0, 0);
}

div.message.validation,
div.error.validation,
div.warning.validation
{
    margin-bottom  : 0px;
    margin-top     : 10px;
    padding-top    : 10px;
    padding-bottom : 10px;
    display        : inline-block;
    width          : 100%;
}

div.message,
div.error,
div.warning
{
    border        : 1px solid transparent;
    border-radius : .25rem;
    /*line-height   : 1;*/
    padding       : 20px;
    margin-bottom : 20px;
}

div.message
{
    color            : #155724;
    background-color : #D4EDDA;
    border-color     : #C3E6CB;
}

div.error
{
    color            : #721C24;
    background-color : #F8D7DA;
    border-color     : #F5C6CB;
}

div.warning
{
    color            : #856404;
    background-color : #FFF3CD;
    border-color     : #FFEEBA;
}

.element.pegasus-contet.type-flexible
{
    padding-left     : 0px;
    padding-right    : 0px;
    background-color : transparent;
}

.profile.header
{
    margin-bottom : 28px;
}

.profile.header > .white-box
{
    padding : 0px !important;
}

.profile.header-part
{
    text-align     : center;
    padding-left   : 0px;
    padding-right  : 0px;
    padding-top    : 20px;
    padding-bottom : 20px;
    margin         : 0px;
    font-weight    : 400;
}

.profile.header-part.selected
{
    background-color : #007DBA;
}

.profile.header-part.selected a
{
    color : #FFFFFF;
}

div.infobox
{
    padding-left  : 15px;
    padding-right : 15px;
}

.navigation .white-box
{
    height : 320px;
}

.navigation .link
{
    position : absolute;
    bottom   : 15px;
}

.grey-box
{
    background-color : #E7E7E7;
}

.grey-box > .kurs
{
    background-color : #FFFFFF;
    margin-left      : 73px;
    padding-left     : 23px;
    padding-top      : 10px;
    padding-bottom   : 20px;
    padding-right    : 20px;
}

.gruppen-head
{
    border-bottom : solid #000000 2px;
}

.kurs.headline
{
    margin-bottom : 0px;
}

.kurs.headline > p
{
    margin-bottom : 10px;
}

.kurs-titel
{
    color : #007DBC;
}

#merkzettel .input
{
    padding-left : 0px;
}

.zeitraum,
.head-datum
{
    font-weight : 700;
}

.zeitraum
{
    margin-top    : 20px;
    margin-bottom : 40px;
}

.gruppen-head,
.sub-line
{
    font-size : 14pt;
}

.einzel-kurs .detail > .link
{
    margin  : auto;
    width   : 208px;
    padding : 10px;
}

.einzel-kurs .formrow.pegasus
{
    margin-top : 10px;
}

.navigation > div:first-child
{
    padding-left  : 0px;
    padding-right : 40px;
}

.navigation > div:last-child
{
    padding-right : 0px;
    padding-left  : 40px;
}

.merkzettel label.checkbox > i
{
    top              : 22px !important;
    left             : 22px !important;
    width            : 30px !important;
    height           : 30px !important;
    border-style     : solid !important;
    border-color     : #007DBA !important;
    border-width     : 3px !important;
    background-color : transparent !important;
}

.merkzettel label.checkbox > i:after
{
    top  : 0px !important;
    left : -1px !important;
}

.kurs-anmelden
{
    padding-top : 40px;
}

.kurs-anmelden > .color-blue
{
    border-style : none;
}

.anmeldung-header
{
    text-align : center;
}

.anmeldung-header p
{
    margin-bottom : 0;
}

.white-box.anmeldung-header
{
    padding       : 0;
    margin-bottom : 20px;
}

.anmeldung-header .head-element
{
    padding : 15px;
}

.anmeldung-header .head-element.active
{
    background-color : #007DBA;
    color            : #FFFFFF;
}

.auswahl-line
{
    height        : 40px;
    border-bottom : solid #000000 1px;
}

.auswahl-line-bold
{
    height        : 40px;
    border-bottom : solid #000000 2px;
}

.auswahl-line-dotted
{
    border-bottom : dotted #000000 1px;
}

.kurs-teilnehmer
{
    /*height : 6em;*/
}

.text-teilnehmer,
.kurs-kosten
{
    font-weight : 700;
}

.kurs-kosten .kosten-info
{
    display       : inline-block;
    color         : #FF0000;
    font-size     : 0.8em;
    margin-left   : 10px;
    margin-bottom : 0;
}

.gesamt-kosten
{
    margin-top     : 40px;
    padding-bottom : 40px;
    color          : #007DBA;
    font-weight    : 700;
}

.gesamt-kosten .anmeldung-buttons
{
    padding-top : 40px;
}

.anmeldung-teilnehmer .text-pflichtfeld > p
{
    margin-bottom : 0;
}

.anmeldung-teilnehmer .pflichtfeld
{
    padding-bottom : 0;
}

.anmeldung-teilnehmer .copy
{
    padding-top : 0;
}

.anmeldung-teilnehmer .kind .copy
{
    padding-top    : 15px;
    padding-bottom : 0;
}

.uebersicht-kurs
{
    margin-bottom : 40px;
}

.pe-bold
{
    font-weight : 700;
}

.uebersicht-kontodaten
{
    margin-top    : 40px;
    margin-bottom : 40px;
}

.expand-head
{
    width : -moz-calc(100% - 30px);
    width : -webkit-calc(100% - 30px);
    width : -o-calc(100% - 30px);
    width : calc(100% - 30px);
}

.del-box
{
    width : 30px;
}

.delete-kurs
{
    float : right;
}

.anmeldung-kurs-teilnehmer,
.anmeldung-kurs,
.anmeldung-uebersicht-kurs
{
    margin-bottom : 40px;
}

#ext-kto-iban
{
    text-transform : uppercase;
}

meter
{
    /* Reset the default appearance */
    /*-webkit-appearance: none;*/
    /*-moz-appearance: none;*/
    /*appearance: none;*/
    margin           : 0 auto 1em;
    /*position: absolute;*/
    /*top : 2.5em;*/
    /*margin-left: 0;*/
    /*margin-right: 0;*/
    /*margin-top: 0;*/
    /*margin-bottom: 0;*/
    width            : 100%;
    height           : .5em;

    /* Applicable only to Firefox */
    background       : none;
    background-color : rgba(0, 0, 0, 0.1);
}

meter::-webkit-meter-bar
{
    background       : none;
    background-color : rgba(0, 0, 0, 0.1);
}

#password-strength-text
{
    margin-bottom : 0;
}

meter[value="1"]::-webkit-meter-optimum-value
{ background : red; }

meter[value="2"]::-webkit-meter-optimum-value
{ background : yellow; }

meter[value="3"]::-webkit-meter-optimum-value
{ background : orange; }

meter[value="4"]::-webkit-meter-optimum-value
{ background : green; }

meter[value="1"]::-moz-meter-bar
{ background : red; }

meter[value="2"]::-moz-meter-bar
{ background : yellow; }

meter[value="3"]::-moz-meter-bar
{ background : orange; }

meter[value="4"]::-moz-meter-bar
{ background : green; }

#zaehler
{
    position : absolute;
    right    : 27px;
    top      : 8px;
}

.pe-tooltip
{
    position : absolute;
    right    : 30px;
    top      : 13px;
    color    : #E0E0E0 !important;
}

.pe-tooltip > .pe-tooltiptext
{
    font-family      : Max, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
    visibility       : hidden;
    width            : 200px;
    background-color : rgba(200, 200, 200, 0.5);
    color            : #000000 !important;
    margin-top       : 5px;
    margin-left      : 10px;
    padding          : 5px 10px;
    border-radius    : 0px;
    position         : absolute;
    z-index          : 1;
}

.pe-tooltip:hover > .pe-tooltiptext
{
    visibility : visible;
}

.row-12
{
    display : block;
}

.pe-switch
{
    position : relative;
    display  : inline-block;
    width    : 60px;
    height   : 34px;
}

.pe-switch input
{
    opacity : 0;
    width   : 0;
    height  : 0;
}

.pe-slider
{
    position           : absolute;
    cursor             : pointer;
    top                : 0;
    left               : 0;
    right              : 0;
    bottom             : 0;
    background-color   : #CCCCCC;
    -webkit-transition : .4s;
    transition         : .4s;
}

.pe-slider:before
{
    position           : absolute;
    content            : "";
    height             : 26px;
    width              : 26px;
    left               : 4px;
    bottom             : 4px;
    background-color   : white;
    -webkit-transition : .4s;
    transition         : .4s;
}

input:checked + .pe-slider
{
    background-color : #2196F3;
}

input:focus + .pe-slider
{
    box-shadow : 0 0 1px #2196F3;
}

input:checked + .pe-slider:before
{
    -webkit-transform : translateX(26px);
    -ms-transform     : translateX(26px);
    transform         : translateX(26px);
}

.pe-slider.pe-round
{
    border-radius : 34px;
}

.pe-slider.pe-round:before
{
    border-radius : 50%;
}

.pe-switch-text
{
    margin-top  : 3px;
    margin-left : 10px;
}

#info-ansprechpartner
{
    margin-top : 20px;
}

.fa-plus-circle::before
{
    margin-right   : 10px;
    vertical-align : inherit;
    color          : #007DBA;
    font-size      : 30pt;
}

.fa-plus-circle
{
    vertical-align : sub;
    font-family    : FontAwesome, Max, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
}

.kinderbox
{
    padding-left  : 2em;
    margin-bottom : 10px;
}

@media (max-width : 763px)
{
    .navigation > div:first-child,
    .navigation > div:last-child,
    .navigation > div
    {
        padding-right : 20px;
        padding-left  : 20px;
        margin-bottom : 20px;
    }

    #anmelden .white-box
    {
        padding-bottom : 0px;
    }

    .btn
    {
        min-width : 200px;
    }

    .copy-link
    {
        margin-left  : 0px;
        padding-left : 0px;
    }
}

@media (max-width : 1114px) and (min-width : 764px)
{
    .navigation > div:first-child
    {
        padding-right : 5px;
        padding-left  : 0px;
    }

    .navigation > div:last-child
    {
        padding-right : 0px;
        padding-left  : 5px;
    }

    .navigation > div
    {
        padding-right : 5px;
        padding-left  : 5px;
    }

    .btn
    {
        min-width : 200px;
    }

    #anmelden .white-box
    {
        padding-bottom : 112px;
    }
}

@media (max-width : 1200px) and (min-width : 1115px)
{
    #anmelden .white-box
    {
        padding-bottom : 68px;
    }
}

.donut
{
    text-align : center;
    margin     : 0px;
}
circle
{
    fill : none;
}

.circle-back
{
    stroke       : #F2F2F2;
    stroke-width : 10px;
}

.circle-front
{
    transform                 : rotate(270deg);
    stroke                    : #4BAF75;
    stroke-width              : 10px;

    /* 2 * Math.PI * radius + 1  */
    stroke-dasharray          : 126px;
    stroke-dashoffset         : 126px;
    animation                 : loading 2.25s ease;
    animation-iteration-count : infinite;
}

@keyframes loading
{
    50%
    {
        stroke-dashoffset : 0;
    }
    100%
    {
        stroke-dashoffset : -126px;
    }
}


