.offcanvas,.offcanvas-lg,.offcanvas-md,.offcanvas-sm,.offcanvas-xl,.offcanvas-xxl{
    --bs-offcanvas-zindex:1045;
    --bs-offcanvas-width:600px;
    --bs-offcanvas-height:30vh;
    --bs-offcanvas-padding-x:1rem;
    --bs-offcanvas-padding-y:1rem;
    --bs-offcanvas-color:var(--bs-body-color);
    --bs-offcanvas-bg:var(--bs-body-bg);
    --bs-offcanvas-border-width:var(--bs-border-width);
    --bs-offcanvas-border-color:var(--bs-border-color-translucent);
    --bs-offcanvas-box-shadow:var(--bs-box-shadow-sm);
    --bs-offcanvas-transition:transform 0.3s ease-in-out;
    --bs-offcanvas-title-line-height:1.5
}
@media (max-width:575.98px){
    .offcanvas-sm{
        position:fixed;
        bottom:0;
        z-index:var(--bs-offcanvas-zindex);
        display:flex;
        flex-direction:column;
        max-width:100%;
        color:var(--bs-offcanvas-color);
        visibility:hidden;
        background-color:var(--bs-offcanvas-bg);
        background-clip:padding-box;
        outline:0;
        transition:var(--bs-offcanvas-transition)
    }
}
@media (max-width:575.98px) and (prefers-reduced-motion:reduce){
    .offcanvas-sm{
        transition:none
    }
}
@media (max-width:575.98px){
    .offcanvas-sm.offcanvas-start{
        top:0;
        left:0;
        width:var(--bs-offcanvas-width);
        border-right:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        transform:translateX(-100%)
    }
    .offcanvas-sm.offcanvas-end{
        background-color:white;
        top:0;
        right:0;
        width:var(--bs-offcanvas-width);
        border-left:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        transform:translateX(100%)
    }
    .offcanvas-sm.offcanvas-top{
        top:0;
        right:0;
        left:0;
        height:var(--bs-offcanvas-height);
        max-height:100%;
        border-bottom:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        transform:translateY(-100%)
    }
    .offcanvas-sm.offcanvas-bottom{
        right:0;
        left:0;
        height:var(--bs-offcanvas-height);
        max-height:100%;
        border-top:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        transform:translateY(100%)
    }
    .offcanvas-sm.show:not(.hiding),.offcanvas-sm.showing{
        transform:none
    }
    .offcanvas-sm.hiding,.offcanvas-sm.show,.offcanvas-sm.showing{
        visibility:visible
    }
}
@media (min-width:576px){
    .offcanvas-sm{
        --bs-offcanvas-height:auto;
        --bs-offcanvas-border-width:0;
        background-color:transparent!important
    }
    .offcanvas-sm .offcanvas-header{
        display:none
    }
    .offcanvas-sm .offcanvas-body{
        display:flex;
        flex-grow:0;
        padding:0;
        overflow-y:visible;
        background-color:transparent!important
    }
}
@media (max-width:767.98px){
    .offcanvas-md{
        position:fixed;
        bottom:0;
        z-index:var(--bs-offcanvas-zindex);
        display:flex;
        flex-direction:column;
        max-width:100%;
        color:var(--bs-offcanvas-color);
        visibility:hidden;
        background-color:var(--bs-offcanvas-bg);
        background-clip:padding-box;
        outline:0;
        transition:var(--bs-offcanvas-transition)
    }
}
@media (max-width:767.98px) and (prefers-reduced-motion:reduce){
    .offcanvas-md{
        transition:none
    }
}
@media (max-width:767.98px){
    .offcanvas-md.offcanvas-start{
        top:0;
        left:0;
        width:var(--bs-offcanvas-width);
        border-right:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        transform:translateX(-100%)
    }
    .offcanvas-md.offcanvas-end{
        background-color:white;
        top:0;
        right:0;
        width:var(--bs-offcanvas-width);
        border-left:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        transform:translateX(100%)
    }
    .offcanvas-md.offcanvas-top{
        top:0;
        right:0;
        left:0;
        height:var(--bs-offcanvas-height);
        max-height:100%;
        border-bottom:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        transform:translateY(-100%)
    }
    .offcanvas-md.offcanvas-bottom{
        right:0;
        left:0;
        height:var(--bs-offcanvas-height);
        max-height:100%;
        border-top:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        transform:translateY(100%)
    }
    .offcanvas-md.show:not(.hiding),.offcanvas-md.showing{
        transform:none
    }
    .offcanvas-md.hiding,.offcanvas-md.show,.offcanvas-md.showing{
        visibility:visible
    }
}
@media (min-width:768px){
    .offcanvas-md{
        --bs-offcanvas-height:auto;
        --bs-offcanvas-border-width:0;
        background-color:transparent!important
    }
    .offcanvas-md .offcanvas-header{
        display:none
    }
    .offcanvas-md .offcanvas-body{
        display:flex;
        flex-grow:0;
        padding:0;
        overflow-y:visible;
        background-color:transparent!important
    }
}
@media (max-width:991.98px){
    .offcanvas-lg{
        position:fixed;
        bottom:0;
        z-index:var(--bs-offcanvas-zindex);
        display:flex;
        flex-direction:column;
        max-width:100%;
        color:var(--bs-offcanvas-color);
        visibility:hidden;
        background-color:var(--bs-offcanvas-bg);
        background-clip:padding-box;
        outline:0;
        transition:var(--bs-offcanvas-transition)
    }
}
@media (max-width:991.98px) and (prefers-reduced-motion:reduce){
    .offcanvas-lg{
        transition:none
    }
}
@media (max-width:991.98px){
    .offcanvas-lg.offcanvas-start{
        top:0;
        left:0;
        width:var(--bs-offcanvas-width);
        border-right:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        transform:translateX(-100%)
    }
    .offcanvas-lg.offcanvas-end{
        background-color:white;
        top:0;
        right:0;
        width:var(--bs-offcanvas-width);
        border-left:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        transform:translateX(100%)
    }
    .offcanvas-lg.offcanvas-top{
        top:0;
        right:0;
        left:0;
        height:var(--bs-offcanvas-height);
        max-height:100%;
        border-bottom:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        transform:translateY(-100%)
    }
    .offcanvas-lg.offcanvas-bottom{
        right:0;
        left:0;
        height:var(--bs-offcanvas-height);
        max-height:100%;
        border-top:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        transform:translateY(100%)
    }
    .offcanvas-lg.show:not(.hiding),.offcanvas-lg.showing{
        transform:none
    }
    .offcanvas-lg.hiding,.offcanvas-lg.show,.offcanvas-lg.showing{
        visibility:visible
    }
}
@media (min-width:992px){
    .offcanvas-lg{
        --bs-offcanvas-height:auto;
        --bs-offcanvas-border-width:0;
        background-color:transparent!important
    }
    .offcanvas-lg .offcanvas-header{
        display:none
    }
    .offcanvas-lg .offcanvas-body{
        display:flex;
        flex-grow:0;
        padding:0;
        overflow-y:visible;
        background-color:transparent!important
    }
}
@media (max-width:1199.98px){
    .offcanvas-xl{
        position:fixed;
        bottom:0;
        z-index:var(--bs-offcanvas-zindex);
        display:flex;
        flex-direction:column;
        max-width:100%;
        color:var(--bs-offcanvas-color);
        visibility:hidden;
        background-color:var(--bs-offcanvas-bg);
        background-clip:padding-box;
        outline:0;
        transition:var(--bs-offcanvas-transition)
    }
}
@media (max-width:1199.98px) and (prefers-reduced-motion:reduce){
    .offcanvas-xl{
        transition:none
    }
}
@media (max-width:1199.98px){
    .offcanvas-xl.offcanvas-start{
        top:0;
        left:0;
        width:var(--bs-offcanvas-width);
        border-right:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        transform:translateX(-100%)
    }
    .offcanvas-xl.offcanvas-end{
        background-color:white;
        top:0;
        right:0;
        width:var(--bs-offcanvas-width);
        border-left:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        transform:translateX(100%)
    }
    .offcanvas-xl.offcanvas-top{
        top:0;
        right:0;
        left:0;
        height:var(--bs-offcanvas-height);
        max-height:100%;
        border-bottom:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        transform:translateY(-100%)
    }
    .offcanvas-xl.offcanvas-bottom{
        right:0;
        left:0;
        height:var(--bs-offcanvas-height);
        max-height:100%;
        border-top:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        transform:translateY(100%)
    }
    .offcanvas-xl.show:not(.hiding),.offcanvas-xl.showing{
        transform:none
    }
    .offcanvas-xl.hiding,.offcanvas-xl.show,.offcanvas-xl.showing{
        visibility:visible
    }
}
@media (min-width:1200px){
    .offcanvas-xl{
        --bs-offcanvas-height:auto;
        --bs-offcanvas-border-width:0;
        background-color:transparent!important
    }
    .offcanvas-xl .offcanvas-header{
        display:none
    }
    .offcanvas-xl .offcanvas-body{
        display:flex;
        flex-grow:0;
        padding:0;
        overflow-y:visible;
        background-color:transparent!important
    }
}
@media (max-width:1399.98px){
    .offcanvas-xxl{
        position:fixed;
        bottom:0;
        z-index:var(--bs-offcanvas-zindex);
        display:flex;
        flex-direction:column;
        max-width:100%;
        color:var(--bs-offcanvas-color);
        visibility:hidden;
        background-color:var(--bs-offcanvas-bg);
        background-clip:padding-box;
        outline:0;
        transition:var(--bs-offcanvas-transition)
    }
}
@media (max-width:1399.98px) and (prefers-reduced-motion:reduce){
    .offcanvas-xxl{
        transition:none
    }
}
@media (max-width:1399.98px){
    .offcanvas-xxl.offcanvas-start{
        top:0;
        left:0;
        width:var(--bs-offcanvas-width);
        border-right:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        transform:translateX(-100%)
    }
    .offcanvas-xxl.offcanvas-end{
        background-color:white;
        top:0;
        right:0;
        width:var(--bs-offcanvas-width);
        border-left:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        transform:translateX(100%)
    }
    .offcanvas-xxl.offcanvas-top{
        top:0;
        right:0;
        left:0;
        height:var(--bs-offcanvas-height);
        max-height:100%;
        border-bottom:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        transform:translateY(-100%)
    }
    .offcanvas-xxl.offcanvas-bottom{
        right:0;
        left:0;
        height:var(--bs-offcanvas-height);
        max-height:100%;
        border-top:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        transform:translateY(100%)
    }
    .offcanvas-xxl.show:not(.hiding),.offcanvas-xxl.showing{
        transform:none
    }
    .offcanvas-xxl.hiding,.offcanvas-xxl.show,.offcanvas-xxl.showing{
        visibility:visible
    }
}
@media (min-width:1400px){
    .offcanvas-xxl{
        --bs-offcanvas-height:auto;
        --bs-offcanvas-border-width:0;
        background-color:transparent!important
    }
    .offcanvas-xxl .offcanvas-header{
        display:none
    }
    .offcanvas-xxl .offcanvas-body{
        display:flex;
        flex-grow:0;
        padding:0;
        overflow-y:visible;
        background-color:transparent!important
    }
}
.offcanvas{
    position:fixed;
    bottom:0;
    z-index:var(--bs-offcanvas-zindex);
    display:flex;
    flex-direction:column;
    max-width:100%;
    color:var(--bs-offcanvas-color);
    visibility:hidden;
    background-color:var(--bs-offcanvas-bg);
    background-clip:padding-box;
    outline:0;
    transition:var(--bs-offcanvas-transition)
}
@media (prefers-reduced-motion:reduce){
    .offcanvas{
        transition:none
    }
}
.offcanvas.offcanvas-start{
    top:0;
    left:0;
    width:var(--bs-offcanvas-width);
    border-right:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
    transform:translateX(-100%)
}
.offcanvas.offcanvas-end{
    background-color:white;
    top:0;
    right:0;
    width:var(--bs-offcanvas-width);
    border-left:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
    transform:translateX(100%)
}
.offcanvas.offcanvas-top{
    top:0;
    right:0;
    left:0;
    height:var(--bs-offcanvas-height);
    max-height:100%;
    border-bottom:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
    transform:translateY(-100%)
}
.offcanvas.offcanvas-bottom{
    right:0;
    left:0;
    height:var(--bs-offcanvas-height);
    max-height:100%;
    border-top:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
    transform:translateY(100%)
}
.offcanvas.show:not(.hiding),.offcanvas.showing{
    transform:none
}
.offcanvas.hiding,.offcanvas.show,.offcanvas.showing{
    visibility:visible
}
.offcanvas-backdrop{
    position:fixed;
    top:0;
    left:0;
    z-index:1040;
    width:100vw;
    height:100vh;
    background-color:#000
}
.offcanvas-backdrop.fade{
    opacity:0
}
.offcanvas-backdrop.show{
    opacity:.5
}
.offcanvas-header{
    display:flex;
    align-items:center;
    padding:var(--bs-offcanvas-padding-y) var(--bs-offcanvas-padding-x)
}
.offcanvas-header .btn-close{
    padding:calc(var(--bs-offcanvas-padding-y) * .5) calc(var(--bs-offcanvas-padding-x) * .5);
    margin:calc(-.5 * var(--bs-offcanvas-padding-y)) calc(-.5 * var(--bs-offcanvas-padding-x)) calc(-.5 * var(--bs-offcanvas-padding-y)) auto
}
.offcanvas-title{
    margin-bottom:0;
    line-height:var(--bs-offcanvas-title-line-height)
}
.offcanvas-body{
    flex-grow:1;
    padding:var(--bs-offcanvas-padding-y) var(--bs-offcanvas-padding-x);
    overflow-y:auto
}
 .btn-close {
     --bs-btn-close-color: #000;
     --bs-btn-close-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3e%3c/svg%3e");
     --bs-btn-close-opacity: 0.5;
     --bs-btn-close-hover-opacity: 0.75;
     --bs-btn-close-focus-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
     --bs-btn-close-focus-opacity: 1;
     --bs-btn-close-disabled-opacity: 0.25;
     --bs-btn-close-white-filter: invert(1) grayscale(100%) brightness(200%);
     box-sizing: content-box;
     width: 1em;
     height: 1em;
     padding: .25em .25em;
     color: var(--bs-btn-close-color);
     background: transparent var(--bs-btn-close-bg) center/1em auto no-repeat;
     border: 0;
     border-radius: .375rem;
     opacity: var(--bs-btn-close-opacity);
}
