* {
font-family: "Roboto", sans-serif;
}
body {
margin: 0 auto;
}
p {
margin: 0px 0 5px;
}
.container {
display: block;
height: 100vh;
width: 100vw;
padding:0;
}
.left-section {
height: 100px;
background-position: top;
background-repeat: no-repeat;
background-size: cover;
background-image: url("https://image.email.groupeseb.com/lib/fe3611717564047d721177/m/1/04017fa6-0c3e-4143-ac17-40111ddc1442.png");
}
.right-section {
width: 90%;
background-color: white;
margin: auto;
padding: 1em 0 0 0;
}
.logo-img {
position: relative;
display: block;
margin-left: auto;
margin-right: auto;
width: 234px;
top: 25%;
}
.form-group {
margin-top: 0.75em;
}
.form-title {
font-size: 1.5em;
color: #106A96;
font-weight:bold;
margin: 0;
font-family: "Oxanium", sans-serif;
}
.form-subtitle {
font-size: 1.2857em;
color: #000000;
font-weight: bold;
margin: 0;
font-family: "Oxanium", sans-serif;
}
.form-description{
font-size: 0.8571em;
color: #595959;
margin: 1.5em 0;
}
label {
display: block;
font-weight: bold;
font-size: 0.625em;
}
input[type="text"],
input[type="email"],
select {
width: 96%;
font-size: 1em;
background: #ffffff !important;
color: #363636;
padding: 0.75em;
margin: 0.5em 0;
border: 1px solid #ccc;
border-radius: 4px;
-ms-box-sizing: content-box;
-moz-box-sizing: content-box;
-webkit-box-sizing: content-box;
box-sizing: content-box;
}
button {
padding: 10px 20px;
background-color: #4caf50;
color: white;
border: none;
border-radius: 4px;
cursor: pointer;
}
.form-button-center {
text-align: center;
width: 100%;
margin-top: 2.5em;
}
.form-button {
background-color: #ff001d;
font-family: "Roboto", sans-serif;
color: #ffffff;
border: 1px solid #ff001b;
font-weight: 400;
text-transform: uppercase;
padding: 0.75em 2em;
border-radius: 0;
cursor: pointer;
margin: 0.5208vw 0 1.40625vw 0;
font-size: 0.875em;
border-radius: 0.25em;
font-weight: bold;
letter-spacing: 1px;
}
.mandatory-fields {
font-size: 0.75em;
padding: 2em 0 1em 0;
}

@media only screen and (min-width: 480px) and (max-width: 1024px) {
.left-section {
height: 16%;
}
.right-section {
padding: 0 2em;
}
.form-title {
font-size: 2.5em;
}
.form-group {
margin-top: 1em;
}
.logo-img {
width: 33%;
}
label {
font-size: 1.1em;
}
.agree-text {
font-size: 0.9em;
}
input[type="checkbox"] {
transform: scale(2);
height: 40px;
}
.form-button {
font-size: 1.3em;
margin: 2.5208vw 0 1.40625vw 0;
}
}
@media only screen and (min-width: 1024px) {
.form-title {
padding: 3vh 1em 0.7vh 0em;
font-size: 2.4285em;
color: #106A96;
}
.container {
display: table;
height: 100vh !important;
}
.left-section {
display: table-cell;
width: 60%;
height: 100vh;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
background-image: url("https://image.email.groupeseb.com/lib/fe3611717564047d721177/m/1/1ce1c43d-0490-410d-847d-c400137c8958.png");
}
.right-section {
display: table-cell;
width: 40%;
height: 100vh;
background-color: white;
padding: 3em 3.8125em 0 3.8125em;
}
.logo-img {
position: relative;
display: block;
width: auto;
top: 0%;
left: 5%;
margin: 0;
}
label {
display: block;
font-weight: bold;
font-size: 0.625em;
}
input[type="text"],
input[type="email"],
select {
width: 96%;
padding: 10px;
font-size: 1em;
border: 1px solid #ccc;
border-radius: 4px;
-ms-box-sizing: content-box;
-moz-box-sizing: content-box;
-webkit-box-sizing: content-box;
box-sizing: content-box;
}
.mandatory-fields {
font-size: 0.75em;
padding: 0.5em 0 0 0;
}
}
@media (min-width: 768px) and (max-width: 992px) {
.list-group-item {
flex-direction: column;
width: 100%;
border-top: 1px solid #ccc !important;
height: auto !important;
border-radius: 0px !important;
}
.list-group-item .row {
display: flex;
}
.list-group-item img {
max-width: 100%;
height: auto;
}
.desk-none {
display: block !important;
}
}
@media (max-width: 768px) {
.row {
padding-left: 0px !important;
}
.list-group {
padding: 0px !important;
overflow: hidden !important;
height: auto !important;
}
.list-group-item {
flex-direction: column;
width: 100%;
border-top: 1px solid #ccc !important;
height: auto !important;
border-radius: 0px !important;
padding: 8px 15px 0px 15px;
}
.list-group-item .row {
display: flex;
}
.list-group-item img {
margin-bottom: 10px;
max-width: 100%;
height: auto;
}
.desk-none {
display: block !important;
}

.btn-accept{
width: 100%;
height: 2.8em;
}
.modal-dialog{
  width: 90vw !important;
}
.form-title{
font-size: 1.8em;
}
.cant-find-country .form-description{
font-size: 0.9em;
}
}


.list-group {
height: 55vh;
overflow: auto;
}
.list-group-item {
background-color: #ffffff;
border: none;
padding: 10px 15px;
height: auto;
max-height: 56px;
}
.list-group-item img {
width: 45px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
}
.list-group-item h4 {
font-size: 0.9375em;
margin: 0 !important;
color: #000000;
font-weight: bold;
}
.list-group-item p {
font-size: 12px;
color: #595959;
}
.list-group-item:hover {
background-color: #f7f7f7;
}
.desk-none {
display: none;
}
.modal {
display: none;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.5);
z-index: 1050;
}
.modal-dialog {
    width: 55vw;
    margin: 30vh auto;
}
.modal-content {
border-radius: 0px;
background-color: #fff;
}
.modal-header {
    display: flex;
    background-color: #ffffff;
    padding: 1em 1em 1em 2em;
}
.modal-title {
    font-size: 1.5em;
    font-weight: bold;
}
.modal-body {
    padding: 1em 2em;
}
.modal-footer {
padding: 10px 15px;
text-align: right;
border: none !important;
}
.btn-close {
    background-color: #106A96;
    color: #fff;
    font-size: 17px;
    cursor: pointer;
    padding: 0px 10px;
    position: relative;
    margin-left: auto;
    margin-right: 0;
}
.btn-accept{
background-color: #106A96;
color: #fff;
font-size: 0.875em;
width: 9em;
height: 3em;
}
.btn-accept:hover{
color: #fff;
}
.cant-find-country {
cursor: pointer;
text-align: right;
color: #106A96;
text-decoration: underline;
font-size: 0.8571em;
font-weight: bold;
}
::-webkit-scrollbar {
  width: 8px;
  background-color: rgba(227, 227, 232, 0.3);
  opacity: 30%;
}

::-webkit-scrollbar-thumb {
  background-color: rgba(227, 227, 232, 1);
  border-radius: 100px;
}
@media only screen and (min-width: 1024px) and (max-width: 1300px) {
  .list-group-item img{
     width: 35px;
  }
}
@media only screen and (min-width: 1800px) {
  .list-group-item img{
     width: 50px;
  }
}