/* Kundenspezifische Änderungen an Farbe und Design */

:root {
    --primary: #327578;
    /* alt #327578; */
}

/* bs dropdown */
/*
.dropdown-item.active, .dropdown-item:active {
    color: #fff;
    text-decoration: none;
    background-color: #327578;
}
*/





/* Seitenbreite */
@media (min-width: 200px) and (max-width: 576px) {
    body { font-size: 1rem; font-weight: 400;}
    .page {/* width: calc(100vw);*/ font-size: 1rem; font-weight: 400;}
}

@media (min-width: 576px) and (max-width: 768px) {
    body { font-size: 1rem; font-weight: 400;}
    .page { /*width: calc(100vw);*/ font-size: 1rem; font-weight: 400;}
}
@media (min-width: 768px) and (max-width: 992px) {
    body { font-size: 1rem; font-weight: 400;}
    .page { /*width: calc(100vw);*/ font-size: 1rem; font-weight: 400;}
}
@media (min-width: 992px)  {
    body { font-size: 1rem; font-weight: 400;}
    .page {width: auto;font-size: 1rem;font-weight: 400;}
}



/* Anmeldung Benachrichtung Check */

.w100 { width: 100%;}
.w100 p { width: 100%; margin-top: .25rem; margin-bottom: .25rem; padding-top: .25rem; padding-bottom: .25rem;}
.w100 btn-secondary { border: none;}
.w100 btn-danger { border: none;}

/* Anmelden Knopf */
.footer.container .col-weiter input {
        width: 10rem;
        float: right;
        color: white;
        background: #327578;
}
@media (max-width:768px) {
    .footer.container .col-weiter input {
        width: 100%;
        color: white;
        background: #327578;
    }
}

.container input {
    color: #1155cc; font-weight: 600;
    color: #327578;
}

.container textarea {
    color: #1155cc; font-weight: 600;
    color: #327578;
    
}

/* Größe der Eingabefelder */

input {
    border-radius: 6px;
    height: 2.8em;
    padding-left: 1em;
/*    width: 388px;*/
    border: none;
    /* border-bottom: 1px solid silver; */
    outline: none;
}


.btn-light {
    color: #1155cc;   
    color: #327578;
}

/* Link Farbe */
a {
    color: blue; font-weight: 600;
    color: #327578;
    text-decoration: none;
    background-color: transparent;
}

/* bootstrap-select wenn nichts ausgewählt ist */
.bootstrap-select>.dropdown-toggle.bs-placeholder, .bootstrap-select>.dropdown-toggle.bs-placeholder:active, .bootstrap-select>.dropdown-toggle.bs-placeholder:focus, .bootstrap-select>.dropdown-toggle.bs-placeholder:hover {
    color: #1155cc;   
    color: #327578;
}

/* Beschreobung links, fett oder nicht */
@media (max-width:768px) {
    .container .desc_left {    font-weight: 600; }
}
@media (min-width:768px) {
    .container .desc_left {font-weight: 400;margin-right:  80px;}
}

@media (min-width:768px) and (max-width: 992px) {
    .container .desc_left  { width: 200px; }
    .container .data_right { width: calc( 700px - 200px - 80px); }
    /* #2022-03-15  Gütersloh */
    .container .data_right { width: calc( 700px - 200px - 0px); }
    .container .desc_left {margin-right:  80px;}

}



/* Format der Placeholder */
input:focus::-webkit-input-placeholder { color: #999; font-weight: 400;text-align: right; }
input:focus:-moz-placeholder {  color: #999; font-weight: 400;text-align: right;}
input:focus::-moz-placeholder { color: #999; font-weight: 400;text-align: right; }
input:focus:-ms-input-placeholder { color:#999; font-weight: 400; text-align: right; }

input::-webkit-input-placeholder { color: #1155cc; font-weight: 400;color: #999; }
input:-moz-placeholder {  color: #1155cc; font-weight: 400;color: #999;}
input::-moz-placeholder {  color: #1155cc; font-weight: 400;color: #999;}
input:-ms-input-placeholder {  color: #1155cc; font-weight: 400;color: #999;}

input:focus::-webkit-input-placeholder { font-style: italic; }
input:focus:-moz-placeholder {  font-style: italic; }
input:focus::-moz-placeholder { font-style: italic; }
input:focus:-ms-input-placeholder { font-style: italic; }

input::-webkit-input-placeholder { font-style: italic; }
input:-moz-placeholder {  font-style: italic; }
input::-moz-placeholder {  font-style: italic; }
input:-ms-input-placeholder {  font-style: italic; }

/* textarea */
textarea::-webkit-input-placeholder { color: #999; font-weight: 100;font-style: italic; }
textarea::-moz-placeholder {  color: #999; font-weight: 100;font-style: italic;}
textarea::-moz-placeholder {  color: #999; font-weight: 100;font-style: italic;}
textarea::-ms-input-placeholder {  color: #999; font-weight: 100;font-style: italic;}


/* checkboxen */
.checkAccept {display: flex;flex-direction: row;align-items: center;border: 0px solid orangered;}
.checkAccept .col-check {min-width: 2rem;border: 0px solid red;}
.checkAccept .col-text { width: auto; border: 0px solid red; padding-left: .5rem; padding-right: 1rem; } 
.checkAccept .col-sign { width: 2rem; border: 0px solid red; }

.checkAccept .col-text a { /*padding-left: .5rem; padding-right: .5rem;*/ }

/* check bei mobil besser sichtbar machen */
@media (max-width: 1992px) {
  .checkAccept  { 
  padding-top: .85rem;
  padding-bottom: .85rem;
  min-width: 2rem; 
  border: 0px solid red; 
  
  }
  .checkAccept .col-check  {
  padding-left: .5rem;
  padding-right: .5rem;
  min-width: 3rem;
  top: 0;
  }
}


/* Pfeile an die Informationsboxen */
.arrow-up {
  width: 0;
  height: 0;
  margin-left: .5rem;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-bottom: 8px solid red;
  margin-top: -8px;
 
}
/* Pfeile aus */
/*.arrow-up {  display: none; }*/
.error { /*border-radius: 4px;*/}

/* Farbliches Feld bei Fehler */
.container .fielderror {
    color: #327578;
    background-color: rgba(190,10,10,.1);
    /*background-color: rgba(10,10,100,.1);*/
    border-color: #f8f9fa;
}


.arrow-down {
  width: 0; 
  height: 0; 
  border-left: 40px solid transparent;
  border-right: 40px solid transparent;
  
  border-top: 40px solid #f00;
}

.arrow-right {
  width: 0; 
  height: 0; 
  border-top: 60px solid transparent;
  border-bottom: 60px solid transparent;
  
  border-left: 60px solid green;
}

.arrow-left {
  width: 0; 
  height: 0; 
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent; 
  
  border-right:10px solid blue; 
}


.alert-info .col-text {
    margin-top: .25rem;
    margin-bottom: .25rem;
    /*border-bottom: 1px solid silver;*/
}
.alert-info .checkAccept {
/*    margin-top: .25rem;
    margin-bottom: .25rem;*/
    /*border-bottom: 1px solid silver;*/
}



/* FEHLER VArIANTE 2 */
/*
@media (min-width: 1200px) {
    .arrow-up { background-color: rgba(250,250,250,.9);;}
    .container .error {
    color: rgb(255, 30, 30);
    display: inline-block;
    background: rgba(250,250,250,.9);
    color: black;
    padding: .25rem;
    padding-right: 1rem;
    padding-left: 1rem;
    right: 245px;
    font-size: 1rem;
    font-variant: all-small-caps;
    border: 1px solid #ddd;
}
}
*/


/* #2021-09-29 Anpassung der Dropdowns in der breite */

.bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn) {
    min-width: 160px;
    width: auto;
    max-width: 100%;
}
.dropdown-toggle .filter-option {
    padding-right: 1rem;
    
}