.loader{display: none} 
/*
font-family: 'Lato', sans-serif;
font-family: 'Lobster', cursive;
font-family: 'Montserrat', sans-serif;
font-family: 'Noto Sans', sans-serif;
font-family: 'Noto Sans JP', sans-serif;
font-family: 'Open Sans', sans-serif;
font-family: 'Oswald', sans-serif;
font-family: 'Playfair Display', serif;
font-family: 'Poppins', sans-serif;
font-family: 'PT Sans', sans-serif;
font-family: 'Raleway', sans-serif;
font-family: 'Roboto', sans-serif;
font-family: 'Rubik', sans-serif;
font-family: 'Source Sans Pro', sans-serif;
font-family: 'Ubuntu', sans-serif;
*/

body,html{}
body{font-family: 'Ubuntu', sans-serif; font-weight: normal; background: #eff4f6; font-size: 12px; line-height: 1.2; color: #36445a; position: relative; height: 100%; overflow-x: hidden;}
.form-control{font-size: 14px;}
.input-sm.form-control {
    font-size: 12px; height:28px;min-height:28px;
    padding: 4px;
}
.input-sm-sm.form-control {
    font-size: 12px;
    height: 24px;
    min-height: 24px;
}

.small_date.form-control {
    font-size: 12px;
    height: 28px;
    min-height: 28px;
    padding: 2px;
}
.light {
    font-weight: 300
}
.wrapper {
    min-height: calc(100vh - 38px)
}
.myloader{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;background:rgba(255,255,255,0.5);display:none}
    .myloader img{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:101}
    .regular {
        font-weight: normal
    }
.medium{font-weight: 500}
.semibold{font-weight: 600}
.bold{font-weight: bold}
.heavy{font-weight: 900}
p{margin-bottom: 20px; text-align: justify}
b,strong{font-weight: bold}
h1,h2,h3,h4,h5,h6{font-family: 'Poppins'; font-weight: 500;}
.text-center p{text-align: center}
h1{font-size:36px;}
h2{font-size:30px;}
h3{font-size:24px;}
h4{font-size:20px;}
h5{font-size:18px;}
h6{font-size:16px;}

a:hover,a:focus,a:active, button:hover,button:focus,button:active{outline: 0;}
button,a{outline: none; outline: 0}
.btn:focus{box-shadow: none!important}
a{color: #007fff}
.btn-primary{background: #007fff; border-color:#007fff;transition: ease-in-out 0.3s}
.btn-primary:hover{background: #0964bf;border-color: #0964bf;}
.btn-secondary{background: #f0f0f0; border-color:#eee;color: #000;transition: ease-in-out 0.3s}
.btn-secondary:hover,.btn-secondary:focus,.btn-secondary:active{background: #333;border-color: #000; color: #fff}
.btn-warning{background: #f60; border-color:#f60;color: #fff;transition: ease-in-out 0.3s}
.btn-warning:hover,.btn-warning:focus,.btn-warning:active{background: #d35907;border-color: #d35907; color: #fff}
.text-warning{color: #f60!important}

.loader{position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 10000; background: #39b49a}
.loader img{position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto}

.loginpage {
    background:  url('../images/bg-login.jpg');
    background-size: cover;
    background-repeat: no-repeat;
    min-height: 100vh;
    position: relative
}
.loginbox{position: fixed; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 320px; z-index: 5}
.loginlogo{background: #fff; box-shadow: 0 1px 10px #aaa; padding: 15px; border-radius: 5px; margin-bottom: 20px}
.loginlogo img{max-width: 250px}
.loginform{background: #fff; box-shadow: 0 1px 10px #aaa; padding: 15px; min-height: 200px; z-index: 5; border-radius: 5px}


.topnav {padding: 0 15px; background: url(../images/header-bg.jpg); border-bottom: 1px solid #fff; background-size: cover; position: fixed; left: 0; right: 0; z-index: 100}
    .topnav .navbar-brand {
        width: 166px;
        margin: 0;
        padding: 0
    }
.topnav .navbar-brand img{max-width: 120px; margin: 0 auto; display: block}
.topnav .nav-link{color: #000; padding: 12px 15px!important}
.topnav .nav-link i{font-size: 24px}

.leftbar{position: fixed; top: 55px; left: 0; width: 220px; bottom: 0; background: #0e8ee9; z-index: 5; padding: 15px 0; color: #fff; margin-left: -220px; transition: ease-in-out 0.3s}
.leftbar.open{margin-left: 0}
.leftbar ul li{display: block}
.leftbar ul li a{ color: #fff; display: block; padding: 10px 15px;  transition: ease-in-out 0.2s;}
.leftbar ul li a i{font-size: 20px; width: 30px}
.leftbar ul li a:hover{text-decoration: none; background: #337ab7}

.wrapper{margin-top: 0px; margin-left: 220px;transition: ease-in-out 0.2s; padding-top:55px}
body.fullwidth .wrapper{margin-left: 0;}

.pageheader{padding: 15px 5px 5px;}
.pageheader .ptitle{margin:0; color: #0e8ee9}
.pagecontent{padding: 5px; margin-bottom: 5px;}

.card-header{padding: 12px 15px}
.card-body{padding: 15px}
.btn-success{background: #a7d926; border-color: #a7d926;}
.btn-success:hover{background: #94c21e; border-color: #94c21e;}

.breadcrumb{background: #fff; margin: 15px 0 0}
.note-editable.panel-body{height:500px!important;}
.toggleLeftNav .la-bars {
    display: block
}
.toggleLeftNav .la-times{display: none}

.scrollToTop {position: fixed; width: 34px;height: 34px;bottom: 20px;right: 10px;z-index: 2001;display: none;text-align: center;background: #0e8ee9; color: #fff;border-radius: 50%; line-height: 34px; transition: ease-in-out 0.1s}
.scrollToTop:hover{background: #000; color: #fff;}
.progress{height: 10px; margin-top: 10px}
.card-dashboard{border-radius: 8px;}
.card-dashboard i{color: #aaa}
.btn{font-size: 13px;}
.btn-delete {
    font-size: 8px;
}
.list-dboard{}
.list-dboard li{display: block; position: relative; margin-bottom: 10px; text-transform: uppercase; font-size: 11px}
.list-dboard li:last-child{margin-bottom: 0;}
.list-dboard li span{position: absolute; top: 4.0px; right: 5px; z-index: 5}
.list-dboard li a{display: block; padding: 3px 3px; border: 1px solid #ccc; transition: ease-in-out 0.2s}
.list-dboard li a:hover{background: #f0f0f0; text-decoration: none}

.card-blue {border-color: #0e8ee9}
.card-blue .card-header{background: #0e8ee9; color: #fff;}
.card-green {border-color: #75b530}
.card-green .card-header{background: #75b530; color: #fff;}
.table td, .table th{padding: 5px 10px}
.table td .btn{white-space: nowrap}

.modal-backdrop{background-color:rgba(0,0,0,0.5)}

footer {
    display: block;
    width: 100%;
    background: #015f5f;
    padding: 12px 0;
    color: #fff;
    position: relative;
    z-index: 100;
}

label{margin-bottom:3px}
.form-group{margin-bottom:7px;}

.navbar-expand .navbar-nav .dropdown-menu {
    margin-top: -7px;
    margin-right: -15px;
    padding: 5px 0;
    min-width: 100px;
}
.dropdown-item {font-size:14px; padding:5px 10px; color:#c00}

.note-editor .note-toolbar, .note-popover .popover-content {
    background: #f0f0f0 !important;
    border-bottom: 1px solid #ddd !important;
}

.nav.nav-pills{background:#eee; padding:0;}
.nav-pills .nav-link {
    border: 1px solid #999;
    padding: 6px 30px;
    border-radius: 7px 7px 0 0;
    font-size: 14px;
    margin-bottom: -1px;
    background: #aaa;
    color: #fff;
    min-width: 200px;
    text-align: center;
}
.table-highlight tr td a{display:block}
.table-highlight tr td a, 
.table-highlight tr td a:hover {
    color: #333;
    text-decoration: none;
}
.table-highlight tr td {
    background: #fff;
}
.table-highlight tr:hover td {
    background: #eee;
}
.input-group > .input-group-append > .input-group-text {
    font-size: 12px;
    padding: 2px 4px
}

.table_form tr td {
    padding: 0 2px;
    vertical-align: middle;
    margin-bottom: 0.3rem!important;
}

.table_form tr td:first-child {
    width: 70%
}
.table_form {
    width: 100%;
    margin-bottom: 0.3rem;
    color: #212529;
}

    @media (min-width: 992px) {
        .modal-lg, .modal-xl {
        max-width: 950px;
    }
}

@media screen and (min-width: 1250px) {
}
@media screen and (max-width: 1400px){


}
@media screen and (max-width: 1200px){
.container{width: 100%; max-width: 100%}
}

@media screen and (max-width: 1199px){

}

@media screen and (max-width: 1024px){

}

@media screen and (max-width: 991px){

}
@media screen and (max-width: 767px){

}
@media screen and (max-width: 640px){

}
@media screen and (max-width: 575px){
.loginbox{width: 90%;}
.leftbar.open{margin-left: -250px}
.wrapper{margin-left: 0}
.leftbar{margin-left: 0}
.topnav .navbar-brand{width: 85px; margin-right: 0px}
.topnav .navbar-brand img{width: 100%; max-width: 100%}
.toggleLeftNav.active .la-bars{display: none}
.toggleLeftNav.active .la-times{display: block}
}
@media screen and (max-width: 480px){

}
@media screen and (max-width: 375px){

}
@media screen and (max-width: 360px){

}
@media screen and (max-width: 320px){
    

}