
@font-face {
    font-family: 'Droid Arabic Kufi';
    font-style: normal;
    font-weight: 400;
    src: url('../fonts/DroidArabicKufi.eot');
    src: url('../fonts/DroidArabicKufi.woff2') format('woff2'), url('../fonts/DroidArabicKufi.woff') format('woff'), url('../fonts/DroidArabicKufi.ttf') format('truetype');
}

@font-face {
    font-family: 'Droid Arabic Kufi';
    font-style: normal;
    font-weight: 700;
    src: url('../fonts/DroidKufi-Bold.eot');
    src: url('../fonts/DroidKufi-Bold.woff2') format('woff2'), url('../fonts/DroidKufi-Bold.woff') format('woff'), url('../fonts/DroidKufi-Bold.ttf') format('truetype');
}

* {
    outline: none;
    box-shadow: none;
}

body {
    background-color: #FFFFFF;
    background-image: url(../img/bg.jpg);
    background-repeat: no-repeat;
    background-position: left top;
    direction: rtl;
    font-family: 'Droid Arabic Kufi', arial;
    font-size: 12px;
    color: #333333;
    /* overflow-x: hidden; */
}

.btn-primary {
    color: #fff;
    background-color: #0C508D;
    border-color: #0B3458;
}

    .btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .open > .dropdown-toggle.btn-primary {
        color: #fff;
        background-color: #216EB3;
        border-color: #0C508D;
    }

select.form-control {
    padding: 0 12px;
}

#header {
    background-image: url(../img/bg2.png);
    background-repeat: no-repeat;
    height: 170px;
    background-position: 136px bottom;
    background-size: 460px;
}

#logo {
    margin-top: 20px;
    float: right;
}

.layout {
    background-image: url(../img/bg3.jpg);
    background-repeat: repeat;
    border-top: solid 3px #0C508D;
    border-bottom: solid 3px #0C508D;
    padding: 20px 0;
}

.ttl {
    color: #fff;
    padding-right: 15px;
    background-color: #0C508D;
    border-radius: 0 5px 0 0;
    -moz-border-radius: 0 5px 0 0;
    -webkit-border-radius: 0 5px 0 0;
    margin-top: -59px;
    height: 35px;
    font-size: 16px;
    position: relative;
    line-height: 35px;
    white-space: nowrap;
}

    .ttl:after {
        content: '';
        width: 0;
        height: 0;
        border-bottom: 35px solid #0C508D;
        border-left: 35px solid transparent;
        position: absolute;
        top: 0;
        left: -35px;
    }


.login-options .checkbox, .login-options a {
    margin-top: 0;
    line-height: normal;
}

#menu {
    margin-bottom: 20px;
}

    #menu nav {
        color: #fff;
        padding: 5px;
        background-color: #0C508D;
        border-radius: 0 0 5px 5px;
        -moz-border-radius: 0 0 5px 5px;
        -webkit-border-radius: 0 0 5px 5px;
        margin: -19px 0 0;
        position: relative;
        min-height: 0;
        text-align: center;
    }

.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus {
    color: #0C508D;
    background-color: #FFFFFF;
    border-radius: 3px;
}

.navbar-default .navbar-nav > li > a {
    color: #FFF;
    padding: 5px 10px;
}

    .navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus {
        color: #8DD3FF;
        background-color: transparent;
    }

.table {
    border-collapse: separate;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -webkit-box-shadow: #999 0px 0px 5px;
    -moz-box-shadow: #999 0px 0px 5px;
    box-shadow: #999 0px 0px 5px;
    border-spacing: 3px;
    background-color: #0C508D;
}

    .table td {
        border-top: solid 1px #fff;
        background-color: #fff;
        border-bottom: solid 1px #fff;
        border-radius: 3px;
        -moz-border-radius: 3px;
        -webkit-border-radius: 3px;
    }

    .table th {
        color: #fff;
        background: none !important;
    }

    .table td, .table th {
        text-align: center;
        padding: 0 5px;
    }

    .table tr:nth-child(even) td {
        background-color: #E7F0FA;
    }

    .table tr:hover td {
        background-color: #D6E7F9;
    }

    .table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td {
        border-top: 1px solid #FFF;
        padding: 3px;
        line-height: 2;
    }

    .table .fa {
        font-size: 15px;
        line-height: 1.5;
        margin-top: 4px;
    }

.panel-info {
    border-color: #6BA7DC;
}

    .panel-info > .panel-heading {
        color: #FFFFFF;
        background-color: #6BA7DC;
        border-color: #0C508D;
    }

.pager-holder, [template-url="templates.pagination"] {
    margin-top: 10px;
    padding: 0 10px 10px;
    border-top: 1px solid #0C508D;
    font: normal 12px Tahoma, Geneva, sans-serif;
    text-align: left;
}

[template-url="templates.pagination"] {
    text-align: right;
}

.pagination {
    margin: 0;
    border-radius: 0px;
}

    .pagination > li > a:hover, .pagination > li > span:hover, .pagination > li > a:focus, .pagination > li > span:focus {
        color: #FFFFFF;
        background-color: #0C508D;
        border-color: transparent;
    }

    .pagination > li > a, .pagination > li > span {
        position: relative;
        float: right;
        padding: 6px 12px;
        margin-right: -1px;
        line-height: 1.42857143;
        color: #0C508D;
        text-decoration: none;
        background-color: rgba(255, 255, 255, 0);
        border: none;
        border-top: 2px solid rgba(221, 221, 221, 0);
        border-radius: 0 !important;
    }


.ttl1 {
    border-bottom: solid 1px #0C508D;
    padding-bottom: 1px;
    text-align: center;
    color: #fff;
    margin: 10px 0;
}

    .ttl1 h3 {
        background-color: #0C508D;
        display: inline-block;
        white-space: nowrap;
        font-size: 12px;
        padding: 0 25px;
        line-height: 30px;
        border-radius: 5px 5px 0 0;
        -moz-border-radius: 5px 5px 0 0;
        -webkit-border-radius: 5px 5px 0 0;
        position: relative;
        margin: 20px 0 0;
    }

.star {
    color: #FF0000;
    display: inline-block;
    margin-left: 2px;
}

.btn-holder {
    /*border-top: solid 1px #0C508D;*/
    padding-top: 10px;
}




.navbar-default .navbar-toggle .icon-bar {
    background-color: #FFF;
}

.navbar-default .navbar-toggle {
    border-color: rgba(255, 255, 255, 0);
    margin: 0;
}

    .navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
        background-color: rgba(221, 221, 221, 0);
    }

        .navbar-default .navbar-toggle:hover .icon-bar, .navbar-default .navbar-toggle:focus .icon-bar {
            background-color: #89B8E2;
        }


.pending, .pending .ttl1 {
    border-color: #F60;
}

.approved, .approved .ttl1 {
    border-color: #093;
}

.rejected, .rejected .ttl1 {
    border-color: #900;
}

.pending .ttl1 h3 {
    background-color: #f60;
}

.approved .ttl1 h3 {
    background-color: #093;
}

.rejected .ttl1 h3 {
    background-color: #900;
}

.dashboard li {
    border-bottom: dotted 1px #335A82;
    margin-bottom: 5px;
    padding-bottom: 5px;
}

    .dashboard li a {
        text-decoration: none;
        color: #333;
        margin-right: 5px;
    }

.userInfo {
    float: left;
    text-align: center;
    width: 135px;
    padding: 0px 0px;
    /* background-image: url(../img/user.png); */
    background-repeat: no-repeat;
    background-position: center 103%;
    height: 150px;
    color: #FFFFFF;
    font-size: 10px;
    margin-top: 23px;
    background-color: rgba(32, 63, 90, 0.88);
    border-radius: 25px;
}

    .userInfo h4 {
        color: #44ccff;
    }

    .userInfo h3, .userInfo h4 {
        font-size: 10px;
    }

    .userInfo a .fa {
        font-size: 15px;
        color: #fff;
        margin: 5px;
    }

.badge {
    width: 20px;
    line-height: 1.4;
    height: 20px;
    background-color: #f00;
    position: absolute;
    font-size: 10px;
}

#header .badge {
    right: -7px;
    bottom: 10px;
}


.userInfo a {
    position: relative;
}

.userInfo > span {
    position: relative;
}

.dropdown-menu > li > a {
    display: block;
    padding: 3px 20px;
    clear: both;
    font-weight: normal;
    line-height: 1.428571429;
    color: #4d4d4d;
    white-space: nowrap;
}

.dropdown-menu.notifications, .dropdown-menu.messages {
    padding: 0;
    z-index: 1300;
}

.dropdown-menu {
    margin-top: 2px;
    -webkit-box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    background-color: #ffffff;
    background-color: rgba(255, 255, 255, 0.98);
}

.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    right: auto;
    z-index: 1001;
    display: none;
    min-width: 280px;
    padding: 5px 0;
    margin: 2px 0 0;
    list-style: none;
    font-size: 14px;
    text-align: right;
    background-color: rgba(255, 255, 255, 0.98);
    border: 1px solid #cccccc;
    border-radius: 1px;
    -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
    background-clip: padding-box;
}

    .dropdown-menu.arrow:before {
        position: absolute;
        top: -6px;
        left: 5px;
        display: inline-block;
        border-right: 10px solid transparent;
        border-bottom: 10px solid #fff;
        border-left: 10px solid transparent;
        content: '';
    }

    .dropdown-menu.notifications li.dd-header {
        padding: 6px 10px;
        font-size: 0.85em;
    }

    .dropdown-menu.notifications li {
        border-bottom: 1px solid #e6e7e8;
        color: #000 !important;
    }

        .dropdown-menu.notifications li.dd-header:before, .dropdown-menu.notifications li.dd-header:after {
            content: " ";
            display: table;
        }

        .dropdown-menu.notifications li.dd-header span:first-child {
            float: right !important;
            float: right;
            font-weight: 400;
        }

        .dropdown-menu.notifications li.dd-header span:last-child {
            float: left !important;
            float: left;
        }

            .dropdown-menu.notifications li.dd-header span:last-child a {
                padding: 0 !important;
            }

        .dropdown-menu.notifications li.dd-header a {
            background: none !important;
        }

        .dropdown-menu.notifications li.dd-header a, .dropdown-menu.notifications li.dd-footer a {
            color: #4f8edc;
        }

        .dropdown-menu.notifications li a {
            padding: 12px 15px;
            line-height: 16px;
            font-size: 11px;
        }

        .dropdown-menu.notifications li.dd-footer {
            text-align: center;
            padding: 0;
        }

        .dropdown-menu.notifications li a.active, .dropdown-menu.notifications li a:hover {
            color: #1a1a1a !important;
            background: #EDEDED !important;
        }

        .dropdown-menu.notifications li a {
            white-space: normal;
            color: #4D4D4D;
        }

.scrollthis {
    height: 200px;
    overflow-y: scroll;
}

    .scrollthis::-webkit-scrollbar {
        width: 10px;
        background: #fff;
    }

    .scrollthis::-webkit-scrollbar-track-piece {
        background-color: #fff;
    }

    .scrollthis::-webkit-scrollbar-thumb {
        width: 15px;
        background-color: #0f83da;
    }

    .scrollthis li:before, .scrollthis li:after {
        content: " ";
        display: table;
    }

.dropdown-menu.notifications li .time {
    float: left;
}

.dropdown-menu.notifications li .time, .dropdown-menu.messages li .time {
    color: #b3b3b3;
    font-size: 0.85em;
    white-space: nowrap;
    text-align: left;
    vertical-align: top;
}

.dropdown-menu.notifications li a .msg {
    overflow: hidden;
    padding: 0 7px;
    display: inline;
    width: 210px;
}

.dropdown-menu.notifications li:last-child, .dropdown-menu.messages li:last-child {
    border-bottom: 0;
}

.dropdown-menu.notifications li.dd-footer, .dropdown-menu.messages li.dd-footer {
    font-size: 0.85em;
}

.dropdown-menu.notifications li, .dropdown-menu.messages li {
    border-bottom: 1px solid #D5D5D5;
    color: #000 !important;
}

.scrollthis + .dd-footer {
    border-top: 1px solid #D5D5D5;
}

.scrollthis li a {
    display: block;
    text-decoration: none;
}


.timeline-month {
    width: 90px;
    text-align: center;
    position: relative;
    right: 6%;
    margin-right: -42px;
    font-size: 14px;
}

    .timeline-month span {
        display: block;
    }

.timeline {
    padding-right: 0;
    list-style: none;
    position: relative;
}

    .timeline:before {
        content: '';
        position: absolute;
        top: 10px;
        bottom: 0;
        width: 2px;
        background: #FFFFFF;
        right: 6%;
        margin-right: 2px;
    }

    .timeline > li {
        position: relative;
    }

        .timeline > li .timeline-header {
            padding: 0 0 10px;
            color: #aeafb1;
        }

            .timeline > li .timeline-header:before,
            .timeline > li .timeline-header:after {
                content: " ";
                display: table;
            }

            .timeline > li .timeline-header:after {
                clear: both;
            }

            .timeline > li .timeline-header:before,
            .timeline > li .timeline-header:after {
                content: " ";
                display: table;
            }

            .timeline > li .timeline-header:after {
                clear: both;
            }

            .timeline > li .timeline-header span.date {
                float: right;
                text-transform: uppercase;
            }

            .timeline > li .timeline-header span.author {
                float: left;
                font-size: 12px;
            }

        .timeline > li .timeline-icon {
            width: 50px;
            height: 50px;
            font-size: 1.4em;
            line-height: 50px;
            -webkit-font-smoothing: antialiased;
            position: absolute;
            color: #4d4d4d;
            background: #FFFFFF;
            border-radius: 50%;
            text-align: center;
            right: 6%;
            top: 0;
            margin: 0 -22px 0 0;
            padding: 0;
        }

        .timeline > li .timeline-body {
            margin: 0 14% 20px 0;
            padding: 20px;
            position: relative;
            border-width: 2px;
            border-style: solid;
            border-radius: 1px;
            background-color: #fff;
        }

            .timeline > li .timeline-body:after {
                left: 100%;
                border: solid transparent;
                content: " ";
                height: 0;
                width: 0;
                position: absolute;
                pointer-events: none;
                border-color: transparent;
                border-width: 10px;
                top: 5%;
            }

            .timeline > li .timeline-body img {
                margin: 5px 20px 0 0;
            }

        .timeline > li .timeline-footer {
            /* color: #fff; */
        }

            .timeline > li .timeline-footer:before,
            .timeline > li .timeline-footer:after {
                content: " ";
                display: table;
            }

            .timeline > li .timeline-footer:after {
                clear: both;
            }

            .timeline > li .timeline-footer:before,
            .timeline > li .timeline-footer:after {
                display: table;
            }

            .timeline > li .timeline-footer:after {
                clear: both;
            }


.timeline-month span {
    display: inline !important;
}

.timeline:before {
    width: 0;
    left: 0;
}

.timeline > li {
    margin-top: 20px;
}

    .timeline > li:first-child {
        margin-top: 0;
    }

    .timeline > li .timeline-body {
        margin: 0 !important;
    }

        .timeline > li .timeline-body:after {
            border-width: 0;
        }

    .timeline > li .timeline-icon {
        width: 30px;
        height: 30px;
        line-height: 30px;
        font-size: 1em;
        margin: 20px 50px 0 0;
        position: relative;
        float: right;
    }

}

.timeline-primary .timeline-body {
    border-color: #4f8edc;
}

    .timeline-primary .timeline-body:after {
        border-left-color: #4f8edc !important;
    }

.timeline-primary .timeline-time {
    color: #4f8edc;
}

.timeline-warning .timeline-body {
    border-color: #f1c40f;
}

    .timeline-warning .timeline-body:after {
        border-left-color: #f1c40f !important;
    }

.timeline-warning .timeline-time {
    color: #f1c40f;
}

.timeline-danger .timeline-body {
    border-color: #e73c3c;
}

    .timeline-danger .timeline-body:after {
        border-left-color: #e73c3c !important;
    }

.timeline-danger .timeline-time {
    color: #e73c3c;
}

.timeline-success .timeline-body {
    border-color: #85c744;
}

    .timeline-success .timeline-body:after {
        border-left-color: #85c744 !important;
    }

.timeline-success .timeline-time {
    color: #85c744;
}

.timeline-info .timeline-body {
    border-color: #2bbce0;
}

    .timeline-info .timeline-body:after {
        border-left-color: #2bbce0 !important;
    }

.timeline-info .timeline-time {
    color: #2bbce0;
}

.timeline-inverse .timeline-body {
    border-color: #4f5259;
}

    .timeline-inverse .timeline-body:after {
        border-left-color: #4f5259 !important;
    }

.timeline-inverse .timeline-time {
    color: #4f5259;
}

.timeline-brown .timeline-body {
    border-color: #c0392b;
}

    .timeline-brown .timeline-body:after {
        border-left-color: #c0392b !important;
    }

.timeline-brown .timeline-time {
    color: #c0392b;
}

.timeline-indigo .timeline-body {
    border-color: #9358ac;
}

    .timeline-indigo .timeline-body:after {
        border-left-color: #9358ac !important;
    }

.timeline-indigo .timeline-time {
    color: #9358ac;
}

.timeline-orange .timeline-body {
    border-color: #efa131;
}

    .timeline-orange .timeline-body:after {
        border-left-color: #efa131 !important;
    }

.timeline-orange .timeline-time {
    color: #efa131;
}

.timeline-sky .timeline-body {
    border-color: #76c4ed;
}

    .timeline-sky .timeline-body:after {
        border-left-color: #76c4ed !important;
    }

.timeline-sky .timeline-time {
    color: #76c4ed;
}

.timeline-midnightblue .timeline-body {
    border-color: #34495e;
}

    .timeline-midnightblue .timeline-body:after {
        border-left-color: #34495e !important;
    }

.timeline-midnightblue .timeline-time {
    color: #34495e;
}

.timeline-magenta .timeline-body {
    border-color: #e73c68;
}

    .timeline-magenta .timeline-body:after {
        border-left-color: #e73c68 !important;
    }

.timeline-magenta .timeline-time {
    color: #e73c68;
}

.timeline-green .timeline-body {
    border-color: #16a085;
}

    .timeline-green .timeline-body:after {
        border-left-color: #16a085 !important;
    }

.timeline-green .timeline-time {
    color: #16a085;
}

.timeline-purple .timeline-body {
    border-color: #e044ab;
}

    .timeline-purple .timeline-body:after {
        border-left-color: #e044ab !important;
    }

.timeline-purple .timeline-time {
    color: #e044ab;
}

.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:focus {
    color: #58C8FF;
    background-color: rgba(12, 80, 141, 0);
}

.navbar-nav > li > .dropdown-menu {
    text-align: center;
    background: #0C508D;
    box-shadow: none;
    border: none;
}

.dropdown-menu > li > a {
    display: block;
    padding: 6px 20px;
    clear: both;
    font-weight: 400;
    line-height: 1.42857143;
    color: #FFF;
    white-space: nowrap;
    border-bottom: solid 1px #45698A;
}



.btn-primary {
    min-width: 80px;
}

.field-validation-indicator {
}

.loading-container {
    margin-top: 4px;
}





.steps {
    margin-top: 20px;
}

    .steps .nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
        color: #FFF;
        font-size: 14px;
        font-weight: bold;
        margin-right: 0px;
        cursor: default;
        background-color: #0C508D;
        border: none;
        border-bottom: 1px solid #0C508D;
        text-align: center;
        opacity: 1;
    }

    .steps .nav-tabs > li > a {
        color: #FFF;
        font-size: 14px;
        background-color: rgb(12, 80, 141);
        font-weight: bold;
        margin: 0;
        line-height: 1.42857143;
        border: 1px solid transparent;
        border-radius: 0;
        text-align: center;
        opacity: .5;
    }

    .steps .nav-tabs {
        width: 100%;
        border-bottom: 5px solid #0C508D;
    }

        .steps .nav-tabs > li {
            float: right;
            /* margin-bottom: -1px; */
            /* margin-right: -2px; */
            width: 50%;
        }

span.lblUploadCheck {
    margin-right: 5px;
}

.chbxUpload {
    margin-top: 75px;
    display: inline;
}

.loadedImage {
    display: block;
    margin: 5px 0px;
    width: 100%;
    max-height: 50px;
}

.manager {
    border: solid 1px #FFF;
    background-color: rgba(255, 255, 255, 0.56);
    padding: 10px;
    border-radius: 5px;
    margin-bottom: 15px;
}

    .manager .col-md-2 {
        text-align: left;
    }

#ObstacleCheckList {
    border: solid 1px #FFF;
    background-color: rgba(255, 255, 255, 0.56);
    padding: 10px;
    border-radius: 5px;
    margin-bottom: 15px;
}

.alert-info {
    color: #FFFFFF;
    background-color: #94C3F5;
    border-color: #82A6CC;
}

.btn-default {
    color: #333;
    background-color: #fff;
    border-color: rgba(12, 80, 141, 0.64);
}

    .btn-default:hover, .btn-default:focus, .btn-default:active, .btn-default.active, .open > .dropdown-toggle.btn-default {
        color: #333;
        background-color: #e6e6e6;
        border-color: #adadad;
    }

.tiles-heading:after,
.tiles-body:after,
.tiles-footer:after {
    clear: both;
}

.tiles-heading:before,
.tiles-body:before,
.tiles-footer:before,
.tiles-heading:after,
.tiles-body:after,
.tiles-footer:after {
    content: " ";
    display: table;
}

.tiles-heading:after,
.tiles-body:after,
.tiles-footer:after {
    clear: both;
}

.info-tiles,
.shortcut-tiles {
    margin: 0px 0px 20px;
    display: block;
    border-radius: 1px;
    position: relative;
}

a.info-tiles,
a.shortcut-tiles {
    background: none;
}



















.panel-widget {
    background: #fff;
}

.panel-blue {
    background: #30a5ff;
    color: #fff;
}

.panel-widget {
    padding: 0;
    position: relative;
}

.no-padding {
    padding: 0;
    margin: 0;
}

.panel-blue .widget-left {
    background: #3b5998;
    color: #fff;
}

.widget-left {
    height: 80px;
    padding-top: 15px;
    text-align: center;
    border-radius: 0px;
}

.panel-widget .glyph {
    stroke-width: 2px;
}

.glyph {
    fill: currentColor;
    display: inline-block;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    text-align: center;
    vertical-align: middle;
    width: 70%;
    height: 70%;
}

.widget-right {
    line-height: 1.6em;
    margin: 0px;
    padding: 20px;
    height: 80px;
    color: #999;
    font-weight: 300;
    background: #fff;
    border: 1px solid rgba(179, 179, 179, 0.49);
    border-radius: 0px;
}

    .widget-right .large {
        color: #5f6468;
    }

.large {
    font-size: 2em;
}

.widget-right .text-muted {
    color: #9fadbb;
}

.panel-blue .text-muted, .panel-teal .text-muted, .panel-orange .text-muted, .panel-red .text-muted {
    color: rgba(255, 255, 255, .5);
}

.text-muted {
    color: #9fadbb;
}

.widget-right .text-muted {
    color: #0c508d;
    line-height: 2;
    font-size: 18px;
}

.dashboard-div-wrapper .badge {
}

.info-tiles.tiles-success:hover .tiles-body {
    background: #78ba38;
}












.panel-grape {
}

.panel {
    margin: 0px 0 20px;
    border-radius: 1px;
}

.panel-grape .panel-heading {
    color: #3b5998;
    background-color: rgb(230, 230, 230);
    border-bottom: .5px solid #3b5998;
}

.panel-heading {
    font-size: 16px;
    border-bottom: 1px solid #dddddd;
    border-top-right-radius: 1px;
    border-top-left-radius: 1px;
    height: 40px;
    font-weight: 600;
    line-height: 2.5em;
}

    .panel-heading:before, .panel-heading:after {
        content: " ";
        display: table;
    }

    .panel-heading h4 i {
        position: relative;
    }

.icon-highlight {
    font-size: 14px;
    top: -1px;
    padding: 5px 0px;
    height: 25px;
    width: 25px;
    text-align: center;
    background: rgba(0, 0, 0, 0.15);
    border-radius: 1px;
    margin: 5px 3px 5px -3px;
    border: 1px solid rgba(0, 0, 0, 0.08);
}

.panel-heading h4 i {
    position: relative;
}

.icon-highlight {
    font-size: 14px;
    top: -1px;
    padding: 5px 0px;
    height: 25px;
    width: 25px;
    text-align: center;
    background: rgba(0, 0, 0, 0.15);
    border-radius: 1px;
    margin: 5px 3px 5px -3px;
    border: 1px solid rgba(0, 0, 0, 0.08);
}

.panel-heading h4 i {
    position: relative;
}

.icon-highlight {
    font-size: 14px;
    top: -1px;
    padding: 5px 0px;
    height: 25px;
    width: 25px;
    text-align: center;
    background: rgba(0, 0, 0, 0.15);
    border-radius: 1px;
    margin: 5px 3px 5px -3px;
    border: 1px solid rgba(0, 0, 0, 0.08);
}


.panel-tasks li:before, .panel-tasks li:after {
    content: " ";
    display: table;
}

.panel-tasks li label {
    margin-bottom: 0;
}

.panel-tasks li .icon-dragtask {
    color: transparent;
    margin-right: 6px;
    width: 6px;
    height: 14px;
    cursor: -webkit-grab;
}

.label-info {
    background-color: #2bbce0;
}



.btn-group, .btn-group-vertical {
    padding: 0;
}

    .btn-group > .btn:first-child:not(:last-child):not(.dropdown-toggle) {
        border-bottom-right-radius: 1px;
        border-top-right-radius: 1px;
    }

    .btn-group > .btn:last-child:not(:first-child), .btn-group > .dropdown-toggle:not(:first-child) {
        border-bottom-left-radius: 0;
        border-top-left-radius: 0;
    }


.panel-indigo {
    border-color: #1ebfae;
}

[class*="panel-"].panel .panel-heading {
    /* padding: 2px 10px; */
    /* border-bottom: none; */
    font-size: 20px;
}

.panel-indigo .panel-heading {
    color: #cc8114;
    background-color: rgb(230, 230, 230);
    border-bottom: 1px solid #cc8114;
}

.panel.panel-indigo .table,
.panel.panel-grape .table {
    background-color: transparent;
    border-collapse: collapse;
}

    .panel.panel-indigo .table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td,
    .panel.panel-grape .table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td {
        color: #424b5a;
    }

.label-grape {
    background-color: #7a869c;
}

.info-tiles.tiles-success .tiles-body {
    background: #85c744;
    color: #fff;
}

.info-tiles.tiles-success .tiles-heading {
    background: #99d063;
}

.number-count {
    background-color: rgba(255, 255, 255, 0.5);
    border-top: 4px solid #55acee;
    padding-top: 20px;
    margin-bottom: 30px;
    display: inline-block;
}

    .number-count.task {
        border-top: 4px solid #ffb53e;
    }

.info-tiles.tiles-alizarin .tiles-heading {
    background: #eb6d60;
}

.info-tiles.tiles-alizarin .tiles-body {
    background: #e74c3c;
}

.info-tiles.tiles-alizarin {
    color: #ffffff !important;
}

.number-count .badge {
    right: 5px;
    top: -8px;
}

.panel-teal .widget-left {
    background: #1ebfae;
    color: #fff;
}

.panel-orange .widget-left {
    background: #ffb53e;
    color: #fff;
    -webkit-transition: 0.05s ease-in;
    -o-transition: 0.05s ease-in;
    transition: 0.05s ease-in;
}

    .panel-orange .widget-left:hover,
    .panel-orange .widget-left:foucs,
    .panel-orange .widget-left:active {
        background: #d6962f;
    }

.panel-red .widget-left {
    background: #ac7b58;
    color: #fff;
}

.panel-widget i.fa.fa {
    font-size: 50px;
}






.chart img {
    width: 100%;
}

.panel-heading .fa {
    margin-left: 12px;
}







.grid {
    min-height: 100px;
    background: rgba(255, 255, 255, 0.7);
    padding: 15px;
    -ms-box-shadow: 0 1px 3px 0px rgba(0, 0, 0, 0.2);
    -o-box-shadow: 0 1px 3px 0px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0 1px 3px 0px rgba(0, 0, 0, 0.2);
    -webkit-box-shadow: 0 1px 3px 0px rgba(0, 0, 0, 0.2);
    box-shadow: 0 1px 3px 0px rgba(0, 0, 0, 0.2);
    margin-bottom: 2em;
}

.secion-2 {
    padding: 25px;
}

.grid-info {
    /* background: #fff; */
    padding: 1em;
}
/*--social-icons--*/
.top-comment-grid {
    max-height: 130px;
    overflow: hidden;
}

    .top-comment-grid:nth-child(2) {
        margin: 0px 0em;
    }

    .top-comment-grid:nth-child(3) {
        /*margin-right: 1em;*/
    }

.comments {
    background: #F96131;
    padding: 1em;
}

.sec-com {
    background: #f14b17;
}

.comments-icon i.fa.fa-file-o,
.comments-icon i.fa.fa-file-text {
    font-size: 7em;
    color: rgba(255, 255, 255, 0.2);
    position: relative;
    top: 13px;
    left: 0;
}

.comments-icon i.fa.fa-users {
    font-size: 9em;
    color: rgba(255, 255, 255, 0.2);
    height: 100%;
    overflow: hidden;
    text-align: center;
    position: relative;
    bottom: 0;
    left: 0;
}

.comments-icon i.fa.fa-twitter {
    font-size: 5em;
    color: #9DCBEF;
}

.comments-icon i.fa.fa-eye {
    font-size: 5em;
    color: #2CCCAB;
}

.comments-icon {
    float: left;
    width: 30%;
}

.comments-info {
    float: left;
    margin-left: 1em;
    text-align: right;
    width: 65%;
    line-height: 1.5;
}

    .comments-info h3 {
        font-size: 4em;
        color: #FFF;
        margin: 0;
    }

    .comments-info a {
        font-size: 1.5em;
        color: #ffbda9 !important;
        margin: 0px !important;
        text-decoration: none;
        font-weight: 600;
    }

        .comments-info a:hover {
            color: #FFF !important;
        }

.likes {
    background: #3b5998;
}

.tweets {
    background: #55acee;
}

.views {
    background: #00a78e;
}

.likes-info a {
    color: #bad3ee !important;
    white-space: nowrap;
}

.tweets-info a {
    color: #9DCBEF !important;
}

.views-info a {
    color: #07CEB0 !important;
}

.comments-icon i.fa {
    -webkit-transition: .5s all;
    transition: .5s all;
    -moz-transition: .5s all;
}

.top-comment-grid:hover div.comments-icon i.fa {
    -webkit-transform: scale(3);
    transform: scale(2);
    -moz-transform: scale(3);
    -o-transform: scale(3);
    -ms-transform: scale(3);
    opacity: .3;
    -moz-opacity: .3;
}
/*--//social-icons--*/






















.info-tiles,
.shortcut-tiles {
    margin: 0px 0px 20px;
    display: block;
    border-radius: 1px;
}

a.info-tiles,
a.shortcut-tiles {
    background: none;
}

.info-tiles .tiles-heading {
    padding: 6px 6px;
    border-top-right-radius: 1px;
    border-top-left-radius: 1px;
    text-transform: uppercase;
    text-align: center;
    font-size: 12px;
}

    .info-tiles .tiles-heading .pull-right {
        -webkit-transition: 0.06s ease-in;
        -o-transition: 0.06s ease-in;
        transition: 0.06s ease-in;
        color: rgba(255, 255, 255, 0.4);
    }

.info-tiles .tiles-body {
    font-size: 14px;
    border-bottom-right-radius: 1px;
    border-bottom-left-radius: 1px;
}

.info-tiles .tiles-body-alt {
    font-size: 48px;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}

.info-tiles .tiles-body-alt,
.info-tiles .tiles-body {
    padding: 6px 15px;
    font-weight: 300;
}

    .info-tiles .tiles-body-alt .sparkline,
    .info-tiles .tiles-body .sparkline {
        width: 100px;
        margin: 0 auto;
        padding: 0px;
    }

    .info-tiles .tiles-body-alt .text-top,
    .info-tiles .tiles-body .text-top {
        vertical-align: super;
        font-size: 24px;
    }

    .info-tiles .tiles-body-alt .text-smallcaps,
    .info-tiles .tiles-body .text-smallcaps {
        font-variant: small-caps;
    }

    .info-tiles .tiles-body-alt .text-center,
    .info-tiles .tiles-body .text-center {
        /* margin-top: -5px; */
    }

.text-center.num {
    font-size: 17px;
    letter-spacing: 1px;
}

.info-tiles .tiles-body-alt i,
.info-tiles .tiles-body i {
    font-size: 34px;
    color: rgba(255, 255, 255, 0.4);
    -webkit-transition: 0.06s ease-in;
    -o-transition: 0.06s ease-in;
    transition: 0.06s ease-in;
}

.info-tiles .tiles-body-alt > i,
.info-tiles .tiles-body > i {
    position: absolute;
    font-size: 42px;
}

.info-tiles .tiles-body-alt div + small,
.info-tiles .tiles-body div + small {
    font-size: 14px;
    text-align: center;
    display: block;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.7);
    margin-top: -7px;
    margin-bottom: 4px;
}

.info-tiles .tiles-footer {
    color: rgba(255, 255, 255, 0.7);
    padding: 5px 10px;
    border-bottom-right-radius: 1px;
    border-bottom-left-radius: 1px;
    min-height: 25px;
}

    .info-tiles .tiles-footer i {
        float: right;
        position: relative;
        top: 2px;
        display: none;
    }

    .info-tiles .tiles-footer:after {
        content: "";
        position: absolute;
        bottom: 0%;
        right: -1px;
        width: 0px;
        height: 0px;
        margin-right: 0px;
        margin-bottom: 0px;
        border-top: 5px solid rgba(0, 0, 0, 0.35);
        border-right: 5px solid #f7f8fa;
        border-bottom: 5px solid #f7f8fa;
        border-left: 5px solid rgba(0, 0, 0, 0.35);
        border-top-left-radius: 1px;
    }

    .info-tiles .tiles-footer:hover {
        color: #fff;
    }

.info-tiles:hover {
    text-decoration: none;
}

    .info-tiles:hover i {
        color: #ffffff;
    }

    .info-tiles:hover .tiles-footer {
        color: #fff;
    }

        .info-tiles:hover .tiles-footer i {
            display: inline;
        }

    .info-tiles:hover .tiles-heading .pull-right {
        color: #ffffff;
    }

@media screen and (-webkit-min-device-pixel-ratio: 0) {
    .info-tiles .tiles-footer:after {
        right: 0;
        border-top: 6px solid rgba(0, 0, 0, 0.35);
    }
}


.shortcut-tiles .tiles-body {
    padding: 10px 10px 0px 10px;
    font-size: 42px;
    line-height: 0px;
    padding-bottom: 0px;
}

    .shortcut-tiles .tiles-body span {
        position: relative;
        top: 16px;
        font-size: 30px;
        color: rgba(255, 255, 255, 0.8);
        -webkit-transition: 0.06s ease-in;
        -o-transition: 0.06s ease-in;
        transition: 0.06s ease-in;
    }

    .shortcut-tiles .tiles-body .pull-right {
    }

        .shortcut-tiles .tiles-body .pull-right .badge {
            background-color: #000000;
            background-color: rgba(0, 0, 0, 0.3);
            zoom: 1;
            background-color: transparent\9;
            -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#4d000000, endColorstr=#4d000000)";
            filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#4d000000, endColorstr=#4d000000);
        }

.shortcut-tiles .tiles-footer {
    /* text-align: center; */
    padding: 5px 10px;
    font-size: 14px;
    border-bottom-right-radius: 1px;
    border-bottom-left-radius: 1px;
    max-height: 70px;
    min-height: 50px;
}

.shortcut-tiles:hover {
    text-decoration: none;
}

    .shortcut-tiles:hover i {
        color: #ffffff;
    }

.info-tiles.tiles-info {
    color: #ffffff !important;
}

    .info-tiles.tiles-info .tiles-heading {
        background: #4fc7e5;
    }

    .info-tiles.tiles-info .tiles-body {
        background: #2bbce0;
    }

    .info-tiles.tiles-info .tiles-body-alt {
        background: #2bbce0;
    }

    .info-tiles.tiles-info .tiles-footer {
        background: #1c9cbc;
    }

    .info-tiles.tiles-info:hover {
        color: #ffffff;
    }

        .info-tiles.tiles-info:hover .tiles-heading {
            background: #36c0e2;
        }

        .info-tiles.tiles-info:hover .tiles-body {
            background: #1fafd3;
        }

        .info-tiles.tiles-info:hover .tiles-body-alt {
            background: #1fafd3;
        }

        .info-tiles.tiles-info:hover .tiles-footer {
            background: #188aa6;
        }

.info-tiles.tiles-success {
    color: #ffffff !important;
}

    .info-tiles.tiles-success .tiles-heading {
        background: #99d063;
    }

    .info-tiles.tiles-success .tiles-body {
        background: #85c744;
    }

    .info-tiles.tiles-success .tiles-body-alt {
        background: #85c744;
    }

    .info-tiles.tiles-success .tiles-footer {
        background: #6ca632;
    }

    .info-tiles.tiles-success:hover {
        color: #ffffff;
    }

        .info-tiles.tiles-success:hover .tiles-heading {
            background: #8bca4e;
        }

        .info-tiles.tiles-success:hover .tiles-body {
            background: #78ba38;
        }

        .info-tiles.tiles-success:hover .tiles-body-alt {
            background: #78ba38;
        }

        .info-tiles.tiles-success:hover .tiles-footer {
            background: #5f932c;
        }

.info-tiles.tiles-danger {
    color: #ffffff !important;
}

    .info-tiles.tiles-danger .tiles-heading {
        background: #eb6060;
    }

    .info-tiles.tiles-danger .tiles-body {
        background: #e73c3c;
    }

    .info-tiles.tiles-danger .tiles-body-alt {
        background: #e73c3c;
    }

    .info-tiles.tiles-danger .tiles-footer {
        background: #d61a1a;
    }

    .info-tiles.tiles-danger:hover {
        color: #ffffff;
    }

        .info-tiles.tiles-danger:hover .tiles-heading {
            background: #e84747;
        }

        .info-tiles.tiles-danger:hover .tiles-body {
            background: #e42525;
        }

        .info-tiles.tiles-danger:hover .tiles-body-alt {
            background: #e42525;
        }

        .info-tiles.tiles-danger:hover .tiles-footer {
            background: #bf1818;
        }

.info-tiles.tiles-warning {
    color: #ffffff !important;
}

    .info-tiles.tiles-warning .tiles-heading {
        background: #f3cd36;
    }

    .info-tiles.tiles-warning .tiles-body {
        background: #f1c40f;
    }

    .info-tiles.tiles-warning .tiles-body-alt {
        background: #f1c40f;
    }

    .info-tiles.tiles-warning .tiles-footer {
        background: #c29d0b;
    }

    .info-tiles.tiles-warning:hover {
        color: #ffffff;
    }

        .info-tiles.tiles-warning:hover .tiles-heading {
            background: #f2c71b;
        }

        .info-tiles.tiles-warning:hover .tiles-body {
            background: #dab10d;
        }

        .info-tiles.tiles-warning:hover .tiles-body-alt {
            background: #dab10d;
        }

        .info-tiles.tiles-warning:hover .tiles-footer {
            background: #aa8a0a;
        }

.info-tiles.tiles-primary {
    color: #ffffff !important;
}

    .info-tiles.tiles-primary .tiles-heading {
        background: #71a4e3;
    }

    .info-tiles.tiles-primary .tiles-body {
        background: #4f8edc;
    }

    .info-tiles.tiles-primary .tiles-body-alt {
        background: #4f8edc;
    }

    .info-tiles.tiles-primary .tiles-footer {
        background: #2973cf;
    }

    .info-tiles.tiles-primary:hover {
        color: #ffffff;
    }

        .info-tiles.tiles-primary:hover .tiles-heading {
            background: #5a95de;
        }

        .info-tiles.tiles-primary:hover .tiles-body {
            background: #3a80d8;
        }

        .info-tiles.tiles-primary:hover .tiles-body-alt {
            background: #3a80d8;
        }

        .info-tiles.tiles-primary:hover .tiles-footer {
            background: #2567ba;
        }

.info-tiles.tiles-inverse {
    color: #ffffff !important;
}

    .info-tiles.tiles-inverse .tiles-heading {
        background: #62666f;
    }

    .info-tiles.tiles-inverse .tiles-body {
        background: #4f5259;
    }

    .info-tiles.tiles-inverse .tiles-body-alt {
        background: #4f5259;
    }

    .info-tiles.tiles-inverse .tiles-footer {
        background: #37393e;
    }

    .info-tiles.tiles-inverse:hover {
        color: #ffffff;
    }

        .info-tiles.tiles-inverse:hover .tiles-heading {
            background: #555860;
        }

        .info-tiles.tiles-inverse:hover .tiles-body {
            background: #43464b;
        }

        .info-tiles.tiles-inverse:hover .tiles-body-alt {
            background: #43464b;
        }

        .info-tiles.tiles-inverse:hover .tiles-footer {
            background: #2b2d30;
        }

.info-tiles.tiles-midnightblue {
    color: #ffffff !important;
}

    .info-tiles.tiles-midnightblue .tiles-heading {
        background: #435d78;
    }

    .info-tiles.tiles-midnightblue .tiles-body {
        background: #34495e;
    }

    .info-tiles.tiles-midnightblue .tiles-body-alt {
        background: #34495e;
    }

    .info-tiles.tiles-midnightblue .tiles-footer {
        background: #222f3d;
    }

    .info-tiles.tiles-midnightblue:hover {
        color: #ffffff;
    }

        .info-tiles.tiles-midnightblue:hover .tiles-heading {
            background: #394f66;
        }

        .info-tiles.tiles-midnightblue:hover .tiles-body {
            background: #2b3c4e;
        }

        .info-tiles.tiles-midnightblue:hover .tiles-body-alt {
            background: #2b3c4e;
        }

        .info-tiles.tiles-midnightblue:hover .tiles-footer {
            background: #19232d;
        }

.info-tiles.tiles-sky {
    color: #ffffff !important;
}

    .info-tiles.tiles-sky .tiles-heading {
        background: #9ad4f2;
    }

    .info-tiles.tiles-sky .tiles-body {
        background: #76c4ed;
    }

    .info-tiles.tiles-sky .tiles-body-alt {
        background: #76c4ed;
    }

    .info-tiles.tiles-sky .tiles-footer {
        background: #49b1e7;
    }

    .info-tiles.tiles-sky:hover {
        color: #ffffff;
    }

        .info-tiles.tiles-sky:hover .tiles-heading {
            background: #81c9ee;
        }

        .info-tiles.tiles-sky:hover .tiles-body {
            background: #5fbaea;
        }

        .info-tiles.tiles-sky:hover .tiles-body-alt {
            background: #5fbaea;
        }

        .info-tiles.tiles-sky:hover .tiles-footer {
            background: #32a7e4;
        }

.info-tiles.tiles-orange {
    color: #ffffff !important;
}

    .info-tiles.tiles-orange .tiles-heading {
        background: #f2b257;
    }

    .info-tiles.tiles-orange .tiles-body {
        background: #efa131;
    }

    .info-tiles.tiles-orange .tiles-body-alt {
        background: #efa131;
    }

    .info-tiles.tiles-orange .tiles-footer {
        background: #dc8911;
    }

    .info-tiles.tiles-orange:hover {
        color: #ffffff;
    }

        .info-tiles.tiles-orange:hover .tiles-heading {
            background: #f0a63d;
        }

        .info-tiles.tiles-orange:hover .tiles-body {
            background: #ed9619;
        }

        .info-tiles.tiles-orange:hover .tiles-body-alt {
            background: #ed9619;
        }

        .info-tiles.tiles-orange:hover .tiles-footer {
            background: #c47a0f;
        }

.info-tiles.tiles-indigo {
    color: #ffffff !important;
}

    .info-tiles.tiles-indigo .tiles-heading {
        background: #a573ba;
    }

    .info-tiles.tiles-indigo .tiles-body {
        background: #9358ac;
    }

    .info-tiles.tiles-indigo .tiles-body-alt {
        background: #9358ac;
    }

    .info-tiles.tiles-indigo .tiles-footer {
        background: #77458c;
    }

    .info-tiles.tiles-indigo:hover {
        color: #ffffff;
    }

        .info-tiles.tiles-indigo:hover .tiles-heading {
            background: #9961b0;
        }

        .info-tiles.tiles-indigo:hover .tiles-body {
            background: #854e9d;
        }

        .info-tiles.tiles-indigo:hover .tiles-body-alt {
            background: #854e9d;
        }

        .info-tiles.tiles-indigo:hover .tiles-footer {
            background: #683d7b;
        }

.info-tiles.tiles-green {
    color: #ffffff !important;
}

    .info-tiles.tiles-green .tiles-heading {
        background: #1bc4a3;
    }

    .info-tiles.tiles-green .tiles-body {
        background: #16a085;
    }

    .info-tiles.tiles-green .tiles-body-alt {
        background: #16a085;
    }

    .info-tiles.tiles-green .tiles-footer {
        background: #107360;
    }

    .info-tiles.tiles-green:hover {
        color: #ffffff;
    }

        .info-tiles.tiles-green:hover .tiles-heading {
            background: #18ab8e;
        }

        .info-tiles.tiles-green:hover .tiles-body {
            background: #138a72;
        }

        .info-tiles.tiles-green:hover .tiles-body-alt {
            background: #138a72;
        }

        .info-tiles.tiles-green:hover .tiles-footer {
            background: #0d5d4d;
        }

.info-tiles.tiles-magenta {
    color: #ffffff !important;
}

    .info-tiles.tiles-magenta .tiles-heading {
        background: #eb6084;
    }

    .info-tiles.tiles-magenta .tiles-body {
        background: #e73c68;
    }

    .info-tiles.tiles-magenta .tiles-body-alt {
        background: #e73c68;
    }

    .info-tiles.tiles-magenta .tiles-footer {
        background: #d61a4b;
    }

    .info-tiles.tiles-magenta:hover {
        color: #ffffff;
    }

        .info-tiles.tiles-magenta:hover .tiles-heading {
            background: #e84771;
        }

        .info-tiles.tiles-magenta:hover .tiles-body {
            background: #e42556;
        }

        .info-tiles.tiles-magenta:hover .tiles-body-alt {
            background: #e42556;
        }

        .info-tiles.tiles-magenta:hover .tiles-footer {
            background: #bf1843;
        }

.info-tiles.tiles-purple {
    color: #ffffff !important;
}

    .info-tiles.tiles-purple .tiles-heading {
        background: #e667bb;
    }

    .info-tiles.tiles-purple .tiles-body {
        background: #e044ab;
    }

    .info-tiles.tiles-purple .tiles-body-alt {
        background: #e044ab;
    }

    .info-tiles.tiles-purple .tiles-footer {
        background: #cf2294;
    }

    .info-tiles.tiles-purple:hover {
        color: #ffffff;
    }

        .info-tiles.tiles-purple:hover .tiles-heading {
            background: #e24fb0;
        }

        .info-tiles.tiles-purple:hover .tiles-body {
            background: #dc2ea1;
        }

        .info-tiles.tiles-purple:hover .tiles-body-alt {
            background: #dc2ea1;
        }

        .info-tiles.tiles-purple:hover .tiles-footer {
            background: #b91f84;
        }

.info-tiles.tiles-brown {
    color: #ffffff !important;
}

    .info-tiles.tiles-brown .tiles-heading {
        background: #d44e40;
    }

    .info-tiles.tiles-brown .tiles-body {
        background: #c0392b;
    }

    .info-tiles.tiles-brown .tiles-body-alt {
        background: #c0392b;
    }

    .info-tiles.tiles-brown .tiles-footer {
        background: #962d22;
    }

    .info-tiles.tiles-brown:hover {
        color: #ffffff;
    }

        .info-tiles.tiles-brown:hover .tiles-heading {
            background: #ca3c2d;
        }

        .info-tiles.tiles-brown:hover .tiles-body {
            background: #ab3326;
        }

        .info-tiles.tiles-brown:hover .tiles-body-alt {
            background: #ab3326;
        }

        .info-tiles.tiles-brown:hover .tiles-footer {
            background: #81261d;
        }

.info-tiles.tiles-grape {
    color: #ffffff !important;
}

    .info-tiles.tiles-grape .tiles-heading {
        background: #919bad;
    }

    .info-tiles.tiles-grape .tiles-body {
        background: #7a869c;
    }

    .info-tiles.tiles-grape .tiles-body-alt {
        background: #7a869c;
    }

    .info-tiles.tiles-grape .tiles-footer {
        background: #616d82;
    }

    .info-tiles.tiles-grape:hover {
        color: #ffffff;
    }

        .info-tiles.tiles-grape:hover .tiles-heading {
            background: #818da1;
        }

        .info-tiles.tiles-grape:hover .tiles-body {
            background: #6c7991;
        }

        .info-tiles.tiles-grape:hover .tiles-body-alt {
            background: #6c7991;
        }

        .info-tiles.tiles-grape:hover .tiles-footer {
            background: #566074;
        }

.info-tiles.tiles-toyo {
    color: #ffffff !important;
}

    .info-tiles.tiles-toyo .tiles-heading {
        background: #677fa4;
    }

    .info-tiles.tiles-toyo .tiles-body {
        background: #556b8d;
    }

    .info-tiles.tiles-toyo .tiles-body-alt {
        background: #556b8d;
    }

    .info-tiles.tiles-toyo .tiles-footer {
        background: #42536d;
    }

    .info-tiles.tiles-toyo:hover {
        color: #ffffff;
    }

        .info-tiles.tiles-toyo:hover .tiles-heading {
            background: #5a7195;
        }

        .info-tiles.tiles-toyo:hover .tiles-body {
            background: #4b5f7d;
        }

        .info-tiles.tiles-toyo:hover .tiles-body-alt {
            background: #4b5f7d;
        }

        .info-tiles.tiles-toyo:hover .tiles-footer {
            background: #38475d;
        }

.info-tiles.tiles-alizarin {
    color: #ffffff !important;
}

    .info-tiles.tiles-alizarin .tiles-heading {
        background: #eb6d60;
    }

    .info-tiles.tiles-alizarin .tiles-body {
        background: #e74c3c;
    }

    .info-tiles.tiles-alizarin .tiles-body-alt {
        background: #e74c3c;
    }

    .info-tiles.tiles-alizarin .tiles-footer {
        background: #d62c1a;
    }

    .info-tiles.tiles-alizarin:hover {
        color: #ffffff;
    }

        .info-tiles.tiles-alizarin:hover .tiles-heading {
            background: #e85647;
        }

        .info-tiles.tiles-alizarin:hover .tiles-body {
            background: #e43725;
        }

        .info-tiles.tiles-alizarin:hover .tiles-body-alt {
            background: #e43725;
        }

        .info-tiles.tiles-alizarin:hover .tiles-footer {
            background: #bf2718;
        }

.shortcut-tiles.tiles-info {
    color: #ffffff !important;
}

    .shortcut-tiles.tiles-info .tiles-heading,
    .shortcut-tiles.tiles-info .tiles-body,
    .shortcut-tiles.tiles-info .tiles-footer {
        background: #2bbce0;
    }

    .shortcut-tiles.tiles-info:hover {
        color: #ffffff;
    }

        .shortcut-tiles.tiles-info:hover .tiles-heading,
        .shortcut-tiles.tiles-info:hover .tiles-body,
        .shortcut-tiles.tiles-info:hover .tiles-footer {
            background: #1fafd3;
        }

.shortcut-tiles.tiles-success {
    color: #ffffff !important;
}

    .shortcut-tiles.tiles-success .tiles-heading,
    .shortcut-tiles.tiles-success .tiles-body,
    .shortcut-tiles.tiles-success .tiles-footer {
        background: #85c744;
    }

    .shortcut-tiles.tiles-success:hover {
        color: #ffffff;
    }

        .shortcut-tiles.tiles-success:hover .tiles-heading,
        .shortcut-tiles.tiles-success:hover .tiles-body,
        .shortcut-tiles.tiles-success:hover .tiles-footer {
            background: #78ba38;
        }

.shortcut-tiles.tiles-danger {
    color: #ffffff !important;
}

    .shortcut-tiles.tiles-danger .tiles-heading,
    .shortcut-tiles.tiles-danger .tiles-body,
    .shortcut-tiles.tiles-danger .tiles-footer {
        background: #e73c3c;
    }

    .shortcut-tiles.tiles-danger:hover {
        color: #ffffff;
    }

        .shortcut-tiles.tiles-danger:hover .tiles-heading,
        .shortcut-tiles.tiles-danger:hover .tiles-body,
        .shortcut-tiles.tiles-danger:hover .tiles-footer {
            background: #e42525;
        }

.shortcut-tiles.tiles-warning {
    color: #ffffff !important;
}

    .shortcut-tiles.tiles-warning .tiles-heading,
    .shortcut-tiles.tiles-warning .tiles-body,
    .shortcut-tiles.tiles-warning .tiles-footer {
        background: #f1c40f;
    }

    .shortcut-tiles.tiles-warning:hover {
        color: #ffffff;
    }

        .shortcut-tiles.tiles-warning:hover .tiles-heading,
        .shortcut-tiles.tiles-warning:hover .tiles-body,
        .shortcut-tiles.tiles-warning:hover .tiles-footer {
            background: #dab10d;
        }

.shortcut-tiles.tiles-primary {
    color: #ffffff !important;
}

    .shortcut-tiles.tiles-primary .tiles-heading,
    .shortcut-tiles.tiles-primary .tiles-body,
    .shortcut-tiles.tiles-primary .tiles-footer {
        background: #4f8edc;
    }

    .shortcut-tiles.tiles-primary:hover {
        color: #ffffff;
    }

        .shortcut-tiles.tiles-primary:hover .tiles-heading,
        .shortcut-tiles.tiles-primary:hover .tiles-body,
        .shortcut-tiles.tiles-primary:hover .tiles-footer {
            background: #3a80d8;
        }

.shortcut-tiles.tiles-inverse {
    color: #ffffff !important;
}

    .shortcut-tiles.tiles-inverse .tiles-heading,
    .shortcut-tiles.tiles-inverse .tiles-body,
    .shortcut-tiles.tiles-inverse .tiles-footer {
        background: #4f5259;
    }

    .shortcut-tiles.tiles-inverse:hover {
        color: #ffffff;
    }

        .shortcut-tiles.tiles-inverse:hover .tiles-heading,
        .shortcut-tiles.tiles-inverse:hover .tiles-body,
        .shortcut-tiles.tiles-inverse:hover .tiles-footer {
            background: #43464b;
        }

.shortcut-tiles.tiles-midnightblue {
    color: #ffffff !important;
}

    .shortcut-tiles.tiles-midnightblue .tiles-heading,
    .shortcut-tiles.tiles-midnightblue .tiles-body,
    .shortcut-tiles.tiles-midnightblue .tiles-footer {
        background: #34495e;
    }

    .shortcut-tiles.tiles-midnightblue:hover {
        color: #ffffff;
    }

        .shortcut-tiles.tiles-midnightblue:hover .tiles-heading,
        .shortcut-tiles.tiles-midnightblue:hover .tiles-body,
        .shortcut-tiles.tiles-midnightblue:hover .tiles-footer {
            background: #2b3c4e;
        }

.shortcut-tiles.tiles-sky {
    color: #ffffff !important;
}

    .shortcut-tiles.tiles-sky .tiles-heading,
    .shortcut-tiles.tiles-sky .tiles-body,
    .shortcut-tiles.tiles-sky .tiles-footer {
        background: #76c4ed;
    }

    .shortcut-tiles.tiles-sky:hover {
        color: #ffffff;
    }

        .shortcut-tiles.tiles-sky:hover .tiles-heading,
        .shortcut-tiles.tiles-sky:hover .tiles-body,
        .shortcut-tiles.tiles-sky:hover .tiles-footer {
            background: #5fbaea;
        }

.shortcut-tiles.tiles-orange {
    color: #ffffff !important;
}

    .shortcut-tiles.tiles-orange .tiles-heading,
    .shortcut-tiles.tiles-orange .tiles-body,
    .shortcut-tiles.tiles-orange .tiles-footer {
        background: #f0ad4e;
    }

    .shortcut-tiles.tiles-orange:hover {
        color: #ffffff;
    }

        .shortcut-tiles.tiles-orange:hover .tiles-heading,
        .shortcut-tiles.tiles-orange:hover .tiles-body,
        .shortcut-tiles.tiles-orange:hover .tiles-footer {
            background: #dfa046;
        }

.shortcut-tiles.tiles-indigo {
    color: #ffffff !important;
}

    .shortcut-tiles.tiles-indigo .tiles-heading,
    .shortcut-tiles.tiles-indigo .tiles-body,
    .shortcut-tiles.tiles-indigo .tiles-footer {
        background: #9358ac;
    }

    .shortcut-tiles.tiles-indigo:hover {
        color: #ffffff;
    }

        .shortcut-tiles.tiles-indigo:hover .tiles-heading,
        .shortcut-tiles.tiles-indigo:hover .tiles-body,
        .shortcut-tiles.tiles-indigo:hover .tiles-footer {
            background: rgb(133, 78, 157);
        }

.shortcut-tiles.tiles-green {
    color: #ffffff !important;
}

    .shortcut-tiles.tiles-green .tiles-heading,
    .shortcut-tiles.tiles-green .tiles-body,
    .shortcut-tiles.tiles-green .tiles-footer {
        background: #26B99A;
    }

    .shortcut-tiles.tiles-green:hover {
        color: #ffffff;
    }

        .shortcut-tiles.tiles-green:hover .tiles-heading,
        .shortcut-tiles.tiles-green:hover .tiles-body,
        .shortcut-tiles.tiles-green:hover .tiles-footer {
            background: #1ca88a;
        }

.shortcut-tiles.tiles-magenta {
    color: #ffffff !important;
}

    .shortcut-tiles.tiles-magenta .tiles-heading,
    .shortcut-tiles.tiles-magenta .tiles-body,
    .shortcut-tiles.tiles-magenta .tiles-footer {
        background: #e73c68;
    }

    .shortcut-tiles.tiles-magenta:hover {
        color: #ffffff;
    }

        .shortcut-tiles.tiles-magenta:hover .tiles-heading,
        .shortcut-tiles.tiles-magenta:hover .tiles-body,
        .shortcut-tiles.tiles-magenta:hover .tiles-footer {
            background: #e42556;
        }

.shortcut-tiles.tiles-purple {
    color: #ffffff !important;
}

    .shortcut-tiles.tiles-purple .tiles-heading,
    .shortcut-tiles.tiles-purple .tiles-body,
    .shortcut-tiles.tiles-purple .tiles-footer {
        background: #e044ab;
    }

    .shortcut-tiles.tiles-purple:hover {
        color: #ffffff;
    }

        .shortcut-tiles.tiles-purple:hover .tiles-heading,
        .shortcut-tiles.tiles-purple:hover .tiles-body,
        .shortcut-tiles.tiles-purple:hover .tiles-footer {
            background: #dc2ea1;
        }

.shortcut-tiles.tiles-brown {
    color: #ffffff !important;
}

    .shortcut-tiles.tiles-brown .tiles-heading,
    .shortcut-tiles.tiles-brown .tiles-body,
    .shortcut-tiles.tiles-brown .tiles-footer {
        background: #c0392b;
    }

    .shortcut-tiles.tiles-brown:hover {
        color: #ffffff;
    }

        .shortcut-tiles.tiles-brown:hover .tiles-heading,
        .shortcut-tiles.tiles-brown:hover .tiles-body,
        .shortcut-tiles.tiles-brown:hover .tiles-footer {
            background: #ab3326;
        }

.shortcut-tiles.tiles-grape {
    color: #ffffff !important;
}

    .shortcut-tiles.tiles-grape .tiles-heading,
    .shortcut-tiles.tiles-grape .tiles-body,
    .shortcut-tiles.tiles-grape .tiles-footer {
        background: #7a869c;
    }

    .shortcut-tiles.tiles-grape:hover {
        color: #ffffff;
    }

        .shortcut-tiles.tiles-grape:hover .tiles-heading,
        .shortcut-tiles.tiles-grape:hover .tiles-body,
        .shortcut-tiles.tiles-grape:hover .tiles-footer {
            background: #6c7991;
        }

.shortcut-tiles.tiles-toyo {
    color: #ffffff !important;
}

    .shortcut-tiles.tiles-toyo .tiles-heading,
    .shortcut-tiles.tiles-toyo .tiles-body,
    .shortcut-tiles.tiles-toyo .tiles-footer {
        background: #556b8d;
    }

    .shortcut-tiles.tiles-toyo:hover {
        color: #ffffff;
    }

        .shortcut-tiles.tiles-toyo:hover .tiles-heading,
        .shortcut-tiles.tiles-toyo:hover .tiles-body,
        .shortcut-tiles.tiles-toyo:hover .tiles-footer {
            background: #4b5f7d;
        }

.shortcut-tiles.tiles-alizarin {
    color: #ffffff !important;
}

    .shortcut-tiles.tiles-alizarin .tiles-heading,
    .shortcut-tiles.tiles-alizarin .tiles-body,
    .shortcut-tiles.tiles-alizarin .tiles-footer {
        background: #e74c3c;
    }

    .shortcut-tiles.tiles-alizarin:hover {
        color: #ffffff;
    }

        .shortcut-tiles.tiles-alizarin:hover .tiles-heading,
        .shortcut-tiles.tiles-alizarin:hover .tiles-body,
        .shortcut-tiles.tiles-alizarin:hover .tiles-footer {
            background: #e43725;
        }

.panel-comments,
.panel-threads,
.panel-users {
    padding-left: 0;
    list-style: none;
    margin-bottom: 20px;
}

    .panel-comments li,
    .panel-threads li,
    .panel-users li {
        display: block;
        margin-left: -20px;
        margin-right: -20px;
        padding: 20px 20px;
        border-bottom: 1px solid #e6e7e8;
    }

        .panel-comments li:before,
        .panel-threads li:before,
        .panel-users li:before,
        .panel-comments li:after,
        .panel-threads li:after,
        .panel-users li:after {
            content: " ";
            display: table;
        }

        .panel-comments li:after,
        .panel-threads li:after,
        .panel-users li:after {
            clear: both;
        }

        .panel-comments li:before,
        .panel-threads li:before,
        .panel-users li:before,
        .panel-comments li:after,
        .panel-threads li:after,
        .panel-users li:after {
            content: " ";
            display: table;
        }

        .panel-comments li:after,
        .panel-threads li:after,
        .panel-users li:after {
            clear: both;
        }

#domshortcuttiles .badge {
    width: auto;
    height: 30px;
    padding: 8px 7px 25px 7px;
    border-radius: 15px;
    background-color: rgba(0, 0, 0, 0.26);
    position: relative;
    font-size: 12px;
    top: 3px;
}

.reports {
    padding: 0px 3px 0px 3px;
    /*height:140px*/
}

.reports1 {
    padding: 0px 3px 0px 3px;
    height: 140px;
}

.rep_height {
    min-height: 20px;
}

.titles_height {
    height: 60px;
}

div#domshortcuttiles {
    padding: 5px 15px 0px 15px;
}


























.cbp-l-filters-button {
    text-align: center;
}

    .cbp-l-filters-button, .cbp-l-filters-button * {
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        outline: 0;
    }

  
        .cbp-l-filters-button .cbp-filter-counter {
            background-color: #4D4C4D;
            border-radius: 3px;
            color: #fff;
            font: 400 11px/18px 'Droid Arabic Kufi', sans-serif;
            margin: 0 auto;
            padding: 4px 0;
            text-align: center;
            width: 34px;
            position: absolute;
            bottom: 0;
            left: 0;
            right: 0;
            opacity: 0;
            -ms-filter: "alpha(Opacity=0)";
            -webkit-transition: opacity .25s ease, bottom .25s ease;
            transition: opacity .25s ease, bottom .25s ease;
        }

        .cbp-l-filters-button .cbp-filter-item:hover {
            color: #ffffff;
        }

            .cbp-l-filters-button .cbp-filter-item:hover .cbp-filter-counter {
                bottom: 30px;
                -ms-filter: "alpha(Opacity=100)";
                opacity: 1;
            }

        .cbp-l-filters-button .cbp-filter-item.cbp-filter-item-active {
            background-color: #4D4C4D;
            color: #fff;
            border-color: #4D4C4D;
            cursor: default;
        }

        .cbp-l-filters-button .cbp-filter-item:hover .cbp-filter-counter:before {
            display: block;
        }

        .cbp-l-filters-button .cbp-filter-counter:before {
            content: "";
            position: absolute;
            bottom: -4px;
            left: 0;
            right: 0;
            margin: 0 auto;
            width: 0;
            height: 0;
            border-left: 4px solid transparent;
            border-right: 4px solid transparent;
            border-top: 4px solid #4D4C4D;
            display: none;
        }


.progect-process h3 {
    font-size: 20px;
    margin-bottom: 22px;
}

.process-one {
    background-color: #a1b0bd;
    position: relative;
    padding: 15px;
    -webkit-transition: .5s all;
    transition: .5s all;
    -moz-transition: .5s all;
}

    .process-one:hover {
        background-color: #849bad;
    }

.process-two {
    background-color: #d2be81;
    position: relative;
    padding: 15px;
    -webkit-transition: .5s all;
    transition: .5s all;
    -moz-transition: .5s all;
}

    .process-two:hover {
        background-color: #d4b75f;
    }

    .process-two .btn-primary {
        background-color: #f60;
        border-color: #de5900;
    }



.process-three {
    background-color: #99ff9d;
    position: relative;
    padding: 15px;
    -webkit-transition: .5s all;
    transition: .5s all;
    -moz-transition: .5s all;
}

    .process-three:hover {
        background-color: #7cc77f;
    }







.dr-holder-toggle {
    position: absolute;
    width: 30px;
    height: 100px;
    right: -30px;
    top: 30%;
    border-radius: 0;
    border: 0;
    background-color: #0c508d;
    color: #ffffff;
    font-size: 24px;
    text-align: center;
    line-height: 60px;
    padding: 0;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}

.dr-holder-inner {
    padding: 20px;
}

    .dr-holder-inner h3 {
        font-size: 16px;
        color: #2397ff;
        font-weight: 600;
        margin-bottom: 15px;
        margin-top: 0px;
    }

    .dr-holder-inner p {
        font-size: 12px;
    }

.btn-primary.btn-o {
    color: #e67e22;
    border: solid 2px #e67e22;
}

    .btn-primary.btn-o:hover, .btn-primary.btn-o:focus, .btn-primary.btn-o:active {
        background-color: #e67e22;
    }

.dr-holder.active {
    left: 0px;
}

.dr-holder.in {
    display: block;
}

.dr-holder {
    position: absolute;
    display: none;
    top: 200px;
    left: -220px;
    width: 220px;
    height: auto;
    padding: 0;
    z-index: 999;
    background-color: #ffffff;
    color: #fff;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
    transition: all .6s ease;
    min-height: 210px;
    border: 3px solid #0c508d;
}


.post-meta {
    font-size: 14px;
    margin-bottom: 7px;
    color: #4e4e4e;
    text-align: right;
    padding: 0;
}

    .post-meta > li {
        display: inline-block;
        text-align: right;
        font-size: 12px;
        line-height: 1.9;
        margin-bottom: 9px;
    }

    .post-meta i.fa.fa-check {
        margin-right: 3px;
        background-color: #0eaf44;
        width: 18px;
        height: 18px;
        border-radius: 9px;
        color: #fff;
        line-height: 1.8;
        font-size: 11px;
        text-align: center;
    }

i.fa.fa-check.late-task {
    background-color: red;
}


.nav-justified > li {
    float: none;
}

.nav-pills > li.active > a, .nav-pills > li.active > a:hover, .nav-pills > li.active > a:focus {
    color: #ffffff;
    background-color: #59af5c;
}

.list-group-item-heading {
    margin-top: 0;
    margin-bottom: 5px;
}

.nav-pills > li.active > a:after, .nav-pills > li.active > a:hover:after, .nav-pills > li.active > a:focus:after {
    width: 0px;
    height: 0px;
    border-style: solid;
    border-width: 9px 9px 9px 0;
    border-color: transparent #59af5c transparent transparent;
    content: "";
    position: absolute;
    top: 50%;
    margin-top: -9px;
    left: -9px;
}



.result-bg {
    background-color: rgba(255, 255, 255, 0.3);
    border: 1px solid #b9d1ec;
    padding: 10px;
    margin-right: 15px;
    margin-left: 15px;
    margin-top: 15px;
}

.project-position {
    font-size: 16px;
    font-weight: bold;
    color: #46ad5d;
}

.result-bg .form-horizontal .control-label {
    padding-top: 7px;
    margin-bottom: 0;
    text-align: right;
}

.table-result {
    margin: 0 auto;
    margin-top: 5px;
}

    .table-result thead {
        font-weight: bold;
    }

    .table-result thead tr:first-child {
        font-weight: bold;
        color: #0c508d;
    }

.table-title h2 {
    font-size: 20px;
    font-weight: bold;
    color: green;
}

.table-result th,
.table-result td {
    text-align: center;
    padding: 10px 20px 10px 20px;
    border: thin solid black;
}

.stage-name {
    display: inline-block;
}

    .stage-name label.control-label.ng-binding {
        color: green;
        font-size: 15px;
    }



.head-events {
    border-left: 1px solid #adadad;
    color: green;
    height: 30px;
}


.table-result .table-bordered > thead > tr > th, .table-bordered > tbody > tr > th, .table-bordered > tfoot > tr > th, .table-bordered > thead > tr > td, .table-bordered > tbody > tr > td, .table-bordered > tfoot > tr > td {
    border: 1px solid #848484;
}

.table-hover > tbody > tr:hover > td, .table-hover > tbody > tr:hover > th {
    background-color: rgba(245, 245, 245, 0.65);
}

.tbl.table-bordered.table-responsive.table-hover.table-result thead {
    color: green;
    font-weight: bold;
}

.form-group div label:before {
    content: none !important;
}

.form-group div label:before {
    content: none !important;
}

.panel.panel-info.search {
    margin: 0px -15px 0 -15px;
}

    .panel.panel-info.search .panel-title {
        padding-right: 3px;
        line-height: 3;
    }

    .panel.panel-info.search > .panel-heading {
        color: #FFFFFF;
        background-color: #4da1e2;
        border-color: #0c508d;
    }

    .panel.panel-info.search > .panel-heading {
        font-size: 18px;
        font-weight: 300;
        letter-spacing: 0.025em;
        height: 50px;
        line-height: 45px;
    }

.reports-btn {
    text-align: center;
}

    .reports-btn .btn-primary {
        margin-bottom: 10px;
    }

.breadcrumb {
    border-radius: 0;
    padding: 10px 15px;
    background: rgba(255, 255, 255, 0.7);
    box-shadow: 0 1px 1px rgba(12, 80, 141, 0.51);
    margin: 0;
    margin-bottom: 15px;
    font-weight: bold;
}

.form-horizontal .control-label {
    padding-top: 7px;
    margin-bottom: 0;
    text-align: right !important;
}

input#ExecuteBtn {
    padding: 6px 17px 6px 17px;
    border-radius: 3px;
    background-color: #0c508d;
    border: 1px solid #0c508d;
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    -webkit-transition: .3s all;
    transition: .3s all;
    -moz-transition: .3s all;
}

    input#ExecuteBtn:hover {
    outline: none;
    box-shadow: none;
    
}

body {
    background-color: #FFFFFF;
    background-image: url(../img/bg.jpg);
    background-repeat: no-repeat;
    background-position: left top;
    direction: rtl;
    font-family: 'Droid Arabic Kufi', arial;
    font-size: 12px;
    color: #333333;
    /* overflow-x: hidden; */
}

.btn-primary {
    color: #fff;
    background-color: #0C508D;
    border-color: #0B3458;
}

    .btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .open > .dropdown-toggle.btn-primary {
        color: #fff;
        background-color: #216EB3;
        border-color: #0C508D;
    }

select.form-control {
    padding: 0 12px;
}

#header {
    background-image: url(../img/bg2.png);
    background-repeat: no-repeat;
    min-height: 60px;
    background-position: 136px bottom;
    background-size: 460px;
}
.process-project {
    background-color: rgba(255, 255, 255, 0.75);
    background-image: url(../img/project-bg.png);
    background-repeat: no-repeat;
    background-position: 0px -908px;
    
    font-size: 12px;
    color: #333333;
    padding: 15px;
    border-radius: 15px 5px 0 0;
    -webkit-box-shadow: 0 8px 6px -6px #bfbfbf;
    -moz-box-shadow: 0 8px 6px -6px #bfbfbf;
    box-shadow: 0 8px 6px -6px #bfbfbf;
}

.process-project {}

.process-project .progect-process-title h3 a{
    color: #6fa572;
    font-weight: 600;
    line-height: 1.6;
    font-size: 20px;
    /* text-shadow: 2px 2px #dcddde; */
    white-space: nowrap;
}
.process-project .col-sm-5 {
    padding-top: 28px; 
}
.process-project .progress {
     height: 20px;
    margin-bottom: 20px;
    overflow: hidden;
       background-color: #0c508d;
    border: 1px solid #d4d1d1;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,.1);
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.26);
}
.process-project .progress span{
    position: absolute;
   color: white;
    text-align: center;
    top: 27px;
    z-index: 9999;
    width: 100%;
    right: 0;}
.layout .progress {
     height: 20px;
    margin-bottom: 20px;
    overflow: hidden;
       background-color: #0c508d;
    border: 1px solid #d4d1d1;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,.1);
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.26);
}
.layout .progress span{
    position: absolute;
   color: white;
    text-align: center;
    top: 0px;
    z-index: 9999;
    width: 100%;
    right: 0;}

.process-project .progect-process-title h3 {
    border-right: 5px solid #0c508d;
    padding-right: 10px;
}
.process-project .progress-bar-info {
    background-color: #73c9e3;
}

.progect-process-content {
    margin-right: 22px;
}

#logo {
    margin-top: 20px;
    float: right;
}

.layout {
    background-image: url(../img/bg3.jpg);
    background-repeat: repeat;
    border-top: solid 3px #0C508D;
    border-bottom: solid 3px #0C508D;
    padding: 20px 0;
}

.ttl {
    color: #fff;
    padding-right: 15px;
    background-color: #0C508D;
    border-radius: 0 5px 0 0;
    -moz-border-radius: 0 5px 0 0;
    -webkit-border-radius: 0 5px 0 0;
    margin-top: -59px;
    height: 34px;
    font-size: 16px;
    position: relative;
    line-height: 35px;
    white-space: nowrap;
}

    .ttl:after {
        content: '';
        width: 0;
        height: 0;
        border-bottom: 35px solid #0C508D;
        border-left: 35px solid transparent;
        position: absolute;
        top: 0;
        left: -34px;
    }


.login-options .checkbox, .login-options a {
    margin-top: 0;
    line-height: normal;
}

#menu {
    margin-bottom: 20px;
}

    #menu nav {
        color: #fff;
        padding: 5px;
        background-color: #0C508D;
        border-radius: 0 0 5px 5px;
        -moz-border-radius: 0 0 5px 5px;
        -webkit-border-radius: 0 0 5px 5px;
        margin: -19px 0 0;
        position: relative;
        min-height: 0;
        text-align: center;
    }

.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus {
    color: #0C508D;
    background-color: #FFFFFF;
    border-radius: 3px;
}

.navbar-default .navbar-nav > li > a {
    color: #FFF;
    padding: 5px 10px;
}

    .navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus {
        color: #8DD3FF;
        background-color: transparent;
    }

.table {
    border-collapse: separate;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -webkit-box-shadow: #999 0px 0px 5px;
    -moz-box-shadow: #999 0px 0px 5px;
    box-shadow: #999 0px 0px 5px;
    border-spacing: 3px;
    background-color: #0C508D;
}

    .table td {
        border-top: solid 1px #fff;
        background-color: #fff;
        border-bottom: solid 1px #fff;
        border-radius: 3px;
        -moz-border-radius: 3px;
        -webkit-border-radius: 3px;
    }

    .table th {
        color: #fff;
        background: none !important;
    }

    .table td, .table th {
        text-align: center;
        padding: 0 5px;
    }

    .table tr:nth-child(even) td {
        background-color: #E7F0FA;
    }

    .table tr:hover td {
        background-color: #D6E7F9;
    }

    .table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td {
        border-top: 1px solid #FFF;
        padding: 3px;
        line-height: 2;
    }

    .table .fa {
        font-size: 15px;
        line-height: 1.5;
        margin-top: 4px;
    }

.panel-info {
    border-color: #6BA7DC;
}

    .panel-info > .panel-heading {
        color: #FFFFFF;
        background-color: #6BA7DC;
        border-color: #0C508D;
    }

.pager-holder, [template-url="templates.pagination"] {
    margin-top: 10px;
    padding: 0 10px 10px;
    border-top: 1px solid #0C508D;
    font: normal 12px Tahoma, Geneva, sans-serif;
    text-align: left;
}

[template-url="templates.pagination"] {
    text-align: right;
}

.pagination {
    margin: 0;
    border-radius: 0px;
}

    .pagination > li > a:hover, .pagination > li > span:hover, .pagination > li > a:focus, .pagination > li > span:focus {
        color: #FFFFFF;
        background-color: #0C508D;
        border-color: transparent;
    }

    .pagination > li > a, .pagination > li > span {
        position: relative;
        float: right;
        padding: 6px 12px;
        margin-right: -1px;
        line-height: 1.42857143;
        color: #0C508D;
        text-decoration: none;
        background-color: rgba(255, 255, 255, 0);
        border: none;
        border-top: 2px solid rgba(221, 221, 221, 0);
        border-radius: 0 !important;
    }


.ttl1 {
    border-bottom: solid 1px #0C508D;
    padding-bottom: 1px;
    text-align: center;
    color: #fff;
    margin: 10px 0;
}

    .ttl1 h3 {
        background-color: #0C508D;
        display: inline-block;
        white-space: nowrap;
        font-size: 12px;
        padding: 0 25px;
        line-height: 30px;
        border-radius: 5px 5px 0 0;
        -moz-border-radius: 5px 5px 0 0;
        -webkit-border-radius: 5px 5px 0 0;
        position: relative;
        margin: 20px 0 0;
    }

.star {
    color: #FF0000;
    display: inline-block;
    margin-left: 2px;
}

.btn-holder {
    /*border-top: solid 1px #0C508D;*/
    padding: 20px;
}




.navbar-default .navbar-toggle .icon-bar {
    background-color: #FFF;
}

.navbar-default .navbar-toggle {
    border-color: rgba(255, 255, 255, 0);
    margin: 0;
}

    .navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
        background-color: rgba(221, 221, 221, 0);
    }

        .navbar-default .navbar-toggle:hover .icon-bar, .navbar-default .navbar-toggle:focus .icon-bar {
            background-color: #89B8E2;
        }


.pending, .pending .ttl1 {
    border-color: #F60;
}

.approved, .approved .ttl1 {
    border-color: #093;
}

.rejected, .rejected .ttl1 {
    border-color: #900;
}

.pending .ttl1 h3 {
    background-color: #f60;
}

.approved .ttl1 h3 {
    background-color: #093;
}

.rejected .ttl1 h3 {
    background-color: #900;
}

.dashboard li {
    border-bottom: dotted 1px #335A82;
    margin-bottom: 5px;
    padding-bottom: 5px;
}

    .dashboard li a {
        text-decoration: none;
        color: #333;
        margin-right: 5px;
    }

.userInfo {
    float: left;
    text-align: center;
    width: 135px;
    padding: 0px 0px;
    /* background-image: url(../img/user.png); */
    background-repeat: no-repeat;
    background-position: center 103%;
    height: 150px;
    color: #FFFFFF;
    font-size: 10px;
    margin-top: 23px;
    background-color: rgba(32, 63, 90, 0.88);
    border-radius: 25px;
}

    .userInfo h4 {
        color: #44ccff;
    }

    .userInfo h3, .userInfo h4 {
        font-size: 10px;
    }

    .userInfo a .fa {
        font-size: 15px;
        color: #fff;
        margin: 5px;
    }

.badge {
    width: 20px;
    line-height: 1.4;
    height: 20px;
    background-color: #f00;
    position: absolute;
    font-size: 10px;
}

#header .badge {
    right: -7px;
    bottom: 10px;
}


.userInfo a {
    position: relative;
}

.userInfo > span {
    position: relative;
}

.dropdown-menu > li > a {
    display: block;
    padding: 3px 20px;
    clear: both;
    font-weight: normal;
    line-height: 1.428571429;
    color: #4d4d4d;
    white-space: nowrap;
}

.dropdown-menu.notifications, .dropdown-menu.messages {
    padding: 0;
    z-index: 1300;
}

.dropdown-menu {
    margin-top: 2px;
    -webkit-box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    background-color: #ffffff;
    background-color: rgba(255, 255, 255, 0.98);
}

.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    right: auto;
    z-index: 1001;
    display: none;
    min-width: 280px;
    padding: 5px 0;
    margin: 2px 0 0;
    list-style: none;
    font-size: 14px;
    text-align: right;
    background-color: rgba(255, 255, 255, 0.98);
    border: 1px solid #cccccc;
    border-radius: 1px;
    -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
    background-clip: padding-box;
}

    .dropdown-menu.arrow:before {
        position: absolute;
        top: -6px;
        left: 5px;
        display: inline-block;
        border-right: 10px solid transparent;
        border-bottom: 10px solid #fff;
        border-left: 10px solid transparent;
        content: '';
    }

    .dropdown-menu.notifications li.dd-header {
        padding: 6px 10px;
        font-size: 0.85em;
    }

    .dropdown-menu.notifications li {
        border-bottom: 1px solid #e6e7e8;
        color: #000 !important;
    }

        .dropdown-menu.notifications li.dd-header:before, .dropdown-menu.notifications li.dd-header:after {
            content: " ";
            display: table;
        }

        .dropdown-menu.notifications li.dd-header span:first-child {
            float: right !important;
            float: right;
            font-weight: 400;
        }

        .dropdown-menu.notifications li.dd-header span:last-child {
            float: left !important;
            float: left;
        }

            .dropdown-menu.notifications li.dd-header span:last-child a {
                padding: 0 !important;
            }

        .dropdown-menu.notifications li.dd-header a {
            background: none !important;
        }

        .dropdown-menu.notifications li.dd-header a, .dropdown-menu.notifications li.dd-footer a {
            color: #4f8edc;
        }

        .dropdown-menu.notifications li a {
            padding: 12px 15px;
            line-height: 16px;
            font-size: 11px;
        }

        .dropdown-menu.notifications li.dd-footer {
            text-align: center;
            padding: 0;
        }

        .dropdown-menu.notifications li a.active, .dropdown-menu.notifications li a:hover {
            color: #1a1a1a !important;
            background: #EDEDED !important;
        }

        .dropdown-menu.notifications li a {
            white-space: normal;
            color: #4D4D4D;
        }

.scrollthis {
    height: 200px;
    overflow-y: scroll;
}

    .scrollthis::-webkit-scrollbar {
        width: 10px;
        background: #fff;
    }

    .scrollthis::-webkit-scrollbar-track-piece {
        background-color: #fff;
    }

    .scrollthis::-webkit-scrollbar-thumb {
        width: 15px;
        background-color: #0f83da;
    }

    .scrollthis li:before, .scrollthis li:after {
        content: " ";
        display: table;
    }

.dropdown-menu.notifications li .time {
    float: left;
}

.dropdown-menu.notifications li .time, .dropdown-menu.messages li .time {
    color: #b3b3b3;
    font-size: 0.85em;
    white-space: nowrap;
    text-align: left;
    vertical-align: top;
}

.dropdown-menu.notifications li a .msg {
    overflow: hidden;
    padding: 0 7px;
    display: inline;
    width: 210px;
}

.dropdown-menu.notifications li:last-child, .dropdown-menu.messages li:last-child {
    border-bottom: 0;
}

.dropdown-menu.notifications li.dd-footer, .dropdown-menu.messages li.dd-footer {
    font-size: 0.85em;
}

.dropdown-menu.notifications li, .dropdown-menu.messages li {
    border-bottom: 1px solid #D5D5D5;
    color: #000 !important;
}

.scrollthis + .dd-footer {
    border-top: 1px solid #D5D5D5;
}

.scrollthis li a {
    display: block;
    text-decoration: none;
}


.timeline-month {
    width: 90px;
    text-align: center;
    position: relative;
    right: 6%;
    margin-right: -42px;
    font-size: 14px;
}

    .timeline-month span {
        display: block;
    }

.timeline {
    padding-right: 0;
    list-style: none;
    position: relative;
}

    .timeline:before {
        content: '';
        position: absolute;
        top: 10px;
        bottom: 0;
        width: 2px;
        background: #FFFFFF;
        right: 6%;
        margin-right: 2px;
    }

    .timeline > li {
        position: relative;
    }

        .timeline > li .timeline-header {
            padding: 0 0 10px;
            color: #aeafb1;
        }

            .timeline > li .timeline-header:before,
            .timeline > li .timeline-header:after {
                content: " ";
                display: table;
            }

            .timeline > li .timeline-header:after {
                clear: both;
            }

            .timeline > li .timeline-header:before,
            .timeline > li .timeline-header:after {
                content: " ";
                display: table;
            }

            .timeline > li .timeline-header:after {
                clear: both;
            }

            .timeline > li .timeline-header span.date {
                float: right;
                text-transform: uppercase;
            }

            .timeline > li .timeline-header span.author {
                float: left;
                font-size: 12px;
            }

        .timeline > li .timeline-icon {
            width: 50px;
            height: 50px;
            font-size: 1.4em;
            line-height: 50px;
            -webkit-font-smoothing: antialiased;
            position: absolute;
            color: #4d4d4d;
            background: #FFFFFF;
            border-radius: 50%;
            text-align: center;
            right: 6%;
            top: 0;
            margin: 0 -22px 0 0;
            padding: 0;
        }

        .timeline > li .timeline-body {
            margin: 0 14% 20px 0;
            padding: 20px;
            position: relative;
            border-width: 2px;
            border-style: solid;
            border-radius: 1px;
            background-color: #fff;
        }

            .timeline > li .timeline-body:after {
                left: 100%;
                border: solid transparent;
                content: " ";
                height: 0;
                width: 0;
                position: absolute;
                pointer-events: none;
                border-color: transparent;
                border-width: 10px;
                top: 5%;
            }

            .timeline > li .timeline-body img {
                margin: 5px 20px 0 0;
            }

        .timeline > li .timeline-footer {
            /* color: #fff; */
        }

            .timeline > li .timeline-footer:before,
            .timeline > li .timeline-footer:after {
                content: " ";
                display: table;
            }

            .timeline > li .timeline-footer:after {
                clear: both;
            }

            .timeline > li .timeline-footer:before,
            .timeline > li .timeline-footer:after {
                display: table;
            }

            .timeline > li .timeline-footer:after {
                clear: both;
            }



.timeline-primary .timeline-body {
    border-color: #4f8edc;
}

    .timeline-primary .timeline-body:after {
        border-left-color: #4f8edc !important;
    }

.timeline-primary .timeline-time {
    color: #4f8edc;
}

.timeline-warning .timeline-body {
    border-color: #f1c40f;
}

    .timeline-warning .timeline-body:after {
        border-left-color: #f1c40f !important;
    }

.timeline-warning .timeline-time {
    color: #f1c40f;
}

.timeline-danger .timeline-body {
    border-color: #e73c3c;
}

    .timeline-danger .timeline-body:after {
        border-left-color: #e73c3c !important;
    }

.timeline-danger .timeline-time {
    color: #e73c3c;
}

.timeline-success .timeline-body {
    border-color: #85c744;
}

    .timeline-success .timeline-body:after {
        border-left-color: #85c744 !important;
    }

.timeline-success .timeline-time {
    color: #85c744;
}

.timeline-info .timeline-body {
    border-color: #2bbce0;
}

    .timeline-info .timeline-body:after {
        border-left-color: #2bbce0 !important;
    }

.timeline-info .timeline-time {
    color: #2bbce0;
}

.timeline-inverse .timeline-body {
    border-color: #4f5259;
}

    .timeline-inverse .timeline-body:after {
        border-left-color: #4f5259 !important;
    }

.timeline-inverse .timeline-time {
    color: #4f5259;
}

.timeline-brown .timeline-body {
    border-color: #c0392b;
}

    .timeline-brown .timeline-body:after {
        border-left-color: #c0392b !important;
    }

.timeline-brown .timeline-time {
    color: #c0392b;
}

.timeline-indigo .timeline-body {
    border-color: #9358ac;
}

    .timeline-indigo .timeline-body:after {
        border-left-color: #9358ac !important;
    }

.timeline-indigo .timeline-time {
    color: #9358ac;
}

.timeline-orange .timeline-body {
    border-color: #efa131;
}

    .timeline-orange .timeline-body:after {
        border-left-color: #efa131 !important;
    }

.timeline-orange .timeline-time {
    color: #efa131;
}

.timeline-sky .timeline-body {
    border-color: #76c4ed;
}

    .timeline-sky .timeline-body:after {
        border-left-color: #76c4ed !important;
    }

.timeline-sky .timeline-time {
    color: #76c4ed;
}

.timeline-midnightblue .timeline-body {
    border-color: #34495e;
}

    .timeline-midnightblue .timeline-body:after {
        border-left-color: #34495e !important;
    }

.timeline-midnightblue .timeline-time {
    color: #34495e;
}

.timeline-magenta .timeline-body {
    border-color: #e73c68;
}

    .timeline-magenta .timeline-body:after {
        border-left-color: #e73c68 !important;
    }

.timeline-magenta .timeline-time {
    color: #e73c68;
}

.timeline-green .timeline-body {
    border-color: #16a085;
}

    .timeline-green .timeline-body:after {
        border-left-color: #16a085 !important;
    }

.timeline-green .timeline-time {
    color: #16a085;
}

.timeline-purple .timeline-body {
    border-color: #e044ab;
}

    .timeline-purple .timeline-body:after {
        border-left-color: #e044ab !important;
    }

.timeline-purple .timeline-time {
    color: #e044ab;
}

.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:focus {
    color: #58C8FF;
    background-color: rgba(12, 80, 141, 0);
}

.navbar-nav > li > .dropdown-menu {
    text-align: center;
    background: #0C508D;
    box-shadow: none;
    border: none;
}

.dropdown-menu > li > a {
    display: block;
    padding: 6px 20px;
    clear: both;
    font-weight: 400;
    line-height: 1.42857143;
    color: #FFF;
    white-space: nowrap;
    border-bottom: solid 1px #45698A;
}


.btn-primary {
    min-width: 80px;
}

.field-validation-indicator {
}

.loading-container {
    margin-top: 4px;
}





.steps {
    margin-top: 20px;
}

    .steps .nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
        color: #FFF;
        font-size: 14px;
        font-weight: bold;
        margin-right: 0px;
        cursor: default;
        background-color: #0C508D;
        border: none;
        border-bottom: 1px solid #0C508D;
        text-align: center;
        opacity: 1;
    }

    .steps .nav-tabs > li > a {
        color: #FFF;
        font-size: 14px;
        background-color: rgb(12, 80, 141);
        font-weight: bold;
        margin: 0;
        line-height: 1.42857143;
        border: 1px solid transparent;
        border-radius: 0;
        text-align: center;
        opacity: .5;
    }

    .steps .nav-tabs {
        width: 100%;
        border-bottom: 5px solid #0C508D;
    }

        .steps .nav-tabs > li {
            float: right;
            /* margin-bottom: -1px; */
            /* margin-right: -2px; */
            width: 50%;
        }

span.lblUploadCheck {
    margin-right: 5px;
}

.chbxUpload {
    margin-top: 75px;
    display: inline;
}

.loadedImage {
    display: block;
    margin: 5px 0px;
    width: 100%;
    max-height: 50px;
}

.manager {
    border: solid 1px #FFF;
    background-color: rgba(255, 255, 255, 0.56);
    padding: 10px;
    border-radius: 5px;
    margin-bottom: 15px;
}

    .manager .col-md-2 {
        text-align: left;
    }

#ObstacleCheckList {
    border: solid 1px #FFF;
    background-color: rgba(255, 255, 255, 0.56);
    padding: 10px;
    border-radius: 5px;
    margin-bottom: 15px;
}

.alert-info {
    color: #FFFFFF;
    background-color: #94C3F5;
    border-color: #82A6CC;
}

.btn-default {
    color: #333;
    background-color: #fff;
    border-color: rgba(12, 80, 141, 0.64);
}

    .btn-default:hover, .btn-default:focus, .btn-default:active, .btn-default.active, .open > .dropdown-toggle.btn-default {
        color: #333;
        background-color: #e6e6e6;
        border-color: #adadad;
    }

.tiles-heading:after,
.tiles-body:after,
.tiles-footer:after {
    clear: both;
}

.tiles-heading:before,
.tiles-body:before,
.tiles-footer:before,
.tiles-heading:after,
.tiles-body:after,
.tiles-footer:after {
    content: " ";
    display: table;
}

.tiles-heading:after,
.tiles-body:after,
.tiles-footer:after {
    clear: both;
}

.info-tiles,
.shortcut-tiles {
    margin: 0px 0px 20px;
    display: block;
    border-radius: 1px;
    position: relative;
}

a.info-tiles,
a.shortcut-tiles {
    background: none;
}



















.panel-widget {
    background: #fff;
}

.panel-blue {
    background: #30a5ff;
    color: #fff;
}

.panel-widget {
    padding: 0;
    position: relative;
}

.no-padding {
    padding: 0;
    margin: 0;
}

.panel-blue .widget-left {
    background: #3b5998;
    color: #fff;
}

.widget-left {
    height: 80px;
    padding-top: 15px;
    text-align: center;
    border-radius: 0px;
}

.panel-widget .glyph {
    stroke-width: 2px;
}

.glyph {
    fill: currentColor;
    display: inline-block;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    text-align: center;
    vertical-align: middle;
    width: 70%;
    height: 70%;
}

.widget-right {
    line-height: 1.6em;
    margin: 0px;
    padding: 20px;
    height: 80px;
    color: #999;
    font-weight: 300;
    background: #fff;
    border: 1px solid rgba(179, 179, 179, 0.49);
    border-radius: 0px;
}

    .widget-right .large {
        color: #5f6468;
    }

.large {
    font-size: 2em;
}

.widget-right .text-muted {
    color: #9fadbb;
}

.panel-blue .text-muted, .panel-teal .text-muted, .panel-orange .text-muted, .panel-red .text-muted {
    color: rgba(255, 255, 255, .5);
}

.text-muted {
    color: #9fadbb;
}

.widget-right .text-muted {
    color: #0c508d;
    line-height: 2;
    font-size: 18px;
}

.dashboard-div-wrapper .badge {
}

.info-tiles.tiles-success:hover .tiles-body {
    background: #78ba38;
}












.panel-grape {
}

.panel {
    margin: 0px 0 20px;
    border-radius: 1px;
}

.panel-grape .panel-heading {
    color: #3b5998;
    background-color: rgb(230, 230, 230);
    border-bottom: .5px solid #3b5998;
}

.panel-heading {
    font-size: 16px;
    border-bottom: 1px solid #dddddd;
    border-top-right-radius: 1px;
    border-top-left-radius: 1px;
    height: 40px;
    font-weight: 600;
    line-height: 2.5em;
}

    .panel-heading:before, .panel-heading:after {
        content: " ";
        display: table;
    }

    .panel-heading h4 i {
        position: relative;
    }

.icon-highlight {
    font-size: 14px;
    top: -1px;
    padding: 5px 0px;
    height: 25px;
    width: 25px;
    text-align: center;
    background: rgba(0, 0, 0, 0.15);
    border-radius: 1px;
    margin: 5px 3px 5px -3px;
    border: 1px solid rgba(0, 0, 0, 0.08);
}




.panel-tasks li:before, .panel-tasks li:after {
    content: " ";
    display: table;
}

.panel-tasks li label {
    margin-bottom: 0;
}

.panel-tasks li .icon-dragtask {
    color: transparent;
    margin-right: 6px;
    width: 6px;
    height: 14px;
    cursor: -webkit-grab;
}

.label-info {
    background-color: #2bbce0;
}



.btn-group, .btn-group-vertical {
    padding: 0;
}

    .btn-group > .btn:first-child:not(:last-child):not(.dropdown-toggle) {
        border-bottom-right-radius: 1px;
        border-top-right-radius: 1px;
    }

    .btn-group > .btn:last-child:not(:first-child), .btn-group > .dropdown-toggle:not(:first-child) {
        border-bottom-left-radius: 0;
        border-top-left-radius: 0;
    }


.panel-indigo {
    border-color: #1ebfae;
}

[class*="panel-"].panel .panel-heading {
    /* padding: 2px 10px; */
    /* border-bottom: none; */
    font-size: 20px;
}

.panel-indigo .panel-heading {
    color: #cc8114;
    background-color: rgb(230, 230, 230);
    border-bottom: 1px solid #cc8114;
}

.panel.panel-indigo .table,
.panel.panel-grape .table {
    background-color: transparent;
    border-collapse: collapse;
}

    .panel.panel-indigo .table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td,
    .panel.panel-grape .table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td {
        color: #424b5a;
    }

.label-grape {
    background-color: #7a869c;
}

.info-tiles.tiles-success .tiles-body {
    background: #85c744;
    color: #fff;
}

.info-tiles.tiles-success .tiles-heading {
    background: #99d063;
}

.number-count {
    background-color: rgba(255, 255, 255, 0.5);
    border-top: 4px solid #55acee;
    padding-top: 20px;
    margin-bottom: 30px;
    display: inline-block;
}

    .number-count.task {
        border-top: 4px solid #ffb53e;
    }

.info-tiles.tiles-alizarin .tiles-heading {
    background: #eb6d60;
}

.info-tiles.tiles-alizarin .tiles-body {
    background: #e74c3c;
}

.info-tiles.tiles-alizarin {
    color: #ffffff !important;
}

.number-count .badge {
    right: 5px;
    top: -8px;
}

.panel-teal .widget-left {
    background: #1ebfae;
    color: #fff;
}

.panel-orange .widget-left {
    background: #ffb53e;
    color: #fff;
    -webkit-transition: 0.05s ease-in;
    -o-transition: 0.05s ease-in;
    transition: 0.05s ease-in;
}

    .panel-orange .widget-left:hover,
    .panel-orange .widget-left:foucs,
    .panel-orange .widget-left:active {
        background: #d6962f;
    }

.panel-red .widget-left {
    background: #ac7b58;
    color: #fff;
}

.panel-widget i.fa.fa {
    font-size: 50px;
}





.panel.panel-informatin {
    background-color: rgba(255, 255, 255, 0.7);
}

.panel-informatin > .panel-heading {
    color: #3b5998;
    background-color: #e6edfd;
    /* border-color: #3b5998; */
    -webkit-box-shadow: 0 1px 3px 0px rgba(0, 0, 0, 0.2);
    /* box-shadow: 0 1px 2px 0px rgb(59, 89, 152); */
}

.panel-informatin {
}



.chart img {
    width: 100%;
}

.panel-heading .fa {
    margin-left: 12px;
}







.grid {
    min-height: 100px;
    background: rgba(255, 255, 255, 0.7);
    padding: 15px;
    -ms-box-shadow: 0 1px 3px 0px rgba(0, 0, 0, 0.2);
    -o-box-shadow: 0 1px 3px 0px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0 1px 3px 0px rgba(0, 0, 0, 0.2);
    -webkit-box-shadow: 0 1px 3px 0px rgba(0, 0, 0, 0.2);
    box-shadow: 0 1px 3px 0px rgba(0, 0, 0, 0.2);
    margin-bottom: 2em;
}

.secion-2 {
    padding: 25px;
}

/*--social-icons--*/
.top-comment-grid {
    max-height: 130px;
    overflow: hidden;
}

    .top-comment-grid:nth-child(2) {
        margin: 0px 0em;
    }

    .top-comment-grid:nth-child(3) {
        /*margin-right: 1em;*/
    }

.comments {
    background: #F96131;
    padding: 1em;
}

.comments-icon i.fa.fa-file-o,
.comments-icon i.fa.fa-file-text {
    font-size: 7em;
    color: rgba(255, 255, 255, 0.2);
    position: relative;
    top: 13px;
    left: 0;
}

.comments-icon i.fa.fa-users {
    font-size: 9em;
    color: rgba(255, 255, 255, 0.2);
    height: 100%;
    overflow: hidden;
    text-align: center;
    position: relative;
    bottom: 0;
    left: 0;
}

.comments-icon i.fa.fa-twitter {
    font-size: 5em;
    color: #9DCBEF;
}

.comments-icon i.fa.fa-eye {
    font-size: 5em;
    color: #2CCCAB;
}

.comments-icon {
    float: left;
    width: 30%;
}

.comments-info {
    float: left;
    margin-left: 1em;
    text-align: right;
    width: 65%;
    line-height: 1.5;
}

    .comments-info h3 {
        font-size: 4em;
        color: #FFF;
        margin: 0;
    }

    .comments-info a {
        font-size: 1.5em;
        color: #ffbda9 !important;
        margin: 0px !important;
        text-decoration: none;
        font-weight: 600;
    }

        .comments-info a:hover {
            color: #FFF !important;
        }

.likes {
    background: #3b5998;
}

.tweets {
    background: #55acee;
}

.views {
    background: #00a78e;
}

.likes-info a {
    color: #bad3ee !important;
    white-space: nowrap;
}

.tweets-info a {
    color: #9DCBEF !important;
}

.views-info a {
    color: #07CEB0 !important;
}

.comments-icon i.fa {
    -webkit-transition: .5s all;
    transition: .5s all;
    -moz-transition: .5s all;
}

.top-comment-grid:hover div.comments-icon i.fa {
    -webkit-transform: scale(3);
    transform: scale(2);
    -moz-transform: scale(3);
    -o-transform: scale(3);
    -ms-transform: scale(3);
    opacity: .3;
    -moz-opacity: .3;
}
/*--//social-icons--*/






















.info-tiles,
.shortcut-tiles {
    margin: 0px 0px 20px;
    display: block;
    border-radius: 1px;
}

a.info-tiles,
a.shortcut-tiles {
    background: none;
}

.info-tiles .tiles-heading {
    letter-spacing: 0.1em;
    padding: 6px 10px;
    border-top-right-radius: 1px;
    border-top-left-radius: 1px;
    text-transform: uppercase;
    text-align: center;
    font-size: 12px;
}

    .info-tiles .tiles-heading .pull-right {
        -webkit-transition: 0.06s ease-in;
        -o-transition: 0.06s ease-in;
        transition: 0.06s ease-in;
        color: rgba(255, 255, 255, 0.4);
    }

.info-tiles .tiles-body {
    font-size: 14px;
    border-bottom-right-radius: 1px;
    border-bottom-left-radius: 1px;
}

.info-tiles .tiles-body-alt {
    font-size: 48px;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}

.info-tiles .tiles-body-alt,
.info-tiles .tiles-body {
    padding: 6px 15px;
    font-weight: 300;
}

    .info-tiles .tiles-body-alt .sparkline,
    .info-tiles .tiles-body .sparkline {
        width: 100px;
        margin: 0 auto;
        padding: 0px;
    }

    .info-tiles .tiles-body-alt .text-top,
    .info-tiles .tiles-body .text-top {
        vertical-align: super;
        font-size: 24px;
    }

    .info-tiles .tiles-body-alt .text-smallcaps,
    .info-tiles .tiles-body .text-smallcaps {
        font-variant: small-caps;
    }

    .info-tiles .tiles-body-alt .text-center,
    .info-tiles .tiles-body .text-center {
        /* margin-top: -5px; */
    }

.text-center.num {
    font-size: 17px;
    letter-spacing: 1px;
}

.info-tiles .tiles-body-alt i,
.info-tiles .tiles-body i {
    font-size: 34px;
    color: rgba(255, 255, 255, 0.4);
    -webkit-transition: 0.06s ease-in;
    -o-transition: 0.06s ease-in;
    transition: 0.06s ease-in;
}

.info-tiles .tiles-body-alt > i,
.info-tiles .tiles-body > i {
    position: absolute;
    font-size: 42px;
}

.info-tiles .tiles-body-alt div + small,
.info-tiles .tiles-body div + small {
    font-size: 14px;
    text-align: center;
    display: block;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.7);
    margin-top: -7px;
    margin-bottom: 4px;
}

.info-tiles .tiles-footer {
    color: rgba(255, 255, 255, 0.7);
    padding: 5px 10px;
    border-bottom-right-radius: 1px;
    border-bottom-left-radius: 1px;
    min-height: 25px;
}

    .info-tiles .tiles-footer i {
        float: right;
        position: relative;
        top: 2px;
        display: none;
    }

    .info-tiles .tiles-footer:after {
        content: "";
        position: absolute;
        bottom: 0%;
        right: -1px;
        width: 0px;
        height: 0px;
        margin-right: 0px;
        margin-bottom: 0px;
        border-top: 5px solid rgba(0, 0, 0, 0.35);
        border-right: 5px solid #f7f8fa;
        border-bottom: 5px solid #f7f8fa;
        border-left: 5px solid rgba(0, 0, 0, 0.35);
        border-top-left-radius: 1px;
    }

    .info-tiles .tiles-footer:hover {
        color: #fff;
    }

.info-tiles:hover {
    text-decoration: none;
}

    .info-tiles:hover i {
        color: #ffffff;
    }

    .info-tiles:hover .tiles-footer {
        color: #fff;
    }

        .info-tiles:hover .tiles-footer i {
            display: inline;
        }

    .info-tiles:hover .tiles-heading .pull-right {
        color: #ffffff;
    }

@media screen and (-webkit-min-device-pixel-ratio: 0) {
    .info-tiles .tiles-footer:after {
        right: 0;
        border-top: 6px solid rgba(0, 0, 0, 0.35);
    }
}



.shortcut-tiles .tiles-body {
    padding: 10px 10px 0px 10px;
    font-size: 42px;
    line-height: 0px;
    padding-bottom: 0px;
}

    .shortcut-tiles .tiles-body span {
        position: relative;
        top: 16px;
        font-size: 25px;
        color: rgba(255, 255, 255, 0.8);
        -webkit-transition: 0.06s ease-in;
        -o-transition: 0.06s ease-in;
        transition: 0.06s ease-in;
    }

    .shortcut-tiles .tiles-body .pull-right {
    }

        .shortcut-tiles .tiles-body .pull-right .badge {
            background-color: #000000;
            background-color: rgba(0, 0, 0, 0.3);
            zoom: 1;
            background-color: transparent\9;
            -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#4d000000, endColorstr=#4d000000)";
            filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#4d000000, endColorstr=#4d000000);
        }

.shortcut-tiles .tiles-footer {
    text-transform: none;
    text-align: center;
    padding: 5px 10px;
    letter-spacing: 0.1em;
    font-size: 14px;
    text-transform: uppercase;
    border-bottom-right-radius: 1px;
    border-bottom-left-radius: 1px;
    max-height: 70px;
    min-height: 50px;
}

.shortcut-tiles:hover {
    text-decoration: none;
}

    .shortcut-tiles:hover i {
        color: #ffffff;
    }

.info-tiles.tiles-info {
    color: #ffffff !important;
}

    .info-tiles.tiles-info .tiles-heading {
        background: #4fc7e5;
    }

    .info-tiles.tiles-info .tiles-body {
        background: #2bbce0;
    }

    .info-tiles.tiles-info .tiles-body-alt {
        background: #2bbce0;
    }

    .info-tiles.tiles-info .tiles-footer {
        background: #1c9cbc;
    }

    .info-tiles.tiles-info:hover {
        color: #ffffff;
    }

        .info-tiles.tiles-info:hover .tiles-heading {
            background: #36c0e2;
        }

        .info-tiles.tiles-info:hover .tiles-body {
            background: #1fafd3;
        }

        .info-tiles.tiles-info:hover .tiles-body-alt {
            background: #1fafd3;
        }

        .info-tiles.tiles-info:hover .tiles-footer {
            background: #188aa6;
        }

.info-tiles.tiles-success {
    color: #ffffff !important;
}

    .info-tiles.tiles-success .tiles-heading {
        background: #99d063;
    }

    .info-tiles.tiles-success .tiles-body {
        background: #85c744;
    }

    .info-tiles.tiles-success .tiles-body-alt {
        background: #85c744;
    }

    .info-tiles.tiles-success .tiles-footer {
        background: #6ca632;
    }

    .info-tiles.tiles-success:hover {
        color: #ffffff;
    }

        .info-tiles.tiles-success:hover .tiles-heading {
            background: #8bca4e;
        }

        .info-tiles.tiles-success:hover .tiles-body {
            background: #78ba38;
        }

        .info-tiles.tiles-success:hover .tiles-body-alt {
            background: #78ba38;
        }

        .info-tiles.tiles-success:hover .tiles-footer {
            background: #5f932c;
        }

.info-tiles.tiles-danger {
    color: #ffffff !important;
}

    .info-tiles.tiles-danger .tiles-heading {
        background: #eb6060;
    }

    .info-tiles.tiles-danger .tiles-body {
        background: #e73c3c;
    }

    .info-tiles.tiles-danger .tiles-body-alt {
        background: #e73c3c;
    }

    .info-tiles.tiles-danger .tiles-footer {
        background: #d61a1a;
    }

    .info-tiles.tiles-danger:hover {
        color: #ffffff;
    }

        .info-tiles.tiles-danger:hover .tiles-heading {
            background: #e84747;
        }

        .info-tiles.tiles-danger:hover .tiles-body {
            background: #e42525;
        }

        .info-tiles.tiles-danger:hover .tiles-body-alt {
            background: #e42525;
        }

        .info-tiles.tiles-danger:hover .tiles-footer {
            background: #bf1818;
        }

.info-tiles.tiles-warning {
    color: #ffffff !important;
}

    .info-tiles.tiles-warning .tiles-heading {
        background: #f3cd36;
    }

    .info-tiles.tiles-warning .tiles-body {
        background: #f1c40f;
    }

    .info-tiles.tiles-warning .tiles-body-alt {
        background: #f1c40f;
    }

    .info-tiles.tiles-warning .tiles-footer {
        background: #c29d0b;
    }

    .info-tiles.tiles-warning:hover {
        color: #ffffff;
    }

        .info-tiles.tiles-warning:hover .tiles-heading {
            background: #f2c71b;
        }

        .info-tiles.tiles-warning:hover .tiles-body {
            background: #dab10d;
        }

        .info-tiles.tiles-warning:hover .tiles-body-alt {
            background: #dab10d;
        }

        .info-tiles.tiles-warning:hover .tiles-footer {
            background: #aa8a0a;
        }

.info-tiles.tiles-primary {
    color: #ffffff !important;
}

    .info-tiles.tiles-primary .tiles-heading {
        background: #71a4e3;
    }

    .info-tiles.tiles-primary .tiles-body {
        background: #4f8edc;
    }

    .info-tiles.tiles-primary .tiles-body-alt {
        background: #4f8edc;
    }

    .info-tiles.tiles-primary .tiles-footer {
        background: #2973cf;
    }

    .info-tiles.tiles-primary:hover {
        color: #ffffff;
    }

        .info-tiles.tiles-primary:hover .tiles-heading {
            background: #5a95de;
        }

        .info-tiles.tiles-primary:hover .tiles-body {
            background: #3a80d8;
        }

        .info-tiles.tiles-primary:hover .tiles-body-alt {
            background: #3a80d8;
        }

        .info-tiles.tiles-primary:hover .tiles-footer {
            background: #2567ba;
        }

.info-tiles.tiles-inverse {
    color: #ffffff !important;
}

    .info-tiles.tiles-inverse .tiles-heading {
        background: #62666f;
    }

    .info-tiles.tiles-inverse .tiles-body {
        background: #4f5259;
    }

    .info-tiles.tiles-inverse .tiles-body-alt {
        background: #4f5259;
    }

    .info-tiles.tiles-inverse .tiles-footer {
        background: #37393e;
    }

    .info-tiles.tiles-inverse:hover {
        color: #ffffff;
    }

        .info-tiles.tiles-inverse:hover .tiles-heading {
            background: #555860;
        }

        .info-tiles.tiles-inverse:hover .tiles-body {
            background: #43464b;
        }

        .info-tiles.tiles-inverse:hover .tiles-body-alt {
            background: #43464b;
        }

        .info-tiles.tiles-inverse:hover .tiles-footer {
            background: #2b2d30;
        }

.info-tiles.tiles-midnightblue {
    color: #ffffff !important;
}

    .info-tiles.tiles-midnightblue .tiles-heading {
        background: #435d78;
    }

    .info-tiles.tiles-midnightblue .tiles-body {
        background: #34495e;
    }

    .info-tiles.tiles-midnightblue .tiles-body-alt {
        background: #34495e;
    }

    .info-tiles.tiles-midnightblue .tiles-footer {
        background: #222f3d;
    }

    .info-tiles.tiles-midnightblue:hover {
        color: #ffffff;
    }

        .info-tiles.tiles-midnightblue:hover .tiles-heading {
            background: #394f66;
        }

        .info-tiles.tiles-midnightblue:hover .tiles-body {
            background: #2b3c4e;
        }

        .info-tiles.tiles-midnightblue:hover .tiles-body-alt {
            background: #2b3c4e;
        }

        .info-tiles.tiles-midnightblue:hover .tiles-footer {
            background: #19232d;
        }

.info-tiles.tiles-sky {
    color: #ffffff !important;
}

    .info-tiles.tiles-sky .tiles-heading {
        background: #9ad4f2;
    }

    .info-tiles.tiles-sky .tiles-body {
        background: #76c4ed;
    }

    .info-tiles.tiles-sky .tiles-body-alt {
        background: #76c4ed;
    }

    .info-tiles.tiles-sky .tiles-footer {
        background: #49b1e7;
    }

    .info-tiles.tiles-sky:hover {
        color: #ffffff;
    }

        .info-tiles.tiles-sky:hover .tiles-heading {
            background: #81c9ee;
        }

        .info-tiles.tiles-sky:hover .tiles-body {
            background: #5fbaea;
        }

        .info-tiles.tiles-sky:hover .tiles-body-alt {
            background: #5fbaea;
        }

        .info-tiles.tiles-sky:hover .tiles-footer {
            background: #32a7e4;
        }

.info-tiles.tiles-orange {
    color: #ffffff !important;
}

    .info-tiles.tiles-orange .tiles-heading {
        background: #f2b257;
    }

    .info-tiles.tiles-orange .tiles-body {
        background: #efa131;
    }

    .info-tiles.tiles-orange .tiles-body-alt {
        background: #efa131;
    }

    .info-tiles.tiles-orange .tiles-footer {
        background: #dc8911;
    }

    .info-tiles.tiles-orange:hover {
        color: #ffffff;
    }

        .info-tiles.tiles-orange:hover .tiles-heading {
            background: #f0a63d;
        }

        .info-tiles.tiles-orange:hover .tiles-body {
            background: #ed9619;
        }

        .info-tiles.tiles-orange:hover .tiles-body-alt {
            background: #ed9619;
        }

        .info-tiles.tiles-orange:hover .tiles-footer {
            background: #c47a0f;
        }

.info-tiles.tiles-indigo {
    color: #ffffff !important;
}

    .info-tiles.tiles-indigo .tiles-heading {
        background: #a573ba;
    }

    .info-tiles.tiles-indigo .tiles-body {
        background: #9358ac;
    }

    .info-tiles.tiles-indigo .tiles-body-alt {
        background: #9358ac;
    }

    .info-tiles.tiles-indigo .tiles-footer {
        background: #77458c;
    }

    .info-tiles.tiles-indigo:hover {
        color: #ffffff;
    }

        .info-tiles.tiles-indigo:hover .tiles-heading {
            background: #9961b0;
        }

        .info-tiles.tiles-indigo:hover .tiles-body {
            background: #854e9d;
        }

        .info-tiles.tiles-indigo:hover .tiles-body-alt {
            background: #854e9d;
        }

        .info-tiles.tiles-indigo:hover .tiles-footer {
            background: #683d7b;
        }

.info-tiles.tiles-green {
    color: #ffffff !important;
}

    .info-tiles.tiles-green .tiles-heading {
        background: #1bc4a3;
    }

    .info-tiles.tiles-green .tiles-body {
        background: #16a085;
    }

    .info-tiles.tiles-green .tiles-body-alt {
        background: #16a085;
    }

    .info-tiles.tiles-green .tiles-footer {
        background: #107360;
    }

    .info-tiles.tiles-green:hover {
        color: #ffffff;
    }

        .info-tiles.tiles-green:hover .tiles-heading {
            background: #18ab8e;
        }

        .info-tiles.tiles-green:hover .tiles-body {
            background: #138a72;
        }

        .info-tiles.tiles-green:hover .tiles-body-alt {
            background: #138a72;
        }

        .info-tiles.tiles-green:hover .tiles-footer {
            background: #0d5d4d;
        }

.info-tiles.tiles-magenta {
    color: #ffffff !important;
}

    .info-tiles.tiles-magenta .tiles-heading {
        background: #eb6084;
    }

    .info-tiles.tiles-magenta .tiles-body {
        background: #e73c68;
    }

    .info-tiles.tiles-magenta .tiles-body-alt {
        background: #e73c68;
    }

    .info-tiles.tiles-magenta .tiles-footer {
        background: #d61a4b;
    }

    .info-tiles.tiles-magenta:hover {
        color: #ffffff;
    }

        .info-tiles.tiles-magenta:hover .tiles-heading {
            background: #e84771;
        }

        .info-tiles.tiles-magenta:hover .tiles-body {
            background: #e42556;
        }

        .info-tiles.tiles-magenta:hover .tiles-body-alt {
            background: #e42556;
        }

        .info-tiles.tiles-magenta:hover .tiles-footer {
            background: #bf1843;
        }

.info-tiles.tiles-purple {
    color: #ffffff !important;
}

    .info-tiles.tiles-purple .tiles-heading {
        background: #e667bb;
    }

    .info-tiles.tiles-purple .tiles-body {
        background: #e044ab;
    }

    .info-tiles.tiles-purple .tiles-body-alt {
        background: #e044ab;
    }

    .info-tiles.tiles-purple .tiles-footer {
        background: #cf2294;
    }

    .info-tiles.tiles-purple:hover {
        color: #ffffff;
    }

        .info-tiles.tiles-purple:hover .tiles-heading {
            background: #e24fb0;
        }

        .info-tiles.tiles-purple:hover .tiles-body {
            background: #dc2ea1;
        }

        .info-tiles.tiles-purple:hover .tiles-body-alt {
            background: #dc2ea1;
        }

        .info-tiles.tiles-purple:hover .tiles-footer {
            background: #b91f84;
        }

.info-tiles.tiles-brown {
    color: #ffffff !important;
}

    .info-tiles.tiles-brown .tiles-heading {
        background: #d44e40;
    }

    .info-tiles.tiles-brown .tiles-body {
        background: #c0392b;
    }

    .info-tiles.tiles-brown .tiles-body-alt {
        background: #c0392b;
    }

    .info-tiles.tiles-brown .tiles-footer {
        background: #962d22;
    }

    .info-tiles.tiles-brown:hover {
        color: #ffffff;
    }

        .info-tiles.tiles-brown:hover .tiles-heading {
            background: #ca3c2d;
        }

        .info-tiles.tiles-brown:hover .tiles-body {
            background: #ab3326;
        }

        .info-tiles.tiles-brown:hover .tiles-body-alt {
            background: #ab3326;
        }

        .info-tiles.tiles-brown:hover .tiles-footer {
            background: #81261d;
        }

.info-tiles.tiles-grape {
    color: #ffffff !important;
}

    .info-tiles.tiles-grape .tiles-heading {
        background: #919bad;
    }

    .info-tiles.tiles-grape .tiles-body {
        background: #7a869c;
    }

    .info-tiles.tiles-grape .tiles-body-alt {
        background: #7a869c;
    }

    .info-tiles.tiles-grape .tiles-footer {
        background: #616d82;
    }

    .info-tiles.tiles-grape:hover {
        color: #ffffff;
    }

        .info-tiles.tiles-grape:hover .tiles-heading {
            background: #818da1;
        }

        .info-tiles.tiles-grape:hover .tiles-body {
            background: #6c7991;
        }

        .info-tiles.tiles-grape:hover .tiles-body-alt {
            background: #6c7991;
        }

        .info-tiles.tiles-grape:hover .tiles-footer {
            background: #566074;
        }

.info-tiles.tiles-toyo {
    color: #ffffff !important;
}

    .info-tiles.tiles-toyo .tiles-heading {
        background: #677fa4;
    }

    .info-tiles.tiles-toyo .tiles-body {
        background: #556b8d;
    }

    .info-tiles.tiles-toyo .tiles-body-alt {
        background: #556b8d;
    }

    .info-tiles.tiles-toyo .tiles-footer {
        background: #42536d;
    }

    .info-tiles.tiles-toyo:hover {
        color: #ffffff;
    }

        .info-tiles.tiles-toyo:hover .tiles-heading {
            background: #5a7195;
        }

        .info-tiles.tiles-toyo:hover .tiles-body {
            background: #4b5f7d;
        }

        .info-tiles.tiles-toyo:hover .tiles-body-alt {
            background: #4b5f7d;
        }

        .info-tiles.tiles-toyo:hover .tiles-footer {
            background: #38475d;
        }

.info-tiles.tiles-alizarin {
    color: #ffffff !important;
}

    .info-tiles.tiles-alizarin .tiles-heading {
        background: #eb6d60;
    }

    .info-tiles.tiles-alizarin .tiles-body {
        background: #e74c3c;
    }

    .info-tiles.tiles-alizarin .tiles-body-alt {
        background: #e74c3c;
    }

    .info-tiles.tiles-alizarin .tiles-footer {
        background: #d62c1a;
    }

    .info-tiles.tiles-alizarin:hover {
        color: #ffffff;
    }

        .info-tiles.tiles-alizarin:hover .tiles-heading {
            background: #e85647;
        }

        .info-tiles.tiles-alizarin:hover .tiles-body {
            background: #e43725;
        }

        .info-tiles.tiles-alizarin:hover .tiles-body-alt {
            background: #e43725;
        }

        .info-tiles.tiles-alizarin:hover .tiles-footer {
            background: #bf2718;
        }

.shortcut-tiles.tiles-info {
    color: #ffffff !important;
}

    .shortcut-tiles.tiles-info .tiles-heading,
    .shortcut-tiles.tiles-info .tiles-body,
    .shortcut-tiles.tiles-info .tiles-footer {
        background: #2bbce0;
    }

    .shortcut-tiles.tiles-info:hover {
        color: #ffffff;
    }

        .shortcut-tiles.tiles-info:hover .tiles-heading,
        .shortcut-tiles.tiles-info:hover .tiles-body,
        .shortcut-tiles.tiles-info:hover .tiles-footer {
            background: #1fafd3;
        }

.shortcut-tiles.tiles-success {
    color: #ffffff !important;
}

    .shortcut-tiles.tiles-success .tiles-heading,
    .shortcut-tiles.tiles-success .tiles-body,
    .shortcut-tiles.tiles-success .tiles-footer {
        background: #85c744;
    }

    .shortcut-tiles.tiles-success:hover {
        color: #ffffff;
    }

        .shortcut-tiles.tiles-success:hover .tiles-heading,
        .shortcut-tiles.tiles-success:hover .tiles-body,
        .shortcut-tiles.tiles-success:hover .tiles-footer {
            background: #78ba38;
        }

.shortcut-tiles.tiles-danger {
    color: #ffffff !important;
}

    .shortcut-tiles.tiles-danger .tiles-heading,
    .shortcut-tiles.tiles-danger .tiles-body,
    .shortcut-tiles.tiles-danger .tiles-footer {
        background: #e73c3c;
    }

    .shortcut-tiles.tiles-danger:hover {
        color: #ffffff;
    }

        .shortcut-tiles.tiles-danger:hover .tiles-heading,
        .shortcut-tiles.tiles-danger:hover .tiles-body,
        .shortcut-tiles.tiles-danger:hover .tiles-footer {
            background: #e42525;
        }

.shortcut-tiles.tiles-warning {
    color: #ffffff !important;
}

    .shortcut-tiles.tiles-warning .tiles-heading,
    .shortcut-tiles.tiles-warning .tiles-body,
    .shortcut-tiles.tiles-warning .tiles-footer {
        background: #f1c40f;
    }

    .shortcut-tiles.tiles-warning:hover {
        color: #ffffff;
    }

        .shortcut-tiles.tiles-warning:hover .tiles-heading,
        .shortcut-tiles.tiles-warning:hover .tiles-body,
        .shortcut-tiles.tiles-warning:hover .tiles-footer {
            background: #dab10d;
        }

.shortcut-tiles.tiles-primary {
    color: #ffffff !important;
}

    .shortcut-tiles.tiles-primary .tiles-heading,
    .shortcut-tiles.tiles-primary .tiles-body,
    .shortcut-tiles.tiles-primary .tiles-footer {
        background: #4f8edc;
    }

    .shortcut-tiles.tiles-primary:hover {
        color: #ffffff;
    }

        .shortcut-tiles.tiles-primary:hover .tiles-heading,
        .shortcut-tiles.tiles-primary:hover .tiles-body,
        .shortcut-tiles.tiles-primary:hover .tiles-footer {
            background: #3a80d8;
        }

.shortcut-tiles.tiles-inverse {
    color: #ffffff !important;
}

    .shortcut-tiles.tiles-inverse .tiles-heading,
    .shortcut-tiles.tiles-inverse .tiles-body,
    .shortcut-tiles.tiles-inverse .tiles-footer {
        background: #4f5259;
    }

    .shortcut-tiles.tiles-inverse:hover {
        color: #ffffff;
    }

        .shortcut-tiles.tiles-inverse:hover .tiles-heading,
        .shortcut-tiles.tiles-inverse:hover .tiles-body,
        .shortcut-tiles.tiles-inverse:hover .tiles-footer {
            background: #43464b;
        }

.shortcut-tiles.tiles-midnightblue {
    color: #ffffff !important;
}

    .shortcut-tiles.tiles-midnightblue .tiles-heading,
    .shortcut-tiles.tiles-midnightblue .tiles-body,
    .shortcut-tiles.tiles-midnightblue .tiles-footer {
        background: #34495e;
    }

    .shortcut-tiles.tiles-midnightblue:hover {
        color: #ffffff;
    }

        .shortcut-tiles.tiles-midnightblue:hover .tiles-heading,
        .shortcut-tiles.tiles-midnightblue:hover .tiles-body,
        .shortcut-tiles.tiles-midnightblue:hover .tiles-footer {
            background: #2b3c4e;
        }

.shortcut-tiles.tiles-sky {
    color: #ffffff !important;
}

    .shortcut-tiles.tiles-sky .tiles-heading,
    .shortcut-tiles.tiles-sky .tiles-body,
    .shortcut-tiles.tiles-sky .tiles-footer {
        background: #76c4ed;
    }

    .shortcut-tiles.tiles-sky:hover {
        color: #ffffff;
    }

        .shortcut-tiles.tiles-sky:hover .tiles-heading,
        .shortcut-tiles.tiles-sky:hover .tiles-body,
        .shortcut-tiles.tiles-sky:hover .tiles-footer {
            background: #5fbaea;
        }

.shortcut-tiles.tiles-orange {
    color: #ffffff !important;
}

    .shortcut-tiles.tiles-orange .tiles-heading,
    .shortcut-tiles.tiles-orange .tiles-body,
    .shortcut-tiles.tiles-orange .tiles-footer {
        background: #f0ad4e;
    }

    .shortcut-tiles.tiles-orange:hover {
        color: #ffffff;
    }

        .shortcut-tiles.tiles-orange:hover .tiles-heading,
        .shortcut-tiles.tiles-orange:hover .tiles-body,
        .shortcut-tiles.tiles-orange:hover .tiles-footer {
            background: #dfa046;
        }

.shortcut-tiles.tiles-indigo {
    color: #ffffff !important;
}

    .shortcut-tiles.tiles-indigo .tiles-heading,
    .shortcut-tiles.tiles-indigo .tiles-body,
    .shortcut-tiles.tiles-indigo .tiles-footer {
        background: #9358ac;
    }

    .shortcut-tiles.tiles-indigo:hover {
        color: #ffffff;
    }

        .shortcut-tiles.tiles-indigo:hover .tiles-heading,
        .shortcut-tiles.tiles-indigo:hover .tiles-body,
        .shortcut-tiles.tiles-indigo:hover .tiles-footer {
            background: rgb(133, 78, 157);
        }

.shortcut-tiles.tiles-green {
    color: #ffffff !important;
}

    .shortcut-tiles.tiles-green .tiles-heading,
    .shortcut-tiles.tiles-green .tiles-body,
    .shortcut-tiles.tiles-green .tiles-footer {
        background: #26B99A;
    }

    .shortcut-tiles.tiles-green:hover {
        color: #ffffff;
    }

        .shortcut-tiles.tiles-green:hover .tiles-heading,
        .shortcut-tiles.tiles-green:hover .tiles-body,
        .shortcut-tiles.tiles-green:hover .tiles-footer {
            background: #1ca88a;
        }

.shortcut-tiles.tiles-magenta {
    color: #ffffff !important;
}

    .shortcut-tiles.tiles-magenta .tiles-heading,
    .shortcut-tiles.tiles-magenta .tiles-body,
    .shortcut-tiles.tiles-magenta .tiles-footer {
        background: #e73c68;
    }

    .shortcut-tiles.tiles-magenta:hover {
        color: #ffffff;
    }

        .shortcut-tiles.tiles-magenta:hover .tiles-heading,
        .shortcut-tiles.tiles-magenta:hover .tiles-body,
        .shortcut-tiles.tiles-magenta:hover .tiles-footer {
            background: #e42556;
        }

.shortcut-tiles.tiles-purple {
    color: #ffffff !important;
}

    .shortcut-tiles.tiles-purple .tiles-heading,
    .shortcut-tiles.tiles-purple .tiles-body,
    .shortcut-tiles.tiles-purple .tiles-footer {
        background: #e044ab;
    }

    .shortcut-tiles.tiles-purple:hover {
        color: #ffffff;
    }

        .shortcut-tiles.tiles-purple:hover .tiles-heading,
        .shortcut-tiles.tiles-purple:hover .tiles-body,
        .shortcut-tiles.tiles-purple:hover .tiles-footer {
            background: #dc2ea1;
        }

.shortcut-tiles.tiles-brown {
    color: #ffffff !important;
}

    .shortcut-tiles.tiles-brown .tiles-heading,
    .shortcut-tiles.tiles-brown .tiles-body,
    .shortcut-tiles.tiles-brown .tiles-footer {
        background: #c0392b;
    }

    .shortcut-tiles.tiles-brown:hover {
        color: #ffffff;
    }

        .shortcut-tiles.tiles-brown:hover .tiles-heading,
        .shortcut-tiles.tiles-brown:hover .tiles-body,
        .shortcut-tiles.tiles-brown:hover .tiles-footer {
            background: #ab3326;
        }

.shortcut-tiles.tiles-grape {
    color: #ffffff !important;
}

    .shortcut-tiles.tiles-grape .tiles-heading,
    .shortcut-tiles.tiles-grape .tiles-body,
    .shortcut-tiles.tiles-grape .tiles-footer {
        background: #7a869c;
    }

    .shortcut-tiles.tiles-grape:hover {
        color: #ffffff;
    }

        .shortcut-tiles.tiles-grape:hover .tiles-heading,
        .shortcut-tiles.tiles-grape:hover .tiles-body,
        .shortcut-tiles.tiles-grape:hover .tiles-footer {
            background: #6c7991;
        }

.shortcut-tiles.tiles-toyo {
    color: #ffffff !important;
}

    .shortcut-tiles.tiles-toyo .tiles-heading,
    .shortcut-tiles.tiles-toyo .tiles-body,
    .shortcut-tiles.tiles-toyo .tiles-footer {
        background: #556b8d;
    }

    .shortcut-tiles.tiles-toyo:hover {
        color: #ffffff;
    }

        .shortcut-tiles.tiles-toyo:hover .tiles-heading,
        .shortcut-tiles.tiles-toyo:hover .tiles-body,
        .shortcut-tiles.tiles-toyo:hover .tiles-footer {
            background: #4b5f7d;
        }

.shortcut-tiles.tiles-alizarin {
    color: #ffffff !important;
}

    .shortcut-tiles.tiles-alizarin .tiles-heading,
    .shortcut-tiles.tiles-alizarin .tiles-body,
    .shortcut-tiles.tiles-alizarin .tiles-footer {
        background: #e74c3c;
    }

    .shortcut-tiles.tiles-alizarin:hover {
        color: #ffffff;
    }

        .shortcut-tiles.tiles-alizarin:hover .tiles-heading,
        .shortcut-tiles.tiles-alizarin:hover .tiles-body,
        .shortcut-tiles.tiles-alizarin:hover .tiles-footer {
            background: #e43725;
        }

.panel-comments,
.panel-threads,
.panel-users {
    padding-left: 0;
    list-style: none;
    margin-bottom: 20px;
}

    .panel-comments li,
    .panel-threads li,
    .panel-users li {
        display: block;
        margin-left: -20px;
        margin-right: -20px;
        padding: 20px 20px;
        border-bottom: 1px solid #e6e7e8;
    }

        .panel-comments li:before,
        .panel-threads li:before,
        .panel-users li:before,
        .panel-comments li:after,
        .panel-threads li:after,
        .panel-users li:after {
            content: " ";
            display: table;
        }

        .panel-comments li:after,
        .panel-threads li:after,
        .panel-users li:after {
            clear: both;
        }

        .panel-comments li:before,
        .panel-threads li:before,
        .panel-users li:before,
        .panel-comments li:after,
        .panel-threads li:after,
        .panel-users li:after {
            content: " ";
            display: table;
        }

        .panel-comments li:after,
        .panel-threads li:after,
        .panel-users li:after {
            clear: both;
        }

#domshortcuttiles .badge {
    width: auto;
    height: 30px;
    padding: 8px 7px 25px 7px;
    border-radius: 15px;
    background-color: rgba(0, 0, 0, 0.26);
    position: relative;
    font-size: 12px;
    top: 3px;
}

.reports {
    padding: 0px 3px 0px 3px;
    /*height:140px*/
}

.reports1 {
    padding: 0px 3px 0px 3px;
    height: 140px;
}

.rep_height {
    height: 50px;
}

.titles_height {
    height: 60px;
}

div#domshortcuttiles {
    padding: 5px 15px 0px 15px;
}


























.cbp-l-filters-button {
    text-align: center;
}

    .cbp-l-filters-button, .cbp-l-filters-button * {
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        outline: 0;
    }

        .cbp-l-filters-button .cbp-filter-item {
            background-color: #0c508d;
            border: 1px solid #0c508d;
            border-radius: 2px;
            color: rgba(255, 255, 255, 0.75);
            margin: 6px 0px 0 0;
            padding: 3px 10px;
            position: relative;
            display: inline-block;
            -webkit-transition: all .3s ease-in-out;
            transition: all .3s ease-in-out;
        }

        .cbp-l-filters-button .cbp-filter-counter {
            background-color: #4D4C4D;
            border-radius: 3px;
            color: #fff;
            font: 400 11px/18px 'Droid Arabic Kufi', sans-serif;
            margin: 0 auto;
            padding: 4px 0;
            text-align: center;
            width: 34px;
            position: absolute;
            bottom: 0;
            left: 0;
            right: 0;
            opacity: 0;
            -ms-filter: "alpha(Opacity=0)";
            -webkit-transition: opacity .25s ease, bottom .25s ease;
            transition: opacity .25s ease, bottom .25s ease;
        }

        .cbp-l-filters-button .cbp-filter-item:hover {
            color: #ffffff;
        }

            .cbp-l-filters-button .cbp-filter-item:hover .cbp-filter-counter {
                bottom: 30px;
                -ms-filter: "alpha(Opacity=100)";
                opacity: 1;
            }

        .cbp-l-filters-button .cbp-filter-item.cbp-filter-item-active {
            background-color: #4D4C4D;
            color: #fff;
            border-color: #4D4C4D;
            cursor: default;
        }

        .cbp-l-filters-button .cbp-filter-item:hover .cbp-filter-counter:before {
            display: block;
        }

        .cbp-l-filters-button .cbp-filter-counter:before {
            content: "";
            position: absolute;
            bottom: -4px;
            left: 0;
            right: 0;
            margin: 0 auto;
            width: 0;
            height: 0;
            border-left: 4px solid transparent;
            border-right: 4px solid transparent;
            border-top: 4px solid #4D4C4D;
            display: none;
        }


.progect-process h3 {
    font-size: 20px;
    margin-bottom: 22px;
}

.process-one {
    background-color: #8db3da;
    position: relative;
    padding: 15px;
    -webkit-transition: .5s all;
    transition: .5s all;
    -moz-transition: .5s all;
}

    .process-one:hover {
        background-color: #6f93b7;
    }

.process-two {
    background-color: #d2be81;
    position: relative;
    padding: 15px;
    -webkit-transition: .5s all;
    transition: .5s all;
    -moz-transition: .5s all;
}

    .process-two:hover {
        background-color: #d4b75f;
    }

    .process-two .btn-primary {
        background-color: #f60;
        border-color: #de5900;
    }



.process-three {
    background-color: #8dbb8f;
    position: relative;
    padding: 15px;
    -webkit-transition: .5s all;
    transition: .5s all;
    -moz-transition: .5s all;
}

    .process-three:hover {
        background-color: #82af84;
    }







.dr-holder-toggle {
    position: absolute;
    width: 30px;
    height: 100px;
    right: -30px;
    top: 30%;
    border-radius: 0;
    border: 0;
    background-color: #0c508d;
    color: #ffffff;
    font-size: 24px;
    text-align: center;
    line-height: 60px;
    padding: 0;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}

.dr-holder-inner {
    padding: 20px;
}

    .dr-holder-inner h3 {
        font-size: 16px;
        color: #2397ff;
        font-weight: 600;
        margin-bottom: 15px;
        margin-top: 0px;
    }

    .dr-holder-inner p {
        font-size: 12px;
    }

.btn-primary.btn-o {
    color: #e67e22;
    border: solid 2px #e67e22;
}

    .btn-primary.btn-o:hover, .btn-primary.btn-o:focus, .btn-primary.btn-o:active {
        background-color: #e67e22;
    }

.dr-holder.active {
    left: 0px;
}

.dr-holder.in {
    display: block;
}

.dr-holder {
    position: absolute;
    display: none;
    top: 200px;
    left: -220px;
    width: 220px;
    height: auto;
    padding: 0;
    z-index: 999;
    background-color: #ffffff;
    color: #fff;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
    transition: all .6s ease;
    min-height: 210px;
    border: 3px solid #0c508d;
}


.post-meta {
    font-size: 14px;
    margin-bottom: 7px;
    color: #4e4e4e;
    text-align: right;
    padding: 0;
}

    .post-meta > li {
        display: inline-block;
        text-align: right;
        font-size: 12px;
        line-height: 1.9;
        margin-bottom: 9px;
    }

    .post-meta i.fa.fa-check {
        margin-right: 3px;
        background-color: #0eaf44;
        width: 18px;
        height: 18px;
        border-radius: 9px;
        color: #fff;
        line-height: 1.8;
        font-size: 11px;
        text-align: center;
    }

i.fa.fa-check.late-task {
    background-color: red;
}


.nav-justified > li {
    float: none;
}

.nav-pills > li.active > a, .nav-pills > li.active > a:hover, .nav-pills > li.active > a:focus {
    color: #ffffff;
    background-color: #59af5c;
}

.list-group-item-heading {
    margin-top: 0;
    margin-bottom: 5px;
}

.nav-pills > li.active > a:after, .nav-pills > li.active > a:hover:after, .nav-pills > li.active > a:focus:after {
    width: 0px;
    height: 0px;
    border-style: solid;
    border-width: 9px 9px 9px 0;
    border-color: transparent #59af5c transparent transparent;
    content: "";
    position: absolute;
    top: 50%;
    margin-top: -9px;
    left: -9px;
}



.result-bg {
    background-color: rgba(255, 255, 255, 0.3);
    border: 1px solid #b9d1ec;
    padding: 10px;
    margin-right: 15px;
    margin-left: 15px;
    margin-top: 15px;
}

.project-position {
    font-size: 16px;
    font-weight: bold;
    color: #46ad5d;
}

.result-bg .form-horizontal .control-label {
    padding-top: 7px;
    margin-bottom: 0;
    text-align: right;
}

.table-result {
    margin: 0 auto;
    margin-top: 5px;
}

    .table-result thead {
        font-weight: bold;
    }

    .table-result thead tr:first-child {
        font-weight: bold;
        color: #0c508d;
        border-bottom: 2px solid #666;
    }

.table-title h2 {
    font-size: 20px;
    font-weight: bold;
    color: green;
}

.table-result th,
.table-result td {
    text-align: center;
    padding: 10px 20px 10px 20px;
    border: thin solid black;
}

.stage-name {
    display: inline-block;
}

    .stage-name label.control-label.ng-binding {
        color: green;
        font-size: 15px;
    }



.head-events {
    border-left: 1px solid #adadad;
    color: green;
    height: 30px;
}


.table-result .table-bordered > thead > tr > th, .table-bordered > tbody > tr > th, .table-bordered > tfoot > tr > th, .table-bordered > thead > tr > td, .table-bordered > tbody > tr > td, .table-bordered > tfoot > tr > td {
    border: 1px solid #848484;
}

.table-hover > tbody > tr:hover > td, .table-hover > tbody > tr:hover > th {
    background-color: rgba(245, 245, 245, 0.65);
}

.tbl.table-bordered.table-responsive.table-hover.table-result thead {
    color: green;
    font-weight: bold;
}


label.control-label:before {
    /*content: "-";
    padding-left: 5px;*/
}

.form-group div label:before {
    content: none !important;
}

.form-group div label:before {
    content: none !important;
}

.panel.panel-info.search {
    margin: 0px -15px 0 -15px;
}

    .panel.panel-info.search .panel-title {
        padding-right: 3px;
        line-height: 3;
    }

    .panel.panel-info.search > .panel-heading {
        color: #FFFFFF;
        background-color: #4da1e2;
        border-color: #0c508d;
    }

    .panel.panel-info.search > .panel-heading {
        font-size: 18px;
        font-weight: 300;
        letter-spacing: 0.025em;
        height: 50px;
        line-height: 45px;
    }

.reports-btn {
    text-align: center;
}

    .reports-btn .btn-primary {
        margin-bottom: 10px;
    }

.breadcrumb {
    border-radius: 0;
    padding: 10px 15px;
    background: rgba(255, 255, 255, 0.7);
    box-shadow: 0 1px 1px rgba(12, 80, 141, 0.51);
    margin: 0;
    margin-bottom: 15px;
    font-weight: bold;
}

.form-horizontal .control-label {
    padding-top: 7px;
    margin-bottom: 0;
    text-align: right !important;
}

input#ExecuteBtn {
    padding: 6px 17px 6px 17px;
    border-radius: 3px;
    background-color: #0c508d;
    border: 1px solid #0c508d;
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    -webkit-transition: .3s all;
    transition: .3s all;
    -moz-transition: .3s all;
}

    input#ExecuteBtn:hover {
        background-color: rgba(12, 80, 141, 0.8);
    }

input#CancelBtn {
    padding: 6px 17px 6px 17px;
    border-radius: 3px;
    background-color: rgba(255, 255, 255, 0.8);
    border: 1px solid rgba(12, 80, 141, 0.65);
    color: #0c508d;
    font-size: 14px;
    font-weight: 600;
    -webkit-transition: .3s all;
    transition: .3s all;
    -moz-transition: .3s all;
}

    input#CancelBtn:hover {
        background-color: rgba(224, 224, 224, 0.3);
    }

.project-list {
    margin-bottom: 30px;
}



.chart-bg {
    padding: 10px;
    margin: 10px;
    border: 1px solid #e6edfd;
    -webkit-box-shadow: 0 1px 3px 0px rgba(0, 0, 0, 0.2);
    width: 48%;
}


input#CancelBtn {
    padding: 6px 17px 6px 17px;
    border-radius: 3px;
    background-color: rgba(255, 255, 255, 0.8);
    border: 1px solid rgba(12, 80, 141, 0.65);
    color: #0c508d;
    font-size: 14px;
    font-weight: 600;
    -webkit-transition: .3s all;
    transition: .3s all;
    -moz-transition: .3s all;
}

    input#CancelBtn:hover {
        background-color: rgba(224, 224, 224, 0.3);
    }

.project-list {
    margin-bottom: 30px;
}



.chart-bg {
    padding: 10px;
    margin: 10px;
    border: 1px solid #e6edfd;
    -webkit-box-shadow: 0 1px 3px 0px rgba(0, 0, 0, 0.2);
    width: 48%;
}

    .chart-bg h5 {
        border-bottom: 1px solid #bbb;
        width: 100%;
        text-align: center;
        padding: 10px;
        display: block;
        margin: 0 auto;
        font-weight: bold;
        color: #3b5998;
        font-size: 16px;
        box-shadow: 0px 1px 0px rgba(223, 227, 233, 0.99);
    }





.panel.panel-primary.text-center.no-boder {
    color: #30333a;
    -webkit-box-shadow: 0 1px 3px 0px rgba(0, 0, 0, 0.2);
    display: block;
}

a.panel.panel-primary.text-center.no-boder:hover {
    text-decoration: none;
    color: #4f5259;
}
.panel.panel-primary.text-center.no-boder h4 {
    line-height: 1.5;
}

.yellow {
    background-color: rgb(236, 247, 104);
}

.blue {
    background-color: rgb(113, 159, 241);
}

.green {
    background-color: rgb(144, 236, 192);
}

.red {
    background-color: rgb(236, 193, 131);
}


















@media (max-width: 1200px) {
    .comments-info {
    width: 62%;
}
    .comments-icon i.fa.fa-users {
        font-size: 8em;
    }
    .comments-icon i.fa.fa-file-o, .comments-icon i.fa.fa-file-text {
        font-size: 6em;
    }
    .comments-info a {
        font-size: 1.2em;
    }
}

    @media (max-width: 991px) {
    .chart-bg {
        width: auto !important;
    }

    .timeline-month {
        width: 100%;
        text-align: center;
        margin-left: 0;
        left: 0;
    }
     .timeline-month {
        width: 100%;
        text-align: center;
        margin-left: 0;
        left: 0;
    }

        .timeline-month span {
            display: inline !important;
        }

    .timeline:before {
        width: 0;
        left: 0;
    }

    .timeline > li {
        margin-top: 20px;
    }

        .timeline > li:first-child {
            margin-top: 0;
        }

        .timeline > li .timeline-body {
            margin: 0 !important;
        }

            .timeline > li .timeline-body:after {
                border-width: 0;
            }

        .timeline > li .timeline-icon {
            width: 30px;
            height: 30px;
            line-height: 30px;
            font-size: 1em;
            margin: 20px 50px 0 0;
            position: relative;
            float: right;
        }
}

    @media (max-width:768px) {
        .comments {
            margin: 10px -15px 10px -15px;
        }

        .likes {
            margin: 0px;
        }

        .col-xs-12 .info-tiles .tiles-footer:after {
            bottom: -20px;
        }

        .navbar-nav {
            float: none;
            margin: 0;
        }

            .navbar-nav > li {
                float: none;
            }

        .form-horizontal .control-label {
            padding-top: 7px;
            margin-bottom: 5px;
            text-align: left;
        }

        .nav > li {
            position: relative;
        }
  
    .nav > li {
        position: relative;
    }
    }

    @media (max-width:640px) {
        body, #header {
            background-image: none;
        }

        .ttl {
            float: none !important;
            border-radius: 5px 5px 0 0;
            margin-bottom: 24px;
        }

            .ttl:after {
                content: none;
            }

        .userInfo {
            margin-top: 0;
            border-radius: 0 0 25px 25px;
        }

        #logo {
            max-width: 230px;
            margin-top: 50px;
        }
    }



    @media (max-width:480px) {
        .comments {
            margin: 10px -15px 10px -15px;
        }

        .likes {
            margin: 0px;
        }

        .comments-icon i.fa.fa-users {
            font-size: 5em !important;
            left: 10px;
        }

        .comments-info a {
            font-size: .8em !important;
        }

        .comments-icon i.fa.fa-file-o, .comments-icon i.fa.fa-file-text {
            font-size: 5em !important;
        }
        .progect-process-content {
        margin-right: 0px;
      }
    }

@media (max-width:420px) {
    #logo {
        display: block;
        margin: 50px auto 10px;
        float: none;
    }

    .userInfo {
        float: none;
        display: block;
        width: 100%;
        position: relative;
        height: auto;
        background-image: none;
        border-radius: 25px;
        padding: 10px;
    }

    #header {
        height: auto;
        padding-bottom: 50px;
    }

    .dropdown-menu.notifications {
        left: 0;
        right: 0;
        margin: 0;
        top: 275px;
        width: 100%;
        position: fixed;
    }

    .process-project .progect-process-title h3 a {
        white-space: pre-wrap;
    }
}

@media (max-width:320px) {
    .comments {
        margin: 10px -15px 10px -15px;
    }

    .likes {
        margin: 0px;
    }

    .comments-icon i.fa.fa-users {
        font-size: 4em !important;
        left: 10px;
    }

    .comments-info a {
        font-size: .8em !important;
    }

    .comments-icon i.fa.fa-file-o, .comments-icon i.fa.fa-file-text {
        font-size: 4em !important;
    }

    .comments-info {
        width: 62%;
    }
}


.speed-num {
    background-color: #0c385f;
    padding: 9px 35px;
    position: absolute;
    left: 35px;
    top: -20px;
    font-size: 13px;
    font-weight: 600;
    border-radius: 0 0 5px 5px;
}
.speed-num a {
    color: #fff;
}
.speed-num  i.fa.fa-plus {
    font-size: 20px;
    padding-left: 12px;
}


.panel.panel-informatin.info2 {
    margin-top: 40px;
    background-color: rgba(255, 255, 255, 0.42);
    /* border: 2px solid #e6edfd; */
}


.pro-height {
    height: 170px;
    overflow-y: auto;
    overflow-x: hidden;
}
.panel-body {
    padding: 15px;
    position: relative;
    z-index: 1;
}