button {color: #666;background: #f9f9f9;}
main {margin-bottom: 80px;}
h1 {margin-top: 0;font-size: 26px;font-weight:bolder;color: #a80011;}
h2 {font-size: 18px;color: #a80011;}
p {font-size: 14px;color: #000;}
a:hover {text-decoration: none;}
a, .breadcrumb-item.active {color: #000;}
.breadcrumb-item a {color: #666;}
.breadcrumb {background: none;padding: 0;margin: 25px 0 20px;}
span {font-weight: bolder;}
.underline {font-weight: normal;color: #888;}
.button{padding: 10px 45px;font-size: 14px !important;font-weight: bolder;border-radius: 2px;border: none;background: -moz-linear-gradient(top, #8AAE13 0%, #9BC243 100%);background: -webkit-linear-gradient(top, #8AAE13 0%,#9BC243 100%);background: linear-gradient(to bottom, #8AAE13 0%,#9BC243 100%);cursor: pointer;text-align: center;color: #fff;width: 100%;display: inline-block;}
.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show>.btn-primary.dropdown-toggle{
  background:-moz-linear-gradient(top, #8AAE13 0%, #9BC243 100%);
  background:-webkit-linear-gradient(top, #8AAE13 0%,#9BC243 100%);
  background:linear-gradient(to bottom, rgb(186, 189, 182) 0%,#9BC243 100%);
  color:#fff;
  border:none;
}
.button.btn-secondary{
  background:linear-gradient(to bottom, rgb(186, 189, 182) 0%, #6c757d 100%);
}
button.accord-icon{ border: none; margin: 0px; padding: 0px; background-color: transparent;cursor:pointer}
.no-active{display: none;}
.card-active{border-color: #9BC243; border-style: solid; border-width: 6px 1px 1px; border-image: none 100% / 1 / 0 stretch;}
#address-error-container p { color: #a80011}
#login-error-container p { color: #a80011}
.form-control::placeholder {font-size: 14px;}
input[type="radio"] {display: none;}
/*styles intro*/
#content-container {margin-bottom: 18px;}
.kennlern-bild, .kennlern-introtext {display: inline-block;}
.kennlern-bild {width: 35.55%;float: left;}
.kennlern-introtext {width: calc(100% - 35.55% - 30px);margin-left: 30px;}
.kennlern-introtext ol {list-style: none;counter-reset: item;}
.kennlern-introtext li {counter-increment: item;margin-bottom: 5px;margin-left: -20px;font-size: 14px;color: #000;}
.kennlern-introtext li:before {content: counter(item);background: #000;border-radius: 100%;color: #fff;text-align: center;margin: 0 5px 0 -20px;padding: 0px 4px;}
/*styles Zustellung Container*/
/*styles container formular und probierpaket*/
#zustellung-container {margin-top: 40px;}
.newsletter-left {float: right;}
.probierpaket .radio {width: 400px;height: 100%;position: absolute;cursor: pointer;}
/*checked styles*/
.probierpaket input[type="radio"]:checked+label {border: 2px solid #9BC243;border-radius: 3px;opacity: 1;}
.probierpaket input[type="radio"]:checked+label+.card-wrapper {opacity: 1;}
.probierpaket label {z-index: 2;opacity: 0;}
.tri {width: 0;height: 0;border-style: solid;border-width: 0px 59px 59px 0px;border-color: transparent #9BC243 transparent;position: absolute;opacity: 1;transform: rotate(0deg);left: -35px;top: -10px;z-index: -1;}
.radio .fa-check {position: absolute;color: #fff;right: 2px;top: 5px;z-index: 0;}
/*styles Gefro Probierpaket*/
.probierpaket .card-wrapper {border: none;opacity: 0.5;background-color: #fff;width: 400px;border: 1px solid #eee;border-radius: 3px;overflow: hidden;}
.probierpaket .hdl-like {text-align: center;font-weight: normal;}
.hdl-like span {font-size: 18px;}
.hdl-card-bod {color: #666;margin-bottom: 10px;padding-left: 10px;font-size: 14px;}
.probierpaket .card-body .button {width: 235px;display: block;margin: 0 auto;padding: 23px 0;}
.button:hover {background:#8AAE13;background-image:-webkit-gradient(linear,left top, left bottom,from(#9BC243),to(#8AAE13));background-image:-webkit-linear-gradient(top,#9BC243,#8AAE13);background-image:-moz-linear-gradient(top,#9BC243,#8AAE13);background-image:-o-linear-gradient(top,#9BC243,#8AAE13);background-image:linear-gradient(top,#9BC243,#8AAE13);background-image:-ms-gradient(top,#9BC243,#8AAE13);}
.text-bg {background-color: #f9f9f9;}
.cont-card-bod li {padding: 5px 10px;font-size: 12px;margin: 5px 0;}
.cont-card-bod .fa-angle-right {margin-right:  3px;}
/*Styles für Prämien-container*/
#Praemie-wrapper {margin-top: 50px;}
.praemie-cont-wrapper p {text-align:center;margin-bottom:40px;}
.containerblock .radio .fa-check {right: 13px;top: 7px;}
.containerblock-wrapper {background: #fff;padding: 30px 15px;border: 1px solid #eee;height:100%;float: left;width: calc(20% - 20px);margin-right:10px;margin-left:10px;border-radius: 3px;position:relative;}
.containerblock-wrapper input[type="radio"]:checked+label {border: 2px solid #9BC243;border-radius: 3px;opacity: 1;}
.containerblock-wrapper label {opacity: 0;z-index: 2;}
.containerblock-wrapper input[type="radio"]:checked+label+.containerblock {opacity: 1;}
.containerblock-wrapper .radio{width:100%;margin-right: 0;height: 100%;position: absolute;cursor: pointer;margin-left: -15px;top: 0;}
.containerblock-wrapper .containerblock{opacity: 0.5;}
.containerblock-wrapper .containerblock-data p{font-size:16px;}
.praemie-cont-wrapper p {text-align:center;margin-bottom:40px;}
.containerblock-wrapper .containerblock-data p.description {margin-bottom:40px; font-size:14px;}
.containerblock-wrapper .containerblock-header img {display: block;margin: 0 auto;}
.containerblock-wrapper .containerblock button {width:calc( 100% - 30px );padding: 10px 20px;position:absolute;bottom:20px;}
/*Styles für "Accordion"*/
#anmeldung-wrapper {margin-top: 60px;}
.hdl-like {text-align: left;font-weight: bold;font-size: 14px;color: #000;}
#accordion .card a {cursor: pointer;border-radius: 3px;}
#accordion .card-body {padding: 25px 20px;}
.card-header {background-color: #fff;border-top:none;}
.card-header .fa-plus-circle, .card-header .fa-minus-circle {float: right;font-size: 18px;color: #888;}
.card-header .fa-check {float: none;opacity: 0;color: #9BC243;margin-left: 5px;}
.card-header .fa-check.complete {opacity: 1;}
.login-left-wrapper, .login-right-wrapper {width: calc(50% - 23px);background-color: #f9f9f9;padding: 30px;border: 1px solid #eeeeee;float: left;min-height: 290px;margin-bottom: 30px;}
.login-left-wrapper {margin-right: 20px;}
.login-right-wrapper {margin-left: 20px;}
#collapseTwo, #collapseThree {margin-bottom: 25px;}
/*style info*/
.info-text, .check-text, .fa-info-circle, .fa-check {margin-right: 5px;float: left;margin-top: 4px;}
.info-text p, .check-text p {display: inline-block;width: calc(100% - 21px);min-height: 34px;}
/*styles login form*/
#login-form {margin-top: 38px;}
#login-form input {border-radius: .25rem;}
.user-form, .pw-form {float: left;width: calc(50% - 10px);}
.user-form {margin-right: 20px;}
.pw-show {position: absolute;right: 10px;top: 50%;transform: translate(-50%, -50%);z-index: 5;cursor: pointer;}
.pw-vergessen {font-size: 10px;margin: 8px auto 0;color: #888;}
.pw-vergessen:hover {text-decoration: none;color: #888;}
#login-form .button {margin-top: 18px;}
.form-control:focus {box-shadow: 0 0 0 .2rem rgba(81,177,105,1);border: none;}
/*.login-right-wrapper .button {margin-top: 50px;}*/
/*Styles für Ihre Angaben Formular*/
.form-control:focus {box-shadow: 0 0 0 .2rem rgba(81,177,105,1);border: none;}
.angaben-form {padding: 0 8px;}
.angaben-form label {display: block;margin-bottom: 8px;color: #000;font-weight: bolder;font-size: 13px;}
.angaben-form select {color: #666;padding: 8px 5px;margin-top: -5px;border: 1px solid #eeeeee;border-radius: 3px;cursor: pointer;appearance: none;-moz-appearance: none;-webkit-appearance: none;}
.form-anrede .form-group-inner-right {margin-left: 11px;}
.left-side-wrapper, .right-side-wrapper {float: left;width: calc(50% - 50px);}
.left-side-wrapper {margin-right: 100px;}
.form-zeile {margin-top: 20px; margin-bottom:5px;}
.form-group-left, .form-group-right {width: calc(50% - 10px);}
.form-group-left {margin-right: 10px;}
.form-group-right {margin-left: 10px;}
.form-group-inner-left {margin-right: 5px;display: inline-block;}
.form-group-inner-right {margin-left: 5px;display: inline-block;}
.form-group-inner-left, .form-group-inner-right  {width: calc(50% - 8px);}
.selectpicker.select-md {margin-left: 10px;}
.form-group-inner-left select, .form-group-inner-right select {width: calc(50% - 8px);}
.selectpicker {padding: 8px 5px;border: 1px solid #dadada;border-radius: 3px;width: 100%;background: url("../img/sort.png") no-repeat 96%;background-size: inherit;}
.select-md, .select-sm {background-position: 92%;}
.pflichtfeld {text-align: right;font-size: 10px;color: #888;display: block;width: 100%;}
.land {margin-bottom: 12.5px !important;}
/*styles right von form*/
.form-group-bday input {display: inline-block;width: 20%;}
.form-group-bday input::placeholder {text-align: center;}
.day, .month {margin-right: 10px !important;width: calc(25% - 10px) !important;}
.year {width: calc(50% - 9px) !important;}
.info-datenschutz {color: #888;font-size: 10px;margin-top: 10px;}
/*styles required*/
.absenden-button-zeile {margin-top: 45px;}
/*responsive Styles*/
@media(max-width:1238.98px) {
  .containerblock-wrapper .containerblock-data p{margin-bottom:60px;}
}
@media(max-width: 991.98px) {
  #content-container {margin-bottom: 20px;}
  .kennlern-introtext {width: 100%;margin: 20px 0 0;display: block;text-align: justify;}
  .kennlern-bild {width: 100%;float: none;display: block;}
  .kennlern-bild img {margin: 0 auto;	display: block;}
  .newsletter-left, .newsletter-right {float: none;}
  .probierpaket .card-wrapper, .probierpaket .radio {width: 335px;}
  .probierpaket .hdl-like {min-height: 70px;}
  .containerblock-wrapper{height:auto;width:calc(50% - 20px);margin-top:20px;}
  .login-left-wrapper, .login-right-wrapper, .left-side-wrapper, .right-side-wrapper {margin-right: 0;margin-left: 0;width: 100%;}
  .form-anrede .right-side-wrapper {display: none;}
  .form-anrede .left-side-wrapper label {margin-bottom: -8px;}
}
@media(max-width:767.98px) {
  .probierpaket .card-wrapper {width: 400px;margin: 20px auto 0;}
  .probierpaket .radio {width: 400px;margin: 0 auto;left: 0;right: 0;height: calc(100% - 20px);}
  .probierpaket .hdl-like {	min-height: auto;}
}
@media(max-width:575.98px) {
  .praemie-cont-wrapper p {margin-top: 10px;}
  .containerblock-wrapper{width: 100%;margin:20px 0 0;}
}
@media(max-width: 450.98px) {
  .probierpaket .card-wrapper {width: 100%;}
  .probierpaket .radio {width: calc(100% - 20px);}
  .user-form, .pw-form {width: 100%;margin-right: 0;}
  .pw-form {margin-top: 15px;}
  #accordion .form-group-right .button {width: 100%;}
  .form-group-left, .form-group-right {width: 100%;margin-left: 0;margin-right: 0;}
  .form-group-right {margin-top: 15px;}
  .form-group-inner-left {margin-right: 0;}
  .form-anrede .left-side-wrapper .form-group-inner-left, .form-anrede .left-side-wrapper .form-group-inner-right {width: 100%;}
  .form-group-inner-left, .form-group-inner-right {width: calc(50% - 5px);}
}
@media(max-width: 400.98px) {
  .containerblock-wrapper{width: 100%;margin:20px 0 0;}
}
@media(max-width: 350.98px) {
  #kochbuch-radio {margin-top: calc(100% / 4 + 260% + 3px);}
  #kosmetikset-radio {margin-top: calc(100% / 4 + 403% + 3px);}
  .kennlern-introtext {text-align: left;}
  .praemie-cont-wrapper p {margin-top: 30px;}
}