.content-wrapper {
    background-color: #f1f1f1;
}
.content.container-fluid .container {
    margin-left: initial!important;
    width: 100%;
}

@media (max-width: 991px) {
    /*padding*/
    .md-pad-0 { padding:0!important; }
    .md-pad-10 { padding:10px; }
    .md-pad-20 { padding:20px; }
    .md-pad-30 { padding:30px; }
    .md-pad-40 { padding:40px; }
    .md-pad-50 { padding:50px; }

    .md-pad-t-0 { padding-top:0!important; }
    .md-pad-t-10 { padding-top:10px; }
    .md-pad-t-20 { padding-top:20px; }
    .md-pad-t-30 { padding-top:30px; }
    .md-pad-t-40 { padding-top:40px; }
    .md-pad-t-50 { padding-top:50px; }

    .md-pad-r-0 { padding-right:0!important; }
    .md-pad-r-10 { padding-right:10px; }
    .md-pad-r-20 { padding-right:20px; }
    .md-pad-r-30 { padding-right:30px; }
    .md-pad-r-40 { padding-right:40px; }
    .md-pad-r-50 { padding-right:50px; }

    .md-pad-b-0 { padding-bottom:0!important; }
    .md-pad-b-10 { padding-bottom:10px; }
    .md-pad-b-20 { padding-bottom:20px; }
    .md-pad-b-30 { padding-bottom:30px; }
    .md-pad-b-40 { padding-bottom:40px; }
    .md-pad-b-50 { padding-bottom:50px; }

    .md-pad-l-0 { padding-left:0!important; }
    .md-pad-l-10 { padding-left:10px; }
    .md-pad-l-20 { padding-left:20px; }
    .md-pad-l-30 { padding-left:30px; }
    .md-pad-l-40 { padding-left:40px; }
    .md-pad-l-50 { padding-left:50px; }

    /*margin*/
    .md-mar-0 { padding:0!important; }
    .md-mar-10 { padding:10px; }
    .md-mar-20 { padding:20px; }
    .md-mar-30 { padding:30px; }
    .md-mar-40 { padding:40px; }
    .md-mar-50 { padding:50px; }
     
    .md-mar-t-0 { padding-top:0!important; }
    .md-mar-t-10 { padding-top:10px; }
    .md-mar-t-20 { padding-top:20px; }
    .md-mar-t-30 { padding-top:30px; }
    .md-mar-t-40 { padding-top:40px; }
    .md-mar-t-50 { padding-top:50px; }
     
    .md-mar-r-0 { padding-right:0!important; }
    .md-mar-r-10 { padding-right:10px; }
    .md-mar-r-20 { padding-right:20px; }
    .md-mar-r-30 { padding-right:30px; }
    .md-mar-r-40 { padding-right:40px; }
    .md-mar-r-50 { padding-right:50px; }
     
    .md-mar-b-0 { padding-bottom:0; }
    .md-mar-b-10 { padding-bottom:10px; }
    .md-mar-b-20 { padding-bottom:20px; }
    .md-mar-b-30 { padding-bottom:30px; }
    .md-mar-b-40 { padding-bottom:40px; }
    .md-mar-b-50 { padding-bottom:50px; }
     
    .md-mar-l-0 { padding-left:0!important; }
    .md-mar-l-10 { padding-left:10px; }
    .md-mar-l-20 { padding-left:20px; }
    .md-mar-l-30 { padding-left:30px; }
    .md-mar-l-40 { padding-left:40px; }
    .md-mar-l-50 { padding-left:50px; }

    .md-show { display:inline-block!important; }
}


.mainlogin { width:400px; margin:0 auto;

}

.loginbg {
    background-color: #646567;
}

.mainformcg {
    background-color: #fff;
    padding: 15px;
}

form.form-horizontal.mainformbg {
    background-color: red !important; padding:15px;
}
div.login-page form.login-form h3 {
    text-align: center;
    padding-bottom: 10px; 
}
/****************************************************
                  DATA Widget
****************************************************/
.widget {
    position: relative;
    overflow: hidden;
    display: flex;
    border-radius: 5px;
    margin-bottom: 30px;
    background-color: #fff;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
}
.widget .widget-icon{
    text-align: center;
    background-color: rgba(0, 0, 0, 0.12);
        margin: 12px;
    font-size: larger;
}
.widget.style2 .widget-icon{
    background-color: inherit;

}

.widget .widget-icon i {
    color: #fff;
    font-size: 45px;
    line-height: 90px;
}
.widget .widget-body{
    padding: 16px 20px;
}

.widget h2, .widget h3 {
    margin-top: 0;
    margin-bottom: 0;
    color: #fff;
}
.widget .chart-bar {
    margin-top: 24px;
}
.widget .chart-pie {
    margin-top: 18px;
}

.widget canvas#clear-day, .widget canvas#sleet, .widget canvas#fog, .widget canvas#wind, .widget canvas#partly-cloudy-day, .widget canvas#snow {
    width: 50px;
    height: 50px;
}

.pager-widget {
    margin-left: 10px;
    margin-right: 10px;
}
.bg-cyan {
    background-color: #00BCD4 !important;
    color: #fff !important;
}
.bg-indigo {
    background-color: #3F51B5 !important;
    color: #fff;
}
.bg-green {
    background-color: #4CAF50 !important;
    color: #fff;
}
.bg-red {
    background-color: #F44336 !important;
    color: #fff;
}
.aside-left {
    background-image: url(../img/bg-01.jpg);
    background-size: cover;
    height: 100vh;
}
.login-section .col-md-6, .login-section .col-md-5{
    padding: 0px;
}
.content.login-section {
    background-color: #fff;
    width: 100%;
}
.login-frm .well {
    border: unset;
    background-color: transparent;
}
.login-frm {
    width: 100%;
}
    .login-frm .well {
        border: unset;
        background-color: transparent;
        width: 55%;
        margin: auto;
        text-align: left;
        padding-top: 13rem;
    }
        .login-frm .well h3 {
            color: #181C32;
            font-size: 2rem;
            font-weight: 600;
            margin-bottom: 28px;
        }
        .login-frm .well .form-group .form-control {
            background-color: #F3F6F9;
            border-color: #F3F6F9;
            color: #3F4254;
            transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
            padding: 27px 15px;
            margin-top: 4px;
            border-radius: 10px;
        }
        .login-frm .well .btn {
            background-color: #00b67b;
            border-color: #00b67b;
            padding: 13px 40px;
            border-radius: 8px;
            font-size: 16px;
        }

.frt-int a {
    color: #368fed;
    text-decoration: none;
    font-size: 14px;
    margin-bottom: 22px;
    display: inline-block;
}

@media (max-width: 768px) {
    .login-frm .well {
        border: unset;
        background-color: transparent;
        width: 100%;
        margin: auto;
        text-align: left;
        padding-top: 3rem;
    }
    .aside-left {
        height: 180px;
        background-position: center;
    }
    
}