@import 'assets/css/colors.css';
@font-face {font-family: Segoe Ui Semi-light;src: url('assets/css/fonts/segoeuisl.ttf');}
@font-face {font-family: Segoe Ui;src: url('assets/css/fonts/SegoeUI.ttf');}
@font-face {font-family: Cairo;src: url('assets/css/fonts/Cairo-Regular.ttf');}
@font-face {font-family: Roboto Slab;src: url('assets/css/fonts/RobotoSlab-Regular.ttf');}

/* :root {
  --bs-primary:#1C75BC !important;
  --bs-secondary:#009ADA !important;
  --bs-success:#009688 !important;
  --bs-info:#C5E8EF !important;
  --bs-primary-rgb:28,117,188 !important;
  --bs-secondary-rgb:0,154,218 !important;
  --bs-success-rgb:0, 150, 136 !important;
  --bs-info-rgb:197,232,239 !important;
  --bs-warning-hover: #FFA707 !important;
} */
html,body {padding:0;margin:0;}
* {box-sizing: border-box;font-family: 'Segoe Ui', 'Cairo', sans-serif;}

* ::-webkit-scrollbar-track{background-color:transparent}
* ::-webkit-scrollbar{background-color:transparent;width:8px}
* ::-webkit-scrollbar-thumb{border:1px solid transparent;border-radius:8px;background-clip:content-box;background-color:rgba(var(--bs-primary-rgb), 0.5)}
* ::-webkit-scrollbar-thumb:hover{/*border:3px solid transparent;*/background-color:var(--bs-primary)}

a {color:var(--bs-primary);text-decoration: none;}
a:hover {color:var(--bs-secondary);}

.ff-roboto-slab {font-family: 'Roboto Slab', 'Cairo', sans-serif;}

body {width:100%;min-height:100vh;font-size: 16px;background-color:#EFEFEF;color:#53535f;line-height: 1.5;overflow-x: hidden; }
main {position:relative;width: 100%;min-height:100vh;background:url('assets/img/background.png') no-repeat center bottom fixed;background-size: cover;color:#FFF;}
.navbar {position:absolute;background: #FFF;top:0;left:0;width:100%;height: 90px;line-height: 70px;padding-block: 10px;padding-inline: 2.5rem;z-index: 999;}
.navbar-brand img {height: 60px;animation: scrollDown 0.5s forwards;transform: translateY(-50px); opacity: 0;}
.navbar-collapse {flex-flow: wrap;align-items: center;justify-content: flex-end;line-height: 1;padding: 0;animation: scrollDown 0.5s 1s forwards;transform: translateY(-50px); opacity: 0;}
.navbar-collapse .nav-item {font-size: 1.1rem;padding-inline: 1rem;}
.navbar-collapse .nav-item:last-child {padding-inline-end:0}
.navbar-collapse .nav-item .btn {font-size: 1.1rem;}
.nav-link {padding-inline: 0 !important;padding-bottom: 0.7rem;}
.nav-link:hover,.nav-link.active {border-bottom: 2px solid var(--bs-danger) !important;}
.content {position: relative;display:flex;flex-flow: column;width: 100%;min-height:100vh;justify-content: center;align-items: center;padding-top:120px;padding-bottom: 130px;}
.main-content {position:relative;width:100%;/*padding:1.5rem;*/}
.content-box {position:relative;background:#FFF;color:var(--bs-dark);width:100%;padding:1.5rem;border-radius:0.5rem;}
.index-buttons {position: relative;display: flex;justify-content: center;width:100%;/* display: flex;align-content: center;justify-content: center; */padding-top: 2rem;}
.registration-btn {max-height: 100px;animation: scrollDown 1s 1.5s forwards;transform: translateY(-50px); opacity: 0;}
.registration-btn:hover {transform: scale(0.95) !important;}
.mobile-header {max-width:100%;animation: scrollDown 0.5s forwards;transform: translateY(-50px); opacity: 0;}
.mobile-event-logo {max-width:100%;animation: scrollDown 0.5s 1s forwards;transform: translateY(-50px); opacity: 0;}
.event-logo {max-width:100%;animation: scrollDown 0.25s 0.75s forwards;transform: translateY(-50px); opacity: 0;mix-blend-mode: lighten;max-width:80%;}

.select-reset {background: #FFF;position: absolute;width: 1.5rem;line-height: 1.125rem;right: 0.625rem;transform: translateY(50%);z-index: 999;font-size: 16px;color: #f44242;text-align:center;}
.select-reset::before{content:'x'}
option[workshop-closed] {display:none;}
.choices {margin-bottom: 0 !important;}
.choices__item {font-size: 0.95rem !important;word-break: keep-all;}
.choices__input__required {display: block;width: 100%;padding: 0.375rem 0.75rem;border:0 !important;border-bottom: 1px solid #ddd !important;background-color: #fff;margin: 0;}
.choices__input.choices__input--cloned {padding: 0.375rem 0.5rem !important;}
.choices__list--dropdown {padding: 0.375rem 0.5rem !important;z-index:99 !important;}
.choices__list--dropdown .choices__item--selectable.is-highlighted {background-color: #07306d !important;color:#FFF !important;}
.choices__list--single .choices__item {width: 95% !important;overflow: hidden;height: 1.25rem;line-height: 1.5rem;}

/* LIVESTREAM PAGE */
.streamBox {width:100%;min-height: 60vh;background-color: #e9ecef;color:var(--bs-primary);padding: 1.25rem;border-radius: 0.75rem;margin-block: 2rem;}
#livestream-frame {position: relative;padding-top: 56.25%;background: url('assets/img/player-bg.png') no-repeat center;background-size:cover;overflow: hidden;}
#livestream-frame > iframe {position: absolute;top:0;left:0;right:0;bottom:0;width: 100%;height:100%}
#ratio169 {position: relative;padding-top: 56.25%;background:#FFF;overflow: hidden;}
#ratio169 > iframe {position: absolute;top:0;left:0;right:0;bottom:0;width: 100%;height:100%}

.custom-tab {display:flex;flex-flow:column;align-items:center;color: var(--bs-primary) !important;padding: 0.75rem 1rem !important;font-size: 1.2rem !important;line-height: 2rem !important;height: 5.5rem !important;border: 2px dashed !important;border-radius: 0.75rem !important;}
.custom-tab i {font-size:1.75rem;}
.custom-tab.active {background-color: var(--bs-primary) !important;color:#f9ca11 !important;border-style: solid !important;border-color: var(--bs-primary) !important;}
.custom-tab:hover {background-color: #f7c603 !important;color: var(--bs-primary) !important;border-style: solid !important;border-color: #f7c603 !important;}
.custom-nav-tabs {display: flex;flex-flow: wrap;gap: 1rem;padding-bottom: 1rem;border:0 !important;}
.tab-content {height: calc(100% - 6.5rem);}
.tab-panel {height: 100%;display: none;}

#discussion-box {position: relative;background:#FFF;min-height:300px;padding:1rem;border: 1px solid #dbdbdb;display: flex;flex-flow: column;justify-content: space-between;height: inherit;}
#discussion-block {width: 100%;height: calc(100% - 120px);display: grid;grid-auto-rows:max-content;background: #f6f6f6;padding-bottom: 0.5rem;overflow-y:auto;}
#discussion-block div {width: 100%;padding:5px;border-bottom:1px solid #ddd;}
#discussion-block div:first-child {padding-top:0;}
#discussion-block div:last-child {border:0;}
#discussion-input-block {width: 100%;height: 100px;display: flex;flex-flow: column;justify-content:flex-end;}
#discussion-input-block textarea {height: auto;resize:none;max-height: 100px;}
#discussion-block.staff {height: calc(100% - 150px);}
#discussion-input-block.staff {height: 130px;}
.unreadMessages:after {content: "";width: 10px;height: 10px;background: #ffc107;position: absolute;border-radius: 50%;left: -4px;top: -2px;}
.unreadMessages {position: relative;}
.custom-tab:hover .unreadMessages:after {background: var(--bs-primary)}
#selectRecipients span {max-height:1rem;line-height: 1rem;overflow:hidden;}
.replyTo {cursor: pointer;}

#questions-box {position: relative;background:#FFF;min-height:300px;padding:1rem;border: 1px solid #dbdbdb;display: flex;flex-flow: column;justify-content: space-between;height: inherit;}
#questions-block {width: 100%;height: calc(100% - 120px);display: grid;grid-auto-rows:max-content;background: #f6f6f6;padding-bottom: 0.5rem;overflow-y:auto;}
#questions-block div {width: 100%;padding:5px;border-bottom:1px solid #ddd;}
#questions-block div:first-child {padding-top:0;}
#questions-block div:last-child {border:0;}
#question-input-block {width: 100%;height: 100px;display: flex;flex-flow: column;}
#question-input-block textarea {height: auto;resize:none;max-height: 100px;}
/* END LIVESTREAM PAGE */

/*form styles*/
.formSection {position: relative;display:flex;flex-flow:column;align-items:center;justify-content:center;max-width: 600px;padding:1.5rem;gap:1.5rem;}
.formSection .card {min-width: 450px;}

input.custom-input {width: 100%;border: 0;padding: 8px 10px;border-bottom: 1px solid #ced4da;}
input.custom-input:focus,input.custom-input:focus-visible {outline:0;border-color:var(--bs-success);}

.btn {width:fit-content;display:flex;align-items:center;gap:0.25rem;}
.btn-primary {background-color: var(--bs-primary);border-color: var(--bs-primary);}
.btn-primary:hover {background-color: var(--bs-primary-hover);border-color: var(--bs-primary-hover);}
.btn-success {background-color: var(--bs-success);border-color: var(--bs-success);}
.btn-success:hover {background-color: var(--bs-success-hover);border-color: var(--bs-success-hover);}
.btn-warning {background-color: var(--bs-warning);border-color: var(--bs-warning);}
.btn-warning:hover {background-color: var(--bs-warning-hover);border-color: var(--bs-warning-hover);}
.btn-danger {background-color: var(--bs-danger);border-color: var(--bs-danger);}
.btn-danger:hover {background-color: var(--bs-danger-hover);border-color: var(--bs-danger-hover);}
.btn-dark {background-color: var(--bs-dark);border-color: var(--bs-dark);}
.btn-dark:hover {background-color: var(--bs-dark-hover);border-color: var(--bs-dark-hover);}

#signUpForm {/* max-width: 960px; */}
#signUpForm .form-header {gap: 5px;text-align: center;font-size: .9em;}
#signUpForm .form-header .stepIndicator {position: relative;flex: 1;padding-bottom: 30px;}
#signUpForm .form-header .stepIndicator.active {font-weight: 600;color: #0886c9;}
#signUpForm .form-header .stepIndicator.finish {font-weight: 600;color: #1c4586;}
#signUpForm .form-header .stepIndicator::before {content: "";position: absolute;left: 50%;bottom: 0;transform: translateX(-50%);z-index: 9;width: 20px;height: 20px;background-color: #a9d9f1;border-radius: 50%;border: 3px solid #ecf5f4;}
#signUpForm .form-header .stepIndicator.active::before {background-color: #0886c9;border: 3px solid #a9d9f1;}
#signUpForm .form-header .stepIndicator.finish::before {background-color: #1c4586;border: 3px solid #8fb2e9;}
#signUpForm .form-header .stepIndicator::after {content: "";position: absolute;left: 50%;bottom: 8px;width: 100%;height: 3px;background-color: #f3f3f3;}
#signUpForm .form-header .stepIndicator.active::after {background-color: #a9d9f1;}
#signUpForm .form-header .stepIndicator.finish::after {background-color: #1c4586;}
#signUpForm .form-header .stepIndicator:last-child:after {display: none;}
#signUpForm .invalid {border-color:#ffaba5;}
#signUpForm .step {display: none;}
#signUpForm .oneColumn {width:fit-content;max-width:100%;}
#signUpForm .workshops {width:fit-content;max-width:100%;}
#signUpForm .form-footer{overflow:auto;gap: 20px;}
#signUpForm .form-footer button{background-color: #1b498a;border: 1px solid #1b498a !important;color: #ffffff;border: none;padding: 13px 30px;font-size: 1em;cursor: pointer;border-radius: 5px;flex: 1;margin-top: 5px;}
#signUpForm .form-footer button:hover {opacity: 0.9;}
#signUpForm .form-footer #prevBtn {background-color: #fff;color: #1b498a;}

#formAlert .alert i {padding-inline-end:0.25rem;}

/*SPONSORS IMAGES*/
.platinium{max-width:100%;height: auto;max-height:180px;}
.diamond{max-width:90%;height: auto;max-height:140px;}
.gold{max-width:80%;height:auto;max-height:120px;}
.silver{max-width:75%;height:auto;max-height:100px;}
.bronze{max-width:70%;height:auto;max-height:80px;}
.iron{max-width:60%;height:auto;max-height:70px;}

/* FOOTER */
footer {position:absolute;background: #FFF;bottom:0;left:0;width:100%;height: 90px;line-height: 90px;padding-block: 10px;padding-inline: 2.5rem;}

/* RESPONSIVE */
@media screen and (max-width: 1199px) {
  .container {max-width:100% !important;}
  .navbar {padding-inline: 1.5rem;}
  footer {padding-inline: 1.5rem;}
}
@media screen and (max-width: 992px) {
  .navbar {position: fixed;top: 0;padding-inline:10px;z-index: 999;}
  .navbar-toggler {position: absolute;right: 0.5rem;z-index:999;border:0px;}
  .navbar-toggler:focus {outline:0;border:0;box-shadow:none;}
  /*.navbar-toggler[aria-expanded=true] {color: #FFF !important;}*/
  .navbar-collapse {position: fixed;background: linear-gradient(45deg, rgb(0 28 131 / 50%), #e91e3a);top: 90px;left: 0;width:100%;height: 100vh;overflow-y: auto;padding:0;line-height: 1;z-index: 999;}
  .navbar-collapse .nav-item {padding:0 !important;}
  .navbar-collapse .nav-link.active, .navbar-collapse .nav-link:hover {border:0 !important;}
  .navbar-collapse .nav-link {padding: 0.75rem 1.5rem !important;}
  .navbar-collapse .nav-link.active {position:relative;background: var(--bs-primary-hover);color: var(--bs-white) !important;}
  .navbar-collapse .nav-link:hover {background: var(--bs-primary);color: var(--bs-white) !important;}
  /* .navbar-collapse .nav-item:first-child .nav-link {margin-top:0.5rem;}
  .navbar-collapse .nav-item:first-child .nav-link.active {margin-top:0;} */
  .navbar-collapse .btn {margin:0 !important;}
}
@media screen and (max-width: 767px) {
  main {background-size: 100% 100%;}
}
@media screen and (max-width: 640px) {
  /* .index-buttons {flex-flow:column;} */
}
@media screen and (max-width: 575px) {
  .navbar {height: 80px;line-height: 60px;padding: 0;padding-block:10px;}
  .navbar-collapse {top: 80px;}
  footer {height: 80px;line-height: 60px;padding-block:10px;}
  main {background:url('assets/img/mobile-background.png') no-repeat center top fixed;background-size: cover;}
  .content {align-items: start;flex-flow:wrap;padding-top:100px;padding-bottom:120px;}
  .main-content {padding: 1rem;}
  .registration-btn {max-height: 80px;}
  .loginForm {max-width: 100%;margin-top:3rem;}
  .loginForm .card {max-width: calc(100% - 3rem) !important;min-width: fit-content;}
}

/* ANIMATIONS */
@keyframes scrollDown {
  to { transform: translateY(0); opacity: 1; }
}
@keyframes hScroll {
  to { transform: translateX(0); opacity: 1; }
}
@keyframes scrollRight {
  to { transform: translateX(100%); opacity: 0; }
}
@keyframes scrollRight {
  to { transform: translateX(-100%); opacity: 0; }
}
@keyframes showIn {
  to { visibility: visible; }
}
@keyframes hideOut {
  to { visibility: hidden; }
}
@keyframes fadeIn {
  0% { opacity: 0; }
  100% { opacity: 1; }
}
@keyframes fadeOut {
  0% { opacity: 1; }
  100% { opacity: 0; }
}
.agenda-tab {color: var(--bs-primary) !important;border-radius: 0 !important;padding: 0.75rem 1rem !important;font-size: 1.2rem !important;line-height: 1.5 !important;border: 2px dashed !important;}
.agenda-tab.active {background-color: var(--bs-primary) !important;color:var(--bs-white) !important;border: 0 !important;}
.agenda-tab:hover {background-color: var(--bs-danger) !important;color: var(--bs-white) !important;border: 0 !important;}