/* ------------------------------------css Bonusrechner - Anfang */
#page-201 #c816{
background-image: none;
background-color: #fff;
}
#page-201 #c816 h2.hinweis,
#page-201 #c816 p.hinweis{
display: block;
margin: 0 auto 10px auto;
text-align: center;
}
#page-201 #c816 p.hinweis{
font-weight: bold;
}

#page-201 #c816 #uebonusrechner{
padding: 10px;
border-radius: 4px;
background-color:#f7f7f7;
width: 99%;
}

#page-201 #c816 #uebonusrechner21{
padding: 10px;
border-radius: 4px;
background-color:#f7f7f7;
width: 99%;
margin-top: 12px;
font-size: 100%;
}

#page-201 #c816 input{
width: 90px;
height: 42px;
border: 1px solid #ccc;
border-radius: 4px;
padding: 4px;
/* font-family: 'Gloria Hallelujah', cursive; */
color: #333;
font-size: 150%;
text-align: center;
display: block;
margin: 0 auto ;
}
#page-201 #c816 input[type=number]::-webkit-outer-spin-button,
#page-201 #c816 input[type=number]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

#page-201 #c816 input[type=number] {
    -moz-appearance:textfield;
}

/* reines Rechenfeld; unsichtbar */
#page-201 #c816 #gesamtanzahlab{
width: 0 !important;
height: 0 !important;
visibility: hidden !important;
}

#page-201 #c816 #guthaben,
#page-201 #c816 #kredite {
width: 160px;
}

#page-201 #c816 output{
border: 1px solid #ccc;
border-radius: 4px;
}

#page-201 #c816 .plus{
font-size: 200%;
color: #666;
display: block;
margin: 0 auto !important;
text-align: center;
border: none;
}
#page-201 #c816 .pfeil{
font-size: 200%;
color: #333;
display: block;
margin: 0 auto !important;
text-align: center;
border: none;
}

#page-201 #c816 .twenty{
font-size: 150%;
color: #666;
display: block;
margin: 0 auto !important;
text-align: center;
border: none;
}

#page-201 #c816 #infkredit,
#page-201 #c816 #infguthaben{
border: 0;
border-radius: 4px;
padding: 0;
margin: 0;
height: 0;
visibility: hidden;
}
/* für Safari, wo Text aus div herauslief: */
#page-201 #c816 #infkredit p,
#page-201 #c816 #infguthaben p{
display: block;
width: 96%;
}


@media (max-width: 400px){
#page-201 #c816 #infkredit p,
#page-201 #c816 #infguthaben p{
font-size: 80%;
}
}

#page-201 #c816 #iGuthaben,
#page-201 #c816 #iKredite,
#page-201 #c816 #deliKredite,
#page-201 #c816 #deliGuthaben{
display: inline-block;
vertical-align: middle;
margin: 0 0 0 3px;
margin-top: -7px !important;
padding: 2px;
width: 42px;
height: 38px;
color: #fff;
font-size: 100%;
background-color: #0066b3;
border: 1px solid #666;
display: inline-block;
text-align: center;
}
@media (max-width: 311px){
#page-201 #c816 #iGuthaben,
#page-201 #c816 #iKredite{
margin-top: 4px !important;
}
}

#page-201 #c816 .meldung{
/* default, wenn leer: */
height: 0;
visibility: hidden;

resize:none;
overflow:visible;


width: 100%;
background: transparent;
border: none;
font-size: 120%;
font-weight: normal;
color: #f37122;
display: block;
margin: 0 auto; 
text-align: center;
border: none;
}
#page-201 #c816 #meldung3{
font-size: 100%;
}

#page-201 #c816 .meldbold{
font-weight: bold;
}

#page-201 #c816 .corpdesignkontakt{
color: #333;
font-size: 90%;
}
#page-201 #c816 .corpdesignkontakt100{
color: #333;
font-size: 100%;
}


#page-201 #c816 .line,
#page-201 #c816 .empty{
width: 100%;
font-size: 120%;
padding: 10px !important;
color: #666;
overflow: hidden;
margin: 0 auto;
text-align: right;
border: none;
}
#page-201 #c816 .empty{
margin: 10px auto;
}

#page-201 #c816 .line{
border-bottom: 3px solid #666;
padding-bottom: 10px !important;
margin-top: 20px;
overflow: visible;
}

#page-201 #c816 .berechneA,
#page-201 #c816 .loescheA,
#page-201 #c816 .berechneB,
#page-201 #c816 .loescheB
{
width: 100px;
height: 34px;
margin: 0;
font-size: 80%;
vertical-align: center;
color: #000;
background-color: #0066b3;
border: 1px solid #666;
display: inline-block;
text-align: center;
overflow: hidden:
}
#page-201 #c816 .loescheA,
#page-201 #c816 .loescheB
{
background-color: #fff;
}

#page-201 #c816 .berechneA,
#page-201 #c816 .berechneB{
margin-top: -60px !important;
color: #fff;
}

#page-201 #c816 label,
#page-201 #c816 .labeltext{
display: block;
margin: 0 auto !important;
color: #333;
text-align: center;
}
#page-201 #c816 .labeltext{
font-size: 70%;
}

#page-201 #c816 .respalte2 .labnormal{
font-weight: normal !important;
}

#page-201 #c816 .row .lispalte{
background: #f7f7f7 url("https://raiba-pfaffenhofen.de/fileadmin/Raiba/Resources/Images-Raiba-Redaktion/06_Mitglieder/Bonuspunkt_transparent.png") top left no-repeat;
border-top-left-radius: 4px;
border-top-right-radius: 4px;
padding: 10px;
width: 99%;
margin: 3% 1% 2% 0;
}
#page-201 #c816 .row .lispalte2{
background-image: -webkit-linear-gradient(top, #f7f7f7 0%, white 100%); 
background-image: -moz-linear-gradient(top, #f7f7f7 0%, white 100%); 
background-image: -o-linear-gradient(#f7f7f7 0%, white 100%); 
background-image: linear-gradient(#f7f7f7 0%, white 100%);
/* moderner Farbverlauf: */
background-image: linear-gradient(to top, white 0%, #f7f7f7 100%);

padding: 10px;
width: 99%;
margin: -3% 1% 2% 0 !important;
}
#page-201 #c816 .row .respalte{
background-color: #f7f7f7;
padding: 10px;

border-radius: 4px;
width: 98%;
margin: 3% 1% 2% 1%;
}
#page-201 #c816 .row .respalte2{
background-image: -webkit-linear-gradient(top, #f7f7f7 0%, white 100%); 
background-image: -moz-linear-gradient(top, #f7f7f7 0%, white 100%); 
background-image: -o-linear-gradient(#f7f7f7 0%, white 100%); 
background-image: linear-gradient(#f7f7f7 0%, white 100%);
/* moderner Farbverlauf: */
background-image: linear-gradient(to top, white 0%, #f7f7f7 100%);
}


#page-201 #c816 .dgesA,
#page-201 #c816 .dgesB,
#page-201 #c816 .dgesAB,
#page-201 #c816 .dgesguthaben,
#page-201 #c816 .dgeskredite{
margin: 0 auto;
padding-top: 3px;
max-width: 200px;
text-align: center;
border: 1px solid #0066b3;
border-radius: 4px;
}

#page-201 #c816 .dgesguthaben,
#page-201 #c816 .dgeskredite{
max-width: 300px;
border: none;
}
#page-201 #c816 #guthaben,
#page-201 #c816 #kredite{
display: inline-block !important;
}

#page-201 #c816 .dgesAB{
border: 1px solid #f37122;
}
#page-201 #c816 .dgesABeuro{
background: #f37122;
}

#page-201 #c816 .gesA,
#page-201 #c816 .gesB,
#page-201 #c816 .gesAB{
display: inline-block;
width: 90px;
height: 42px;
margin: 5px auto !important;
padding: 4px;
background-color: #fff;
border: 1px solid #ccc;
border-radius: 4px;
color: #333;
font-size: 150%;
text-align: center;
}

#page-201 #c816 .gesABeuro{
border-color: #0066b3;
}

#page-201 #c816 .gesklasse{
font-weight: bold;
color: #333;
font-size: 150%;
}
#page-201 #c816 .geseuro{
color: #333;
font-size: 150%;
vertical-align: top;
line-height: 210%;
}
#page-201 #c816 .hinweis_sparplan{
padding-top: 10px;
font-size: 60%;
color: grey;
text-align: center;
}

/* ---------------Änderungen für BFSG Frühjahr 2025 */
input:focus-visible,
button:focus-visible {
  outline: 2px dashed #f37122 !important;
  outline-offset: 3px !important;
}
#page-201 #c816 .labeltext {
  font-size: 100%;
}

/* css Bonusrechner - Ende */
