/*<editor-fold desc="Letters list">*/
#speakerListLetterBloc {
    display: flex;
    align-items: center;
    color: #0F589A;
    font-family: Avenir, serif;
    font-size: 1.25rem;
    font-style: normal;
    font-weight: 500;
    line-height: 1.5rem;
    padding: 0;
}

#speakerListLetterBloc > span {
    cursor: default;
    display: inline-block;
}

#speakerListLetterBloc > span.separator {
    color: #333333;
}

#speakerListLetterBloc > a,
#speakerListLetterBloc > a:hover,
#speakerListLetterBloc > a > strong,
#speakerListLetterBloc > a:hover > strong {
    color: #0F589A !important;
}
/*</editor-fold>*/

/*<editor-fold desc="Search bar">*/
.speaker-search-area > input {
    width: 39rem !important;
    height: 3rem !important;
    border-radius: 0.19rem !important;
    border: 1px solid #333333 !important;
    background: #FFFFFF !important;
}

.speakerSearchBtn {
    width: fit-content;
    height: 2rem;
    padding: 0 .5rem;
    margin: 0;
    position: absolute;
    left: min(87vw, 37.5rem);
    background-color: transparent;
    border-color: transparent;
    color: #333333;
}

.speakerSearchBtn:hover {
    background-color: transparent;
    border-color: transparent;
    color: #333333;
}
/*</editor-fold>*/

/*<editor-fold desc="Faculty tile">*/
.speaker-holder {
    background-color: #FFFFFF;
    border-radius: .25rem;
    box-shadow: 0 0 .5rem 0 rgba(0, 0, 0, 0.35);
    margin-bottom: 1.75rem;
    font-family: Avenir, serif;
}

.profile-picture-speaker {
    width: 9rem;
    height: 9rem;
    border-radius: 9rem;
    background: lightgray 50% / cover no-repeat;
}

.speaker-last-name, .speaker-first-name {
    color: #000000 !important;
    text-align: center;
    font-size: 1.5rem !important;
    font-style: normal;
    font-weight: 900;
    line-height: 2rem;
}

.speaker-btn-bio {
    width: 12rem;
    height: 2.5rem;
    border-radius: 0.19rem;
    border: 1px solid #0F589A;
    background: #FFFFFF;
    line-height: 1.5rem;
    font-style: normal;
    color: #0F589A;
    letter-spacing: 0;
    text-transform: none;
    padding: 0 .75rem;
    display: flex;
    align-content: center;
    justify-content: center;
    flex-wrap: wrap;
}

.speaker-btn-bio > i {
    text-align: center;
    font-size: 1.5rem;
    font-weight: 400;
    align-self: center;
    flex-grow: 1;
}

.speaker-btn-bio > span {
    font-size: 1rem;
    font-weight: 500;
    align-self: center;
    padding: 0 .5rem;
}
/*</editor-fold>*/

/*<editor-fold desc="Bottom Pagination">*/
.js-speaker-list-pagination {
    display: flex;
}

.pagination {
    margin: 0;
}

.pagination > li > a,
.pagination > li.disabled > a {
    background-color: transparent;
    color: #0F589A !important;
}

.pagination > li {
    display: flex;
    align-items: center;
    justify-items: center;
    flex-shrink: 1;
    flex-grow: 0;
    flex-basis: auto;
}

.pagination > li:not(.first, .prev, .next, .last) {
    padding: 0;
    margin-right: 0.75rem;
}

.pagination > li:not(.first, .prev, .next, .last) > a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1.5rem;
    height: 1.5rem;
    border: 2px solid #0F589A;
    border-radius: 50%;
    font-size: 0.75rem;
    font-style: normal;
    font-weight: 700;
    padding: 0.1rem 0;
}

.pagination > li.active > a,
.pagination > li.active > a:hover {
    background-color: #000000;
    color: #FFFFFF !important;
    border: 2px solid #0F589A;
}

.pagination > li.next > a {
    margin-left: -0.75rem;
}

.pagination > li.first > a,
.pagination > li.prev > a,
.pagination > li.next > a,
.pagination > li.last > a {
    background-color: transparent;
}
/*</editor-fold>*/

/*<editor-fold desc="Modal faculty">*/
.text-black {
    color: #000000 !important;
}

.modal-backdrop.show {
    background-color: rgba(15, 88, 154, 0.55);
}

#modal-user-profile {
    user-select: none;
}

#modal-user-profile > .modal-title {

}

#modal-user-profile > #modal-user-profile-dialog >.modal-content {
    border-color: transparent;
    border-radius: 0.5rem;
    box-shadow: 0 0 12px 0 #064B7F;
    padding: 1rem 1rem 1rem 1.5rem;
}

#modal-user-profile > #modal-user-profile-dialog >.modal-content > .modal-header {
    border: none;
}

#modal-user-profile > #modal-user-profile-dialog >.modal-content > .modal-header > .modal-title {
    color: #000000;
    font-family: Avenir, serif;
    font-size: 1.4375rem;
    font-style: normal;
    font-weight: 900;
    line-height: 2rem;
}

#user-profile-body {
    padding: 0;
    overflow: hidden;
}

#user-modal-content {
    max-height: 85vh;
}

#user-profile-detail-header {
    flex-grow: 0;
}

@media (min-width: 992px) {
    #user-profile-detail-header {
        height: calc(13.125rem + (1 * .5rem));
    }
}

#user-profile-img {
    width: 210px;
    height: 210px;
    border-radius: 0;
}

#user-profile-county {
    font-family: Avenir, serif;
    font-size: 1rem;
    font-style: normal;
    line-height: 1.5rem;
}

#user-profile-county > span:first-child {
    font-weight: 800;
    color: #000000;
}

#user-profile-county > span:last-child {
    font-weight: 400;
    color: #000000;
}

.profilDetails {
    overflow-x: hidden;
    overflow-Y: scroll;
    height: 12rem;
    text-align: justify;
}

.profilDetails::-webkit-scrollbar {
    width: 0.375rem;
}
.profilDetails::-webkit-scrollbar-track {
    background: transparent;
}
.profilDetails::-webkit-scrollbar-thumb {
    background: #333333;
    border-radius: .2rem;
}
.profilDetails::-webkit-scrollbar-thumb:hover {
    background: #DDDDDD;
}

#biography {
    max-width: fit-content;
    color: #000000;
    font-family: Avenir, serif;
    font-size: 1rem;
    font-style: normal;
    font-weight: 400;
    line-height: 1.5rem;
}

#user-room-container {
    overflow-y: auto;
}
#user-room-container::-webkit-scrollbar {
    width: 0.375rem;
    height: 8rem;
}
#user-room-container::-webkit-scrollbar-track {
    background: transparent;
}
#user-room-container::-webkit-scrollbar-thumb {
    background: #333333;
    border-radius: .2rem;
}
#user-room-container::-webkit-scrollbar-thumb:hover {
    background: #DDDDDD;
}

#user-room-container > .user-room > .user-room-header {
    min-height: 1.5rem;
    color: #FFFFFF;
    background-color: #333333;
}

#user-room-container > .user-room > .user-room-text > p {
    font-family: Avenir, serif;
    font-size: 1.25rem;
    font-style: normal;
    font-weight: 400;
    line-height: 1.5rem;
    color: #333333 !important;
}

#user-room-container > .user-room > .user-room-text > p.user-room-details {
    line-height: 1rem;
    font-size: 1rem;
    color: #333333 !important;
    margin-top: .75rem;
    text-align: justify;
}

#user-room-container > .user-room > .user-room-text > p:nth-child(1) {
    font-size: 1rem;
    font-weight: 800;
}

#user-room-container > .user-room > .user-room-conflict-of-interest p {
    color: #333333 !important;
    font-family: Avenir, serif;
    font-size: 1rem;
    font-style: normal;
    font-weight: 500;
    line-height: 1.5rem;
    margin-bottom: .25rem;
    text-align: justify;
}

#user-room-container > .user-room > .user-room-conflict-of-interest > p:nth-child(1) {
    color: #0F589A !important;
    margin-left: 0;
}

#user-room-container > .user-room > .user-room-conflict-of-interest > div {
    height: 0;
    overflow: hidden;

    transition: height .5s ease-in-out;
}

#user-room-container > .user-room > .user-room-conflict-of-interest > p:nth-child(1)::before {
    position: relative;
    display: inline-block;
    left: 0;
    margin-right: .5rem;
    color: #0F589A;
    font-family: 'Font Awesome 6 Pro', serif;
    font-size: 1rem;
    font-style: normal;
    font-weight: 900;
    line-height: 1.5rem;
    content: "\F077";
    cursor: pointer;
    transition: transform .5s ease-in-out;
}
#user-room-container > .user-room > .user-room-conflict-of-interest > p:nth-child(1).open::before {
    transform: rotate(180deg);
}

.speaker-list-letter__enabled {
    text-decoration: underline;
}

.speaker-list-letter-selected {
    background-color: #0f589a;
}

#speakerListLetterBloc>a.speaker-list-letter-selected>strong{
    color: #ffffff!important;
}
/*</editor-fold>*/
