@import url('open-iconic/font/css/open-iconic-bootstrap.min.css');
@import url('app/layout.css');
@import url('app/content.css');
@import url('app/pages.css');
@import url('app/blazor.css');
@import url('app/mudblazor.css');
@import url('app/video.css');

/*Other default Application styles*/

@media (max-width: 1620px) {
    .custom_class {
        display: flex;
        align-items: baseline;
        width: 100%;
        justify-content: end !important;
    }
    .custom_class2 {
        width: 40%;
    }
    .margin1 {
        margin-right: 100px;
    }

}

@media (max-width: 768px) {
    .custom_class {
        flex-direction: column;
    }

    .custom_class2 {
        width: 100%;
    }

    .margin1 {
        margin-right: 0px;
    }
}

@media (max-width: 720px) {
    .custom_margin {
        margin-right: 0px;
        padding-left: 0px;
        padding-right: 0px;
    }
}

@media (min-width: 721px) {
    .custom_margin {
        margin-right: 25vh;
    }
}

@media (max-width: 400px) {
    .custom_padding {
        padding-left: 0px;
        padding-right: 0px;
    }
}

@media (max-width:320px) {
    .custom_margin2 {
         margin-left: 0px !important;
    }
}

.navbar {
    /*   z-index should be above .close-navbar-toggler */
    z-index: 2;
}

.close-navbar-toggler {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 1;
    cursor: pointer;
}

.close-navbar-toggler.collapsed {
    z-index: -1;
}

.navbar-vertical .navbar-nav .nav .nav-item .nav-link {
     padding: .2rem 0 .2rem .5rem; 
}