/*---------------------------------------------- COMMON STYLES https://www.webthemez.com/demo/insight-free-bootstrap-html5-admin-template/empty.html# ------------------------------------------------*/ body { font-family: 'Open Sans', sans-serif; background: #f3f3f3; } #wrapper { width: 100%; margin: 0 auto; } #page-wrapper { margin: 0 0 0 180px; padding: 15px 30px; margin-right: 180px; } .text-center { text-align: center; } h1, .h1, h2, .h2, h3, .h3 { margin-top: 7px; margin-bottom: -5px; } h2 { color: #000; } h4 { padding-top: 10px; } .square-btn-adjust { border: 0px solid transparent; -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; } p { font-size: 16px; line-height: 25px; } .panel { border-radius: 0px; } /*.navbar-side .nav > li > a > i {*/ /*color: #B5B5B5;*/ /*padding: 8px;*/ /*width: 30px;*/ /*text-align: center;*/ /*}*/ /*.navbar-side {*/ /*z-index: 1;*/ /*position: fixed;*/ /*width: 260px;*/ /*top: 60px;*/ /*bottom: 0;*/ /*overflow-y : auto;*/ /*background: #2b2e33;*/ /*}*/ #page-wrapper { position: relative; top: 55px; } .nav .open > a, .nav .open > a:hover, .nav .open > a:focus { /*background-color: #2497BA;*/ /*border-color: #428bca;*/ background-color: #fff; border-color: #fff; } .breadcrumb { padding: 0; margin-bottom: 20px; list-style: none; /* background-color: #FAFAFA; */ border-radius: 0; } /*---------------------------------------------- DASHBOARD STYLES ------------------------------------------------*/ .page-header { padding-bottom: 9px; margin: 10px 0 20px; border-bottom: 1px solid transparent; } .panel-left { width: 35%; height: 158px; background: #5CB85C; } .panel-left .fa-5x { font-size: 11em; color: rgba(255, 255, 255, 0.15); padding: 40px 0; margin-bottom: 30px; } .panel-right { width: 65%; height: 158px; background: transparent; margin-bottom: 0; color: #fff; } .panel-right h3 { font-size: 50px; padding: 31px 10px 13px; color: rgba(255, 255, 255, 0.96); } .panel-back { background-color: #fff; } .panel-default { border-color: #ECECEC; border: 1px solid transparent; border-radius: 4px; } .panel-default > .panel-heading { color: #000; border-color: #FFF; font-weight: bold; background: #FFFFFF; font-size: 16px; } .panel-heading { padding: 15px 15px 0px; border-bottom: 1px solid transparent; border-top-left-radius: 3px; border-top-right-radius: 3px; } .jumbotron, .well { background: #fff; } .noti-box { min-height: 100px; padding: 20px; } .noti-box .icon-box { display: block; float: left; margin: 0 15px 10px 0; width: 70px; height: 70px; line-height: 75px; vertical-align: middle; text-align: center; font-size: 40px; } .text-box p { margin: 0 0 3px; } .main-text { font-size: 25px; font-weight: 600; } .set-icon { -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; } .panel-primary { display: inline-block; margin-bottom: 30px; width: 100%; } .green { background-color: #5cb85c; color: #fff; } .blue { background-color: #4CB1CF; color: #fff } .red { background-color: #F0433D; color: #fff; } .brown { background-color: #f0ad4e; color: #fff; } .back-footer-red { background-color: #F0433D; color: #fff; border-top: 0px solid #fff; } .icon-box-right { display: block; float: right; margin: 0 15px 10px 0; width: 70px; height: 70px; line-height: 75px; vertical-align: middle; text-align: center; font-size: 40px; } .main-temp-back { background: #8702A8; color: #FFFFFF; font-size: 16px; font-weight: 300; text-align: center; } .main-temp-back .text-temp { font-size: 40px; } .back-dash { padding: 20px; font-size: 20px; font-weight: 500; -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; background-color: #2EA7EB; color: #fff; } .back-dash p { padding-top: 16px; font-size: 13px; color: #fff; line-height: 25px; text-align: justify; } .color-bottom-txt { color: #000; font-size: 16px; line-height: 30px; } /*CHAT PANEL*/ /*Charts*/ .main-chart { background: #fff; } .easypiechart-panel { text-align: center; padding: 1px 0; margin-bottom: 20px; } .placeholder h2 { margin-bottom: 0px; } .donut { width: 100%; } .easypiechart { position: relative; text-align: center; width: 120px; height: 120px; margin: 20px auto 10px auto; } .easypiechart .percent { display: block; position: absolute; font-size: 26px; top: 38px; width: 120px; } #easypiechart-blue .percent { color: #30a5ff; } #easypiechart-teal .percent { color: #1ebfae; } #easypiechart-orange .percent { color: #ffb53e; } #easypiechart-red .percent { color: #ef4040; } .chat-panel .panel-body { height: 450px; overflow-y: scroll; } .chat-box { margin: 0; padding: 0; list-style: none; } .chat-box li { margin-bottom: 15px; padding-bottom: 5px; border-bottom: 1px dotted #808080; } .chat-box li.left .chat-body { margin-left: 90px; } .chat-box li .chat-body p { margin: 0; color: #8d8888; } .chat-img>img { margin-left: 20px; } footer p { font-size: 14px; } /*---------------------------------------------- MENU STYLES ------------------------------------------------*/ .dropdown-menu > li > a{ cursor: pointer; } .top-navbar .dropdown-menu > li > a:hover, .top-navbar .dropdown-menu > li > a:focus { color: #225081; background: none; } .dropdown-tasks { width: 255px; } .dropdown-tasks .progress { height: 8px; margin-bottom: 8px; overflow: hidden; background-color: #f5f5f5; border-radius: 0px; } .dropdown-tasks > li > a { padding: 0px 15px; } .dropdown-tasks p { font-size: 13px; line-height: 21px; padding-top: 4px; } .active-menu { background-color: #2DAFCB !important; color: #fff !important; } .active-menu i { color: #fff !important; } .arrow { float: right; margin-top: 8px; } .fa.arrow:before { content: "\f104"; } .active > a > .fa.arrow:before { content: "\f107"; } .nav-second-level li, .nav-third-level li { border-bottom: none !important; } .nav-second-level li a { padding-left: 37px; } .nav-third-level li a { padding-left: 55px; } .sidebar-collapse , .sidebar-collapse .nav { background: none; } .sidebar-collapse .nav { padding: 0; } .sidebar-collapse .nav > li > a { color: #B5B5B5; background: transparent; text-shadow: none; } .sidebar-collapse > .nav > li > a { padding: 12px 10px; } .sidebar-collapse > .nav > li { border-bottom: 1px solid rgba(107, 108, 109, 0.19); } ul.nav.nav-second-level.collapse.in { background: #17191B; } .sidebar-collapse .nav > li > a:hover, .sidebar-collapse .nav > li > a:focus { outline: 0; } .navbar-side { border: none; } .top-navbar { background: #fff; border-bottom: none; } .top-navbar .nav > li > a > i { margin-right: 2px; } .top-navbar .nav > li > a > span { color: #666; margin-right: 5px; } .top-navbar .navbar-brand:hover { color: #2DAFCB; background-color: rgb(43, 46, 51); } .dropdown-user li { margin: 8px 0; } .navbar-default { border: 0px solid black; } .navbar-header { background: transparent; } .navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus { background-color: #B40101; } .navbar-default .navbar-toggle { border-color: #fff; } .navbar-default .navbar-toggle .icon-bar { background-color: #FFF; } .nav > li > a > i { margin-right: 10px; color: #666; } /*---------------------------------------------- UI ELEMENTS STYLES ------------------------------------------------*/ .btn-circle { width: 50px; height: 50px; padding: 6px 0; -webkit-border-radius: 25px; -moz-border-radius: 25px; border-radius: 25px; text-align: center; font-size: 12px; line-height: 1.428571429; } /*---------------------------------------------- MEDIA QUERIES ------------------------------------------------*/ @media(max-width:768px) { .top-navbar{ position: relative; } .top-navbar .navbar-brand{ width: 100%; } .navbar-side { z-index: 1; width: 100%; position: relative; top: 0; } #page-wrapper { margin: 0; padding: 15px 30px; top: 0; } }