/*! * Start Bootstrap - SB Admin 2 Bootstrap Admin Theme (http://startbootstrap.com) * Code licensed under the Apache License v2.0. * For details, see http://www.apache.org/licenses/LICENSE-2.0. */ @font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 400; src: local('Montserrat-Regular'), url('/fonts/zhcz-_WihjSQC0oHJ9TCYPk_vArhqVIZ0nv9q090hN8.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000; } @font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 700; src: local('Montserrat-Bold'), url('/fonts/IQHow_FEYlDC4Gzy_m8fcoWiMMZ7xLd792ULpGE4W_Y.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000; } @font-face { font-family: 'Chivo'; font-style: normal; font-weight: 400; src: local('Chivo'), local('Chivo-Regular'), url('/fonts/UZPPER-oWTCIdBggEtZvZA.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000; } @font-face { font-family: 'Chivo'; font-style: italic; font-weight: 400; src: local('Chivo-Italic'), url('/fonts/Sj1QqLyoKuAyWOdnG3PRjw.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000; } body { background-color: #f5f5f5; font-size: 15px; font-family: 'Chivo', sans-serif; } h1, h2, h3, h4, h5, h6{ font-family: 'Montserrat', sans-serif; } #wrapper { width: 100%; } #page-wrapper { padding: 0 15px; min-height: 568px; background-color: #fff; } @media(min-width:768px) { #page-wrapper { position: inherit; margin: 0; padding: 0 30px; margin-top: 10px; background: transparent; } } .navbar-top-links { margin-right: 0; } .navbar-top-links li { display: inline-block; } .navbar-top-links li:last-child { margin-right: 15px; } .navbar-top-links li a { padding: 15px; min-height: 50px; } .navbar-top-links .dropdown-menu li { display: block; } .navbar-top-links .dropdown-menu li:last-child { margin-right: 0; } .navbar-top-links .dropdown-menu li a { padding: 3px 20px; min-height: 0; } .navbar-top-links .dropdown-menu li a div { white-space: normal; } .navbar-top-links .dropdown-messages, .navbar-top-links .dropdown-tasks, .navbar-top-links .dropdown-alerts { width: 310px; min-width: 0; } .navbar-top-links .dropdown-messages { margin-left: 5px; } .navbar-top-links .dropdown-tasks { margin-left: -59px; } .navbar-top-links .dropdown-alerts { margin-left: -123px; } .navbar-top-links .dropdown-user { right: 0; left: auto; } .sidebar .sidebar-nav.navbar-collapse { padding-right: 0; padding-left: 0; } .sidebar .sidebar-search { padding: 15px; } .sidebar ul li { border-bottom: 1px solid #e7e7e7; } .sidebar ul li a.active { background-color: #eee; } .sidebar .arrow { float: right; } .sidebar .fa.arrow:before { content: "\f104"; } .sidebar .active>a>.fa.arrow:before { content: "\f107"; } .sidebar .nav-second-level li, .sidebar .nav-third-level li { border-bottom: 0!important; } .sidebar .nav-second-level li a { padding-left: 37px; } .sidebar .nav-third-level li a { padding-left: 52px; } @media(min-width:768px) { .sidebar { z-index: 1; position: absolute; width: 250px; margin-top: 51px; } .navbar-top-links .dropdown-messages, .navbar-top-links .dropdown-tasks, .navbar-top-links .dropdown-alerts { margin-left: auto; } } .btn-outline { color: inherit; background-color: transparent; transition: all .5s; } .btn-primary.btn-outline { color: #428bca; } .btn-success.btn-outline { color: #5cb85c; } .btn-info.btn-outline { color: #5bc0de; } .btn-warning.btn-outline { color: #f0ad4e; } .btn-danger.btn-outline { color: #d9534f; } .btn-primary.btn-outline:hover, .btn-success.btn-outline:hover, .btn-info.btn-outline:hover, .btn-warning.btn-outline:hover, .btn-danger.btn-outline:hover { color: #fff; } .chat { margin: 0; padding: 0; list-style: none; } .chat li { margin-bottom: 10px; padding-bottom: 5px; border-bottom: 1px dotted #999; } .chat li.left .chat-body { margin-left: 60px; } .chat li.right .chat-body { margin-right: 60px; } .chat li .chat-body p { margin: 0; } .panel .slidedown .glyphicon, .chat .glyphicon { margin-right: 5px; } .chat-panel .panel-body { height: 350px; overflow-y: scroll; } .login-panel { margin-top: 25%; } .flot-chart { display: block; height: 400px; } .flot-chart-content { width: 100%; height: 100%; } .dataTables_wrapper { position: relative; clear: both; } table.dataTable thead .sorting, table.dataTable thead .sorting_asc, table.dataTable thead .sorting_desc, table.dataTable thead .sorting_asc_disabled, table.dataTable thead .sorting_desc_disabled { background: 0 0; } table.dataTable thead .sorting_asc:after { content: "\f0de"; float: right; font-family: fontawesome; } table.dataTable thead .sorting_desc:after { content: "\f0dd"; float: right; font-family: fontawesome; } table.dataTable thead .sorting:after { content: "\f0dc"; float: right; font-family: fontawesome; color: rgba(50,50,50,.5); } .btn-circle { width: 30px; height: 30px; padding: 6px 0; border-radius: 15px; text-align: center; font-size: 12px; line-height: 1.428571429; } .btn-circle.btn-lg { width: 50px; height: 50px; padding: 10px 16px; border-radius: 25px; font-size: 18px; line-height: 1.33; } .btn-circle.btn-xl { width: 70px; height: 70px; padding: 10px 16px; border-radius: 35px; font-size: 24px; line-height: 1.33; } .show-grid [class^=col-] { padding-top: 10px; padding-bottom: 10px; border: 1px solid #ddd; background-color: #eee!important; } .show-grid { margin: 15px 0; } .huge { font-size: 50px; } .fontMedium { font-size: 25px; } .panel-green { border-color: #dfdfdf; } .panel-green .panel-heading { border-color: #1fbc99; color: #fff; background-color: #1fbc99; } .panel-green a { color: #606368; } /*.panel-green a:hover { color: #1fbc99; text-decoration: none; }*/ .panel-red { border-color: #ddd; } .panel-red .panel-heading { border-color: #e14333; color: #fff; /*background-color: #e14333;*/ background-color: #EA3C53; } .panel-red a { color: #606368; } .panel-red a:hover { color: #e14333; text-decoration: none; } .panel-high { border-color: #ddd; } .panel-high .panel-heading { border-color: #fcb322; color: #fff; background-color: #fcb322; } .panel-high a { color: #606368; } .panel-high a:hover { color: #fcb322; text-decoration: none; } /*NEW STYLES START HERE*/ /*navbar*/ .navbar-default{ background: rgba(255, 255, 255, 0.9); border-radius: 0;; } .navbar-brand{ height: 77px; padding: 7px 10px; margin-left: 0 !important; } .navbar-nav{ padding: 12px 15px; } .navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:focus, .navbar-default .navbar-nav>.active>a:hover{ background-color: transparent; color: #3397e1; display: inline-block; border-bottom: 2px solid #3397e1; height: 40px; } .navbar-default .navbar-nav>li>a{ color: #7b7c80; padding: 16px 3px; margin: 0 12px; } .navbar-default .navbar-nav>li>a:hover{ color: #3397e1; } .navbar-toggle{ margin-top:20px; } .user i img{ width: 54px; border-radius: 100px; border: 2px solid #e9e9e9; margin-right: 12px; display: inline-grid;; } .user{ background:transparent; border-left: 1px solid #dadada; margin-right: -15px; height: 77px; } .user:hover, .user.open{ background:#f5f5f5; } .navbar-default .user>.active>a{ border-bottom:0; color:#3397e1; padding: 0; height: 52px; } .navbar-default .user>.active>a:hover, .navbar-default .user>.active>a:focus{ color:#3397e1; border-bottom: 0; height: 52px; } /*navbar ends*/ /*title panel*/ .panel{ border-radius: 0; } .panel-body{ padding:0; } .dashboard-button{ background-color: #fff; color:#3d4047; border-radius: 0; border: 0; height:55px; width: 85px; padding-top: 15px; float: left; margin-right: 25px; border-right: 1px solid #dadada; } .dashboard-button:hover, .dashboard-button:active, .dashboard-button:focus{ background-color: #3d4047; } .dashboard-button i.fa-chevron-down{ margin-top: 0; margin-left: 5px; } .fa-chevron-right{ color: #337AB8; } .header-dashboard{ float: left; margin: 18px 0; } .clear{ clear: both; } .well{ background-color: #3d4047; border-radius: 0; color:#fff; border:0; box-shadow:none; margin-top: 11px; } .btn-success{ background-color: #1fbc99; border-color: #0b9778; border-radius: 2px; margin-right: 16px; margin-top: 11px; } .btn-success:hover, .btn-success:active, .btn-success:focus{ background-color: #0b9778; border-color: #0b9778; } .form-control{ width: 100px; margin: 11px 17px 0 0; } .dashboard-right { margin: 5px; } .dashboard-right h5{ margin: 20px 12px 0 0; } /*title panel ends*/ .panel-low{ border-color: #ddd; } .panel-low a{ color: #606368; } .panel-low a:hover{ color: #3397e1; text-decoration: none; } .panel{ box-shadow:none; } .panel a{ text-decoration: none; } .indicators .panel-heading{ min-height: 115px; } .indicators{ margin-bottom: 20px; margin-bottom: 45px; } .panel-green:hover, .panel-red:hover, .panel-high:hover, .panel-low, .panel-status:hover{ box-shadow:0px 3px 2px #dfdfdf; } .small{ font-size: 20px; } .smallB{ font-size: 17px; } .panel-footer{ background-color: #fff; } .panel-active{ /*background-color: #D99058;*/ position: relative; } .panel-active:after, .panel-active:before { top: 100%; left: 50%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; } .panel-active:after { border-color: rgba(136, 183, 213, 0); /*background-color: #000;*/ border-top-color: #fff; border-width: 20px; margin-left: -20px; } .panel-active:before { border-color: rgba(194, 225, 245, 0); border-top-color: #ddd; border-width: 21px; margin-left: -21px; } .progress{ height: 115px; margin-bottom: 0; } .progress-bar{ padding: 10px 15px; } .progress-dark-base{ background-color: #ddd; border-radius: 0; margin-top: -115px; } .panel .text-right, .small{ margin-top:10px; } /*panel red for color must be white * .panel-red .panel-heading, .panel-low .panel-heading{ color:rgba(0,0,0,0.4) !important; } */ .panel-high .progress-bar{ background: #fcb322; } .process-div{ background-color: #fff; border: 1px solid #ddd; margin-top: 10px; padding:0; color:#000; } .process-div .panel-heading{ color:#606368; font-size: 20px; } .process-div .panel-heading a{ color: #606368; } .process-div .small{ margin-top: 0; } /*.process-div .breadcrumb{*/ .breadcrumb{ margin: 0; background: transparent; padding: 0; } .breadcrumb>li+li:before{ color: rgba(0,0,0, 2); } .red{ color:#e14333 !important; } .green{ color:#1fbc99 !important; } .yellow{ color:#fcb322 !important; } .blue{ color:#337AB8 !important; } .grey{ color:#606368 !important; } .redbg{ /*background:#e14333 !important;*/ border-color: #e14333; background-color: #fff; } .greenbg{ /*background:#1fbc99 !important;*/ border-color: #1fbc99; background-color: #fff; } .yellowbg{ /*background:#fcb322 !important;*/ border-color: #fcb322; background-color: #fff; } .bluebg{ /*background:#337ab7 !important;*/ border-color: #337ab7; background-color: #fff; } .greybg{ background:#606368 !important; } .vcenter { margin: 7% 0; } .vcenter-task { margin: 2% 0; } .border-left-light{ border-left:1px solid rgba(255,255,255, 0.5); } .border-left-dark{ border-left:1px solid rgba(0,0,0, 0.2); } .process-button{ border:1px solid #dadada; display:inherit; height:83px; padding: 13px; } .process-button .small{ font-size: 14px; } .process-button .blue, .process-button .red, .process-button .green{ font-size: 24px; } .process-button:hover .blue, .process-button:hover, .process-button:hover .grey, .process-button:hover .red, .process-button:hover .green { background: #337AB8; color:#fff !important; } .arrow{ margin-top: 18px; } .title-process{ margin-top:15px; } .btn-group .btn-success{ margin: 20px 0 0 0; } .selected .fa-star{ color: #fcb322 !important; } .selected .btn-success{ background-color: #007E62; } .well .btn-group{ margin: 0 15px 0 0; } .bottom{ margin-bottom: 30px; } .tooltip > .tooltip-inner { line-height: 1; text-align: center; color: #fff; width: 150px; padding: 15px; font-size: 12px; background: rgba(0, 0, 0, 0.7); border-radius: 8px; pointer-events: none; }