/* TODO: change color scheme */

/* HEADER */
#banner-img {
    width: 100%;
}

#header-title {
    text-align: center;
    padding-top: .5rem;
}

#header {
    display: flex;
    justify-content: space-between;
    padding: 0 3rem;
    margin: 1rem 0;
}

#header-about {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding-right: 5rem;
}

#header-dates, #header-location, #header-free {
    display: flex;
    /* justify-content: space-between; */
}

#header-dates img, #header-location img, #header-free img{
    margin-right: 1rem;
}

#header-free div {
    display: flex;
    align-items: center;
}

#header-info p{
    margin: 0;
    width: max-content;
}

/* Nav */
#uranus-flagship-nav {
    display: flex;
    justify-content: space-around;
    margin-bottom: 1rem;
}

.uranus-flagship-nav-option {
    flex: 1;
    text-align: center;
    margin: 0;
    padding: 0.5rem;
    font-size: 16px;
}

.uranus-flagship-nav-option:hover {
    cursor: pointer;
}

.selected {
    /* color: white; */
    border-bottom: 2px solid #9791eb;
    /* TODO: make edges daigonal (match banner) */
}

/* 
.far-right {
    TODO: make left edge straight; right diagonal
} */

/* 
.far-left {
    TODO: Make right edge straight; left diagonal
}
*/

/* Pages */
#about, #registration, #agenda, #logistics {
    padding: 0 1rem;
}
    /* Registration */
#abstract-link {
    color: #673ab7;
}

    /* Agenda */
.day {
    text-align: center;
    font-size: 20px;
    margin: 2rem 0 1rem 0;
}

#quick-nav-div {
    display: flex;
    justify-content: space-around;
    margin-bottom: 1rem;
}

.quick-nav-btn {
    background-color: #673ab7;
    padding: 0.5rem;
    border-radius: 10px;
    overflow: hidden;
    border: 2px solid #673ab7;
}

.quick-nav-btn:hover {
    border: 2px solid #0F4176;
}

.session-title {
    right: 1em;
    font-size: 14px;
}

.poster-citation-ul {
    list-style: none;
}

.poster-citation-ul li {
    margin-bottom: 8px;
}

/* .agenda-item {
    display: flex;
    align-items: center;
    border: 2px solid #0F4176;
    border-radius: 10px;
    margin: 5px;
    overflow: hidden;
} */

/* .agenda-time {
    flex: 1;
    min-width: 100px;
    background-color: #0F4176;
    color: white;
    display: flex;
    align-self: stretch;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    flex-direction: column;
    text-align: center;
    padding: 1rem;
} */

/* .agenda-speaker {
    flex: 1;
    text-align: center;
    border-right: 2px solid #0F4176;
    display: flex;
    align-items: center;
    justify-content: center;
} */

/* .speaker-blank {
    border: none;
} */

/* .agenda-text {
    flex: 2;
    display: flex;
    align-items: center;
    padding: 1rem;
    margin: 8px;
} */

/* .agenda-lunch {
    background-color: #88B8EC;
    align-self: stretch;
    margin: 0;
} */


    /* Logistics */
.logistics-heading {
    font-size: 18px;
    margin: 0.5rem 0;
    color: #483DDB;
}
.logistics-sub-heading {
    text-decoration: underline;
    font-size: 14px;
}

#metro-map-img {
    width: 500px;
}

/* Utils */
.text-center {
    text-align: center;
}

.hidden {
    display: none;
}

@media screen and (max-width: 750px) {
    #header {
        flex-wrap: wrap;
        justify-content: center;
        padding: 0;
    }

    #header-about {
        padding: 0;
    }

    #header-info {
        margin: 1rem;
    }

    #uranus-flagship-nav {
        display: block;
        width: fit-content;
        margin: 1rem auto;
    }

    /* agenda */
    .agenda-item {
        flex-direction: column;
    }

    .agenda-speaker {
        border-right: none;
        border-bottom: 2px solid #0F4176;
        margin-top: 0.5rem;
    }

    .speaker-blank {
        display: none;
    }

    .agenda-lunch {
        width: 100%;
    }

    .agenda-lunch p {
        flex: 1;
        text-align: center;
    }

    /* logistics */
    /* TODO: Add any maps here */
    #google-maps-iframe {
        width: calc(100vw - 24px);
    }
}