body {
    color: #666666;
    font-family: 'Noto Sans', sans-serif;
    margin: 0;
    padding: 0;
}

#formContainer {
    width: 95%;
    max-width: 1248px;
    margin: 0 auto;
    padding: 0 20px 57px;
}

#RegistrationCastrolExchangerAppForm {
    padding: 0 20px 20px 20px;
}
.formSeperatorHR{
margin: 20px 0px 10px 0px;
border: 1px solid #00833B;
}
.fields {
    padding: 6px;
}

.required {
    display: inline;
    color: #F00023;
    font-weight: bold;
    padding: 0 2px;
}

.inline-container-wrapper {
    display: inline-flex;
    width: 100%;
}

.field-col-73 {
    width: 73%;
}

.field-col-27 {
    width: 27%;
}

.field-col-22 {
    width: 22%;
}

.field-col-51 {
    width: 51%;
}

.banner-img {
    width: 100%;
    display: block;
    max-width: 100%;
}

.black-label {
   color: #666666;
    display: block;
    font-size: 14px;
    line-height: 1.7;
}

.green-outline-input {
    color: #666666;
    font-family: 'Noto Sans', sans-serif;
    padding: 6px 6px;
    border: 1px solid #00833B;
    background-color: #fff;
    font-size: 14px;
    line-height: 1.7;
    width: calc(100% - 20px);
}

select {
    height: 37.8px;
}

.birthday-picker {
    display: flex;
    position: relative;
}

#day,
#year {
    margin-left: 4px;
}

.inline-container-wrapper .iti--allow-dropdown {
    width: 100%;
}

.checkbox-wrapper {
    position: relative;
}

.checkbox {
    width: 14px;
    height: 14px;
    margin: 0 8px;
    position: absolute;
    top: 4px;
}

.checkbox-label {
    display: inline-block;
    padding-left: 30px;
    vertical-align: top;
    margin: 0 0 0 4px;
}

.term-condition-link {
    color: #00833B;
}

.submit-button {
    font-family: 'Noto Sans', sans-serif;
    background: #00833B;
    border: 0px solid black;
    border-radius: 3px;
    color: #ffffff;
    font-size: 14px;
    font-weight: bold;
    text-align: center;
    line-height: 120%;
    padding: 12px 20px;
    text-decoration: none;
    width: auto;
    cursor: pointer;
}

.btn-field {
    min-width: 90%;
    display: flex;
    justify-content: center;
    position: fixed;
    bottom: 0;
    background: #fff;
    left: 0;
    right: 0;
}

.btn-app-registration {
    justify-content: start;
    position: relative;
}

#calendarIcon {
    font-size: 16px;
    color: #00833B;
    margin: 9px 4px;
}

.error {
    color: #F00023;
    display: block;
    font-size: 14px;
    font-style: italic;
    font-weight: bold;
    line-height: 24px;
    padding: 0 8px;

}

.text-checkbox-align {
  display: flex;
  align-items: self-start;
}

.mt-2 {
  margin-top:2px;
}

.consent-container {
  display: flex;
  flex-direction: column;
  align-items: self-start;
}

#thanks-msg-container {
    display: none;
}

#thanks-msg-container {
    width: 684px;
    margin: 60px auto;
    display: none;
}

#thanks-msg-container h2 {
    font-size: 26px;
    line-height: 1.31;
    font-family: 'Noto Sans', sans-serif;
    color: #666666;
    font-weight: 300;
    letter-spacing: -.1px;
    margin-bottom: 30px;
    margin-top: 10px;
}

#thanks-msg-container p {
    font-family: 'Noto Sans', sans-serif;
    color: #666;
    font-size: 14px;
    letter-spacing: -.2px;
    line-height: 1.75;
    margin: 0;
}

.thanks-black-txt {
    color: #666666 !important;
    font-size: 26px !important;
    font-weight: 300;
}

.thanks-green-txt {
    color: #00833B !important;
    font-size: 22px !important;
    font-weight: 400;
}

.thanks-green-head {
     color: #00833B !important;
      font-size: 26px !important;
      font-weight:300;
   }

   .thanks-black-subHead {
     color: #666666 !important;
     font-size: 22px !important;
     font-weight:400;
   }

.thanks-link {
    border-bottom: 1px solid #00833B;
    color: #666666;
    text-decoration: none;
}

.thanks-link:hover {
    color: #00833B;
}

.formBody {
    max-width: 600px;
    margin: 10px auto;
}

.headerimg {
    width: 100%;
    height: auto;
}

.bannerImg {
    width: 100%;
    height: auto;
}

.discriptionText>.heading {
    font-size: 20px;
    color: #00833B;
    line-height: 1.7;
    font-weight: 700;
    margin: 1px 0px;
}
.discriptionText {
    margin: 6px;
}
.discriptionText>.boldText {
    font-weight: 700;
    line-height: 1;
    font-size: 10px;
    color: #666666;
    margin: 1px 0px;
}

.discriptionText>.paragraph {
    line-height: 1.6;
    font-size: 10px;
    color: #666666;
    margin: 1px 0px;
}

.link {
    font-size: 10px;
    text-decoration-line: underline;
    color: #00833B;
}

.sideFields {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-between;
    margin-top: 10px;
box-sizing: border-box;
}

.sideFields .fields {
    width: 49%;
box-sizing: border-box;
}

.sideFields>.fields>select {
    font-family: 'Noto Sans', sans-serif;
    width: 268px !important;
    color: #666666;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.7;
    margin-bottom: 0px;
    margin-top: 0px;
    border-radius: 0px;
    background-color: #fff;
    border: 1px solid #ccc;
box-sizing: border-box;
}

.napaFields>input[type='email'] {
font-family: 'Noto Sans', sans-serif;
    width: 484px !important;
    border-radius: 0px;
    background-color: #fff;
    border: 1px solid #ccc;
    color: #666666;
    font-size: 14px;
    line-height: 1.7;
    padding: 6px;
box-sizing: border-box;
}

.sideFields>.fields>input[type='text'] {
font-family: 'Noto Sans', sans-serif;
    width: 268px !important;
    border-radius: 0px;
    background-color: #fff;
    border: 1px solid #ccc;
    color: #666666;
    font-size: 14px;
    line-height: 1.7;
    padding: 6px;
box-sizing: border-box;
}

#dob {
 width: 84% !important;
}

.greenLabel {
font-family: 'Noto Sans', sans-serif;
    font-weight: 700;
    line-height: 1;
    color: #00833B;
    font-size: 14px;
    line-height: 1.7;
}

.submitBtnRed {
    font-family: 'Noto Sans', sans-serif;
    float: right;
    color: #ffffff;
    font-size: 14px;
    font-weight: bold;
    text-align: center;
    line-height: 120%;
    padding: 12px 20px;
    text-decoration: none;
    min-width: 0px;
    background: #00833B;
    border-radius: 0px;
    border: 0px;
}

button.submitBtnRed:hover {
    cursor: pointer;
}

.winPriceSec {
    margin: 0px;
    color: #666666;
    line-height: 150%;
    font-size: 14px;
}

.SubmitionText {
    line-height: 1.6;
}

.fields.submitCheck {
    width: 80% !important;
}

.fields.submitbtn {
    width: 20% !important;
}

/* Style the calendar icon */

.thank-you-para {
    padding: 12px 15px;
}

.thanks-txt {
    margin: 6px;
    font-size: 14px;
    line-height: 1.5;
    color: #666666;
}

#rulepage p {
    color: #666666;
}

.betterOilContainer {
    margin: 10px 15px;
}

.date-input-container {
    display: flex;
    align-items: center;
    gap: 5px;
    position: relative;
}

.date-input {
    text-align: center;
    border: 1px solid #ccc;
    border-radius: 0px;
    width: 74px;
    background-color: #fff;
    line-height: 1.7;
    padding: 6px;
}

.year-input {
    width: 70px;
}

.calendar-icon {
    cursor: pointer;
    border: none;
    background: none;
    font-size: 18px;
}

.hidden-date-input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

.discriptionText>p {
    font-size: 14px;
    color: #666666;
    line-height: 1.7;
margin: 6px;
}

.socialMediaText {
    font-weight: 700;
}

.socialMediaSection {
    background-color: #00833B;
    padding: 6px;
}

.socialMediaSection>ul {
    display: flex;
    align-items: center;
    justify-content: center;
    padding:0px;
    margin:0px;
}
hr {
    margin: 0px 15px;
    border: 1px solid #00833B;
}

.socialMediaSection>ul>li {
    padding: 3px 10px 0px;
    list-style-type: none;
}

.greenLink {
    color: #00833B;
    font-size: 14px;
}

.ruletitle {
    line-height: 150%;
    margin: 0px;
    font-size: 20px;
    color: #00833B;
    padding: 6px;
}

.AlertText {
    color: #666666;
    font-size: 14px;
    margin: 0px;
    line-height: 150%;
    font-size: 16px;
display: inline;
}
option {
    color: #666666;
}
.paraBeforeHead {
    font-size: 14px;
    font-weight: 400;
    line-height: 1.7;
    margin: 0 0 12px;
    color: #666666 !important;

}

.gray-label {
    font-size: 14px;
    color: #666666;
}

.terms-label {
    font-size: 12px;
    color: #666666;
    padding-left: 22px;
}
#consentprocess {
position: absolute;
}
.socialMediaParentBlock {
    margin: 15px;
}

.toggleFieldSection {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: flex-start;
font-size: 14px;
}

.toggleFieldSection > input {
    width: auto;
    margin-right: 10px;
    margin-top: 6px;
}

.toggleFieldSection > #InfoTermData {
    width: 96% !important;
}
 #InfoTermData {
font-size: 14px;
    line-height: 1.7;
}

@media only screen and (max-width: 470px) {
.fields.submitCheck {
    width: 100% !important;
}
.fields.submitbtn {
    width: 100% !important;
}
.napaFields>input[type='email'] {
      width: 100% !important;
box-sizing: border-box;
  }
  .sideFields>.fields>input[type='text'] {
      width: 100% !important;
  }
  .sideFields>.fields>select {
      width: 100% !important;
  }
  .date-input-container{
      width: 100%;
      justify-content: space-between;
  }
.sideFields{
flex-direction: column;
}
.napaFields>input[type='email'] {
    width: 100% !important;
}
.sideFields .fields {
    width: 100%;
box-sizing: border-box;
}

}


@media only screen and (max-width: 768px) {
    /* CSS rules for mobile screens */


    .inline-container-wrapper {
        flex-direction: column;
    }

    #formContainer {
        padding: 0 0 57px;
    }

    #RegistrationCastrolExchangerAppForm {
        padding: 0;
    }

    .field-col-73,
    .field-col-27,
    .field-col-22,
    .field-col-51 {
        width: 97%;
    }

.toggleFieldSection > #InfoTermData {
        width: 90% !important;
    }
#dob {
 width: 88% !important;
}
.mob-width {
width:calc(100% - 8px);
}
}

@media screen and (min-width: 1024px) {
    /* CSS rules for desktop screens */
    body {
        margin: 0 auto;
    }

    .flatpickr-calendar {
        right: 20% !important;
    }
}