body{

}

.btn-pill{
 background-color:#00779f !important;
 color:white !important;
}
.show{
  display:block !important;
}
.btn{
  background-color:#00b1eb;
  color:white;
  border-radius:0px;
}
.btn:hover,.btn:active{
  background-color:#00b1eb;
  color:white;
}

.card-active{
	background-color: #00b1eb;
}

input[type=text],input[type=email],input[type=number],input[type=password], select {
 border-radius:0px !important;
}
.shopcontainer{
	padding: 32px;
    margin-bottom: 32px;
}

* {
  box-sizing:border-box;
  padding:0;
  margin:0;
   outline: 0;
}

.ui-datepicker-calendar thead{
	color:white;
}

/* .ui-state-default{
	border:none !important;
	background-color:white !important;
	color:#006eb7 !important;
}
.ui-state-default:hover{
	border:none !important;
	background-color:white !important;
	color:#76b82a !important;
} */

.ui-widget-header .ui-icon {
	background-image: url(../images/ui-icons-blue.png) !important;
}
article {
  width:100%;
  max-width:1000px;
  margin:0 auto;
  height:1000px;
  position:relative;
}
ul {
  display:flex;
  top:0px;
  z-index:10;
  padding-bottom:14px;
}
li {
  list-style:none;
}

li.active button {
  background:#ededed;
  color:#000;
}
.pricing_table { border-collapse:collapse; table-layout:fixed; width:100%; background-color:#71bf44; color:white;font-weight:700;}
th { background:#ededed; display:none; }
.pricing_td, th {
  height:53px
}
.pricing_td,th { border:1px solid #DDD; padding:10px; empty-cells:show; }
.pricing_td,th {
  text-align:left;
}
.pricing_td+.pricing_td, th+th {
  text-align:center;
  display:none;
}
.pricing_td.default {
  display:table-cell;
}
.bg-purple {
  border-top:3px solid #71bf44;
}
.bg-blue {
  border-top:3px solid #ededed;
}
.sep {
  background:#F5F5F5;
  font-weight:bold;
}
.txt-l { font-size:28px; font-weight:bold; }
.txt-top { position:relative; top:-9px; left:-2px; }
.tick { font-size:18px; color:#ffffff; }
.hide {
  border:0;
  background:none;
}

@media (min-width: 640px) {
  ul {
    display:none;
  }
  .pricing_td,th {
    display:table-cell !important;
  }
  .pricing_td,th {
    width: 330px;
  
  }
  .pricing_td+.pricing_td, th+th {
    width: auto;
  }
  
}

.formular{
	padding:32px;
	margin-bottom:32px;
}



/*helper */
.csc-firstHeader{
	color:#76b729;
}

.form-control{
 margin:5px 0;
}
.piblink a{
	color:white;
}

.form-style-2{
    max-width: 700px;
    padding: 20px 12px 10px 20px;
    --font: 13px Arial, Helvetica, sans-serif;
}
.form-style-2-heading{
    font-weight: bold;
    font-style: italic;
    border-bottom: 2px solid #ddd;
    margin-bottom: 20px;
    font-size: 25px;
    padding-bottom: 3px;
}
.form-style-2 label{
    display: block;
    margin: 0px 0px 15px 0px;
}
.form-style-2 label > span{
    width: 150px;
    font-weight: bold;
    float: left;
    padding-top: 8px;
    padding-right: 5px;
}
.form-style-2 span.required{
    color:red;
}
.form-style-2 .tel-number-field{
    width: 40px;
    text-align: center;
}
.form-style-2 input.input-field, .form-style-2 .select-field{

}
.form-style-2 input.input-field, 
.form-style-2 .tel-number-field, 
.form-style-2 .textarea-field, 
 .form-style-2 .select-field{
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    border: 1px solid #C2C2C2;
    box-shadow: 1px 1px 4px #EBEBEB;
    -moz-box-shadow: 1px 1px 4px #EBEBEB;
    -webkit-box-shadow: 1px 1px 4px #EBEBEB;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    padding: 7px;
    outline: none;
}
.form-style-2 .input-field:focus, 
.form-style-2 .tel-number-field:focus, 
.form-style-2 .textarea-field:focus,  
.form-style-2 .select-field:focus{
    border: 1px solid #0C0;
}
.form-style-2 .textarea-field{
    height:100px;
    width: 55%;
}
.form-style-2 input[type=submit],
.form-style-2 input[type=button]{
    border: none;
    padding: 8px 15px 8px 15px;
    background: #71bf44;
    color: #fff;
    box-shadow: 1px 1px 4px #DADADA;
    -moz-box-shadow: 1px 1px 4px #DADADA;
    -webkit-box-shadow: 1px 1px 4px #DADADA;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
}
.form-style-2 input[type=submit]:hover,
.form-style-2 input[type=button]:hover{
    background: #ededed;
    color: #fff;
}

.noshow{
	display:none;
}

.weiterbutton{
	width:100px;
	height:45px;
	padding:13px 0 0 20px;
	font-size:1.2em;
	background-color:#ededed;
	color:white;
	border-radius:5px;
	float:left;
}
.weiterbutton:hover{
	background-color:white;
	color:#ededed;
	border-radius:5px;
	cursor: pointer;

}

.form_failure{
	border:#ededed 3px solid !important;
}

.fehlermeldung{
	color:#ededed;
	font-weight:700;
}

.summary_rahmen{
	border:1px solid #ededed;
	border-radius:15px;
	padding:20px;
	margin:20px;
}

.sticky{
    position: sticky;
    top: 25px;
}

.btn-check{
	height:25px;
	padding-top:3px;
	background-color:#ededed;
	color:black;
	font: bold 14px Arial;
}

.btn-checked{
	height:25px;
	padding-top:3px;
	background-color:#ededed;
	color:white;
	font: bold 14px Arial;
}

.active{
	height:25px;
	padding-top:3px;
	background-color:#00b1eb;
	color:white;
	font: bold 14px Arial;
}

.header-check{
 color:#00b1eb;
}

.ui-datepicker-week-end{
	width:auto;
	height:25px;
}

.ui-datepicker-month,.ui-datepicker-year{
	height:30px;
}

.hint{
	padding-left:15px;
	color:#00b1eb;
	font-weight:700;
}

.tarifattribut{
	display:block;
}

.nextArrowBtn{
    display: inline;
    position: absolute;
    top: 450px;
    right: -25px;
	z-index:101;
	width:40px;
	height:25px;
}
.prevArrowBtn{
    display: inline;
    position: absolute;
    top: 450px;
    left: -25px;
	z-index:100;
	width:40px;
	height:25px;
}

.rn-card-header{
--	background-color:#76b729;
}

.tarifname-header{
	color:#00b1eb;
	font-weight:700;
	font-size:1.8rem;
}

.pipLinkCard{
  color:#00b1eb;
}
.pipLinkCard:hover,.pipLinkCard:active{
  color:#00779f ;
}
.card-content{
	margin-left:15px;
	margin-right:15px;
}

.result-content{
	margin-left: 25px;
    margin-bottom: 25px;
}

small{
	font-size:90%;
}
.footerlink{
    font-size: 0.8em;
    color: #c8c8c8;
    text-shadow: 1px 1px 1px #212121;
}

.label-contianer{
 display:​ table;
}

.text-label{
		text-align:right;
  padding-top: 18px;
}

@media (max-width: 665px) {
	.text-label{
  		text-align:left;
	}
}

<style>
/* This is the default state */
.custom-radio .custom-control-label::before {
    background-color: #00b1eb;  /* orange */
}

/* This is the checked state */
.custom-radio .custom-control-input:checked~.custom-control-label::before,
.custom-radio .custom-control-input:checked~.custom-control-label::after {
    background-color: #00b1eb;  /* green */
    /* this bg image SVG is just a white circle, you can replace it with any valid SVG code */
    border-radius: 50%;
}

/* active state i.e. displayed while the mouse is being pressed down */
.custom-radio .custom-control-input:active ~ .custom-control-label::before {
    color: #fff;
    background-color: #ff0000; /* red */
}
    
/* the shadow; displayed while the element is in focus */
.custom-radio .custom-control-input:focus ~ .custom-control-label::before {
    box-shadow: 0 0 0 1px #fff, 0 0 0 0.2rem rgba(255, 123, 255, 0.25); /* pink, 25% opacity */
}

.btn_active{
 background-color:#00b1eb;
 color:white;
}
.btn_inactive{
  background-color:#f5f5f5;
  color:black;
}

/* ---------------------------------------------------------------------------------------------
   V2: Bestellübersicht (js/pricing.js showOrder). Farben wie Shop: Blau #00b1eb, Text #595959.
   --------------------------------------------------------------------------------------------- */
.ov{ margin:8px 0 40px; color:#595959; }
.ov-intro h3{ font-size:1.6rem; font-weight:700; color:#222; margin:20px 0 6px; }
.ov-intro p{ margin-bottom:22px; }
.ov-grid{ display:flex; flex-wrap:wrap; margin:0 -10px; }
.ov-grid > .ov-card{ flex:1 1 300px; margin:0 10px 20px; }
.ov-card{ background:#fff; border:1px solid #e3e3e3; border-radius:6px; box-shadow:0 2px 8px rgba(0,0,0,.05); margin-bottom:20px; overflow:hidden; }
.ov-card-head{ background:#f5f5f5; border-bottom:1px solid #e3e3e3; padding:12px 18px; font-weight:700; color:#222; font-size:1.05rem; }
.ov-card-head .fa{ color:#00b1eb; width:20px; text-align:center; margin-right:6px; }
.ov-card-main .ov-card-head{ background:#00b1eb; color:#fff; border-bottom-color:#00b1eb; }
.ov-card-main .ov-card-head .fa{ color:#fff; }
.ov-card-body{ padding:14px 18px 16px; }
.ov-row{ display:flex; padding:7px 0; border-bottom:1px solid #f0f0f0; line-height:1.4; }
.ov-row:last-child{ border-bottom:0; }
.ov-label{ flex:0 0 34%; max-width:34%; color:#8a8a8a; font-size:.9rem; padding-right:10px; }
.ov-value{ flex:1 1 auto; color:#333; word-break:break-word; }
.ov-mono{ font-family:Consolas, "Courier New", monospace; font-size:.9rem; white-space:nowrap; }
.ov-note{ font-size:.85rem; color:#8a8a8a; margin:10px 0 0; }
.ov-text{ margin:4px 0 0; color:#333; }
.ov-ok{ color:#00b1eb; margin-right:6px; }
.ov-badge{ display:inline-block; font-size:.72rem; background:#e6f7fd; color:#0089b8; border-radius:10px; padding:1px 8px; margin-left:4px; vertical-align:middle; }

.ov-tarif{ display:flex; justify-content:space-between; align-items:center; padding:4px 0 16px; border-bottom:1px solid #f0f0f0; margin-bottom:12px; }
.ov-tarif-name{ font-size:1.4rem; font-weight:700; color:#222; }
.ov-tarif-meta{ font-size:.9rem; color:#8a8a8a; }
.ov-tarif-preis{ font-size:1.6rem; font-weight:700; color:#00b1eb; text-align:right; white-space:nowrap; line-height:1.1; }
.ov-tarif-preis small{ display:block; font-size:.75rem; font-weight:400; color:#8a8a8a; }
.ov-price-grid{ display:flex; flex-wrap:wrap; margin:0 -12px; }
.ov-prices{ flex:1 1 260px; align-self:flex-start; margin:0 12px 8px; border-collapse:collapse; width:100%; }
.ov-prices th{ border-left:0; border-right:0; border-top:0; background:transparent; height:auto; vertical-align:bottom; font-size:.8rem; text-transform:uppercase; letter-spacing:.04em; color:#8a8a8a; font-weight:700; padding:6px 0; border-bottom:2px solid #e3e3e3; }
.ov-prices td{ border-left:0; border-right:0; background:transparent; height:auto; vertical-align:top; padding:6px 0; border-bottom:1px solid #f0f0f0; color:#333; }
.ov-prices td:last-child, .ov-prices th:last-child{ text-align:right; white-space:nowrap; padding-left:12px; }
.ov-prices tfoot td{ border-bottom:0; border-top:2px solid #333; font-weight:700; color:#222; padding-top:8px; }

.ov-consent{ background:#fff; border:1px solid #e3e3e3; border-left:4px solid #00b1eb; border-radius:6px; padding:16px 18px 6px; margin:4px 0 20px; }
.ov-consent-head{ font-weight:700; color:#222; margin-bottom:12px; font-size:1.05rem; }
.ov-check{ display:flex; align-items:flex-start; margin:0 0 12px; cursor:pointer; line-height:1.45; }
.ov-check input{ flex:0 0 auto; width:18px; height:18px; margin:2px 12px 0 0; cursor:pointer; }
.ov-check em{ color:#8a8a8a; font-style:normal; font-size:.85rem; }
.ov-check a{ color:#00b1eb; text-decoration:underline; }
.ov-error{ font-weight:700; color:#c0392b; margin:0 0 10px; }
.ov-next{ display:flex; align-items:flex-start; background:#e6f7fd; border-radius:6px; padding:12px 16px; margin-bottom:22px; }
.ov-next .fa{ color:#00b1eb; font-size:1.3rem; margin:2px 12px 0 0; }
.ov-next p{ margin:0; color:#333; font-size:.92rem; }
.ov-order{ text-align:right; }
.ov-order .ov-order-btn{ display:inline-block; min-width:320px; padding:14px 28px; font-size:1rem; font-weight:700; margin-bottom:32px; }

@media (max-width:575px){
  .ov-label{ flex-basis:100%; max-width:100%; padding-bottom:2px; }
  .ov-row{ flex-wrap:wrap; }
  .ov-tarif{ flex-direction:column; align-items:flex-start; }
  .ov-tarif-preis{ text-align:left; margin-top:8px; }
  .ov-order .ov-order-btn{ display:block; min-width:0; width:100%; }
}

/* V2: Adressfelder mit Vorschlagsliste (datalist) wie normale Textfelder – kein Auswahlpfeil von Chrome/Edge */
input[list]::-webkit-calendar-picker-indicator{ display:none !important; }
