@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');
*::before,
*::after {
  box-sizing:border-box;
  -webkit-box-sizing:border-box;
  -moz-box-sizing:border-box;
  -o-box-sizing:border-box;
  -ms-box-sizing:border-box;
  outline: none;
}

html, body {
  font-family: "Inter", sans-serif;
  font-weight: 400;
  font-size:18px;
  line-height:1.5;
  padding:0;
  margin:0;
  transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease;
}

a {
  color:#F8E9BD;
  text-decoration:none;
  transition:all .5s ease;
  -webkit-transition:all .5s ease;
  -moz-transition:all .5s ease;
  display: inline-block;
}


@font-face {
    font-family: 'abu_dhabi_basisbold';
    src: url('../font/abudhabibasis-bold.woff2') format('woff2'),
         url('../font/abudhabibasis-bold.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'abu_dhabi_basismedium';
    src: url('../font/abudhabibasis-medium.woff2') format('woff2'),
         url('../font/abudhabibasis-medium.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

.main-content-block{margin: 0px; padding: 0px; height: 100vh; display: flex; align-items: center;}
.main-content-block .leftphoto{width: 50%; height: 100%; position: relative; overflow: hidden; background: #4c1348; padding: 72px 30px 30px 30px;}
.main-content-block .leftphoto .top-part{position: relative; z-index: 1;}
.main-content-block .leftphoto .logo{ width: 176px; margin: 0 auto 52px auto; display: block;}
.main-content-block .leftphoto .logo img{ width: 100%; position: relative;}
.main-content-block .leftphoto .bottom-img{width: 80%; position: absolute; left: 10%; bottom: 0;}
.main-content-block .leftphoto h1{font-weight: 700; font-size: 45px; line-height: 62px; text-align: center; color: #B696FE; position: relative; padding-bottom: 20px; margin: 0 0 20px 0; letter-spacing: -2%; font-family: 'abu_dhabi_basisbold';}
.main-content-block .leftphoto h1 span{font-family: 'abu_dhabi_basisbold';}
.main-content-block .leftphoto h1::before{content: ''; width: 310px; height: 1px; background: #fff; left: 50%; margin-left: -155px; position: absolute; bottom:0px;}
.main-content-block .leftphoto .event-info{display: flex; justify-content: center; align-items: center; margin-bottom: 28px;}
.main-content-block .leftphoto .event-info .small-block{font-family: 'abu_dhabi_basismedium'; font-size: 10px; text-transform: uppercase; letter-spacing: 2%; color: #fff; line-height: 16px; text-align: center;}
.main-content-block .leftphoto .event-info .small-block strong{display: block; font-size: 50px; line-height: 60px;}
.main-content-block .leftphoto .event-info .location{font-family: 'abu_dhabi_basismedium'; font-size: 17px; line-height: 22px; letter-spacing: 1%; text-transform: uppercase; color: #fff; text-align: center; padding: 10px 12px; border-right: #fff 1px solid; border-left: #fff 1px solid; margin: 0 12px;}
.main-content-block .leftphoto .event-info .location span{display: block; font-size: 10px; line-height: 12px;}
.main-content-block .leftphoto .event-info .location .sub { font-size: 10px; line-height: 16px; font-weight: 400; }
.main-content-block .leftphoto .box-text { border: 1px solid #9872cc; width: fit-content; margin: auto; padding: 6px 12px 4px 12px; margin-bottom: 30px; }
.main-content-block .leftphoto .box-text p { font-family: 'abu_dhabi_basismedium'; font-size: 10px; line-height: 12px; letter-spacing: 1%; color: #fff; text-align: center; margin: 0 0 2px; font-weight: 300; }
.main-content-block .leftphoto .white-btn-area{display: flex; flex-direction: column; align-items: center; gap:12px}
.main-content-block .leftphoto .white-btn-area a{font-family: 'abu_dhabi_basismedium'; background: #fff; min-width: 150px; text-align: center; color: #4B1347; font-size: 13px; line-height: 16px; padding: 4px 22px 3px 22px; border-radius: 15px;}
.main-content-block .leftphoto ul{margin: 0 -4px; padding: 0; list-style: none; display: flex;}
.main-content-block .leftphoto ul li{width: 33.33%; padding: 0 4px;}
.main-content-block .leftphoto ul li .info{background: linear-gradient(270.6deg, rgba(255, 255, 255, 0.13) 0.5%, rgba(182, 150, 254, 0.13) 99.5%); border-radius: 3px; font-weight: 600; font-size: 15px; line-height: 100%; letter-spacing: -0.3px; padding: 14px 5px 14px 12px; color: #fff; display: flex; align-items: center;}
.main-content-block .leftphoto ul li .info img{vertical-align: top; margin-right: 5px;}
.main-content-block .leftphoto ul li .info span{font-weight: 400; margin-left: 2px;}
.main-content-block .leftphoto .download-area{text-align: center; position: relative; z-index: 1; margin: 50px 0 0 0;}
.main-content-block .leftphoto .download-area h3{font-size: 16px; line-height: 20px; color: #fff; font-weight: 600; margin: 0 0 15px 0; padding-bottom: 15px; position: relative;}
.main-content-block .leftphoto .download-area h3::before{content: ''; position: absolute; bottom: 0px; left: 50%; width: 82px; margin-left: -41px; height: 1px; background: #fff;}
.main-content-block .leftphoto .download-area .link{display: flex; gap: 30px; justify-content: center;}
.main-content-block .leftphoto .download-area .link a{text-decoration: underline; font-size: 16px; line-height: 20px; color: #fff; font-weight: 400; letter-spacing: -0.3px;}
.main-content-block .form-area{width: 50%; padding: 75px 148px; height: 100%; overflow-y: scroll;}
.main-content-block .form-area h2{font-size: 30px; line-height: 36px; color: #4C0C48; font-weight: 700; margin: 0 0 10px 0; text-align: center;}
.main-content-block .form-area p{font-size: 16px; line-height: 24px; letter-spacing: -0.3px; text-align: center; color: #00283B; margin: 0 auto 26px auto; max-width: 400px;}
.main-content-block .form-area .form-group{margin-bottom: 15px}
.main-content-block .form-area .form-group label{font-weight: 500; font-size: 14px; line-height: 100%; letter-spacing: -0.1px; color: #4C0C48; margin: 0 0 10px 0; display: block; }
.main-content-block .form-area .form-group .form-control{border: 1px solid #DEDFE3; color: #000; font-size: 16px; font-weight: 400; line-height: 16px; height: auto; padding: 15px; border-radius: 2px;}
.main-content-block .form-area .form-group .form-select{border: 1px solid #DEDFE3; color: #000; font-size: 16px; font-weight: 400; line-height: 16px; height: auto; padding: 17px 15px; border-radius: 2px;}
.main-content-block .form-area .form-group .form-control:focus,
.main-content-block .form-area .form-group .form-select:focus{box-shadow: none; border: #4C0C48 1px solid}
.main-content-block .form-area .form-group .form-control::placeholder {color: #B6B6B6; opacity: 1;}
.main-content-block .form-area .form-group .form-control::-ms-input-placeholder {color: #B6B6B6;}
.iti.iti--allow-dropdown {
  width: 100%;
}
.iti__flag-container{width: 120px;}
.iti.iti--allow-dropdown .form-control {
  padding-left: 130px !important;
}
.main-content-block .form-area .form-group .phone-code{display: flex; gap: 8px;}
.main-content-block .form-area .form-group .phone-code .form-control:first-child{width: 100px;}
.main-content-block .form-area .form-group .radio-area{display: flex; gap: 24px; padding-bottom: 5px;}
.main-content-block .form-area .form-group .radio-area input[type=radio].css-radio {position:absolute; z-index:-1000; left:-1000px; overflow: hidden; clip: rect(0 0 0 0); height:1px; width:1px; margin:-1px; padding:0; border:0; }
.main-content-block .form-area .form-group .radio-area input[type=radio].css-radio + label.css-radiolabel{padding-left:28px; cursor:pointer; position: relative; margin: 0px; font-weight: 500; font-size: 14px; line-height: 20px; letter-spacing: -0.3px; color: #000;}
.main-content-block .form-area .form-group .radio-area input[type=radio].css-radio + label.css-radiolabel::before{content: ''; position: absolute; top: 0px; left: 0px; width: 20px; height: 20px; border-radius: 50%; border: #D9DDE6 1px solid}
.main-content-block .form-area .form-group .radio-area input[type=radio].css-radio:checked + label.css-radiolabel::after{content: ''; width: 10px; height: 10px; background: #4C0C48; position: absolute; top: 5px; left: 5px; border-radius: 50%}
.main-content-block .form-area .form-group .radio-area input[type=radio].css-radio:checked + label.css-radiolabel::before{border: #4C0C48 1px solid}
.main-content-block .form-area .btn-area{margin-top: 26px; text-align: center;}
.main-content-block .form-area .btn-submit{border-radius: 2px; border: 1px solid #4C0C48; background: #4C0C48; line-height: 16px; color: #FFF; font-size: 16px; font-weight: 600; letter-spacing: -0.3px; text-decoration: none; padding: 18px 65px;}
.main-content-block .form-area .btn-submit:hover{background: #fff; color: #4C0C48}
.main-content-block .leftphoto .white-btn-area a:hover {background: #B696FE; color: #fff;}

@media only screen and (max-width: 1366px) {
  .main-content-block .leftphoto{padding: 50px 30px 30px 30px;}
  .main-content-block .leftphoto .logo{margin: 0 auto 40px auto;}
  .main-content-block .leftphoto ul li .info{font-size: 14px;}
  .main-content-block .leftphoto .download-area{margin:30px 0 0 0;}
}
@media only screen and (max-width: 1024px) {
  .main-content-block{display: block;}
  .main-content-block .leftphoto{width: 100%; height: auto; padding: 0px;}
  .main-content-block .leftphoto .bottom-img{position: relative;}
  .main-content-block .leftphoto .logo{margin: 0 auto 30px auto;}
  .main-content-block .leftphoto .top-part{padding: 30px 30px 0 30px;}
  .main-content-block .leftphoto h1{font-size: 30px; line-height: 38px;}
  .main-content-block .leftphoto .download-area{margin: 30px 0 0 0;}
  .main-content-block .form-area{width: 100%; padding: 40px; height: auto; overflow-y: auto;}

}

@media only screen and (max-width: 767px) {
  .main-content-block .leftphoto .top-part{padding: 30px 20px 10px 20px;}
  .main-content-block .leftphoto .logo {width: 140px; margin: 0 auto 30px auto;}
   .main-content-block .leftphoto h1 {font-size: 22px; line-height: 28px; margin: 0 0 18px 0;  }
   .main-content-block .leftphoto ul{display: block; margin: 0px;}
   .main-content-block .leftphoto ul li {width: 100%; padding: 2px 0;}
   .main-content-block .leftphoto ul li .info{font-size: 13px; padding: 8px 5px 8px 12px;}
    .main-content-block .leftphoto .download-area{margin: 15px 0 0 0;}
    .main-content-block .leftphoto .download-area h3{font-size: 14px; line-height: 16px;}
    .main-content-block .leftphoto .download-area .link{gap: 20px;}
    .main-content-block .leftphoto .download-area .link a{font-size: 13px; line-height: 16px;}
    .main-content-block .leftphoto .event-info .small-block strong{font-size: 36px; line-height: 40px;}
    .main-content-block .leftphoto .event-info .location{font-size: 14px; margin: 0 10px; padding: 8px 10px;}
  .main-content-block .form-area{padding: 20px;}
  .main-content-block .form-area h2{font-size: 24px; line-height: 30px;}
  .main-content-block .form-area p{font-size: 14px; line-height: 20px; margin: 0 auto 18px auto;}
  .main-content-block .form-area .form-group label{font-size: 12px; padding-left: 0; margin: 0 0 7px 0;}
  .main-content-block .form-area .form-group .form-control{font-size: 14px; line-height: 20px; padding: 10px 15px;}
  .main-content-block .form-area .form-group .form-select{font-size: 14px; line-height: 20px; padding: 10px 15px;}
  .main-content-block .form-area .form-group .phone-code .form-control:first-child{width: 80px;}
  .main-content-block .form-area .form-group .radio-area{padding-left: 0px;}
  .main-content-block .form-area .btn-area{margin-top: 0;}
  .main-content-block .form-area .btn-submit{width: 100%; font-size: 14px; padding: 12px 65px;}
  .iti__flag-container {width: 90px; font-size: 14px;}
  .iti.iti--allow-dropdown .form-control { padding-left: 100px !important;}
  .main-content-block .leftphoto .event-info .location .sub { font-size: 8px; line-height: 14px; font-weight: 400; }
  .main-content-block .leftphoto .box-text p {font-size: 8px; line-height: 10px; }

}

/* Media query for 1920x1080 at 125% scaling (effective 1536x864) */
@media only screen and (max-width: 1536px) and (min-width: 1367px) {
  .main-content-block .leftphoto{padding: 18px 25px 18px 25px;}
  .main-content-block .leftphoto .bottom-img{width: 84%; left: 8%;}
  .main-content-block .leftphoto .logo{width: 165px; margin: 0 auto 25px auto;}
  .main-content-block .leftphoto h1{font-size: 34px; line-height: 44px; margin: 0 0 15px 0; padding-bottom: 18px;}
  .main-content-block .leftphoto h1::before{width: 280px; margin-left: -140px;}
  .main-content-block .leftphoto .event-info{margin-bottom: 15px;}
  .main-content-block .leftphoto .event-info .small-block strong{font-size: 40px; line-height: 45px;}
  .main-content-block .leftphoto .event-info .location{font-size: 16px; line-height: 21px; padding: 10px 12px;}
  .main-content-block .leftphoto ul li .info{font-size: 14px; padding: 13px 5px 13px 11px;}
  .main-content-block .leftphoto .download-area{margin: 42px 0 0 0;}
  .main-content-block .leftphoto .download-area h3{font-size: 15px; line-height: 19px;}
  .main-content-block .leftphoto .download-area .link{gap: 28px;}
  .main-content-block .leftphoto .download-area .link a{font-size: 15px;}
  .main-content-block .form-area{padding: 70px 130px;}
  .main-content-block .form-area h2{font-size: 29px; line-height: 35px;}
  .main-content-block .form-area p{font-size: 16px; line-height: 23px;}
  .main-content-block .leftphoto .box-text{margin-bottom: 14px;}
  .main-content-block .leftphoto .white-btn-area {gap: 8px;}
}

/* Media query for 1920x1080 at 150% scaling (effective 1280x720) */
@media only screen and (max-width: 1280px) and (min-width: 1025px) {
  .main-content-block .leftphoto{padding: 18px 25px 18px 25px;}
  .main-content-block .leftphoto .bottom-img{width: 80%; left: 10%;}
  .main-content-block .leftphoto .logo{width: 140px; margin: 0 auto 15px auto;}
  .main-content-block .leftphoto h1{font-size: 24px; line-height: 32px; margin: 0 0 10px 0; padding-bottom: 15px;}
  .main-content-block .leftphoto h1::before{width: 250px; margin-left: -125px;}
  .main-content-block .leftphoto .event-info{margin-bottom: 12px;}
  .main-content-block .leftphoto .event-info .small-block strong{font-size: 42px; line-height: 50px;}
  .main-content-block .leftphoto .event-info .location{font-size: 15px; line-height: 20px; padding: 8px 10px;}
  .main-content-block .leftphoto ul li .info{font-size: 13px; padding: 12px 5px 12px 10px;}
  .main-content-block .leftphoto .download-area{margin: 35px 0 0 0;}
  .main-content-block .leftphoto .download-area h3{font-size: 15px; line-height: 18px;}
  .main-content-block .leftphoto .download-area .link{gap: 25px;}
  .main-content-block .leftphoto .download-area .link a{font-size: 15px;}
  .main-content-block .form-area{padding: 60px 100px;}
  .main-content-block .form-area h2{font-size: 28px; line-height: 34px;}
  .main-content-block .form-area p{font-size: 15px; line-height: 22px;}
  .main-content-block .leftphoto .box-text{margin-bottom: 14px;}
  .main-content-block .leftphoto .white-btn-area {gap: 8px;}

}