@import 'colors.css';
@import 'forms.css';
@font-face {font-family: Poppins;src: url('../fonts/Poppins.ttf');}
@font-face {font-family: Cairo;src: url('../fonts/Cairo.ttf');}
@font-face {font-family: Segoe Ui;src: url('../fonts/SegoeUI.ttf');}
@font-face {font-family: Alro;src: url('../fonts/Alro.ttf');}
@font-face {font-family: Raleway;src: url('../fonts/Raleway.ttf');}
@font-face {font-family: Gotham;src: url('../fonts/Gotham-Book.otf');}

html,body {padding:0;margin:0;}
* {box-sizing: border-box;font-family: 'Poppins', 'Cairo', sans-serif;}
* ::-webkit-scrollbar-track{background-color:rgba(175, 200, 217, 0.26)}
* ::-webkit-scrollbar{background-color:transparent;width:10px;height: 12px;}
* ::-webkit-scrollbar-thumb{border-inline:2px solid transparent;border-block:3px solid transparent;border-radius:12px;background-clip:content-box;background-color:rgba(var(--bs-primary-rgb),0.5);}
* ::-webkit-scrollbar-thumb:hover{background-color:rgba(var(--bs-primary-rgb), 1);}

/* Font Class */
.ff-segoe-ui, .ff-segoe-ui * {box-sizing: border-box;font-family: 'Segoe Ui', 'Cairo', sans-serif;}
.ff-alro, .ff-alro * {box-sizing: border-box;font-family: 'Alro', 'Cairo', sans-serif;}
.ff-raleway, .ff-raleway * {box-sizing: border-box;font-family: 'Raleway', 'Cairo', sans-serif;}
.ff-gotham, .ff-gotham * {box-sizing: border-box;font-family: 'Gotham', 'Cairo', sans-serif;}

/* GLOBAL */
a {color:currentColor;text-decoration:none;}
a:hover {color: var(--bs-success);}
/* a {color: var(--dash-primary);} */
/* a:hover {color: var(--dash-secondary);} */
img {display: block;}

.no-scrollbar ::-webkit-scrollbar {display:none;}

.no-outline { outline: none !important; }
.no-outline:focus { outline: none !important; }
.no-outline:focus-visible {outline: none !important;}

.no-box-shadow {box-shadow: none;}
.no-box-shadow:focus {box-shadow: none;}

.cursor-pointer {cursor:pointer;}

/* GENERAL */
html, body {margin: 0;padding: 0;}
body {position: relative;width:100vw;min-height:100vh;font-size: 16px;overflow-x: hidden;background: linear-gradient(#ffffff, #adc8d5);padding-bottom: 5vw;}
header {position: relative;width: 100vw;height: 15vw;background: url('../images/header.png') no-repeat;background-size: 100%;}
main {position:relative;width:100vw;min-height: calc(100vh - 20vw);display: flex;align-items: center;justify-content: center;}
footer {position: absolute;bottom: 0;width: 100vw;height: 3vw;}

/* CONTENT */
.body-overlay {position: absolute;top: 0;left: 0;right: 0;bottom: 0;background: rgb(0 40 80 / 50%);z-index: -2;display: none;}
.content {position: relative;width: fit-content;max-width: 100vw;min-height: calc(100vh - 20vw);display: flex;align-items: center;justify-content: center;flex-direction: column;gap: 3vw;}
.event_title {position: relative;width:40vw;height:8vw;background: url('../images/event_title.png') no-repeat;background-size: 100%;}

.registration_form {position: relative;width: 100%;max-width: 70vw;}
.form-control, .form-control-sm, .form-select {
    box-shadow: 0 0 0 0.2rem rgb(0 155 211 / 25%);
}
.form-control:focus, .form-control-sm:focus, .form-select:focus {
    border-color: #009bd3;
    box-shadow: 0 0 0 0.2rem rgb(0 155 211 / 25%);
}
.form-control.is-invalid, .was-validated .form-control:invalid, .form-control-sm.is-invalid, .was-validated .form-control-sm:invalid, .form-select.is-invalid, .was-validated .form-select:invalid {box-shadow: 0 0 0 .25rem rgba(var(--bs-danger-rgb), .25);}
.registration_btn {width: 280px;height: 75px;max-width: 30vw;max-height: 8vw;background: url('../images/registration_btn.png') no-repeat;background-size: 100%;padding: 0;margin: 0;margin-top: 1.5vw;border: 0;outline: none;}
.registration_btn:hover {
  --animate-duration: .6s;
  animation: pulse var(--animate-duration);
}

.footer1 {width: 100vw;height: 1vw;background-color: #009bd3;}
.footer2 {width: 100vw;height: 2vw;background-color: #f04e2a;}

/* RESPONSIVE */
@media screen and (max-width: 1139px) {
  .event_title {width:50vw;height:10vw;background-size: 100%;}

}

@media screen and (max-width: 991px) {
  header {height: 26vw;background: url('../images/mobile_header.png') no-repeat;background-size: 100%;}
  main {min-height: calc(100vh - 31vw);}
  .content {min-height:calc(100vh - 31vw);}
  .event_title {width:60vw;height:12vw;background-size: 100%;}

}

@media screen and (max-width: 767px) {
  .event_title {width:70vw;height:14vw;background-size: 100%;}
  .registration_form {max-width: 90vw;}
  .registration_btn {max-width: 50vw;max-height: 13vw;margin-block: 3vw;}
  footer {height: 4vw;}
  .footer1 {height: 1.5vw;}
  .footer2 {height: 2.5vw;}

}

@media screen and (max-width: 575px) {
  .event_title {width:65vw;height:44vw;background: url('../images/mobile_event_title.png') no-repeat;background-size: 100%;}

}