:root{
    --catalog-color:#adadad;
    --dark-grey: #444444;
}
.AuthorCatelog-banner-link{ background: url(/assets/img/AuthorCatelog-Banner-Color.webp) no-repeat center center; background-size:cover; padding: 15px 0 30px 0;}
.AuthorCatelog-banner-link h1{ margin: 0;}
.AuthorCatelog-banner-link h1 a{ font-size: 36px; font-weight: 700; color: var(--bs-body-bg); margin: 0; text-decoration: none;}
.AuthorCatelog-banner-link h2{ font-size:22px; font-weight: 600; color: var(--bs-body-bg); margin: 0;}
.catelog-links-wrraper{ width: 100%; display: flex; justify-content: flex-start; align-items: center; margin-top: 30px;}
.catelog-links-wrraper label{ font-size: 15px; font-weight: 600; color: var(--bs-body-bg); margin-right: 10px;}
.catelog-links-wrraper ul{ margin: 0; padding: 0; display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap;}
.catelog-links-wrraper ul li{ margin: 0px 10px 0px 0px; padding: 0; list-style: none;}
.catelog-links-wrraper ul li a{ background-color: transparent; padding: 3px 12px; border:2px solid var(--bs-body-bg); font-size: 15px; font-weight: 600; color: var(--bs-body-bg); text-decoration: none; border-radius: 3px;}
.catelog-links-wrraper ul li a:hover{background-color:rgba(var(--background-color-rgb),0.4);}
.FindbyName-bar{ background-color: var(--catalog-color); padding: 25px 0px; margin-top: 3px; transition: transform 0.35s ease;}
.fixed-FindbyName-bar{ position: sticky; top:154px; z-index: 100; animation: slideDown 0.35s ease forwards; padding: 13px 0px;}
@keyframes slideDown {from {transform: translateY(-100%);}to {transform: translateY(0);}}
.fixed-FindbyName-bar .SearchbyAlphabat{ display: none;}
.FindbyName-bar label{ font-size: 16px; color: var(--bs-body-bg); font-weight: 600;}
.AlphaFilter{ width: 100%; display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap; margin: 0; padding: 0;}
.AlphaFilter li{ margin: 0; padding: 0; list-style: none;}
.AlphaFilter li a{ position: relative; padding: 0 11px; font-size: 15px; color: var(--bs-body-bg); text-decoration: none;}
.AlphaFilter li a:hover{ color: var(--default-color);}
.AlphaFilter li a::after{ content: "|"; position: absolute; color: #fff; font-size: 15px; display: inline-block; margin-left: 10px;}
.AlphaFilter li:last-child a::after{ display: none;}
.AlphaFilter li:first-child a{ padding-left: 0;}
.SearchbyAlphabat{ width: 100%; display: flex; justify-content: flex-start; align-items: center; margin-top: 1rem; position: relative;}
.SearchbyAlphabat .form-control{ max-width: 235px; font-size: 13px; border-radius: 3px; height: 35px;}
.SearchbyAlphabat .form-control:focus{background-color: var(--bs-body-bg); border-color: var(--bs-body-bg);}
.SearchbyAlphabat .btn-primary{ width: 40px; height: 35px; margin-left: 5px; background-color: var(--bs-body-bg); border-color: var(--bs-body-bg); position: relative; font-size: 18px; color: var(--catalog-color); padding: 0; border-radius: 3px;}
.whitebg-fuild{ background-color: var(--bs-body-bg);}
.letterstart{ display: flex; justify-content: center; position: absolute; left: 50%; transform: translate(-50%, -50px);}
.letterstart h2{ width: 100px; height: 100px; display: flex; justify-content: center; align-items: center; background-color: var(--bs-body-bg); border: 3px solid var(--light-dark); font-size: 45px; color: var(--light-dark); border-radius: 50%; margin: 0;}
.allspeaker-list-section .allspeaker-list{ padding:90px 0px;}
.allspeaker-list ul{ margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 15px;}
.allspeaker-list ul li{ list-style: none; display: flex; justify-content: flex-start; align-items: flex-start; margin-bottom: 15px;}
.allspeaker-list ul li .allspeaker-img{ margin-right: 10px;}
.allspeaker-list ul li .allspeaker-img img{ aspect-ratio: 1/1;}
.allspeaker-list ul li .allspeaker-name a{ font-size: 15px; font-weight: 600; color: var(--heading-color); text-decoration: none; line-height: 0;}
.allspeaker-list ul li .allspeaker-byline{ font-size:12px; color: var(--light-dark); font-weight: 400; line-height:16px;}
/* .SeeMore-AllSpeakerList{ background-color: var(--bs-body-bg);} */
.SeeMore-AllSpeakerList .btn{ background-color: var(--default-color); border-color: var(--default-color); border-radius: 4px; padding:10px 40px; font-size: 15px; color: var(--bs-body-bg); text-transform: uppercase; letter-spacing: 0.01em; box-shadow: none;}
.SeeMore-AllSpeakerList .btn:active, .SeeMore-AllSpeakerList .btn:focus{ box-shadow: none; background-color: var(--default-color); border-color: var(--default-color);}
#speakers-list-content-loader { padding-top: 50px; display: flex; justify-content: center; align-items: flex-start; min-height: 500px;}
#suggesstion-box-speaker-keyword-search #author-search-list{ width: 280px; background-color: var(--bs-body-bg); position: absolute; left: 0; top:18px; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2); padding: 10px 10px 7px 10px; z-index:7; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; transform: translate3d(0, 20px, 0); -webkit-transform: translate3d(0, 20px, 0); -moz-transform: translate3d(0, 20px, 0); -ms-transform: translate3d(0, 20px, 0); -o-transform: translate3d(0, 20px, 0); list-style: none;}
#suggesstion-box-speaker-keyword-search #author-search-list li{ border-top: 1px solid rgba(var(--heading-color-rgb),0.1);}
#suggesstion-box-speaker-keyword-search #author-search-list li:first-child{ border-top: none;}
#suggesstion-box-speaker-keyword-search #author-search-list li:last-child{ text-align: center;}
#suggesstion-box-speaker-keyword-search #author-search-list li a{ font-size: 13px; color: var(--dark-grey); padding: 8px 0 8px 8px; line-height: 26px; text-decoration: none; display: block;}
#suggesstion-box-speaker-keyword-search #author-search-list li a:hover{ background-color: var(--default-color); color: var(--bs-body-bg);}


@media (max-width:1024px) {
.fixed-FindbyName-bar{ top: 75px;}
}

@media (max-width:991px) {
.FindbyName-bar{ text-align: center; min-height: 190px;}
.FindbyName-bar label{ font-size: 14px;}
.fixed-FindbyName-bar{ padding: 5px 0; min-height: auto;}
.AlphaFilter, .SearchbyAlphabat{ justify-content: center;}
.AlphaFilter li a{ padding: 0 8px;}
.AlphaFilter li a::after{ margin-left: 7px;}
#suggesstion-box-speaker-keyword-search #author-search-list{ left: 50%; transform: translate3d(-50%, 20px, 0); -webkit-transform: translate3d(-50%, 20px, 0);}
.letterstart{ width: 80px; height: 80px; font-size: 40px; transform: translate(-50%, -40px);}
.letterstart h2{width: 80px; height: 80px; font-size: 40px;}
.allspeaker-list ul{ grid-template-columns: repeat(2, 1fr);}
}

@media (max-width:767px) {
.FindbyName-bar{ padding: 15px 0;  min-height: 180px;}
.fixed-FindbyName-bar{padding: 5px 0; min-height: auto;  top:68px;}
.SearchbyAlphabat{ margin-top: 0.8rem;}
.letterstart{ width:70px; height: 70px; transform: translate(-50%, -35px);}
.letterstart h2{width:70px; height:70px;}
.AlphaFilter li a{ padding: 0 10px;}
}

@media (max-width:599px) {
.allspeaker-list-section .allspeaker-list{ padding:40px 0px;}
.AuthorCatelog-banner-link{ padding: 15px 0 50px 0;}
.AuthorCatelog-banner-link h1 a{ font-size: 30px;}
.AuthorCatelog-banner-link h2{ font-size:16px;}
.FindbyName-bar{ min-height: auto; padding:10px 0 35px 0; transition: transform 1s ease;}
.fixed-FindbyName-bar{padding: 5px 0; animation: slideDown 1s ease forwards;}
.catelog-links-wrraper{ margin-top: 10px; flex-wrap: wrap;}
.catelog-links-wrraper ul li{ width: calc(50% - 10px); margin-bottom: 7px;}
.catelog-links-wrraper ul li a{ display: block; text-align: center;}

.fixed-FindbyName-bar .AlphaFilter li{ width: 33px; text-align: center;}
.fixed-FindbyName-bar .AlphaFilter li a{ padding: 0;}
.letterstart{ width:46px; height:46px; font-size:28px; transform: translate(-50%, -23px);}
.letterstart h2{width:46px; height:46px; font-size:28px;}
.allspeaker-list ul{ grid-template-columns:1fr;}

}