/*COMMON CSS*/
.select2-dropdown {top: -43px;}
.form-select {--bs-form-select-bg-img:none !important;}
/*CUSTOM CSS*/
.cls-bg-1{background-color: #00A7B5;}
.cls-bg-2{background-color: #002F6D;}
.cls-bg-3{background-color: #FFFFFF;}
.cls-bg-4{background-color: #F2F2F2;}
.cls-text-1{color: #FFFFFF !important;}
.cls-text-2{color: #002F6D !important;}
.cls-text-3{color: #002F6D !important;}
.cls-text-4{color: /*#8E8E8E*/#ACACAC !important;}
.cls-text-5{color: #797979 !important;}
.cls-text-6{color: #0EB21A !important;}
.cls-text-7{color: #F58E02 !important;}
.cls-text-8{color: #E51313 !important;}
/*TAB DESIGN*/
li.nav-item > a:not(.active) {color: #002F6D !important;background: #E2E2E2 !important;margin-top: 1rem !important;padding-top: .25rem !important;padding-bottom: .25rem !important;border-top-left-radius: 0.5rem;border-top-right-radius: 0.5rem;}
li.nav-item > a.active {background-color: #002F6D !important;color: #FFFFFF !important;font-weight:500;border-top-left-radius: 0.5rem;border-top-right-radius: 0.5rem;}
/*SWAP JOURNEY BUTTON CSS*/
.SwapJourney {position: absolute;padding: 8px;border-radius: 50% !important;z-index: 1;margin-left: -4px;margin-top: 6px;cursor: pointer;}
i.SwapJourney {background-color: #FFCD00 !important;color: #FFFFFF !important;}
/*FIND BUTTON CSS*/
.cls-btn-1, .cls-btn-1:hover, .cls-btn-1:active {background-color: #FFCD00 !important;color:#FFFFFF !important;}
#btnLSFindMyCoach:after {content: '';background-image: url(/Resources/Megabus/images/circle-arrow-icon.svg);width: 25px;height: 25px;position: absolute;margin-left: 7px;}
#btnSNFindMyCoach:after {content: '';background-image: url(/Resources/Megabus/images/circle-arrow-icon.svg);width: 25px;height: 25px;position: absolute;margin-left: 7px;}
/*ACTIVE JOUNEY CSS*/
.cls-active-jrny{background-color: #d8ebfb !important;border: 1px solid #82b2d4 !important;}
/*LIVE TRACKING SCROLLING CSS*/
.HRScrollJourneyList,.HRScrollJourneyList:hover{position:relative;overflow: scroll;overflow-x: hidden;overflow-y: auto;white-space: nowrap;height: 600px;scrollbar-width: thin;scrollbar-color: #002F6D transparent;}
.HRScrollJourneyList::-webkit-scrollbar-track, .HRScrollJourneyList::-webkit-scrollbar-track:hover{border-radius: 10px;background: #002F6D !important;}
.HRScrollJourneyList::-webkit-scrollbar-thumb, .HRScrollJourneyList::-webkit-scrollbar-thumb:hover{border-radius: 10px;background-color: #002F6D !important;}
/*TRACKER DETAILS SCROLLING CSS*/
.HRScrollStopList,.HRScrollStopList:hover{position:relative;overflow: scroll;overflow-x: hidden;overflow-y: auto;white-space: nowrap;height: 433px;scrollbar-width: thin;scrollbar-color: #002F6D transparent;}
.HRScrollStopList::-webkit-scrollbar-track, .HRScrollStopList::-webkit-scrollbar-track:hover{border-radius: 10px;background: #002F6D !important;}
.HRScrollStopList::-webkit-scrollbar-thumb, .HRScrollStopList::-webkit-scrollbar-thumb:hover{border-radius: 10px;background-color: #002F6D !important;}
/*STOPS DONE IMAGE CSS*/
.ImgStopsDone {position: absolute;z-index: 1;margin-left: -2px;margin-top: 10px;}
/*STOPS PENDING IMAGE CSS*/
.ImgStopsPending {position: absolute;z-index: 1;margin-left: -2px;margin-top: 10px;}
/*LAST STOP DONE IMAGE CSS*/
.ImgLastStopsDone {position: absolute;z-index: 1;margin-left: -2px;margin-top: 10px;}
/*LAST PENDING DONE IMAGE CSS*/
.ImgLastStopsPending {position: absolute;z-index: 1;margin-left: -2px;margin-top: 10px;}
/*LIVE BUS IMAGE CSS*/
.LiveBus {background: url(/Resources/Megabus/LiveTT.svg) no-repeat !important;background-size: 40px !important;width: 40px !important;height: 45px !important;margin-top: -35px !important;margin-left: -12px !important;position: absolute !important;z-index: 999999 !important;}
.LiveBus:before {content: "";border: 10px solid #00A7B5;border-radius: 50%;height: 48px;width: 48px;position: absolute;top: -7px;left: -4px;bottom: -15px;animation: pulsate 1.6s ease-out;animation-iteration-count: infinite;opacity: 0.0;z-index: 99;}
@keyframes pulsate {0% {transform: scale(0.6, 0.6);opacity: 0.0;}50% {opacity: 1.0;}100% {transform: scale(1, 1);opacity: 0.0;}}
/*LIVE BUS START POINT IMAGE CSS*/
.StartLiveBus {background: url(/Resources/Megabus/LiveTT.svg) no-repeat !important;background-size: 40px !important;width: 40px !important;height: 45px !important;margin-left: -12px !important;position: absolute !important;z-index: 999999 !important;}
/*ELLIPSIS TEXT CSS*/
.text-ellipsis{white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
/*MAP INFO. WINDOW CSS*/
.leaflet-popup-content{max-width: 401px !important;min-width: auto !important;width: auto !important;white-space:nowrap;}
.MainDivInfoWindow {width: 401px;white-space:normal;}
.MainDivBusInfo {width: 100%;display: inline-block;border-bottom: 1px solid #D8D8DB;}
.DivBusNo {margin-bottom: 0.75rem;text-align: left;}
.DivBusNo > i {font-size: 2rem;color: #009ef7;margin-right: 0.75rem;}
.DivBusNo > span {display: inline-block;align-items: center;color: #ffffff;background-color: #009ef7;font-size: 2rem;border-radius: 50rem !important;font-weight: 500;padding: 0.325rem 0.5rem;text-align: center;line-height: 1;}
.MainDivDepart {width: 100%;display: inline-block;text-align: left;margin-top: 0.75rem;}
.MainDivDepart > label {font-size: 1.25rem;margin-bottom: 0;font-weight: 400;color: #252f4a;}
.MainDivDepart > label > i {color: #4B5675;font-size: 1.25rem;margin-right: 0.5rem;}
.MainDivDepart > label > span {padding: 0.325rem 0.5rem;font-size: 0.85rem;font-weight: 500;line-height: 1;border-radius: 0.475rem;color: #ffffff;background-color: #7239EA;display: inline-block;align-items: center;margin-left: 0.5rem;vertical-align: text-bottom;}
.MainDivTowards {width: 100%;display: inline-block;text-align: left;margin-top: 0.5rem;}
.MainDivTowards > label {font-size: 1.25rem;margin-bottom: 0;font-weight: 400;color: #252f4a;}
.MainDivTowards > label > i {color: #4B5675;font-size: 1.25rem;margin-right: 0.5rem;}
.MainDivTowards > label > span {padding: 0.325rem 0.5rem;font-size: 0.85rem;font-weight: 500;line-height: 1;border-radius: 0.475rem;color: #ffffff;background-color: #7239EA;display: inline-block;align-items: center;margin-left: 0.5rem;vertical-align: text-bottom;}
.MainDivStatus {width: 100%;display: inline-block;text-align: left;margin-top: 1.25rem;background-color: #f9f9f9;border-radius: 0.475rem;padding: 0.5rem;}
.MainDivStatus > .StatusTitle {font-size: 1.25rem;margin-bottom: 0;font-weight: 400;width: 100%;}
.MainDivStatus > .StatusTitle > .OnTime {padding: 0.325rem 0.5rem;font-weight: 500;line-height: 1;border-radius: 0.475rem;color: #FFFFFF;background-color: #50CD89;display: inline-block;align-items: center;margin-left: 0.5rem;}
.MainDivStatus > .StatusTitle > .Early {padding: 0.325rem 0.5rem;font-weight: 500;line-height: 1;border-radius: 0.475rem;color: #FFFFFF;background-color: #F14141;display: inline-block;align-items: center;margin-left: 0.5rem;}
.MainDivStatus > .StatusTitle > .Late {padding: 0.325rem 0.5rem;font-weight: 500;line-height: 1;border-radius: 0.475rem;color: #1E2129;background-color: #FFC700;display: inline-block;align-items: center;margin-left: 0.5rem;}
.MainDivStatus > .StatusTitle > .NoComm {padding: 0.325rem 0.5rem;font-weight: 500;line-height: 1;border-radius: 0.475rem;color: #252F4A;background-color: #E1E3EA;display: inline-block;align-items: center;margin-left: 0.5rem;}
.MainDivLastUpdate {width: 100%;display: inline-block;text-align: left;margin-top: 0.5rem;background-color: #f9f9f9;border-radius: 0.475rem;padding: 0.5rem;}
.MainDivLastUpdate > label {font-size: 0.95rem;margin-bottom: 0;font-weight: 400;color: #252f4a;}
.MainDivLastUpdate > label > i {color: #009ef7;font-size: 0.95rem;margin-right: 0.5rem;margin-left: 0.5rem;}
/*CONFIRM MODAL CSS*/
#BlockDivConfBox > div.modal-header > h3.modal-title{font-weight: 500;}
#BlockDivConfBox > div.modal-body > div > div > h2#DivConfirmationBox_MsgText{font-weight: 400;}
/*POLYLINE BORDER COLOR CSS*/
.PolylineColor {stroke: #00A7B5;stroke-width: 5;}
.PolylineArrowColor{stroke:#002F6D;}
@media (max-width: 768px) {
    /*LIVE TRACKING SCROLLING CSS*/
    .HRScrollJourneyList,.HRScrollJourneyList:hover{position:relative;overflow: scroll;overflow-x: hidden;overflow-y: auto;white-space: nowrap;height: 640px;scrollbar-width: thin;scrollbar-color: #002F6D transparent;}
    .HRScrollStopList,.HRScrollStopList:hover{position:relative;overflow: scroll;overflow-x: hidden;overflow-y: auto;white-space: nowrap;height: 445px;scrollbar-width: thin;scrollbar-color: #002F6D transparent;}
    /*STOPS DONE IMAGE CSS*/
    .ImgStopsDone {position: absolute;z-index: 1;margin-left: 8px;margin-top: 10px;}
    /*STOPS PENDING IMAGE CSS*/
    .ImgStopsPending {position: absolute;z-index: 1;margin-left: 8px;margin-top: 10px;}
    /*LAST STOP DONE IMAGE CSS*/
    .ImgLastStopsDone {position: absolute;z-index: 1;margin-left: 8px;margin-top: 10px;}
    /*LAST PENDING DONE IMAGE CSS*/
    .ImgLastStopsPending {position: absolute;z-index: 1;margin-left: 8px;margin-top: 10px;}
    /*LIVE BUS IMAGE CSS*/
    .LiveBus {background: url(/Resources/Megabus/LiveTT.svg) no-repeat !important;background-size: 40px !important;width: 40px !important;height: 45px !important;margin-top: -35px !important;margin-left: -2px !important;position: absolute !important;z-index: 999999 !important;}
    .LiveBus:before {content: "";border: 10px solid #00A7B5;border-radius: 50%;height: 48px;width: 48px;position: absolute;top: -7px;left: -4px;bottom: -15px;animation: pulsate 1.6s ease-out;animation-iteration-count: infinite;opacity: 0.0;z-index: 99;}
    @keyframes pulsate {0% {transform: scale(0.6, 0.6);opacity: 0.0;}50% {opacity: 1.0;}100% {transform: scale(1, 1);opacity: 0.0;}}
    /*LIVE BUS START POINT IMAGE CSS*/
    .StartLiveBus {background: url(/Resources/Megabus/LiveTT.svg) no-repeat !important;background-size: 40px !important;width: 40px !important;height: 45px !important;margin-left: -2px !important;position: absolute !important;z-index: 999999 !important;}
    /*ELLIPSIS TEXT CSS*/
    .text-ellipsis{white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
}
@media (max-width: 600px){
    .SwapJourney {margin-left: -12%;margin-top: 11%;}
    .fa-exchange {transform: rotate(90deg);}
}
@media (max-width: 480px){
    .SwapJourney {margin-left: -12%;margin-top: 8%;}
    .fa-exchange {transform: rotate(90deg);}
    /*STOPS DONE IMAGE CSS*/
    .ImgStopsDone {position: absolute;z-index: 1;margin-left: 11px;margin-top: 10px;}
    /*STOPS PENDING IMAGE CSS*/
    .ImgStopsPending {position: absolute;z-index: 1;margin-left: 11px;margin-top: 10px;}
    /*LAST STOP DONE IMAGE CSS*/
    .ImgLastStopsDone {position: absolute;z-index: 1;margin-left: 11px;margin-top: 10px;}
    /*LAST PENDING DONE IMAGE CSS*/
    .ImgLastStopsPending {position: absolute;z-index: 1;margin-left: 11px;margin-top: 10px;}
    /*LIVE BUS IMAGE CSS*/
    .LiveBus {background: url(/Resources/Megabus/LiveTT.svg) no-repeat !important;background-size: 40px !important;width: 40px !important;height: 45px !important;margin-top: -32px !important;margin-left: 1px !important;position: absolute !important;z-index: 999999 !important;}
    .LiveBus:before {content: "";border: 10px solid #00A7B5;border-radius: 50%;height: 48px;width: 48px;position: absolute;top: -7px;left: -4px;bottom: -15px;animation: pulsate 1.6s ease-out;animation-iteration-count: infinite;opacity: 0.0;z-index: 99;}
    @keyframes pulsate {0% {transform: scale(0.6, 0.6);opacity: 0.0;}50% {opacity: 1.0;}100% {transform: scale(1, 1);opacity: 0.0;}}
    /*LIVE BUS START POINT IMAGE CSS*/
    .StartLiveBus {background: url(/Resources/Megabus/LiveTT.svg) no-repeat !important;background-size: 40px !important;width: 40px !important;height: 45px !important;margin-left: 1px !important;position: absolute !important;z-index: 999999 !important;}
    /*ELLIPSIS TEXT CSS*/
    .text-ellipsis{white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
}
@media (max-width: 414px){
    .SwapJourney {margin-left: -12%;margin-top: 11%;}
    .fa-exchange {transform: rotate(90deg);}
}
@media (max-width: 412px){
    .SwapJourney {margin-left: -12%;margin-top: 11%;}
    .fa-exchange {transform: rotate(90deg);}
}
@media (max-width: 375px){
    .SwapJourney {margin-left: -12%;margin-top: 9%;}
    .fa-exchange {transform: rotate(90deg);}
    /*STOPS DONE IMAGE CSS*/
    .ImgStopsDone {position: absolute;z-index: 1;margin-left: 8px;margin-top: 10px;}
    /*STOPS PENDING IMAGE CSS*/
    .ImgStopsPending {position: absolute;z-index: 1;margin-left: 8px;margin-top: 10px;}
    /*LAST STOP DONE IMAGE CSS*/
    .ImgLastStopsDone {position: absolute;z-index: 1;margin-left: 8px;margin-top: 10px;}
    /*LAST PENDING DONE IMAGE CSS*/
    .ImgLastStopsPending {position: absolute;z-index: 1;margin-left: 8px;margin-top: 10px;}
    /*LIVE BUS IMAGE CSS*/
    .LiveBus {background: url(/Resources/Megabus/LiveTT.svg) no-repeat !important;background-size: 40px !important;width: 40px !important;height: 45px !important;margin-top: -32px !important;margin-left: -2px !important;position: absolute !important;z-index: 999999 !important;}
    .LiveBus:before {content: "";border: 10px solid #00A7B5;border-radius: 50%;height: 48px;width: 48px;position: absolute;top: -7px;left: -4px;bottom: -15px;animation: pulsate 1.6s ease-out;animation-iteration-count: infinite;opacity: 0.0;z-index: 99;}
    @keyframes pulsate {0% {transform: scale(0.6, 0.6);opacity: 0.0;}50% {opacity: 1.0;}100% {transform: scale(1, 1);opacity: 0.0;}}
    /*LIVE BUS START POINT IMAGE CSS*/
    .StartLiveBus {background: url(/Resources/Megabus/LiveTT.svg) no-repeat !important;background-size: 40px !important;width: 40px !important;height: 45px !important;margin-left: -2px !important;position: absolute !important;z-index: 999999 !important;}
    /*ELLIPSIS TEXT CSS*/
    .text-ellipsis{white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
}
@media (max-width: 360px){
    .SwapJourney {margin-left: -12%;margin-top: 11%;}
    .fa-exchange {transform: rotate(90deg);}
}
@media (max-width: 320px){ 
    .SwapJourney {margin-left: -12%;margin-top: 11%;}
    .fa-exchange {transform: rotate(90deg);}
    /*STOPS DONE IMAGE CSS*/
    .ImgStopsDone {position: absolute;z-index: 1;margin-left: 2px;margin-top: 10px;}
    /*STOPS PENDING IMAGE CSS*/
    .ImgStopsPending {position: absolute;z-index: 1;margin-left: 2px;margin-top: 10px;}
    /*LAST STOP DONE IMAGE CSS*/
    .ImgLastStopsDone {position: absolute;z-index: 1;margin-left: 2px;margin-top: 10px;}
    /*LAST PENDING DONE IMAGE CSS*/
    .ImgLastStopsPending {position: absolute;z-index: 1;margin-left: 2px;margin-top: 10px;}
    /*LIVE BUS IMAGE CSS*/
    .LiveBus {background: url(/Resources/Megabus/LiveTT.svg) no-repeat !important;background-size: 40px !important;width: 40px !important;height: 45px !important;margin-top: -33px !important;margin-left: -8px !important;position: absolute !important;z-index: 999999 !important;}
    .LiveBus:before {content: "";border: 10px solid #00A7B5;border-radius: 50%;height: 48px;width: 48px;position: absolute;top: -7px;left: -4px;bottom: -15px;animation: pulsate 1.6s ease-out;animation-iteration-count: infinite;opacity: 0.0;z-index: 99;}
    @keyframes pulsate {0% {transform: scale(0.6, 0.6);opacity: 0.0;}50% {opacity: 1.0;}100% {transform: scale(1, 1);opacity: 0.0;}}
    /*LIVE BUS START POINT IMAGE CSS*/
    .StartLiveBus {background: url(/Resources/Megabus/LiveTT.svg) no-repeat !important;background-size: 40px !important;width: 40px !important;height: 45px !important;margin-left: -8px !important;position: absolute !important;z-index: 999999 !important;}
    /*ELLIPSIS TEXT CSS*/
    .text-ellipsis{white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
}