.overlay {
    position: absolute;
    display:none;
    right: 0;
    left: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.16);
    opacity: 0;
    transition: all 450ms cubic-bezier(0.32, 1, 0.23, 1) 0ms;
}
.overlay .modal-bottom-sheet {
    position: fixed;
    bottom: 0;
    width: 100%;
    background-color: #fff;
    padding-top: 20px;
    box-sizing: border-box;
    box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.22), 0px 14px 56px rgba(0, 0, 0, 0.25);
    transform: translate(0, 100%);
    transition: all 450ms cubic-bezier(0.32, 1, 0.23, 1) 100ms;
    max-height: 60%;
    border-radius: 15px 15px 0 0;
}

.overlay .modal-bottom-sheet.modal-bottom-sheet-blue{
    color: white;
    background: linear-gradient(135deg, #0952BF 0%, #0C8AD1 100%);
}

.overlay .modal-bottom-sheet.modal-bottom-sheet-blue svg{
    fill: white;
}

.overlay .modal-bottom-sheet.modal-bottom-sheet-large{
    max-height: 85%;
}

.overlay .modal-bottom-sheet.modal-bottom-sheet-fixed{
    height: 100%;
}

.overlay .modal-bottom-sheet .modal-bottom-sheet-content{
    max-height: 60vh;
    overflow-y:scroll;
    padding-bottom:60px;
}

.overlay .modal-bottom-sheet.modal-bottom-sheet-large .modal-bottom-sheet-content{
    max-height: 85vh;
}

.overlay .modal-bottom-sheet ul.action-list li{
    padding: 5px 0;
}

.overlay .modal-bottom-sheet ul a {
    display: block;
    margin: 8px 0;
    color: gray;
    text-decoration: none;
    text-align: center;
}

.overlay .btn-close-modal-bottom-sheet {
    color: #666;
    transform: scale(0, 0);
    transition: all 450ms ease-in-out 0;
}
.overlay:target {
    display: block;
    position: fixed;
    top: 0;
    opacity: 1;
}
.overlay:target .modal-bottom-sheet {
    transform: translate(0, 0);
    z-index: 9;
}
.overlay:target .btn-close-modal-bottom-sheet {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    outline: 0 none;
    transform: scale(1, 1);
}

.carousel .carousel-item {
    transition-duration: 0.35s;
}

.overlay .ispinner{
    position: absolute;
    left: 50%;
    top: 20%;
}

.overlay .modal-bottom-sheet .carousel-next, 
.overlay .modal-bottom-sheet .carousel-prev{
    color: inherit;
}

@media screen and (min-width: 640px) {
    .overlay {
        padding: 0 19%;
    }
    .overlay .modal-bottom-sheet {
        max-width: 62%;
        margin: 0 auto;
    }
}
@media screen and (min-width: 960px) {
    .overlay {
        padding: 0 23.5%;
    }
    .overlay .modal-bottom-sheet {
        min-width: 384px;
        max-width: 50%;
    }
}
@media screen and (min-width: 1280px) {
    .overlay {
        padding: 0 26%;
    }
    .overlay .modal-bottom-sheet {
        min-width: 512px;
        max-width: 48%;
    }
}
@media screen and (min-width: 1440px) {
    .overlay {
        padding: 0 28%;
    }
    .overlay .modal-bottom-sheet {
        min-width: 576px;
        max-width: 44%;
    }
}
.sr-only {
    /* a generic way to visually hide content while remaining accessible to screen readers (h5bp.com) */
    clip: rect(0 0 0 0);
    overflow: hidden;
    position: absolute;
    height: 1px;
    width: 1px;
}