@media only screen and (max-width: $screen-lg-width) {
    // BUTTON COMPONENT
    .btn-resp-lg {
        display: block;
        width: 100%;
        flex-basis: 100%;
        margin-left: 0;
        margin-right: 0;
    }
}

@media only screen and (max-width: $screen-md-width) {
    // BUTTON COMPONENT
    .btn-resp-md {
        display: block;
        width: 100%;
        flex-basis: 100%;
        margin-left: 0;
        margin-right: 0;
    }
    // Side Nav Bar
    .SideNavBar {
        min-width: calc(100% - 30px);
        flex-basis: calc(100% - 30px);
        height: auto !important;
        min-height: unset !important;
        margin-left: 15px;
        margin-right: 15px;
        margin-top: 15px;
    }
    #snb-mob-row {
        display: flex;
    }
    .snb-content {
        max-height: 0;
    }
    #fca-control-panel > main {
        height: auto !important;
        align-items: flex-start;
    }
    // Top Nav Bar
    .tnb-nav {
        display: none;
    }
    .tnb-logo {
        display: none !important;
    }
    .tnb-mob-btn {
        display: block;
    }
}

@media only screen and (max-width: $screen-sm-width) {
    .dt-btn {
        > span {
            display: none;
        }
        > i {
            margin-right: 0 !important;
        }
    }
    // BUTTON COMPONENT
    .btn-resp-sm {
        display: block;
        width: 100%;
        flex-basis: 100%;
        margin-left: 0;
        margin-right: 0;
    }
    // LOGIN TEMPLATE
    #login-theme-1 {
        height: auto;
        .container {
            transform: unset;
        }
        .login-box {
            margin: 20px 0;
            > * {
                margin-bottom: 0;
            }
            .content-side {
                padding: 30px 20px;
                ul {
                    margin-top: 40px;
                }
                li {
                    &:before {
                        display: none;
                    }
                    text-align: center;
                }
            }
            .form-side {
                //height: -webkit-fill-available;
                padding: 0;
                > * {
                    padding: 30px 20px;
                    bottom: unset;
                }
                form {
                    padding-bottom: 0;
                    > .title {
                        margin-bottom: 20px;
                    }
                }
                .form-footer {
                    justify-content: center;
                    position: static;
                    margin-top: 30px;
                    > a {
                        margin-top: 30px;
                    }
                }
            }
        }
        #copy-right-bar {
            padding-top: 0;
            text-align: center;
            span, a {
                font-size: $fsSm;
            }
        }
    }
}

@media only screen and (min-width: $screen-md-width) {
    .tnb-mob-nav {
        display: none !important;
    }
}

@media only screen and (min-width: $screen-sm-width) {
}