@import url('open-iconic/font/css/open-iconic-bootstrap.min.css');
@font-face {
    font-family: Nunito;
    src: url(//fonts.googleapis.com/css?family=Nunito);
}
html,
body {
    /*font-family: "Poppins", Helvetica, Arial, sans-serif;*/
    font-family: Nunito,Helvetica,Arial,sans-serif;
    color: #26292a;
    /*background-color: #f1f1f2;*/
    background-color: #fff;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid red;
}

.validation-message {
    color: red;
}

#blazor-error-ui {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }

.loader {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 9999;
    background: url('../images/loading.gif') 50% 50% no-repeat rgb(249, 249, 249);
    opacity: .8;
    /*display: none;*/
}

@media only screen and (max-width: 800px) {
    /* Force table to not be like tables anymore */
    #responsiveTable table,
    #responsiveTable thead,
    #responsiveTable tbody,
    #responsiveTable th,
    #responsiveTable td,
    #responsiveTable tr {
        display: block;
    }
        /* Hide table headers (but not display: none;, for accessibility) */
        #responsiveTable thead tr {
            position: absolute;
            top: -9999px;
            left: -9999px;
        }

    #responsiveTable tr {
        border: 1px solid #ccc;
    }

    #responsiveTable td {
        /* Behave like a "row" */
        border: none;
        border-bottom: 1px solid #eee;
        position: relative;
        /*padding-left: 50%;*/
        white-space: normal;
        text-align: left;
    }

    .no-show-in-mobil {
        display: none;
    }

    #responsiveTable td:before {
        /* Now like a table header */
        /*position: absolute;*/
        /* Top/left values mimic padding */
        /*top: 6px;
        left: 6px;
        width: 45%;
        padding-right: 10px;
        white-space: nowrap;*/
        text-align: left;
    }
    /*
        Label the data
        */
    #responsiveTable td:before {
        content: attr(data-title);
        padding-top: 25px;
        padding-bottom: 25px;
    }
}

.pop-container {
    position: relative;
    display: inline;
}

.popconfirm {
    background-color: white;
    border-style: solid;
    border-width: 1px;
    border-color: lightblue;
    width: 250px;
    position: absolute;
    top: -50px;
    padding: 10px;
    border-radius: 8px;
}

.btn-icon__inner {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}