/*
--- 01 TYPOGRAPHY SYSTEM

- Font sizes (px)
10 / 12 / 14 / 16 / 18 / 20 / 24 / 30 / 36 / 44 / 52 / 62 / 74 / 86 / 98

- Font weights
Default: 
Medium: 
Semi-bold: 
Bold: 

- Line heights

Default : 1
medium : 1.2
high : 1.5
higher : 1.8
- Letter spacing

--- 02 COLORS

- header: #eeedf2
- Tints:
- Shades: 

- Accents:
- Greys : #868686
          #6c6c6c

--- 05 SHADOWS
box-shadow: 0 0 6px #bbbbbb;

--- 06 BORDER-RADIUS

--- 07 WHITESPACE

- Spacing system (px)
2 / 4 / 8 / 12 / 16 / 24 / 32 / 48 / 64 / 80 / 96 / 128
*/


/* Default padding / Margin */

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
html {
    font-size: 62.5%;
    height: 100%;
    -ms-overflow-style: scrollbar;
}
 
/*====================*/
/* BG BODY SECTION */
/*====================*/
 
body {
    font-family:  'Roboto', sans-serif;
    line-height: 1;
    color: #000000;
    font-weight: 400;
 background-image: url("https://image.email.groupeseb.com/lib/fe3611717564047d721177/m/2/2cf55bdf-0e0f-48ce-bc61-198be5104384.png");
    width: 100% !important;
    background-color: #FFFFFF;
    background-size: cover;
    background-position: 50%;
    background-repeat: no-repeat;
 background-position-y: 0.1042vw;
}
*:focus {
    outline: none;/* outline: 4px dotted #e67e22; *//* outline-offset: 8px; *//* box-shadow: 0 0 0 0.8rem rgba(230, 125, 34, 0.5); */
}
img {
    vertical-align: middle;
    width: 100%;
}
/*====================*/
/* LINKS */
/*====================*/
a {
    color: #000000;
}
a:hover {
    color: #000000;
}
a:link {
    color: #000000;
} 
a:active {
    color: #ffffff;
}
select {
    padding: 5px;
    -webkit-appearance: none;
}
 
/*====================*/
/* LOGO SECTION */
/*====================*/

.logoimg-container {
    max-width: 10.9375vw;
    position: relative;
    margin: auto;
    padding: 1.3025vw 0;
}
.logo-img {
    align-content: center;
    display: inline-block;
}
.logo_head {
    background-color: #FFFFFF;
    background-size: cover;
    background-position: 70%;
    background-repeat: no-repeat;
}

/*====================*/
/* FORM SECTION */
/*====================*/

.form-box {
    padding-bottom: 3.28125vw !important;
    padding-top: 2.0833vw   !important;
}
.form-group {
  margin-bottom: 0.9375vw;
 }
 .main-form {
    padding: 0 7.5521vw;
}
.form-background-color {
    width: 45vw;
    height: 34.700vw;
    background-color: #FFFFFF;
    padding: 0.78125vw 0.6771vw;
    margin-left: 10.209vw;
    margin-right: 43.8025vw;
    margin-top: 1.5625vw;

}
.form_headline p {
    color: #51555D;
    margin-bottom: 0.2604vw;
    text-align: center;
    font-size: 3.021vw;
    font-family:  'Roboto', sans-serif;
    text-transform: uppercase;
    font-weight: bold;
    line-height: 1.2;
    padding-top: 0.8333vw;
}
.form_bodytext p {
    color: #51555D;
    margin-bottom: 0.2604vw;
    text-align: center;
    font-size: 1.406vw;
 line-height: 1.2;
    font-family:  'Roboto', sans-serif;
    font-weight: 400;
    padding: 0rem 6.40625vw 0rem 4.375vw;
}
.small-text p {
    font-size: 1.042vw;
    line-height: 1.3;
    color: #51555D;
    margin-bottom: 1.5625vw;
    text-align: center;
    font-family:  'Roboto', sans-serif;
    font-weight: 400;
    padding: 0 5.26875vw;
}
.form-background-color input, .form-background-color select {
    border: 1px solid #141414;
    border-radius: 1.3020vw;
    font-family:  'Roboto', sans-serif !important;
    height: 2.8646vw;
    
    padding: 0.5210vw 0.1200vw 0.5210vw 1.0000vw;
    display: block;

    width: 100%;
    font-size: 1.200vw;
    opacity: 1;
    background-color: #ffffff;
} 
.form-background-color button {
    background-color: #EB212E;
    font-family:  'Roboto', sans-serif;
    color: #ffffff;
    border: 1px solid #EB212E;
    font-weight: 400;
    text-transform: uppercase;
    width: 18.125vw;
    padding: 0.36719vw 0;
    border-radius: 0;
    cursor: pointer;
    
 margin: 0.5208vw 0 1.40625vw 0;
   
    font-size: 1.302vw;
}
.DOB_text {
    font-family:  'Roboto', sans-serif;
 color: #51555D;
    font-size: 1.302vw;
    line-height: 1.1;
    padding: 1.0417vw 0;
    text-align: right;
}

/*====================*/
/* TWO COLUMN SECTION */
/*====================*/
 
.clearfix {
    display: block;
    width: 100% !important;
    clear: both;
    float: left;
}
.col-left {
    float: left;
    padding-right: 1.5128vw;
}
.col-right {
    float: right;
    padding-left: 1.5128vw;
}
.col-md-6 {
    width: 50%
}
.col-md-6-DOB {
  width: 50%;
}
.col-left-DOB {
  float: left;
  padding-right: 1.5128vw;
}
.col-right-DOB {
  float: right;
  padding-left: 1.5128vw;
}
.col-md-12 {
  width: 100%;
 }
 .col-center{
  margin: 0 auto;
  
  display: flex; justify-content: center;
 }
.text-col {
    width: 50%
}
.text-left {
    float: left;
    padding-right: 1.0419vw;
    text-align: left;
    font-size: 0.781vw;
}
.text-right {
    float: right;
    padding-left: 1.0419vw;
    text-align: right;
    font-size: 0.781vw;
}


 
/*====================*/
/* ERROR MESSAGE CSS */
/*====================*/
 

 
form .error {
    color: #FA7070 !important;
 
}
 input.error, select.error{
  border: 1px solid #FA7070 !important;
  color: #F96969 !important;
 }
 input.error::placeholder, select.error::placeholder{
  border: 1px solid #FA7070 !important;
  color: #F96969 !important;
 }
 
 
 
    option, input {
        color: #000000 !important;
    }
 
 
 
label {
    display: inline-block;
    max-width: 100%;
    margin-bottom: 5px;
 font-size: 0.60vw;
 padding-top: 0.1042vw;
 padding-left: 0.9375vw;
    font-weight: normal;
    position: absolute !important;
}
input.error::-webkit-input-placeholder{
    color:    #FA7070;
 border: none !important;
}
 
 
/*====================*/
/* PLACEHOLDER CSS */
/*====================*/
input::placeholder{
color: #51555D;
 opacity: 10;
}
.placeholder_text::-webkit-input-placeholder {
   text-transform: uppercase;
  color: #51555D;
}

.placeholder_text:-moz-placeholder { /* Firefox 18- */
   text-transform: uppercase; 
 color: #51555D;
}

.placeholder_text::-moz-placeholder {  /* Firefox 19+ */
   text-transform: uppercase;
 color: #51555D;
}

.placeholder_text:-ms-input-placeholder {  
   text-transform: uppercase;  
 color: #51555D;
}

.placeholder_text {
    text-transform: uppercase;  
}
.empty {
    color: #51555D !important;
} 
 
/*====================*/
/* GENDER INPUT STYLES */
/*====================*/
 
select:required:invalid {
  color: #51555D;
}
option[value=""][disabled] {
  display: none;
}
option {
  color: #000000;
}

/*====================*/
/* NUMBER INPUT ICON */
/*====================*/

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button { /* Chrome, Safari, Edge, Opera */
  -webkit-appearance: none;
  margin: 0;
}


input[type=number] { /* Firefox */
  -moz-appearance: textfield;
}
 
/*====================*/
/* MEDIA QUERIES */
/*====================*/
 
@media (max-width:74em)/* 74em = 1184 px */ { 
select { 
  text-align-last:center !important; 
  text-align: center !important;}
input[type="date"] { /* Safari */
  display:block;
  min-width: 96%;
}
input::placeholder{
color: #000000;
 opacity: 10;
}
.empty {
    color: #000000 !important;
}
select:required:invalid {
  color: #000000;
}
input.error, select.error{
  border: 1px solid #FA7070;
  color: #F96969 !important;
 }
 input.error::placeholder, select.error::placeholder{
  border: 1px solid #FA7070;
  color: #F96969 !important;
 }
label {
    display: inline-block;
    max-width: 100%;
    margin-top: 2px;
 font-size: 9px;
 padding-left: 0px;
 margin-bottom: 0px;
    font-weight: normal;
    position: relative !important;
}
a {
    color: #000000;
}
a:hover {
    color: #000000;
}
a:link {
    color: #000000;
}
.logo-img {
    width: 100% !important;
    align-content: center;
    display: inline-block;
}
.logoimg-container {
    width: 100% !important;
 max-width: 138px;
    position: relative;
    margin: auto;
    padding: 2.1rem 0 2.7rem;
}
.form-group {
  margin-bottom: 2rem;
 }
.form-background-color {
    width: 100% !important;
    height: auto !important;
    background-color: #ffffff;
    padding: 0rem;
    max-width: 60rem;
    margin: 1rem auto;
 text-align: center;
 
}
.em_mob_block {
    display: block !important;
}
.form-background-color input, .form-background-color select {
    font-size: 1.7rem;
    border: 1px solid #51555D;
    text-align-last:center !important; 
  text-align: center !important;
    height: 2.9rem;
 border-radius: 25px;
    padding: 0.1rem 1rem 0.1rem 1rem;
 
 
}
.bg_color {
 background-image: none;
    background-color: #ffffff;
}
.form-background-color button {
    color: #ffffff;
    
    width: 190px;
    padding: 1rem 1rem;
    border-radius: 0;
    cursor: pointer;
    
    font-size: 2rem;
 margin: 1rem auto 1.422rem auto;
}
.content-section {
    background-image: none;
    width: 100% !important;
    background-color: #ffffff;
}
.em_txt_white {
    color: #ffffff !important;
}
.form-box {
    width: 100% !important;
    margin: auto;
    padding-top: 0rem !important;
 padding-bottom: 0rem !important;
}
.form_headline p {
    margin-bottom: 1.7rem;
    font-size: 3.5rem;
    line-height: 1.2;
 color: #51555D;
}
.form_bodytext p {
    margin-bottom: 0.7rem;
    font-size: 2rem;
    line-height: 1.2;
    padding: 0rem 9rem;
 color: #51555D;
}
.small-text p {
    font-size: 1.8rem;
    line-height: 1.2;
    padding: 0rem 9rem;
 color: #51555D;
 margin-bottom: 2rem;
}
.main-form {
    padding: 0 2.5rem;
}
.col-left {
    padding-right: 0rem;
}
.col-right {
    padding-left: 0rem;
}
.col-md-6 {
    width: 100%
}
.text-col {
    width: 100%
}
.text-left {
    padding: 0 0.7rem;
    text-align: left;
    font-size: 1rem;
}
.text-right {
    padding-left: 0rem;
    text-align: center;
    font-size: 1rem;
    line-height: 1.2;
    padding-bottom: 2.5rem;
}
.hide {
    display: none!important;
}
.DOB_text {
    
 color: #000000;
    font-size: 1.6rem;
    line-height: 1.1;
    padding: 0.57rem 1rem 0.57rem 1rem;
    text-align: center;
}
} 


@media (max-width:48em)/* 48em = 768 px */ {
select { 
  text-align-last:center !important; 
  text-align: center !important;}
input[type="date"] { /* Safari */
  display:block;
  min-width: 96%;
}
input::placeholder{
color: #000000;
 opacity: 10;
}
.empty {
    color: #000000 !important;
}
select:required:invalid {
  color: #000000;
}
input.error, select.error{
  border: 1px solid #FA7070;
  color: #F96969 !important;
 }
 input.error::placeholder, select.error::placeholder{
  border: 1px solid #FA7070;
  color: #F96969 !important;
 }
label {
    display: inline-block;
    max-width: 100%;
    margin-top: 2px;
 font-size: 9px;
 padding-left: 0px;
 margin-bottom: 0px;
    font-weight: normal;
    position: relative !important;
}
a {
    color: #000000;
}
a:hover {
    color: #000000;
}
a:link {
    color: #000000;
}
.logo-img {
    width: 100% !important;
    align-content: center;
    display: inline-block;
}
.logoimg-container {
    width: 100% !important;
 max-width: 118px;
    position: relative;
    margin: auto;
    padding: 2.1rem 0 2.7rem;
}
.form-group {
  margin-bottom: 1.7rem;
 }
.form-background-color {
    width: 100% !important;
    height: auto !important;
    background-color: #ffffff;
    padding: 0rem;
    max-width: 55rem;
    margin: 1rem auto;
 text-align: center;
 
}
.em_mob_block {
    display: block !important;
}
.form-background-color input, .form-background-color select {
    font-size: 1.6rem;
    border: 1px solid #51555D;
    text-align-last:center !important; 
  text-align: center !important;
    height: 2.8rem;
 border-radius: 25px;
    padding: 0.1rem 1rem 0.1rem 1rem;
 
 
}
.bg_color {
    background-color: #ffffff;
}
.form-background-color button {
    color: #ffffff;
    
    width: 190px;
    padding: 1rem 1rem;
    border-radius: 0;
    cursor: pointer;
    
    font-size: 2rem;
 margin: 1rem auto 1.422rem auto;
}
.content-section {
    background-image: none;
    width: 100% !important;
    background-color: #ffffff;
}
.em_txt_white {
    color: #ffffff !important;
}
.form-box {
    width: 100% !important;
    margin: auto;
    padding-top: 0rem !important;
 padding-bottom: 0rem !important;
}
.form_headline p {
    margin-bottom: 1.7rem;
    font-size: 3rem;
    line-height: 1.2;
 color: #51555D;
}
.form_bodytext p {
    margin-bottom: 0.7rem;
    font-size: 1.8rem;
    line-height: 1.2;
    padding: 0rem 9rem;
 color: #51555D;
}
.small-text p {
    font-size: 1.4rem;
    line-height: 1.2;
    padding: 0rem 9rem;
 color: #51555D;
 margin-bottom: 2rem;
}
.main-form {
    padding: 0 2.5rem;
}
.col-left {
    padding-right: 0rem;
}
.col-right {
    padding-left: 0rem;
}
.col-md-6 {
    width: 100%
}
.text-col {
    width: 100%
}
.text-left {
    padding: 0 0.7rem;
    text-align: left;
    font-size: 1rem;
}
.text-right {
    padding-left: 0rem;
    text-align: center;
    font-size: 1rem;
    line-height: 1.2;
    padding-bottom: 2.5rem;
}
.hide {
    display: none!important;
}
.DOB_text {
    
 color: #000000;
    font-size: 1.6rem;
    line-height: 1.1;
    padding: 0.57rem 1rem 0.57rem 1rem;
    text-align: center;
}
}


@media (max-width:38em)/* 38em = 608 px */ {
input[type="date"] { /* Safari */
  display:block;
  min-width: 96%;
}
.form_headline p {
    margin-bottom: 1.7rem;
    font-size: 2.3rem;
    line-height: 1.2;
}
.form_bodytext p {
    font-size: 1.6rem;
 line-height: 1.2;
    padding: 0rem 7.8rem;
}
.small-text p {
    font-size: 1.4rem;
    line-height: 1.2;
    padding: 0rem 6rem;
}

}

@media (max-width:30em)/* 30em = 480 px */ {
input[type="date"] { /* Safari */
  display:block;
  min-width: 96%;
}
.main-form {
  padding: 0 1.5rem;
}
.form_headline p {
    margin-bottom: 1.7rem;
    font-size: 2.4rem;
    line-height: 1.2;
}
.form_bodytext p {
    font-size: 1.5rem;
    line-height: 1.2;
    padding: 0rem 4.5rem;
}
.small-text p {
    font-size: 1.2rem;
    line-height: 1.2;
    padding: 0rem 3.1rem;
    margin-bottom: 2rem;
}
.form-background-color input, .form-background-color select {
    font-size: 1.3rem;
    border: 1px solid #51555D;
 border-radius: 25px;
    text-align-last:center !important; 
  text-align: center !important;
    height: 2.4rem;
    padding: 0.4rem 1rem 0.4rem 1rem;
 
}
.form-background-color button {
    width: 130px;
    font-size: 1.8rem;
}
.DOB_text {
    
 color: #000000;
    font-size: 1.3rem;
    line-height: 1.1;
    padding: 0.49rem 1rem 0.49rem 1rem;
    text-align: center;
}
}

@media (max-width:23em)/* 23em = 368 px */ {
input[type="date"] { /* Safari */
  display:block;
  min-width: 96%;
}
.content-section {
    width: 100% !important;
    background-color: #ffffff;
}
.form_headline p {
    margin-bottom: 1.4rem;
    font-size: 2.1rem;
    line-height: 1.2;
}
.form_bodytext p {
    font-size: 1.3rem;
 line-height: 1.2;
    padding: 0rem 2.5rem;
}
.small-text p {
    font-size: 1.1rem;
    line-height: 1.2;
    padding: 0rem 2rem;
}
.form-background-color input, .form-background-color select {
    font-size: 1.2rem;
    border: 1px solid #51555D;
 border-radius: 25px;
    text-align-last:center !important; 
  text-align: center !important;
    height: 2.3rem;
    padding: 0.4rem 1rem 0.4rem 1rem;
 
}
.form-background-color button {
    width: 110px;
    font-size: 1.5rem;
}
.DOB_text {
    
 color: #000000;
    font-size: 1.2rem;
    line-height: 1.1;
    padding: 0.49rem 1rem 0.49rem 1rem;
    text-align: center;
}
}
