/**
 * Fonts
 */
 @font-face {
    font-family: DiorFont;
    src: url(fonts/Dior-Bold.ttf);
  }

@font-face {
  font-family: CenturyGothic;
  src: url(fonts/CenturyGothic.woff2);
}

@font-face {
  font-family: CenturyGothic-Bold;
  src: url(fonts/CenturyGothic-Bold.woff2);
}


  
  /**
   * Main CSS
   */
  body {
    overscroll-behavior: contain;  
    background-color: #fff;
    font-family: CenturyGothic, var(--bs-font-sans-serif);
    /* padding-bottom: env(safe-area-inset-bottom)+10rem; */
  }
  
  a{
    color: #000;
  }

  /* .default_desktop_background {
    background-color: black !important;
    background-image: url("../assets/common/image/oil_ball_01.png"), url("../assets/common/image/oil_ball_02.png"), url("../assets/common/image/water_ball.png"), url("../assets/common/image/dome.png"), url("../assets/common/image/star_bg.png"), url("../assets/common/image/oil_water_ball.png"), url("../assets/common/image/galaxy.png");
    background-position: top -25vmin left -15vmin, top 11vmin right 14vmin, top 10vmin left 30vmin, bottom 32vmin right calc(15vw - 15vmin), top, bottom -75vmin right calc(20vw - 60vmin), top -40vmin center;
    background-size: 50vmin 50vmin, 20vmin 20vmin, 22.5vmin 22.5vmin, auto 30vmin, 100% auto, 120vmin 120vmin, 100% auto;
    background-repeat: no-repeat, no-repeat, no-repeat, no-repeat, repeat-y, no-repeat, no-repeat;
  } */
  
  #root {
    margin: 0 auto;
    position: relative;
    color: #000;
    padding: 1rem 0;
    max-width: 500px;
  }

  img {
    -webkit-touch-callout: none; /* iOS Safari */
      -webkit-user-select: none; /* Safari */
       -khtml-user-select: none; /* Konqueror HTML */
         -moz-user-select: none; /* Old versions of Firefox */
          -ms-user-select: none; /* Internet Explorer/Edge */
              user-select: none; /* Non-prefixed version, currently
                                    supported by Chrome, Edge, Opera and Firefox */
  }
  
  /**
   * Project Form Control
   */
  /* .col-form-label {
    padding-left: .75rem;
  } */

  .form-control,
  .form-select{ 
    box-shadow: none !important;
    border: 1px solid #555555 !important;

  }

  .form-control:focus,
  .form-select:focus{ 
    border: 1px solid #555555 !important;
  }
/*   
  .form-control ~ .invalid-feedback,
  .form-select ~ .invalid-feedback,
  .form-control ~ .valid-feedback,
  .form-select ~ .valid-feedback {
    padding-left: .75rem;
  }
   */
  .form-select {
    background-image: url('../assets/image/select_icon.svg') !important;
    background-size: 12px 8px !important;
  }
  
  .form-select:not(:valid) {
    color: rgb(191, 191, 191);
  }
  
  .form-select option:not(:disabled) {
    color: #000;
    /* color: rgb(191, 191, 191); */

  }

  .input-group {
    margin: 0.5rem auto;
  }
  
  .input-group>.region-code-select {
    flex-basis: 5rem !important;
    flex-grow: unset !important;
    padding-left: .5rem;
    padding-right: 0;
    z-index: 0 !important;
    border-right-width: 0;
  }
  
  .input-group>.region-code-select+* {
    z-index: 1;
  }
  
  /* .input-group>.mobile-input {
    border-right-width: 0;
  } */
  
  /* .input-group>.btn_verify {
    border-left-width: 0;
  } */
  
  .input-group>.first-input {
    border-top-left-radius: 0rem !important;
    border-bottom-left-radius: 0rem !important;
  }
  
  /* .input-group>.last-input {
    border-top-right-radius: 0rem !important;
    border-bottom-right-radius: 0rem !important;
  } */
  
  .form-check-label{
    background-color: transparent;
    /* color: white; */
  }

  .form-check-input {
    margin-top: calc(.25em + .1em);
    background-color: transparent;
    border: 1px solid #000;
    /* box-shadow: 0 0 5px #9c5810, 0 0 10px #9c5810, 0 0 15px #9c5810; */
  }
  
  .form-check-input:checked,
  .form-check-input:focus {
    color: #000 !important;
    border-color: #000 !important;
    background-color: transparent;
  }
  
  .form-check-input+label {
    font-size: .8em;
    padding-top: .35em;
  }
  
  .form-check-input:not(:checked) + label > .active {
    display: none;
  }
  
  .form-check-input:checked + label > .inactive {
    display: none;
  }
  
  input:-webkit-autofill {
    -webkit-text-fill-color: rgb(0, 0, 0);
    -webkit-box-shadow: 0 0 0px 1000px rgba(110, 94, 73, 1) inset;
  }
  
  input:-webkit-autofill:hover,
  input:-webkit-autofill:focus,
  input:-webkit-autofill:active {
    -webkit-text-fill-color: rgb(0, 0, 0);
    -webkit-box-shadow: 0 0 0px 1000px rgba(110, 94, 73, 1) inset;
    transition: background-color 5000s ease-in-out 0s;
  }
  
  /**
   * Project btn
   */
  .btn {
    box-shadow: none;
  }

  .btn:not(.disabled) .inactive {
    display: none;
  }
  
  .btn.disabled .active {
    display: none;
  }
  
  .btn.disabled {
    background-color: #888888;
    border-color: #888888;
  }
  
  .btn-outline-primary, .btn-outline-secondary,
  .btn-primary, .btn-secondary {
    color: #000;
    /* border-color: white; */
    border: 1px solid #555555;
    border-radius: 3rem;
    /* box-shadow: 0 0 5px rgb(156, 88, 16), 0 0 10px rgb(156, 88, 16), 0 0 15px rgb(156, 88, 16);
    text-shadow: 0 0 5px #894d06, 0 0 5px #894d06, 0 0 5px #894d06; */
  }
  
  .btn-outline-primary:focus, .btn-outline-secondary:focus,
  .btn-primary:focus, .btn-secondary:focus,
  .btn-outline-primary:active, .btn-outline-secondary:active,
  .btn-primary:active, .btn-secondary:active,
  .btn-outline-primary:hover, .btn-outline-secondary:hover,
  .btn-primary:hover, .btn-secondary:hover {
    /* background-color: rgb(240, 191, 105); */
    text-shadow: none;
    /* color: white; */
  }

  .btn-project {
    min-width: 8rem;
    margin: 1rem;
    padding: 1rem 4rem;
  }

  .btn-project:focus,
  .btn-project:active,
  .btn-project:hover {
    background-color: #000;
    color: #fff;
  }

  .btn-inverse {
    background-color: #000;
    color: #fff;
  }

  .btn-inverse:focus,
  .btn-inverse:active,
  .btn-inverse:hover {
    background-color: #fff;
    color: #000;
  }

  /**
   * Bootstrap Modal CSS
   */
  .modal-sm {
    max-width: 300px;
    margin: 0.5rem auto;
  }
  
  .modal .modal-title {
    position: relative;
    min-height: 1em;
  }
  
  .modal .modal-content {
    filter: drop-shadow(2px 2px 4px #666666);
    max-height: calc(100vh - 100px);

    max-height: calc(100dvh - 100px);
  }
  
  .long-modal .modal-content {
    --scroll-fadeIn-height: 2rem;
  }
  
  .long-modal .modal-header::after {
    content: " ";
    position: absolute;
    top: 100%;
    left: 0;
    height: var(--scroll-fadeIn-height);
    width: 100%;
    /* background: linear-gradient(to bottom, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0)); */
    z-index: 1;
  }
  
  .long-modal .modal-footer::before {
    content: " ";
    position: absolute;
    bottom: 100%;
    left: 0;
    height: var(--scroll-fadeIn-height);
    width: 100%;
    /* background: linear-gradient(to top, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0)); */
    z-index: 1;
  }
  
  /* .modal .modal-body::-webkit-scrollbar {
    width: 8px;
  } */
  
  .modal .modal-body::-webkit-scrollbar-thumb {
    border-radius: 2px;
    /* background-color: rgba(255, 255, 255, 1); */
  }
  
  .modal-header,
  .modal-footer {
    position: relative;
    border: 0 !important;
  }
  
  .modal-body {
    padding: 0rem 3rem 0rem 3rem;
  }
  
  .long-modal .modal-body {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
  
  .modal-backdrop.show {
    opacity: 0.7;
  }
  
  #tnc_modal .modal-body,
  #agreement_modal .modal-body {
    font-size: .8em;
  }
  
  #enquiry_section {
    padding-bottom: 2rem;
  }
  
  #enquiry_section .enquiry {
    font-size: .7rem;
    padding-top: 1rem;
  }
  
  .no_sms_phone{
    /* color: #894d06; */
  }
  
  /* #contact_us_modal .modal-content {
    background-color: rgba(0, 0, 0, 0);
    box-shadow: none;
    border: none;
    text-shadow: 0 0 5px #894d06, 0 0 5px #894d06, 0 0 5px #894d06;
  } */
  
  #redeem_modal .modal-content,
  #contact_us_modal .modal-content,
  #arfilter_tnc_modal .modal-content,
  #referral_tnc_modal .modal-content,
  #register_tnc_modal .modal-content {
    padding-top: 2rem;
    padding-bottom: 2rem;
    color: white;
    text-shadow: 0 0 5px #894d06, 0 0 5px #894d06, 0 0 5px #894d06;
    
    background-color: rgba(0, 0, 0, 0);
    box-shadow: none;
    border: none;
  }
  
  #redeem_modal .btn-close,
  #contact_us_modal .btn-close,
  #arfilter_tnc_modal .btn-close,
  #referral_tnc_modal .btn-close,
  #register_tnc_modal .btn-close {
    position: absolute;
    top: 0rem;
    right: 0rem;
    width: 2rem;
    height: 2rem;
    opacity: 1;
    background-image: url("../assets/common/image/btn_close.png");
    background-size: 100%;
  }
  
  #arfilter_tnc_modal .modal-content b,
  #referral_tnc_modal .modal-content b,
  #register_tnc_modal .modal-content b {
    font-size: 1.2rem;
  }
  
  .modal-content .frame {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  
    pointer-events: none;
  }
  
  .modal-content .frame > .frame_comp {
    width: 100%;
  }
  
  .modal-content .frame > .frame_comp.frame_mid {
    flex: 1 0 auto;
  }
  
  .ios-strech-fix{
    display:flex;
    align-items: center;
  }
  
  .featured-text {
    text-shadow: 0 0 5px #894d06, 0 0 7px #894d06, 0 0 10px #894d06;
  }
  
  .glowing-text {
    text-shadow: 0 0 5px rgb(255 136 0), 0 0 5px rgb(255 136 0), 0 0 5px rgb(255 136 0);
  }

  .event_logo {
    max-width: 60%;
    margin: auto;
    padding: 2rem 0;
  }