body {
    background-color: #EBEDF5;
    background-image:url(/images/background2.jpg);
    padding: 0;
    margin: 0;
    background-attachment: fixed;
    opacity: 0.99;
    color: #4D545B;
}

/*text color*/
.grey-text {
    color: #9e9e9e !important;
}

#main, footer {
    padding-left: 200px;
}

.margin {
    margin: 0;
}

.hint-block {
    margin-top: 1px;
    padding-left: 0.7rem;
    font-size: 0.8rem;
}

.kcb-h6 {
    font-size: 1.2rem;
    font-weight: 600;
    color: #000000;
}

#input-select .input-field label {
    position: absolute;
    top: -14px;
    font-size: 0.8rem;
}

#sidenav-overlay {
    background-color: transparent;
}

.container {
    padding: 0 0.5rem;
    margin: 0 auto;
    max-width: 100% !important;
    width: 98%;
}

#left-sidebar-nav span.badge.new {
    line-height: 20px;
    margin-top: 11px;
}

#content .container .row {
    margin-bottom: 0;
}

@media only screen and (min-width: 601px) {
    .container {
        width: 98%;
    }
}

@media only screen and (min-width: 993px) {
    .container {
        width: 98%;
    }

    .row .col.kl10 {
        width: 83%;
        margin-left: 0;
    }
}

/*移动端*/
@media only screen and (max-width: 993px) {
    #main, footer {
        padding-left: 0;
    }

    .exam-cert {
        position: unset !important;
        text-align: center;
    }
}

@media only screen and (max-width: 600px) {
    .search-form .input-field {
        width: 100%;
        margin-top: 0.2rem;
        padding: 0 5px;
        float: left;
    }
}

@media only screen and (min-width: 601px) and (max-width: 992px) {
    .search-form .input-field {
        width: 50%;
        margin-top: 0.2rem;
        padding: 0 5px;
        float: left;
    }
}

@media only screen and (min-width: 993px) and (max-width: 1200px) {
    .search-form .input-field {
        width: 33.3%;
        margin-top: 0.2rem;
        padding: 0 5px;
        float: left;
    }
}

@media only screen and (min-width: 1201px) {
    .search-form .input-field {
        width: 20%;
        margin-top: 0.2rem;
        padding: 0 5px;
        float: left;
    }
}

/*---------------------------------
    Typography
-----------------------------------*/

.small {
    font-size: 1.0rem;
    margin: 0;
    padding: 0;
}

.medium-small {
    font-size: 0.9rem;
    margin: 0;
    padding: 0;
}

.ultra-small {
    font-size: 0.8rem;
    margin: 0;
    padding: 0;
}

small {
    font-size: 0.8rem;
}

.strong {
    font-weight: 600;
}

h4.header {
    font-size: 1.5rem;
    line-height: 2.508rem;
    margin: 1.14rem 0 0.912rem 0;
}

p.title {
    font-size: 1.3rem;
}

p.header {
    font-size: 1rem;
    font-weight: 500;
    text-transform: uppercase;
}

h4.header {
    font-size: 1.4rem;
    font-weight: 400;
    text-transform: uppercase;
}

h4.header2 {
    font-size: 1.1rem;
    font-weight: 400;
    text-transform: uppercase;
}

li.li-hover:hover {
    background: transparent !important;
}

.more-text {
    padding: 5px 20px;
    font-weight: 500;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.valign-demo {
    height: 400px;
    background-color: #ddd;
}

/*----------------------------------------
    Pre Loader
------------------------------------------*/
#loader-wrapper {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1000;
}

#loader {
    display: block;
    position: relative;
    left: 50%;
    top: 50%;
    width: 150px;
    height: 150px;
    margin: -75px 0 0 -75px;
    border-radius: 50%;
    border: 3px solid transparent;
    border-top-color: #000087;
    -webkit-animation: spin 2s linear infinite; /* Chrome, Opera 15+, Safari 5+ */

    animation: spin 2s linear infinite; /* Chrome, Firefox 16+, IE 10+, Opera */

    z-index: 1001;
}

#loader-logo {
    display: block;
    position: absolute;
    left: 48%;
    top: 46%;
    background: url(../images/logo.png) no-repeat center center;
    background-size: 100% 100%;
    z-index: 1001;
    width: 75px;
    height: 46px;
    /* IE10、Firefox and Opera，IE9以及更早的版本不支持 */
    animation-name: breath; /* 动画名称 */
    animation-duration: 700ms; /* 动画时长3秒 */
    animation-timing-function: ease-in-out; /* 动画速度曲线：以低速开始和结束 */
    animation-iteration-count: infinite; /* 播放次数：无限 */

    /* Safari and Chrome */
    -webkit-animation-name: breath; /* 动画名称 */
    -webkit-animation-duration: 700ms; /* 动画时长3秒 */
    -webkit-animation-timing-function: ease-in-out; /* 动画速度曲线：以低速开始和结束 */
    -webkit-animation-iteration-count: infinite; /* 播放次数：无限 */
}

/*开始呼吸动画*/
@keyframes breath {
    from {
        opacity: 0.1;
    }
    /* 动画开始时的不透明度 */
    50% {
        opacity: 1;
    }
    /* 动画50% 时的不透明度 */
    to {
        opacity: 0.1;
    }
    /* 动画结束时的不透明度 */
}

@-webkit-keyframes breath {
    from {
        opacity: 0.1;
    }
    /* 动画开始时的不透明度 */
    50% {
        opacity: 1;
    }
    /* 动画50% 时的不透明度 */
    to {
        opacity: 0.1;
    }
    /* 动画结束时的不透明度 */
}

#loader:before {
    content: "";
    position: absolute;
    top: 5px;
    left: 5px;
    right: 5px;
    bottom: 5px;
    border-radius: 50%;
    border: 3px solid transparent;
    border-top-color: #00ba80;
    -webkit-animation: spin 3s linear infinite; /* Chrome, Opera 15+, Safari 5+ */

    animation: spin 3s linear infinite; /* Chrome, Firefox 16+, IE 10+, Opera */
}

#loader:after {
    content: "";
    position: absolute;
    top: 15px;
    left: 15px;
    right: 15px;
    bottom: 15px;
    border-radius: 50%;
    border: 3px solid transparent;
    border-top-color: #ebaf10;
    -webkit-animation: spin 1.5s linear infinite; /* Chrome, Opera 15+, Safari 5+ */

    animation: spin 1.5s linear infinite; /* Chrome, Firefox 16+, IE 10+, Opera */
}

@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
        /* Chrome, Opera 15+, Safari 3.1+ */

        -ms-transform: rotate(0deg);
        /* IE 9 */

        transform: rotate(0deg);
        /* Firefox 16+, IE 10+, Opera */
    }
    100% {
        -webkit-transform: rotate(360deg);
        /* Chrome, Opera 15+, Safari 3.1+ */

        -ms-transform: rotate(360deg);
        /* IE 9 */

        transform: rotate(360deg);
        /* Firefox 16+, IE 10+, Opera */
    }
}

@keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
        /* Chrome, Opera 15+, Safari 3.1+ */

        -ms-transform: rotate(0deg);
        /* IE 9 */

        transform: rotate(0deg);
        /* Firefox 16+, IE 10+, Opera */
    }
    100% {
        -webkit-transform: rotate(360deg);
        /* Chrome, Opera 15+, Safari 3.1+ */

        -ms-transform: rotate(360deg);
        /* IE 9 */

        transform: rotate(360deg);
        /* Firefox 16+, IE 10+, Opera */
    }
}

#loader-wrapper .loader-section {
    position: fixed;
    top: 0;
    width: 51%;
    height: 100%;
    background: #222222;
    z-index: 1000;
    -webkit-transform: translateX(0); /* Chrome, Opera 15+, Safari 3.1+ */

    -ms-transform: translateX(0); /* IE 9 */

    transform: translateX(0); /* Firefox 16+, IE 10+, Opera */
}

#loader-wrapper .loader-section.section-left {
    left: 0;
}

#loader-wrapper .loader-section.section-right {
    right: 0;
}

/* Loaded */

.loaded #loader-wrapper .loader-section.section-left {
    -webkit-transform: translateX(-100%); /* Chrome, Opera 15+, Safari 3.1+ */

    -ms-transform: translateX(-100%); /* IE 9 */

    transform: translateX(-100%); /* Firefox 16+, IE 10+, Opera */

    -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
    transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
}

.loaded #loader-wrapper .loader-section.section-right {
    -webkit-transform: translateX(100%); /* Chrome, Opera 15+, Safari 3.1+ */

    -ms-transform: translateX(100%); /* IE 9 */

    transform: translateX(100%); /* Firefox 16+, IE 10+, Opera */

    -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
    transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
}

.loaded #loader {
    opacity: 0;
    -webkit-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}

.loaded #loader-wrapper {
    visibility: hidden;
    -webkit-transform: translateY(-100%); /* Chrome, Opera 15+, Safari 3.1+ */

    -ms-transform: translateY(-100%); /* IE 9 */

    transform: translateY(-100%); /* Firefox 16+, IE 10+, Opera */

    -webkit-transition: all 0.3s 1s ease-out;
    transition: all 0.3s 1s ease-out;
}

/* JavaScript Turned Off */

.no-js #loader-wrapper {
    display: none;
}

.progress {
    background-color: #E9EBEF;
}

/*=================================================================================
    Header
====================================================================================*/
nav ul a {
    color: #666666;
}

/*----------------------------------------
    Page Header
------------------------------------------*/

#header {
    /*opacity: 0.9;*/
}

h1.logo-wrapper {
    margin: 0px 0px;
}

h1 span.logo-text {
    display: none;
}

header .brand-logo {
    margin-left: 20px;
}

@media only screen and (max-width: 992px) {
    nav .nav-wrapper {
        text-align: center;
    }

    nav .nav-wrapper a.page-title {
        font-size: 36px;
    }
}

li.search-out:hover {
    background: transparent;
}

.search-out {
    display: none;
}

.search-out-text {
    border-bottom: 1px solid #fff !important;
}

.search-out input[type=text]:focus:not([readonly]) {
    border-bottom: 1px solid #fff !important;
    box-shadow: none;
}

/*=================================================================================
    Sidebar
====================================================================================*/
/*----------------------------------------
    Sidebar Main Menu
------------------------------------------*/

ul.side-nav.fixed {
    top: 64px;
}

@media only screen and (max-width: 992px) {
    ul.side-nav.fixed {
        top: 56px;
    }
}

ul.side-nav.fixed hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #e0e0e0;
    margin: 1em 0;
    padding: 0;
}

.side-nav a {
    line-height: 42px;
    height: 42px;
}

#left-sidebar-nav {
    position: fixed;
    width: 100px;
    left: 180px;
    z-index: 999;
    height: auto;
}

#slide-out {
    background-color: #000087;
    opacity:0.85;
}

#slide-out li a i {
    line-height: inherit;
    width: 2rem;
    font-size: 1.6rem;
    display: block;
    float: left;
    text-align: center;
    margin-right: 0;
    margin-left: 0;
}

#slide-out ul.side-nav li {
    padding: 0px !important;
}

ul.side-nav li {
    padding: 0;
}

ul.side-nav .collapsible-header {
    margin: 0;
}

.caption {
    font-size: 1.25rem;
    font-weight: 300;
    margin-bottom: 30px;
}

.caption-uppercase {
    font-size: 1.25rem;
    font-weight: 300;
    margin-bottom: 30px;
    text-transform: uppercase;
}

.sidebar-collapse {
    position: absolute;
    left: -170px;
    top: -45px;
}

ul.side-nav.fixed {
    overflow: hidden;
}

ul.side-nav.fixed li {
    line-height: 44px;
    /*border-left: 14px solid #ffffff;*/
}

ul.side-nav.fixed li.active {
    background-color: #000087;
}
ul.side-nav.fixed li:hover{
    background-color: #000073;
}

#slide-out > ul > ul > li.active {
    background-color: #000087;
}

ul.side-nav.fixed li.no-border {
    border-left: 0;
}

ul.side-nav.fixed li a {
    font-size: 14px;
    font-weight: 400;
    color: #CFD6DA;
}

ul.side-nav.fixed li a.active{
    border-right: solid 5px #00BA80;
}

/*避免主UL影响*/
ul.collapsible > li.active > a.active {
    border-right: solid 0px;
}

#profile-dropdown li a {
     color: #666666;
}

#profile-dropdown li a:hover {
     color: #ffffff;
    border-bottom: 1px solid #ffffff;
}

.side-nav .collapsible-body {
    background-color: #000087;
}

.side-nav .collapsible-body li.active, .side-nav.fixed .collapsible-body li.active {
    background-color: #000087;
}

ul.side-nav.fixed:hover { /*overflow-y:hidden;*/
}

ul.side-nav.fixed li.user-details {
    /*background: url(../images/user-bg.jpg) no-repeat center center;*/
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover; /*overflow: hidden;*/
    padding: 15px 0 0 15px;
}

.user-details .row {
    margin: 0;
}

.user-task, .user-time {
    margin: 0;
    font-size: 13px;
    color: #fff;
}

ul.side-nav.fixed .profile-image { /*height: 50px;*/
}

ul.side-nav.fixed .profile-btn {
    margin: 0;
    text-transform: capitalize;
    padding: 0;
    font-size: 15px;
}

.user-roal {
    color: #fff;
    margin-top: -16px;
    font-size: 13px;
    text-shadow: 1px 1px 1px #444;
}

.bold > a {
    font-weight: bold;
}

nav.top-nav {
    height: 122px;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}

nav.top-nav a.page-title {
    line-height: 122px;
    font-size: 48px;
}

/*----------------------------------------
    Right Chat Slideout
------------------------------------------*/
.right-side-navigation {
    position: fixed;
    width: 100px;
    right: 5px;
    z-index: 999;
    height: 100%;
}

.right-side-navigation .card-panel .card-foot {
    position: absolute;
    bottom: 120px; /*最大高度 溢出60px*/
    width: calc(100% - 60px);
}

.button-fixed-bottom {
    position: fixed;
    bottom: 5px;
    width: 100%;
}

.chat-close-collapse {
    padding: 5px 15px 0 0;
}

#right-search .input-field {
    margin-top: 0px;
}

#chat-out .collapsible-header {
    background-color: transparent;
    border: none;
    line-height: 45px;
    height: 45px;
    font-weight: 400;
}

#chat-out .chat-out-list {
    padding: 5px;
    margin: 0;
    border-bottom: 1px solid #e0e0e0;
}

#chat-out .favorite-associate-list .circle {
    -moz-border-radius: 50px;
    -webkit-border-radius: 50px;
    border-radius: 50px;
    border: 2px solid #999;
    padding: 3px;
    display: block;
}

#chat-out .favorite-associate-list .online-user {
    border: 2px solid #00e676;
}

#chat-out .recent-activity-list-icon {
    margin-top: 8px;
    font-size: 2rem;
}

#chat-out .recent-activity-list-text a {
    font-size: 0.8rem;
    padding: 0;
    font-weight: 600;
}

#chat-out .recent-activity-list-text p {
    font-size: 0.9rem;
    padding: 0;
}

#chat-out .favorite-associate-list p {
    padding: 0;
}

#chat-out .favorite-associate-list p.place {
    font-size: 0.8rem;
}

/* =================================================================================
    Content
================================================================================= */
/*----------------------------------------
    Breadcrumb
------------------------------------------*/

.breadcrumb {
    padding: 0px;
    margin: 15px 0px 10px 0px;
    list-style: none;
}

.breadcrumbs-title {
    font-size: 1.5rem;
    line-height: 1.804rem;
    margin: 18px 0px 0px 0px;
}

.breadcrumb > li {
    display: inline-block;
}

.breadcrumb a {
    color: #000087;
}

.breadcrumb .active {
    font-weight: normal;
    color: #000;
}

.breadcrumb > li + li:before {
    padding: 0 5px;
    color: #000087;
    content: "/\00a0";
}

h5.breadcrumbs-header {
    font-size: 1.64rem;
    line-height: 1.804rem;
    margin: 1.5rem 0 0 0;
}

.breadcrumbs-nav {
    margin: 8px 0 9px 0;
}

/*----------------------------------------
    Cards
------------------------------------------*/
/*card-stats*/

#card-stats .card-content {
    text-align: center;
}

#card-stats .card-stats-title, #card-stats .card-stats-title i {
    font-size: 1.2rem;
}

#card-stats .card-stats-compare {
    font-size: 1.0rem;
}

#card-stats .card-stats-compare i {
    position: relative;
    top: 5px
}

#card-stats .card-stats-number {
    font-size: 1.8rem;
    line-height: 2.0rem;
    margin: 0.2rem 0 0.2rem 0;
    font-weight: 500;
}

/*work-collections*/

#work-collections .collection-header {
    font-size: 1.64rem;
    font-weight: 500;
}

#work-collections .collection-item.avatar {
    height: auto;
}

#work-collections p.collections-title {
    font-size: 1.0rem;
    padding: 0;
    margin: 0;
    font-weight: 500;
}

#work-collections p.collections-content {
    font-size: 0.9rem;
    padding: 0;
    margin: 0;
    font-weight: 400;
}

/*flight-card*/

#flight-card .card-header .card-title {
    padding: 20px;
}

#flight-card .flight-card-title {
    margin: 0;
    font-weight: 300;
}

#flight-card .flight-card-date {
    font-size: 1.0rem;
    margin: 0;
}

#flight-card .flight-state {
    padding-bottom: 15px;
}

#flight-card .flight-state-two {
    border-left: 1px dashed #9e9e9e;
}

#flight-card .flight-icon {
    font-size: 2.2rem;
    display: block;
    -webkit-transform: rotate(90deg); /* Safari */

    -moz-transform: rotate(90deg); /* Firefox */

    -ms-transform: rotate(90deg); /* IE */

    -o-transform: rotate(90deg); /* Opera */

    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
    /* Internet Explorer */
}

#flight-card .card-content-bg {
    background: url(../images/sample-1.jpg) no-repeat center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

#flight-card .card-content {
    background: rgba(0, 0, 0, 0.25);
}

#flight-card .flight-state-wrapper {
    margin: 0 0 100px 0 !important;
}

/*task-card*/

#task-card label {
    display: block;
    color: rgba(0, 0, 0, 0.87);
    height: auto;
}

#task-card .task-card-title {
    margin: 0;
    color: #fff;
    font-weight: 300;
}

#task-card .task-card-date {
    font-size: 1.0rem;
    margin: 0;
    color: #fff;
}

#task-card .collection-header {
    padding: 20px;
}

#task-card .task-cat {
    padding: 2px 4px;
    color: #fff;
    margin-left: 37px;
    font-weight: 300;
    font-size: 0.8rem;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    background-clip: padding-box;
}

.task-cat {
    padding: 2px 4px;
    color: #fff;
    font-weight: 300;
    font-size: 0.8rem;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    background-clip: padding-box;
}

.collection .collection-item.avatar i.circle {
    font-size: 28px;
}

/* Profile Card */

#profile-card .card-image {
    height: 150px;
}

#profile-card .card-content p {
    font-size: 1.2rem;
    margin: 10px 0 12px 0;
}

#profile-card .card-profile-image {
    width: 80px;
    position: absolute;
    top: 90px;
    z-index: 1;
    cursor: pointer;
}

#profile-card .btn-move-up {
    position: relative;
    top: -45px;
    right: -18px;
    margin-right: 10px !important;
}

/*----------------------------------------
    Charts
------------------------------------------*/

#chart-dashboard {
    padding-top: 12px;
}

#chart-dashboard .card .card-content, #card-stats .card .card-content, #card-stats .card .card-action {
    padding: 10px 14px;
}

#line-updated { /*background: #00bcd4;*/
}

.sample-chart-wrapper {
    width: 100%;
}

.chart-title {
    font-size: 1.6rem;
    font-weight: 300;
}

/* Revenue Chart */

.chart-revenue {
    float: right;
    text-align: center;
    padding: 8px;
    border-radius: 3px;
}

.chart-revenue .chart-revenue-total {
    font-size: 0.9rem;
    margin: 0;
}

.chart-revenue .chart-revenue-per {
    font-size: 0.8rem;
    margin: 0;
}

.chart-revenue .chart-revenue-per i {
    position: relative;
    top: 5px;
}

.chart-revenue-switch {
    padding-top: 28px;
    padding-right: 10px;
    color: #fff;
    text-align: right;
}

/* doughnut chart */
.doughnut-chart-status {
    position: relative;
    top: -75px;
    left: 0;
    font-size: 16px;
    font-weight: 500;
    height: 0px;
    text-align: center;
}

.doughnut-chart-status p {
    margin-top: -5px;
}

.doughnut-chart-legend li {
    padding: 2px 0;
    font-size: 0.9rem;
}

.doughnut-chart-legend li:before {
    content: "";
    width: 8px;
    height: 8px;
    display: block;
    float: left;
    margin-top: 6px;
    margin-right: 4px;
}

li.mobile:before {
    background: #F7464A;
}

li.kitchen:before {
    background: #46BFBD;
}

li.home:before {
    background: #FDB45C;
}

a.button-collapse.top-nav {
    position: absolute;
    left: 7.5%;
    top: 0;
    float: none;
    margin-left: 1.5rem;
    color: #fff;
    font-size: 32px;
    z-index: 2;
}

/* trending bar chart */

.trending-bar-chart-wrapper {
    width: 100%;
}

.btn-move-up {
    position: relative;
    top: -28px;
    right: -18px;
    margin-right: 10px !important;
}

/* Flot Chart*/

.flotchart-placeholder {
    width: 100%;
    height: 300px;
    font-size: 13px;
    line-height: 1.2em;
}

#flotchart table {
    position: absolute;
    top: 13px;
    right: 17px;
    font-size: smaller;
    color: #545454;
    width: 100px;
}

#flotchart td, th {
    padding: 5px;
}

/* xCharts */

.xchart-placeholder {
    width: 90%;
    height: 300px;
}

/*Sparkline*/

.tooltip-class {
    overflow: hidden;
    color: #fff;
    height: 20px;
    width: 30px;
}

/**/
#ct2-chart .ct-series.ct-series-a .ct-area {
    fill: #00BCD4;
}

#ct2-chart .ct-series.ct-series-a .ct-point {
    stroke: #00BCD4;
}

#ct2-chart .ct-series.ct-series-a .ct-line {
    stroke: #54E2F4;
}

/*------------------
  Widget
--------------------*/

.socialbox .logo {
    color: #fff;
    font-size: 28px;
    left: 20px;
    bottom: 20px;
    position: absolute;
}

.socialbox .info {
    color: #fff;
    margin: 0;
    position: absolute;
    right: 20px;
    bottom: 20px;
    font-size: 15px;
    padding: 0;
}

/*----------------------------------------
    Calender
------------------------------------------*/

#full-calendar {
    padding-top: 30px;
}

#calendar h2 {
    font-size: 1.5rem;
    text-transform: uppercase;
    line-height: 35px;
}

#calendar .fc-day-header {
    text-transform: uppercase;
    font-weight: 400;
}

#external-events {
    padding-top: 50px;
}

#external-events .fc-event {
    color: #fff;
    text-decoration: none;
    padding: 5px;
    margin-bottom: 10px;
    cursor: all-scroll;
    border: none;
}

.fc button {
    background: #fff;
}

.fc td, .fc th {
    border-width: 0px !important;
}

.fc-state-active, .fc-state-down {
    color: #ff4081 !important;
}

/*----------------------------------------
    Color Palette for css-color.html page
------------------------------------------*/

.dynamic-color .red, .dynamic-color .pink, .dynamic-color .purple, .dynamic-color .deep-purple, .dynamic-color .indigo, .dynamic-color .blue, .dynamic-color .light-blue, .dynamic-color .cyan, .dynamic-color .teal, .dynamic-color .green, .dynamic-color .light-green, .dynamic-color .lime, .dynamic-color .yellow, .dynamic-color .amber, .dynamic-color .orange, .dynamic-color .deep-orange, .dynamic-color .brown, .dynamic-color .grey, .dynamic-color .blue-grey {
    height: 55px;
    width: 100%;
    padding: 0 15px;
    line-height: 55px;
    font-weight: 500;
    font-size: 12px;
    display: block;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.dynamic-color .col {
    margin-bottom: 55px;
}

@media only screen and (max-width: 1024px) {
    tfoot {
        display: none;
    }
}

tr.group, tr.group:hover {
    background-color: #ddd !important;
}

.btn-radius {
    border-radius: 1rem;
}

.kcb-green {
    background-color: #00ba80 !important;
    border: 1px #00ba80 solid;
    border-radius: 0.2rem;
    color: #fff;
    padding: 0 1rem;
}

.kcb-green:hover {
    background-color: #FFF !important;
    border: 1px #00ba80 solid;
    color: #00ba80;
}

.kcb-black {
    background-color: #6e6e6e !important;
    border: 1px #6e6e6e solid;
    border-radius: 0.2rem;
    padding: 0 1rem;
}

.kcb-black:hover {
    background-color: #FFF !important;
    color: #6e6e6e;
}

.kcb-green:disabled {
    cursor: not-allowed;
    background-color: #9b9f9e !important;
    border: 1px #9e9f9f solid;
    color: #fff;
}

.kcb-green.disabled:hover {
    color: #fff;
}

.kcb-blue {
    background-color: #000086 !important;
    border: 1px #000086 solid;
    padding: 0 1rem;
}

.kcb-blue-lighten-1 {
    background-color: #3d4a57;
}

.kcb-blue:hover {
    background-color: #FFF !important;
    color: #000086;
}

.kcb-red {
    background-color: #F44336 !important;
    border: 1px #F44336 solid;
    padding: 0 1rem;
}

.kcb-red:hover {
    background-color: #FFF !important;
    color: #F44336;
}

.btn-kcb-green {
    background-color: #00ba80 !important;
}

.btn-kcb-grey {
    background-color: #C4C5C5 !important;
}

.kcb-font-green {
    color: #00ba80;
}
.kcb-font-blue {
    color: #000087;
}
.kcb-font-blank {
    color: #1e1e23;
}
.kcb-font-grey {
    color: #6e6e6e;
}
.kcb-font-grey1 {
    color: #b2b2b5;
}
.kcb-font-grey2 {
    color: #c4c5c5;
}
.kcb-font-grey3 {
    color: #d9d9d9;
}
.kcb-font-grey4 {
    color: #FAFAFA;
}
.kcb-font-white {
    color: #FFF;
}

.kcb-background-green {
    background-color: #00ba80;
}
.kcb-background-blue {
    background-color: #000087;
}
.kcb-background-blank {
    background-color: #1e1e23;
}
.kcb-background-grey {
    background-color: #6e6e6e;
}
.kcb-background-grey1 {
    background-color: #b2b2b5;
}
.kcb-background-grey2 {
    background-color: #c4c5c5;
}
.kcb-background-grey3 {
    background-color: #F0F1F4;
}
.kcb-background-grey4 {
    background-color: #FAFAFA;
}
.kcb-background-white {
    background-color: #FFF;
}



.btn-floating .btn-kcb-large-size {
    text-align: center;
    width: 30px;
    height: 30px;
}

.btn-kcb-small-size {
    text-align: center;
    display: block;
    width: 18px;
    height: 18px;
    font-size: 12px !important;
    color: #FFFFFF;
    border-radius: 9px;
    margin-top: 7px;
}

.time-line {
    padding-left: 5%;
    padding-top: 5%;
    padding-right: 5%;
}

.time-line a {
    font-size: 18px;
}

.btn-floating i {
    line-height: 25px;
}

.vertical-line {
    width: 3px;
    height: 50px;
    background-color: #d2d2d2;
    display: block;
    margin-left: 16px;
    margin-top: -5px;
}

.time-line-block {
}

.first-line {
}

/*专业申请*/
.card-panel {
    opacity: 90%;
}

.collection .collection-item.info .icon-img {
    position: absolute;
    width: 42px;
    height: 42px;
    overflow: hidden;
    left: 30px;
    margin-top: 12px;
}

.collection .collection-item.info .data-info {
    padding-left: 70px;
    overflow: hidden;
    margin-top: 12px;
}

.collection .collection-item.info .data-info .title {
    font-weight: 600;
}

/*.collection .collection-item.info .upload-btn {*/
/*    margin-top: 12px;*/
/*    padding: 0 1.1rem;*/
/*}*/

/*百度插件进度条问题*/
p.progress span {
    display: block;
    height: 4px;
    background-color: #000000;
}


img.has-error {
    border: 3px #a9302a solid;
    width: 60px;
}
.upload-img {
    position: relative;
    float: left;
    display: block;
    width: 70px;
    padding: 5px;
    margin-right: 10px;
}
.upload-del-img {
    position: absolute;
    top: -3px;
    right: 0;
    display: block;
    color: #FFFFFF;
    background-color: #0C0C0C;
    width: 16px;
    height: 16px;
    font-size: 12px;
    line-height: 16px;
    text-align: center;
    border-radius: 8px;
}

.upload-del-img .mdi-content-clear {
    font: normal normal normal 16px/1 'Material-Design-Icons';
}

.btn {
    padding: 0 1rem;
}

.btn-kcb-small-size .mdi-action-done {
    font: normal normal normal 12px/1 'Material-Design-Icons';
    line-height: 18px;
}

.btn-kcb-small-size .mdi-content-clear {
    font: normal normal normal 12px/1 'Material-Design-Icons';
    line-height: 18px;
}

/*/ 专业申请*/

/*----------------------------------------
    Grid - Flat Site Mockup
------------------------------------------*/

#site-layout-example-left {
    background-color: #90a4ae;
    height: 300px;
}

#site-layout-example-top {
    background-color: #00ba80;
    height: 50px;
}

.flat-text-header {
    height: 35px;
    width: 80%;
    background-color: rgba(255, 255, 255, 0.15);
    display: block;
    margin: 27px auto;
}

.flat-text {
    height: 25px;
    width: 80%;
    background-color: rgba(0, 0, 0, 0.15);
    display: block;
    margin: 27px auto;
}

.flat-text.small {
    width: 25%;
    height: 25px;
    background-color: rgba(0, 0, 0, 0.15);
}

.flat-text.full-width {
    width: 100%;
}

.col.grid-example {
    border: 1px solid #eee;
    margin: 7px 0;
    text-align: center;
    line-height: 50px;
    font-size: 28px;
    background-color: tomato;
    color: white;
    padding: 0px;
}

.col.grid-example span {
    font-weight: 200;
    line-height: 50px;
}

.waves-color-demo .collection-item {
    height: 57px;
    line-height: 57px;
}

/*----------------------------------------
    Chrome Browser Grid Example
------------------------------------------*/

.browser-window {
    text-align: left;
    width: 100%;
    height: auto;
    display: inline-block;
    -webkit-border-radius: 5px 5px 2px 2px;
    -moz-border-radius: 5px 5px 2px 2px;
    border-radius: 5px 5px 2px 2px;
    background-clip: padding-box;
    background-color: transparent;
    margin: 20px 0px;
    overflow: hidden;
}

.browser-window .top-bar {
    height: 30px;
    -webkit-border-radius: 5px 5px 0 0;
    -moz-border-radius: 5px 5px 0 0;
    border-radius: 5px 5px 0 0;
    background-clip: padding-box;
    border-top: thin solid #eaeae9;
    border-bottom: thin solid #dfdfde;
    background: linear-gradient(#e7e7e6, #E2E2E1);
}

.browser-window .circle {
    height: 10px;
    width: 10px;
    display: inline-block;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    background-color: white;
    margin-right: 1px;
}

#close-circle {
    background-color: #FF5C5A;
}

#minimize-circle {
    background-color: #FFBB50;
}

#maximize-circle {
    background-color: #1BC656;
}

.browser-window .circles {
    margin: 5px 12px;
}

.browser-window .content {
    margin: 0;
    width: 100%;
    display: inline-block;
    border-radius: 0 0 5px 5px;
    background-color: #fafafa;
}

.browser-window .row {
    margin: 0;
}

.clear {
    clear: both;
}

.promo i {
    color: #ee6e73;
    font-size: 6rem;
    display: block;
}

.promo-caption {
    font-size: 1.7rem;
    font-weight: 500;
    margin-top: 5px;
    margin-bottom: 0px;
}

.switch label input[type=checkbox]:checked + .lever {
    background-color: rgba(1, 186, 128, 0.33);;
}

input[type=text]:disabled, input[type=text][readonly="readonly"], input[type=password]:disabled, input[type=password][readonly="readonly"], input[type=email]:disabled, input[type=email][readonly="readonly"], input[type=url]:disabled, input[type=url][readonly="readonly"], input[type=time]:disabled, input[type=time][readonly="readonly"], input[type=date]:disabled, input[type=date][readonly="readonly"], input[type=datetime-local]:disabled, input[type=datetime-local][readonly="readonly"], input[type=tel]:disabled, input[type=tel][readonly="readonly"], input[type=number]:disabled, input[type=number][readonly="readonly"], input[type=search]:disabled, input[type=search][readonly="readonly"], textarea.materialize-textarea:disabled, textarea.materialize-textarea[readonly="readonly"] {
    color: inherit;
    border-bottom: 1px solid #d9d9d9;
}

input[type=text]:disabled + label, input[type=text][readonly="readonly"] + label, input[type=password]:disabled + label, input[type=password][readonly="readonly"] + label, input[type=email]:disabled + label, input[type=email][readonly="readonly"] + label, input[type=url]:disabled + label, input[type=url][readonly="readonly"] + label, input[type=time]:disabled + label, input[type=time][readonly="readonly"] + label, input[type=date]:disabled + label, input[type=date][readonly="readonly"] + label, input[type=datetime-local]:disabled + label, input[type=datetime-local][readonly="readonly"] + label, input[type=tel]:disabled + label, input[type=tel][readonly="readonly"] + label, input[type=number]:disabled + label, input[type=number][readonly="readonly"] + label, input[type=search]:disabled + label, input[type=search][readonly="readonly"] + label, textarea.materialize-textarea:disabled + label, textarea.materialize-textarea[readonly="readonly"] + label {
    color: #d9d9d9;
}

/*----------------------------------------
    icon page
------------------------------------------*/

.icon-demo {
    line-height: 50px;
}

.icon-container i {
    font-size: 3em;
    display: block;
    margin-bottom: 10px;
}

.icon-container .icon-preview {
    height: 120px;
    text-align: center;
}

.icon-holder {
    display: block;
    text-align: center;
    width: 150px;
    height: 115px;
    float: left;
    margin: 0px 0px 15px 0px;
}

.icon-holder p {
    margin: 0px 0;
}

/*----------------------------------------
    Login Page
------------------------------------------*/

.login-form {
    width: 280px;
}

.login-form-text {
    text-transform: uppercase;
    letter-spacing: 2px;
    font-size: 0.8rem;
}

.profile-image-login {
    width: 100px;
    height: 100px !important;
}

.login-text {
    margin-top: -6px;
    margin-left: -6px !important;
}

/*----------------------------------------
    Error Page
------------------------------------------*/

.text-long-shadow {
    text-shadow: rgb(0, 186, 128) 1px 1px, rgb(0, 186, 128) 2px 2px, rgb(0, 186, 128) 3px 3px, rgb(0, 186, 128) 4px 4px, rgb(0, 186, 128) 5px 5px, rgb(0, 186, 128) 6px 6px, rgb(0, 186, 128) 7px 7px, rgb(0, 186, 128) 8px 8px, rgb(0, 186, 128) 9px 9px, rgb(0, 186, 128) 10px 10px, rgb(0, 186, 128) 11px 11px, rgb(0, 186, 128) 12px 12px, rgb(0, 186, 128) 13px 13px, rgb(0, 186, 128) 14px 14px, rgb(0, 187, 129) 15px 15px, rgb(0, 188, 131) 16px 16px, rgb(1, 190, 132) 17px 17px, rgb(1, 192, 134) 18px 18px, rgb(1, 195, 136) 19px 19px, rgb(2, 197, 137) 20px 20px, rgb(2, 199, 139) 21px 21px, rgb(3, 201, 141) 22px 22px, rgb(3, 203, 142) 23px 23px, rgb(3, 205, 144) 24px 24px, rgb(4, 207, 146) 25px 25px, rgb(4, 209, 147) 26px 26px, rgb(5, 210, 149) 27px 27px, rgb(5, 212, 151) 28px 28px, rgb(5, 204, 152) 29px 29px, rgb(6, 206, 154) 30px 30px, rgb(6, 207, 156) 31px 31px, rgb(7, 209, 157) 32px 32px, rgb(7, 210, 159) 33px 33px, rgb(7, 212, 161) 34px 34px, rgb(8, 214, 162) 35px 35px, rgb(8, 216, 164) 36px 36px, rgb(9, 217, 166) 37px 37px;
    background-color: rgb(9, 217, 166); /*height: 100%;*/
    width: 100%;
    font-size: 5rem;
    line-height: 5.3rem;
    color: #fff !important;
    text-align: center;
    padding: 20px 0 !important;
}

#site-layout-example-right {
    background-color: rgb(9, 217, 166);
    height: 385px;
}

/*----------------------------------------
    Invoice Page
------------------------------------------*/

.invoice-icon i {
    font-size: 2rem;
}

.invoice-table {
    padding-top: 40px;
}

.invoice-text {
    padding: 18px 0px;
}

/*----------------------------------------
    Shadow effect
------------------------------------------*/

.shadow-demo {
    background-color: #26a69a;
    width: 100px;
    height: 100px;
    margin: 20px auto;
}

.collapsible-header {
    font-weight: 500;
}

/*=================================================================================
    Footer
====================================================================================*/

footer.page-footer {
    padding-top: 0px;
}

/*----------------------------------------
    footer charts
------------------------------------------*/

#world-map-markers {
    height: 300px;
}

#polar-chart-holder {
    padding-top: 20px;
}

/*=================================================================================
    Media Queries
====================================================================================*/

/* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) {
    /* STYLES GO HERE */
    .doughnut-chart-status {
        display: none;
    }
}

/* For Tables ----------- */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
    /* STYLES GO HERE */
    .doughnut-chart-status {
        display: none;
    }

    #card-stats .card-stats-compare {
        font-size: 0.8rem;
    }
}

/*----------------------------------------
    form 错误提示自定义
------------------------------------------*/

.input-field > .help-block {
    color: #FF5C5A;
    margin-left: 3rem;
    margin-top: 3px;
    font-size: 0.8rem;
}

.has-error > .help-block {
    color: #000000;
    margin-left: 1rem;
    font-size: 0.9rem;
}

.has-error > .help-block-error {
    color: #FF5C5A;
}

.has-error > .input-field {
    border-left: 0.2rem #FF5C5A solid;
}

.help-block {
    color: #000000;
    margin-top: 0;
    margin-left: 1rem;
    font-size: 0.9rem;
}

.help-block-error {
    color: #FF5C5A;
}

/*自定义波纹颜色*/
.waves-effect.waves-kcb .waves-ripple {
    background-color: rgb(1, 186, 128);
}

/* 头部切换语言 */
.change-language > a {
    height: 60px;
    line-height: 60px;
}

.change-language > a > i {
    height: auto;
    line-height: revert;
}

.change-language > .dropdown-change-language > li > a {
    font-size: 1rem;
    display: inline-flex;
}

/*考试题库导航*/
ul.question-nav li.col {
    padding: 2px;
}

ul.question-nav li a {
    margin: auto;
    display: block;
    padding: 0;
}

/*解决头部导航挡住锚点的问题*/
.questions {
    position: relative;
    padding-top: 64px;
    margin-top: -64px;
}

#test-paper > #paper-foot {
    text-align: center;
    padding: 2rem;
}

.btn-no-padding {
    padding: 0 0.7rem;
}

/* 搜索通用DIV */
.search-form .input-field label {
    top: 0.3rem;
}
.search-form .input-field input[type=text],
input[type=password],
input[type=email],
input[type=url],
input[type=time],
input[type=date],
input[type=datetime-local],
input[type=tel],
input[type=number],
input[type=search],
textarea.materialize-textarea {
    height: 2rem;
}

/*搜索框样式*/
.search-form .input-field .dropdown-content li {
    line-height: 1.3rem;
}

.search-form .input-field .dropdown-content li > a, .dropdown-content li > span {
    font-size: 1rem;
    padding: 5px 5px;
}

/*表格通用DIV*/

.table-list {
    background: rgba(255, 255, 255, 0.98);
    padding: 1rem;
}

table.table, th, td {
    border: 1px #E9EBEF solid;
    text-align: center;
}

table.table th {
    background-color: #F0F1F4;
}

.table-list tr a {
    color: #4D545B;
}

.td-content-left {
    text-align: left;
    padding-left: 1rem;
}

.td-content-center {
    text-align: center;
}

td p {
    margin: 2px auto;
    white-space: nowrap;
    overflow: hidden; /* 防止内容溢出 */
    text-overflow: ellipsis; /* 当内容溢出时显示省略号 */
}

td .btn {
    margin: 0.2rem;
}

/*进度条*/

/* 复选框自定义 */
.input-checkboxes .control-label {
    font-size: 0.8rem;
    -webkit-transform: translateY(-140%);
    -moz-transform: translateY(-140%);
    -ms-transform: translateY(-140%);
    -o-transform: translateY(-140%);
    transform: translateY(-140%);
}
.input-checkboxes .hint-block {
    margin-top: 1rem;
}

/*常用padding*/

.p-5 {
    padding: 2rem !important;
}

.p-1 {
    padding: 0.7rem !important;
}

.m-5 {
    margin: 2rem !important;
}

.mt-5 {
    margin-top: 2rem !important;
}

.mt-1 {
    margin-top: 1rem !important;
}

.mb-0 {
    margin-bottom: 0 !important;
}

.mb-1 {
    margin-bottom: 1rem !important;
}

.mb-2 {
    margin-bottom: 2rem !important;
}

.mb-5 {
    margin-bottom: 2rem !important;
}

.ml-5 {
    margin-left: 2rem !important;
}

.ml-1 {
    margin-left: 1rem !important;
}
.mr-3 {
    margin-right: 1.5rem !important;
}
.mr-5 {
    margin-right: 2rem !important;
}
.mr-12 {
    margin-right: 1.2rem !important;
}

.mr-1 {
    margin-right: 0.5rem !important;
}

.kcb-smail-i {
    font: normal normal normal 20px/1 'Material-Design-Icons';
}

.exam-progress {
    display: block;
    width: 145px;
    height: 140px;
    margin: 15px 0 0 20px;
}

/* 证书页面 */
.exam-cert {
    position: absolute;
    padding: 20px;
    left: calc(50% - 300px);
    background-color: #f1f4f5;
}

.exam-cert .cert-foot {
    position: absolute;
    right: 20px;
    top: 588px;
    font-size: 1.1rem;
}

.exam-cert .cert-body {
    text-indent: 2rem;
    position: absolute;
    top: 350px;
    font-size: 1.2rem;
    left: 135px;
    padding-right: 1rem;
}

.exam-cert .cert-name {
    position: absolute;
    top: 275px;
    left: 135px;
}

.exam-cert .cert-title {
    position: absolute;
    top: 187px;
    left: 266px;
}

.exam-cert .cert-code {
    display: block;
    float: right;
    margin-top: 20px;
    margin-right: 20px;
}

/*问题解析*/
#question-list .record-item {
    padding: 10px 60px 10px 10px;
    min-height: 84px;
    height: auto;
}

#question-list .answer-f {
    width: 24px;
    height: 24px;
    border-radius: 12px;
    display: inline-block;
}

#question-list .collection .collection-item.selected {
    background: #E8FFF8;
    border-left: 4px solid #00ECA5;
}

#quest-analysis {
    padding: 20px;
}

/*首页卡片背景*/
.exam-card {
    opacity: 90%;
}

.exam-card-title {
    opacity: 80%;
}

.exam-card-body {
    opacity: 90%;
}

.card .card-action {
    padding: 10px;
}
.card .card-action a {
    color: #4D545B;
    margin-right: 0;
    font-size: 1.5rem;
}
.card .card-action a:hover {
    color: #00ECA5;
}

.modal-max {
    max-height: 90%;
}

.modal.modal-fixed-footer.modal-max {
    height: 90%;
}

/*申请专业代码*/

.work_instruction img {
    width: 50px;
    display: block;
    margin: auto;
}

.side-nav .collapsible-body li a {
    margin: 0 0 0 2rem;
}

.side-nav.fixed a {
    padding: 0 18px;
}

/*
20211125 调整样式注释
.work_instruction li.work_item {
    display: inline-block;
    width: 100px;
    height: 60px;
    float: left;
}

.work_instruction span.title {
    display: inline-block;
    margin: auto;
    width: 100px;
    overflow: hidden;
    line-height: 20px;
    white-space: nowrap;
    text-align: center;
}
*/

.work_instruction li.work_item{
    float: left;
    margin-left: 1rem;
}

.work_instruction li.work_item a {
    padding: 0 1rem;
    border-radius: 6px;
}

/* 自动 填充样式 */
.tt-menu {
    z-index: 1000 !important;
}

.tt-menu .tt-suggestion {
    line-height: 2rem;
}

/*----------------------------------------
    User Page
------------------------------------------*/

#user-app hr { display: block; height: 1px; border: 0; border-top: 1px solid #e0e0e0; margin: 1em 0; padding: 0; }
.user-tips .file-name-title { font-weight: 500; }
#user-sidebar, #user-details { min-height: 800px; }
#user-sidebar li { padding: 10px 0; text-align: center; }
#user-sidebar li a { padding: 5px 0; color: #272727; display: block; }
#user-sidebar li a.active { background: #DDDDDD; border-radius: 2px; -webkit-border-radius: 2px; -moz-border-radius: 2px; }
#user-sidebar li a:hover { background: #DDDDDD; border-radius: 2px; -webkit-border-radius: 2px; -moz-border-radius: 2px; }
#user-app #user-sidebar, #user-app #user-details { margin-top: 0px; }
#user-sidebar > ul > li > a > span {
    font-size: 16px;
}
#user-details { padding: 15px; }
#user-details .card-item{ padding: 1rem 1.5rem; }
#user-details .card-item-border{ border-bottom: 1px dashed #0f9d58; padding: 1rem 1.5rem; }

#file-list { padding: 0; }
#file-list .collection { margin: 0; }
#file-list .collection .collection-item.avatar { height: auto; padding-left: 72px; position: relative; }
#file-list .collection .collection-item:hover { background: #e1f5fe; cursor: pointer; }
#file-list .collection .collection-item.selected { background: #e1f5fe; border-left: 4px solid #29b6f6; }
#file-list .collection .collection-item.avatar .secondary-content { position: absolute; top: 10px; right: -4px; }
#file-list .collection .collection-item.avatar .secondary-content.email-time { right: 8px; }
#file-list .collection .collection-item.avatar .icon { position: absolute; width: 42px; height: 42px; overflow: hidden; left: 15px; display: inline-block; text-align: center; vertical-align: middle; top: 20px; }
#file-list .collection .collection-item.avatar .circle { position: absolute; width: 42px; height: 42px; overflow: hidden; left: 15px; display: inline-block; vertical-align: middle; text-align: center; font-size: 1.5rem; color: #fff; font-weight: 300; padding: 10px; }
#file-list .collection .collection-item.avatar img.circle { padding: 0px; }
#file-list .attach-file { -ms-transform: rotate(90deg); /* IE 9 */

    -webkit-transform: rotate(90deg); /* Chrome, Safari, Opera */

    transform: rotate(90deg); color: #9e9e9e; font-size: 1.1rem; }

/*赵林修改样式*/
nav .nav-wrapper i{
    font-size: 24px;
    color: #333;
}
.hoverable{
    box-shadow: 0 0 3px 0 rgb(0 0 0 /5%), 0 0 3px 0 rgb(0 0 0 /5%);
}
.hoverable:hover{
    box-shadow: 0 0 5px 0 rgb(0 0 0 /15%), 0 0 5px 0 rgb(0 0 0 /15%);
}
.card {
    border-radius: 6px;
}
.no-hover{
    background-color: #000087;
}
ul.side-nav.fixed li.no-hover:hover{
    background-color:  #000087;
}
.zl-line{
    border-bottom: 2px solid #000087;
}
.zl-shadow{
    box-shadow: 0 0 3px 0 rgb(0 0 0 / 5%), 0 0 3px 0 rgb(0 0 0 / 5%);
}
.z-depth-2{
    box-shadow: 0 0 3px 0 rgb(0 0 0 / 10%), 0 0 3px 0 rgb(0 0 0 / 10%);
}
.zl-h6{
    font-size:18px;
    line-height:1.5rem;
    font-weight:600;
}
.btn-small2{
    height: 26px;
    line-height: 26px;
    padding:0 1rem;
    background-color: #00BA80;
    border: none;
    color: #fff;
}
i.left {
    float: left;
    margin-right: 10px;
}
.zl-grey{
    color: #9BA7B5;
}
.right2{
    margin-right: -2rem;
}
.zl-ring {
    color: #FFF;
    width: 30px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    padding: 0;
    background-color: #CFD6DA;
    border-radius: 50%;
}
.zl-button{
    color: #4D545B;
    background: #F0F1F4;
    border: solid 1px #CFD6DA;
    border-radius: 4px;
}
.zl-button:hover{
    color: #4D545B;
    background: #fff;
    border: solid 1px #CFD6DA;
    border-radius: 4px;
}
.zl-button2{
    color: #4D545B;
    background: #F0F1F4;
    border: solid 1px #CFD6DA;
    border-radius: 2px;
}
.zl-button2:hover{
    color: #4D545B;
    background: #fff;
    border: solid 1px #CFD6DA;
    border-radius: 2px;
}

.zl-button-green{
    color: #fff;
    background: #00BA80;
    border: solid 1px #00BA80;
    border-radius: 4px;
}
.zl-button-green:hover{
    color: #fff;
    background: #00ECA5;
    border: solid 1px #00ECA5;
    border-radius: 4px;
}
.zl-button-red{
    color: #fff;
    background: #ff4081;
    border: solid 1px #ff4081;
    border-radius: 4px;
}
.zl-button-red:hover{
    color: #fff;
    background: #ff80ad;
    border: solid 1px #ff80ad;
    border-radius: 4px;
}
.zl-button-green2{
    color: #fff;
    font-size: 20px;
    background: #00BA80;
    border: solid 1px #00BA80;
    border-radius: 4px;
    height: 40px;
    line-height: 40px;
    padding: 0 50px;
}
.zl-button-green2:hover{
    color: #fff;
    font-size: 20px;
    background: #00ECA5;
    border: solid 1px #00ECA5;
    border-radius: 4px;
    height: 40px;
    line-height: 40px;
    padding: 0 50px;
}
.zl-button-blue{
    color: #fff;
    font-size: 20px;
    background:#000087;
    border: solid 1px #000087;
    border-radius: 4px;
    height: 40px;
    line-height: 40px;
    padding: 0 50px;
}
.zl-button-blue:hover{
    color: #fff;
    font-size: 20px;
    background:#0000D2;
    border: solid 1px #000087;
    border-radius: 4px;
    height: 40px;
    line-height: 40px;
    padding: 0 50px;
}
.zl-corlor{
    background:#9BCCEC;
    box-shadow: none;
    color: #fff;

}

.zl-button-lag{
    padding: 0 80px;
    height: 50px;
    line-height: 50px;
    font-size: 20px;
    color: #fff;
}
.test-sm{
    background-color: #F0F1F4;
    border: solid 1px #E9EBEF;
    padding-top: 0 !important;
}
.table-list {
    background: rgba(255, 255, 255, 0.98);
    padding: 2rem 3rem 3rem;
}
.f-30{
    font-size: 30px;
}
.f-30{
    font-size: 80px;
}
.zl-card{
    color: #9BA7B5;
    padding:10px 20px;
    /*background-color:#80cbc4;*/
    border-radius: 6px;
    border: solid 1px #DBE0E3;
}
.zl-green{
    color: #00BA80;
}
.zl-icon{
    display: inline-block;
    background: #00BA80;
    border-radius: 50px;
    line-height: 60px;
    color: #fff;
    width: 60px;
    text-align: center;
}

#base-info input,select {
    background-color:#F0F1F4;
    border: 1px solid #F0F1F4;
    border-radius: 0;
    outline: none;
    height: 2rem;
    width: 100%;
    font-size:13px;
    padding: 0;
    box-shadow: none;
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    transition: all .3s;
    border-radius: 4px;
}
.zl-more{
    font-size: 13px;
    color: #9BA7B5;
    margin-right: 10px;
}
h6 {
    font-size: 16px;
    line-height: 1.1rem;
    margin: 0.5rem 0 0.4rem 0;
    font-weight: 600;
    vertical-align: middle;
    display: inline-flex;
}
th{
    padding: 10px 5px;
    vertical-align: middle;
    display: table-cell;
}
td{
    padding: 5px;
    vertical-align: middle;
    display: table-cell;
}
.example-text ul,.example-text ul li{
    list-style-type: square;
    margin: 0;
    padding: 0;
}
a.text-link{
    color: #000087;
}
a.text-link:hover{
    color: #0000D2;
}
.work_instruction li.work_item {
    margin-left: 0;
    float: none;
}
.work_instruction li.work_item a{
    border-radius: 4px;
    height: 30px;
    line-height: 30px;
    width: 100%;
    border: solid 1px #000087;
    color: #fff;
    background-color: #000087;
}
.work_instruction li.work_item a:hover{
    border-radius: 4px;
    height: 30px;
    line-height: 30px;
    width: 100%;
    border: solid 1px #0000D2;
    color: #0000D2;
    background-color: #fff;
}
.zl-help a{
    border-radius: 4px;
    height: 30px;
    line-height: 30px;
    width: 100%;
    margin-bottom: -5px;
    border: solid 1px #000087;
    color: #fff;
    background-color: #000087;
}
.zl-help a:hover{
    border-radius: 4px;
    height: 30px;
    line-height: 30px;
    width: 100%;
    margin-bottom: -5px;
    border: solid 1px #0000D2;
    color: #0000D2;
    background-color: #fff;
}
.zl-111 td{
    font-size: 13px;
    text-align: left;
}
.zl-grey01{
    background-color:#E9EBEF;
    border-top: solid 1px #DCE1E4;
}
.modal li a{
    color: #000087;
    font-size: 13px;
}
.modal li a:hover{
    color:#0000D2;
}
#apply-view .card-panel{
    box-shadow: none;
}
.zl-work{
    font-size: 13px;
    color: #9BA7B5;
}
.zl-work b{
    font-size: 13px;
    font-weight:normal;
}
.ueditor-content p{
    margin-top: 0;
}