html {
    font-size: 14px;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
    box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
    position: relative;
    min-height: 100%;
}

body {
    margin-bottom: 60px;
}

/**
* Overrides Bootstrap presets & styles
*/

:root {
    /*--bs-body-color: rgb(121 128 138);*/
    /*--bs-body-color: rgb(200 200 200);*/
    --bs-body-color: rgb(255 255 255);
    --bs-body-bg: rgb(24 28 49);
    --bs-dark-rgb: rgb(24 28 49);
}

.navbar-dark .navbar-nav .nav-link {
    color: var(--bs-body-color);
}

.dropdown-menu-dark {
    background-color: rgb(24 28 49);
    border: solid 1px var(--bs-body-color);
}

/*
* Custom presets
*/
*, ::before, ::after {
    --site-shadow: 0 0 #0000;
    --site-shadow-colored: 0 0 #0000;
    --site-ring-offset-shadow: 0 0 #0000;
    --site-ring-shadow: 0 0 #0000;
}

p {
    font-size: 1.15rem;
}

h6, h5, h4, h3, h2, h1 {
    margin-bottom: 1.2rem;
}

/**
* Custom styles
*/

.cursor-pointer {
    cursor: pointer;
}

a.navbar-brand {
    margin-right: 2rem;
}

    a.navbar-brand > img {
        width: 100%;
    }

@media (max-width: 768px) {
    .site-header div.container > .row > .col-auto {
        width: 250px;
    }
}
/* Hamburger menu below this break point */
@media (max-width: 575px) {
    .site-header div.container > .row > .col-auto {
        width: 350px !important;
    }

    .navbar-collapse {
        position: absolute;
        left: 0;
        padding-left: 10px;
        z-index: 99999;
        background-color: rgb(24 28 49);
        border-left: solid 6px rgb(82 186 209);
    }
}

/*.navbar-toggler navbar-collapse*/

@media (min-width: 576px) and (max-width: 995px) {
    .site-header div.container {
        max-width: 100%;
    }
}

@media (max-width: 995px) {
    .site-header div.container > .row > .col-auto {
        width: 350px;
    }
}

@media (max-width: 840px) {
    .site-header div.container > .row > .col-auto {
        width: 330px;
    }
}

@media (max-width: 820px) {
    .site-header div.container > .row > .col-auto {
        width: 310px;
    }
}

@media (max-width: 800px) {
    .site-header div.container > .row > .col-auto {
        width: 290px;
    }
}

@media (max-width: 780px) {
    .site-header div.container > .row > .col-auto {
        width: 270px;
    }
}

@media (max-width: 760px) {
    .site-header div.container > .row > .col-auto {
        width: 250px;
    }
}

@media (max-width: 680px) {
    .site-header div.container > .row > .col-auto {
        width: 230px;
    }
}

@media (max-width: 660px) {
    .site-header div.container > .row > .col-auto {
        width: 200px;
    }
}

@media (max-width: 640px) {
    .site-header div.container > .row > .col-auto {
        width: 180px;
    }
}

@media (max-width: 620px) {
    .site-header div.container > .row > .col-auto {
        width: 160px;
    }
}

@media (max-width: 590px) {
    .site-header div.container > .row > .col-auto {
        width: 140px;
    }
}

@media (max-width: 441px) {
    .site-header div.container > .row > .col-auto {
        width: 330px !important;
    }
}

@media (max-width: 421px) {
    .site-header div.container > .row > .col-auto {
        width: 310px !important;
    }
}

@media (max-width: 401px) {
    .site-header div.container > .row > .col-auto {
        width: 290px !important;
    }
}

@media (max-width: 381px) {
    .site-header div.container > .row > .col-auto {
        width: 270px !important;
    }
}

@media (max-width: 361px) {
    .site-header div.container > .row > .col-auto {
        width: 250px !important;
    }
}

@media (max-width: 341px) {
    .site-header div.container > .row > .col-auto {
        width: 230px !important;
    }
}

.site-header {
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    z-index: 99999;
    padding-top: 1.75rem;
    padding-bottom: 1.75rem;
}

.sticky-header {
    background-color: rgb(24 28 49 / 0.95);
    --site-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
    --site-shadow-colored: 0 1px 3px 0 var(--site-shadow-color), 0 1px 2px -1px var(--site-shadow-color);
    box-shadow: var(--site-ring-offset-shadow, 0 0 #0000), var(--site-ring-shadow, 0 0 #0000), var(--site-shadow);
    border-bottom: 1px solid rgb(150 150 150 / 0.1);
    padding-top: 1rem !important;
    padding-bottom: 1rem !important;
    transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
}

@media (min-width: 1280px) {
    .container.main {
        padding-top: 13rem;
    }
}

@media (min-width: 768px) {
    .container.main {
        padding-top: 10rem;
    }
}

.container.main {
    /*padding-top: 8.75rem;*/
    padding-top: 7rem;
}

.section {
    padding-top: 2.0rem;
}

.conference-griditem {
    border: solid 1px rgb(158 158 158);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    min-height: 300px;
    padding: 30px 10px 10px 10px;
    text-decoration: none !important;
    cursor: pointer;
    position: relative;
}

    .conference-griditem .conference-griditem-title {
        text-align: center !important;
        color: #fff;
        font-size: 2rem;
        font-weight: 500;
        line-height: 1.2;
        position: absolute;
        width: 96%;
        top: 12px;
    }

    .conference-griditem .conference-griditem-date {
        text-align: center !important;
        color: #fff;
        font-size: 1rem;
        padding: 10px;
        margin: 90px 50px 0px 50px;
        background-color: rgb(0 0 0 / 0.4);
    }

    .conference-griditem .conference-griditem-location {
        text-align: center !important;
        color: #fff;
        font-size: 1rem;
        padding: 0px 10px 10px 10px;
        margin: 0px 50px 0px 50px;
        background-color: rgb(0 0 0 / 0.4);
    }

    .conference-griditem .conference-griditem-click {
        text-align: center !important;
        color: #fff;
        font-size: 1.5rem;
        text-decoration: underline;
        position: absolute;
        bottom: 10px;
        left: 50%;
        transform: translateX(-50%);
        white-space: nowrap;
    }

.conference-detailsitem {
    border: solid 1px rgb(158 158 158);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    min-height: 500px;
    padding-top: 30px;
    position: relative;
}

    .conference-detailsitem .conference-detailsitem-title {
        text-align: center !important;
        position: absolute;
        width: 96%;
        top: 12px;
    }

    .conference-detailsitem .conference-detailsitem-title h1 {
        color: #fff;
        font-weight: 500;
    }

    .conference-detailsitem .conference-detailsitem-date {
        text-align: center !important;
        color: #fff;
        font-size: 1.5rem;
        padding: 10px;
        margin: 150px 50px 0px 50px;
        background-color: rgb(0 0 0 / 0.4);
    }

    .conference-detailsitem .conference-detailsitem-location {
        text-align: center !important;
        color: #fff;
        font-size: 1.5rem;
        padding: 0px 10px 10px 10px;
        margin: 0px 50px 0px 50px;
        background-color: rgb(0 0 0 / 0.4);
    }

    .conference-detailsitem .conference-detailsitem-organizers {
        text-align: center !important;
        color: #fff;
        font-size: 1.5rem;
        padding: 0px 10px 10px 10px;
        margin: 0px 50px 0px 50px;
        background-color: rgb(0 0 0 / 0.4);
    }

    .conference-detailsitem .conference-detailsitem-deadline {
        text-align: center !important;
        position: absolute;
        bottom: 25px;
        left: 50%;
        transform: translateX(-50%);
        white-space: nowrap;
    }

    .conference-detailsitem .conference-detailsitem-deadline a {
        color: #fff;
        font-size: 1.5rem;
        text-decoration: underline;
    }

@media (max-width: 575px) {
    /*.conference-detailsitem {
    min-height: 600px;
}*/

    .conference-detailsitem .conference-detailsitem-date {
        font-size: 1.3rem;
        padding: 10px;
        margin: 90px 25px 0px 25px;
    }

    .conference-detailsitem .conference-detailsitem-location {
        font-size: 1.3rem;
        padding: 0px 10px 10px 10px;
        margin: 0px 25px 0px 25px;
    }

    .conference-detailsitem .conference-detailsitem-organizers {
        font-size: 1.3rem;
        padding: 0px 10px 10px 10px;
        margin: 0px 25px 0px 25px;
    }

    .conference-detailsitem .conference-detailsitem-deadline a {
        font-size: 1.3rem;
    }
}

.conference-griditem-sub {
    padding-bottom: 5px;
}

    .conference-griditem-sub .conference-griditem-title {
        color: #fff;
        font-size: 1.5rem;
        text-decoration: underline;
        padding-bottom: 3px
    }



.conference-speaker {
    font-size: 1.2rem;
    font-weight: 400;
    text-transform: uppercase;
}

.conference-speaker a {
    text-decoration: none;
    color: var(--bs-body-color);
}

button, a.button {
    padding: 4px 10px 4px 10px;
    color: #fff;
    font-weight: 400;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    background-color: rgb(82 186 209 / 0.8);
    border: none;
}

a.button {
    text-decoration: none;
    display: block;
}

    button.uppercase, a.button.uppercase {
        text-transform: uppercase;
    }

.site-title {
    color: rgb(82 186 209);
    font-weight: bold;
}

.notyf, .toastify {
    z-index: 99999 !important;
}

/* By default, text is not justified */
.text-justify-md {
    text-align: left;
}

@media (min-width: 768px) { /* This value might vary based on your Bootstrap version */
    .text-justify-md {
        text-align: justify;
    }
}

/**
*    Animations
*/
.fade-in {
    opacity: 0;
    transition: opacity 5s;
}

    .fade-in.show {
        opacity: 1;
    }

/**
Scroll back top
*/
button.back-top {
    display: none;
    width: 2.5rem;
    height: 2.5rem;
    position: fixed;
    bottom: 2rem;
    right: 2rem;
    z-index: 999;
}

    button.back-top.show {
        display: flex !important;
    }

svg.back-top {
    fill: #FFFFFF;
    width: 1.25rem;
    height: 1.25rem;
}

/**
Form elements
*/
.dark-input,
.dark-input .k-input,
.dark-input .k-dropdownlist {
    background-color: transparent;
    color: #fff;
    border-color: var(--bs-body-color);
}

    .dark-input:focus, .dark-input:focus-within,
    .dark-input .k-input:focus, .dark-input .k-input:focus-within,
    .dark-input.k-dropdownlist:focus, .dark-input.k-dropdownlist:focus-within, .dark-input.k-dropdownlist:hover {
        background-color: transparent;
        color: #fff;
        border-color: rgb(82 186 209 / 0.8);
        box-shadow: none;
        outline: none;
    }

    /* Fix direct label for .dark-input .k-input */
    .dark-input > label {
        color: var(--bs-body-color) !important;
    }

/* Replacing default checkbox with own style */
.custom-checkbox {
    display: inline-block;
    width: 15px;
    height: 15px;
    background-color: transparent;
    border: 1px solid #ced4da;
    cursor: pointer;
    position: relative;
}

    .custom-checkbox::before {
        content: "";
        position: absolute;
        width: 100%;
        height: 100%;
        opacity: 0; /* Hide by default */
        transition: opacity 0.2s; /* Smooth transition */
    }

/* When the actual checkbox is checked, change the appearance of the custom checkbox */
input[type="checkbox"].dark-input:checked + .custom-checkbox::before {
    opacity: 1; /* Show the checked state */
}

/* Adding inner border for checked state */
input[type="checkbox"].dark-input:checked + .custom-checkbox::after {
    content: "";
    position: absolute;
    width: 70%; /* Smaller width for inner border effect */
    height: 70%; /* Smaller height for inner border effect */
    background-color: rgb(82 186 209); /* Background for checked state */
    top: 15%;
    left: 15%;
    box-sizing: border-box;
    opacity: 1; /* Ensure it's visible when checked */
}

@media (min-width: 768px) {
    .form-cols-2 {
        max-width: 440px;
    }
}

/**
*    Hide cookie revisit icon by default
*/
.cky-btn-revisit-wrapper {
    display: none !important;
}