/* oswald-200 - latin */

@font-face {
    font-display: swap;
    /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Oswald';
    font-style: normal;
    font-weight: 200;
    src: url('../fonts/oswald/oswald-v53-latin-200.woff2') format('woff2');
    /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}


/* oswald-300 - latin */

@font-face {
    font-display: swap;
    /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Oswald';
    font-style: normal;
    font-weight: 300;
    src: url('../fonts/oswald/oswald-v53-latin-300.woff2') format('woff2');
    /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}


/* oswald-regular - latin */

@font-face {
    font-display: swap;
    /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Oswald';
    font-style: normal;
    font-weight: 400;
    src: url('../fonts/oswald/oswald-v53-latin-regular.woff2') format('woff2');
    /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}


/* oswald-500 - latin */

@font-face {
    font-display: swap;
    /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Oswald';
    font-style: normal;
    font-weight: 500;
    src: url('../fonts/oswald/oswald-v53-latin-500.woff2') format('woff2');
    /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}


/* oswald-600 - latin */

@font-face {
    font-display: swap;
    /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Oswald';
    font-style: normal;
    font-weight: 600;
    src: url('../fonts/oswald/oswald-v53-latin-600.woff2') format('woff2');
    /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}


/* oswald-700 - latin */

@font-face {
    font-display: swap;
    /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Oswald';
    font-style: normal;
    font-weight: 700;
    src: url('../fonts/oswald/oswald-v53-latin-700.woff2') format('woff2');
    /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

.corner-container {
  width: 250px;
}

.logo-wrapper {
  position: absolute;
  top: 0;
  left: 0;
  z-index:10;
  width: 100%;
  display: flex;
}

.second-logo img {
  margin: unset;
}

.mobile .red-background {
    width: 100px;
    height: 55px;
    left: 0px;
}

.red-background {
    position: relative;
    background: #CC2A1F 0% 0% no-repeat padding-box;
    border-bottom-left-radius: 16px;
    border-bottom-right-radius: 16px;
    width: 166px;
    height: 71px;
    display: flex;
    justify-content: center;
    align-content: center;
    align-items: center;
}

.red-background .rewe {
    background-image: url('../images/user-register/REWE_White.png');
    background-repeat: no-repeat;
    background-size: cover;
    width: 106px;
    height: 37px !important;
    margin: 0 auto;
}

.mobile .red-background .rewe {
    width: 73px;
    height: 27px !important;
}

.top-image {
    display: block;
    max-width: 100%;
    height: auto;
}

.corner-container .top-image {
    width: 100%;
    background-color: #FFFFFF;
    border-bottom-left-radius: 16px;
    border-bottom-right-radius: 16px;
    opacity: 1;
}



/* .corner-container .logo {
    max-width: 166px;
    height: 71px;
    left: 10px;
    z-index: 100;
    background-color: #CC2A1F;
    border-bottom-left-radius: 16px;
    border-bottom-right-radius: 16px;
} */

.talk-api-user-register-form select#edit-country {
    display: inline-block;
    width: 92%;
    margin-top: 8px;
    background: none;
    background-color: #fff;
    pointer-events: none;
    opacity: 0.5;
}

.talk-api-user-register-form #edit-surname {
    margin-bottom: -2px;
}

.talk-api-user-resend-confirmation-mail-form {
    margin-bottom: 20px;
}

.register-block .registered-form {
    display: none;
}

.register-block .registered-message h3 {
    font-family: 'Oswald', sans-serif;
    font-size: 24px;
    font-weight: normal;
    line-height: 35px;
    font-style: normal;
    padding-bottom: 5px;
    color: #24827A;
}

.registered-message .button-large {
    background-color: #24827A;
    font-weight: bold;
    border: 2px solid #fff;
    border-radius: 5px;
    height: 47px;
    width: 90%;
    margin-top: 10px !important;
    color: #fff;
}

#registered-message {
    padding: 1rem;
}

.register-block .talk-api-register-form .form-control-checkbox-label {
    font-size: 15px;
}

.register-block #talk-api-user-register-form .form-select .form-control-select {
    width: 400px;
    max-width: 90%;
}

.content #talk-api-user-register-form .toggle-password.fa-eye-slash {
    right: 30px;
}

.register6 .content {
    padding-bottom: 15px;
}

#edit-register {
    font-size: 16px;
}

.mobile.mini #edit-actions {
    display: block;
    width: 100%;
}

.rounded-image {
    border-radius: 4%;
}

@media (min-width: 1550px) {
    .col.left {
        max-width: 33%;
    }
}

@media (min-width: 780px) {
    .register-block p.register-form-footnote {
        padding-top: 10px!important;
    }
    .register-block .talk-api-register-form .form-control-checkbox-label {
        width: 360px;
    }
    .register-block .talk-api-register-form .form-element-checkbox {
        text-align: left;
        padding-left: 3%;
    }
    .register-block #talk-api-user-register-form .form-element .form-control,
    .register-block #talk-api-user-register-form .form-select .form-control-select {
        width: 400px;
        max-width: 90%;
    }
    .checkbox-labels {
        width: 90%;
    }
    #talk-api-user-register-form .toggle-password {
        top: 13%;
    }
    /* #talk-api-user-register-form .toggle-password {
        top: 2px;
    } */
}

@media (max-width: 1180px) {
    .trendsetter {
        max-width: 250px!important;
    }
}

@media (max-width: 1084px) {
    .col.trend .group2x img {
        top: -84px !important;
    }
}

@media (max-width: 1024px) {
    #block-userregistertalk {
        display: none!important;
    }
    #talk-api-user-register-form .toggle-password {
        top: 2px;
    }
}

@media (max-width: 940px) {
    .ps-9 {
        display: flex;
        justify-content: end;
    }
}

@media (max-width: 870px) {
    .content-bottom .row.right {
        flex-direction: column;
        align-content: center;
    }
}

@media (max-width: 779px) {
    form#talk-api-user-register-form {
        text-align: left;
    }
  .register-block .talk-api-register-form .label-desc-wrapper {
    display: inline;
  }
  .register-block .talk-api-register-form .form-control-checkbox-label {
        width: 90%;
    }
}

.mobile.mini form#talk-api-user-register-form {
    text-align: unset;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.mobile #edit-terms-privacy-cookies-accepted--wrapper,
.tablet #edit-terms-privacy-cookies-accepted--wrapper {
    width: 100%;
    margin-left: 5px;
}

.mobile.mini #edit-terms-privacy-cookies-accepted {
    padding-left: 8px;
}

.content.content-register .main {
    padding: 0 0 35px;
}

.container-fluid {
    width: 100%;
    margin-right: auto;
    margin-left: auto;
    display: flex;
    flex-direction: column;
    flex: 1;
}

.container {
    /* max-width: 1248px; */
    margin: 0 auto;
}

.row {
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 0;
    display: flex;
    flex-wrap: wrap;
    margin-top: calc(-1 * var(--bs-gutter-y));
    margin-right: calc(-0.5 * var(--bs-gutter-x));
    margin-left: calc(-0.5 * var(--bs-gutter-x));
}

.flex-column {
    flex-direction: column !important;
}

.justify-content-center {
    justify-content: center;
}

.col.form {
    margin-left: 32px;
    height: 96%;
    max-width: 563px;
    background-color: white;
    border-radius: 29px;
    opacity: 1;
}

.reg-form {
  padding: 25px 24px;
  border: 2px solid #494949;
  border-radius: 29px;
  background-color: white;
}

.reg-form h1 {
    padding-top: 17px;
    text-align: center;
    letter-spacing: var(--unnamed-character-spacing-0);
    color: var(--unnamed-color-6fb39d);
    text-align: center;
    font: normal normal normal 32px/42px Oswald;
    letter-spacing: 0px;
    color: #24827A;
    opacity: 1;
}

.reg-form [id*="block-kundenstimme"] h1 {
    display: none;
}

.col {
    flex: 1 0 0%;
}

.col-2 {
    flex: 0 0 auto;
    width: 16.66666667%;
}

.col-2.kunden-claim {
    width: 15.66666667%;
}

.col-10 {
    flex: 0 0 auto;
    width: 83.33333333%;
}

.col.trend {
    display: flex;
}

.col.trend h2 {
    font: normal normal normal 32px/42px Oswald;
    letter-spacing: 0px;
    color: #24827A;
    padding-bottom: 10px;
}

.col.trend p {
    font-weight: 600;
}

.col.trend p:last-child {
    padding-top: 10px;
}

.col.trend p span,
.col.trend p a {
    font-weight: 300;
}

.col.trend .group2x {
    position: relative;
}

.col.trend .group2x img {
    position: absolute;
    top: -115px;
}

.col.trend .group2x img .align-items-center {
    text-align: center;
}

.pt-5 {
    padding-top: 3rem !important;
}

.ps-9 {
    padding-left: 7rem !important
}

.container-fluid.content-register {
    background-color: #E2F0EB;
    background: url("../images/landing-page-bg.jpg") no-repeat center;
    background-size: cover;
    /* min-height: 1005px; */
    color: #fff;
    margin-bottom: 14px;
    height: 638px;
}

.mobile .container-fluid.content-register {
    margin-bottom: 0;
}

.kunden-claim {
    background: url("../images/user-register/Logo_Kundenstimme_Flaeche_unten_RGB.png") top left no-repeat;
    background-size: 100%;
}

.kunden-claim img {
    display: none;
}

.stores {
    /* background: url("../images/user-register/talk_app.svg") no-repeat bottom left;
    background-size: contain;
    display: flex; */
    position: relative;
}

.talk-app {
    position: absolute;
    top: 70px;
    left: -115px;
}

.register6 header {
    height: 0;
}

.container .header h2,
.container .header {
    color: #333333;
    text-align: center;
}

.container .header h2 {
    font: normal normal 600 26px/32px 'Oswald';
    letter-spacing: 0px;
    line-height: 40px;
}

.container .header p {
    font: normal normal normal 16px/40px 'Oswald';
    letter-spacing: 0px;
    padding-bottom: 68px;
}

.col-10.pt-5 {
    display: flex;
    justify-content: center;
}

header h2.title {
    font-family: 'Oswald', sans-serif;
    font-size: 40px;
    font-weight: normal;
    line-height: 45px;
    font-style: normal;
    text-align: center;
    color: #24827A;
    max-width: 633px;
}

.tablet_to_wide.tablet header h2.title,
.tablet_to_wide.desktop-standard header h2.title {
    padding-left: 24%;
}

.mobile header h2.title {
    padding-top: 100px;
}

header {
    padding-top: 2rem;
}

.tablet .register6 header,
.mobile .register6 header {
    background-color: unset;
}

fieldset .description {
  font: normal normal 300 12px / 15px Lato;
  font-size: 15px;
  font-weight: revert;
  text-align: left;
  letter-spacing: 0;
  color: #494949;
}

fieldset .fieldset-wrapper {
    text-align: left;
    font: normal normal 300 12px/15px Lato;
    letter-spacing: 0;
    color: #494949;
}

.form input {
    max-width: 384px;
    color: #333333;
}

.form input.form-text,
.form-email {
    height: 30px !important;
    margin-bottom: 5px;
}

.talk-api-register-form .form-actions .button {
    font-weight: bold;
    /* border-radius: 5px; */
    height: 47px;
    width: 100%;
    margin-top: 10px !important;
    color: #fff;
}

.bubbles .col {
    background-size: 291px 254px;
    height: 254px;
    position: relative;
    flex: 1 0 291px;
}

.bubbles .col>h2,
.bubbles .col>p {
    max-width: 200px;
    position: absolute;
}

.bubbles .col>h2 {
    top: 30px;
    left: 120px;
}

.bubbles .col>p {
    top: 90px;
    left: 100px;
    word-break: break-all;
}

.register-block input::placeholder {
    color: #333;
    font-family: "Lato";
    font-weight: lighter;
}

.register-block h1 {
    display: block;
}

.register-block input {
    border: unset;
}

.container-fluid header {
    background: none;
}

.container-fluid div#messages {
    padding-bottom: 0;
}

#edit-terms-privacy-cookies-accepted--wrapper {
    color: #333;
    width: 400px;
    margin-left: 23px;
}

.content .main {
    padding: 0!important;
}

.main .disc h3 {
    font-family: "Lato";
    font-size: 20px;
    font-weight: bold;
    font-style: normal;
    text-align: left;
    color: #24827A;
}

.main .col.disc img {
    float: left;
    max-width: 40px;
    padding-right: 10px;
}

ul:before {
    content: attr(aria-label);
    font-weight: bold;
}

ul[aria-label] {
    text-align: left;
    font: normal normal bold 20px/27px 'Oswald';
    letter-spacing: 0px;
}

.main .col.disc ul li {
    color: #333;
}

.main .container ul h3 {
    margin-bottom: 1.5rem;
}

.main .container .col.disc ul li {
    margin-bottom: 2.5rem;
}

.col.disc ul li {
    text-align: left;
    font: normal normal normal 16px/24px 'Lato';
    letter-spacing: 0px;
}

ul span {
    font-family: 'Oswald';
    font-size: 24px;
}

.badges {
    display: flex;
    align-items: flex-start;
    justify-content: space-around;
    width: 100%;
}

.badges img {
    max-height: 71px;
}

.right-badge {
    opacity: 0.63;
}

.content-bottom .button {
    width: 400px;
    height: 47px;
    background: #24827A 0% 0% no-repeat padding-box;
    box-shadow: 0px 3px 6px #00000029;
    border-radius: 5px;
    font-weight: bold;
    line-height: 47px;
}

.content-bottom .button.tipps {
    background: #619181 0% 0% no-repeat padding-box;
    margin-bottom: 16px;
}

.content-bottom .button.tipps:hover,
.content-bottom .button.tipps:active {
    background: #496f62 0% 0% no-repeat padding-box;
}

.content-bottom .row {
    margin-top: 10px;
}

.mobile .content-bottom .row {
    margin-top: 0!important;
}

.mobile .content.content-register {
    padding-bottom: 0;
}

.trendsetter {
    max-width: 330px;
    float: right;
}

.col.left {
    justify-content: end;
    display: flex;
}

.gesamelte-text h2 {
    padding-bottom: 1rem;
    font-family: 'Oswald', sans-serif;
    font-size: 24px;
    font-weight: normal;
    line-height: 35px;
    font-style: normal;
    text-align: left;
    color: #333333;
}

.kunden-trend {
    padding-left: 15px;
    padding-bottom: 9px;
    display: flex;
    align-items: center;
}

.content-bottom .row.right {
    margin-top: 5px;
    display: flex;
    justify-content: center;
}

.kunden-trend-1-3 {
    background-size: 37px 37px;
    padding-left: 45px;
    display: flex;
    align-items: center;
    position: relative;
    margin-top: 2rem;
    margin-bottom: 2rem;
    font: normal normal 400 18px/24px Lato;
    letter-spacing: 0px;
    color: #494949;
}


.register-icon {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    /* Vertically center the image */
    width: 36px;
}

.kunden-trend .row.flex-column {
    flex: 1;
    text-align: center;
}

.mobile .kunden-trend .row.flex-column {
    align-content: flex-start;
}

.kunden-trend h2 {
    color: #24827A;
    font: normal normal normal 22px/32px Oswald;
    padding-bottom: 32px;
    letter-spacing: 0px;
}

.kunden-trend .gesamelte-text {
    max-width: 60%;
}

.kunden-trend .gesamelte-text {
    padding-bottom: 1rem;
}

.kunden-trend p,
.registered-message p {
    padding-bottom: 9px;
    line-height: 1.5rem;
    font-family: "Lato";
    font-size: 16px;
    font-weight: 300;
    line-height: 22px;
    font-style: normal;
    text-align: justify;
    color: #333333;
}

.mobile-bkg {
    display: none;
}

.mobile .mobile-bkg {
    background: url("../images/user-register/landing_page_pic_1_compressed.png") no-repeat;
    background-size: auto;
    background-size: cover;
    height: 100%;
    display: block;
    height: 300px;
    background-position: 1% center;
  width: auto;
  margin-left: -15px;
  margin-right: -15px;
}





.mobile .mobile-bkg .group2x {
    position: absolute;
    top: 85px;
    width: 120px;
    left: 140px;
}

.mobile .mobile-bkg .group2x .trendsetter {
    width: 130px;
}


.mobile header {
    display: none;
}

.mobile .container-fluid {
    display: flex;
    flex-direction: column;
}

.mobile .container-fluid.content-register {
    background: #fff 0% 0% no-repeat padding-box;
    background-size: unset;
    min-height: unset;
}

.mobile.mini header h2.title {
    font-size: 30px;
    padding-top: 82px;
}

.mobile.mini header h2.title {
    line-height: inherit;
    max-width: 80%;
    margin: 0 auto;
}

.mobile .kunden-claim {
    background: url("../images/user-register/Logo_Kundenstimme_Flaeche_unten_RGB.png") no-repeat top right;
    height: 90px;
}

.mobile .container .row {
    flex-direction: column;
    align-items: center;
}

.mobile .content {
    padding-bottom: 0px;
}

.mobile .content-register header .row .pt-5 {
    padding-top: unset;
}

.mobile .content-register header .col-10,
.mobile .col-10 {
    flex: 1 0 auto;
    width: 100%;
    order: 2;
}

.mobile .content-register header .col-2 {
    flex: 1 0 auto;
    width: 95%;
    order: 1;
}

.mobile .row .col.form {
    margin-left: 0;
    order: 1;
}

.mobile .row .col:first-of-type {
    order: 2;
}

.mobile .ps-9 {
    padding-left: unset !important;
}

.mobile .talk-app {
    display: none;
}

.mobile .content-register .form-element .form-control {
    width: 90%;
    max-width: 780px;
    height: 48px!important;
    font-size: 18px;
    padding: 2px 3%;
    margin: 5px;
}

.mobile #edit-country {
    width: 90% !important;
    max-width: 780px !important;
    height: 44px !important;
    font-size: 18px !important;
    padding: 2px 3% !important;
    margin: 5px;
}

.mobile .button {
    margin: 0;
    width: 90% !important;
    max-width: 780px !important;
}

.mobile .col.disc {
    text-align: center;
    max-width: 600px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
}

.mobile .disc ul {
    order: 2;
}

.mobile .stores.row {
    margin: 17px 0 34px 0;
}

.mobile .content-bottom .row {
    margin-top: 10px;
    flex-direction: column;
}

.mobile .col.trend {
    display: none;
}

.col.trend.mobile {
    display: none;
}

.mobile .col.trend.mobile {
    justify-content: center;
    flex: 1 0 0%;
    display: flex;
}

.mobile img.trendsetter {
    width: 98%;
}

.mobile .button-large {
    height: 47px!important;
    margin: 0 auto!important;
}

.mobile .talk-api-register-form .form-actions .button {
    margin: 0 auto;
}

.mobile .talk-api-register-form .form-control-select {
    width: 90%;
    max-width: 780px;
}

.mobile .content-bottom .button.tipps {
    margin-bottom: unset;
}

.mobile .kunden-trend {
    display: flex;
    justify-content: center;
    max-width: 100%;
}

.mobile.mini .kunden-trend h2 {
    margin-bottom: 35px;
}

.mobile .kunden-trend h2 {
    text-align: left;
    padding: 32px 0 10px 0;
    margin-bottom: 45px;
}

.mobile .kunden-trend p {
    max-width: unset;
    text-align: justify;
}

.mobile .container .header h2 {
    max-width: 80%;
    margin: 0 auto;
}

.mobile.mini .container .header h2 {
    line-height: 40px;
}

.mobile .row.align-items-center.bubbles .bubble-2,
.mobile .row.align-items-center.bubbles .bubble-3 {
    margin-bottom: 47px;
}

.mobile.mini .row.align-items-center.bubbles .bubble-2,
.mobile.mini .row.align-items-center.bubbles .bubble-3 {
    margin-bottom: unset;
}

.mobile .container .header p {
    padding-bottom: 30px;
}

.mobile.mini .container .header p {
    line-height: 20px;
}

.mobile.mini .toggle-password {
    top: 2px;
}

.mobile .content.content-bottom {
    padding-bottom: 0;
}

.mobile .trend-buttons {
    margin-bottom: 60px;
}

.tablet_to_wide .talk-app img {
    max-width: 70%;
}

.tablet_to_wide .talk-app {
    left: -110px;
}

.tablet .talk-app {
    top: 55px;
}

.tablet .trendsetter {
    max-width: 300px;
    padding-right: 5px;
}


.tablet .content-bottom .button {
    max-width: 85%;
}

.mobile .content-register header {
    margin-bottom: 0;
}

.mobile.mini .kunden-trend {
    max-width: 100%;
}

.mobile.mini .button.button-large {
    font-size: 16px;
}

.mobile.mini .trendsetter {
    float: none;
    padding-right: unset;
}

.mobile.mini .kunden-trend {
    margin: unset;
}

.mini .row,
.mobile .row {
    --bs-gutter-x: 0;
    --bs-gutter-y: 0;
}

.mini .col.form,
.disc ul {
    margin-left: 5px;
}

.gewinnspiel {
  color: #494949;
  padding: 2rem;
}

.kunden-trend {
  padding: 2rem;
  width: 100%;
  box-sizing: border-box;
}

.content-width.text-block-content {
  padding: 2rem;
  margin: 0 auto;
}

@media (max-width: 779px) {
  .landinpage-content .gewinnspiel {
    display: none;
  }


  .landinpage-content .trend {
    padding: 2rem;
  }
}

@media (min-width: 780px) {
  .trend--header {
    display: none;
  }

  .content-width.text-block-content {
    padding-top: 0;
  }

  .landinpage-content {
    width: 47%;
  }

  .landinpage-content .gewinnspiel {
    padding-left: 0;
    padding-right: 120px;
    padding-top:0;
    position: relative;
  }


  .content .register-block {
    position: relative;
  }

  .container-fluid.content-register {
    min-height: 638px;
  }


  .content-register .form {
    position: absolute;
    right: 0;
    top: 200px;
    width: 50%;
    max-width: 518px;
    z-index: 1000;
  }

  .content .register-block {
    width: 100%;
    max-width: 100%;
  }

  .gewinnspiel-gutscheine {
    margin: unset;
    position: absolute;
    right: -80px;
    top: -80px;
    width: 180px;
  }

}
