/*
* 全站共用CSS
* 主框架或首頁之CSS
*/

body {
    background-color: #ccc;
    font-family: "Helvetica", "Times New Roman", "微軟正黑體", "sans-serif";
    /*padding-top: 50px;
    padding-bottom: 20px;*/
    overflow-y: hidden;
}


/** share layout **/
/* layout frame & menu*/
#wrapper, .wrapper {
    width: 100%;
}
.wrapper-left {
    position: absolute;
    top: 0;
    left: 0;
    min-height: 0;
    width: 250px;
}
.wrapper-right {
    width: 100%;
    padding-left: 250px;
}

/* redefine bootstrap style */
.wrapper .navbar {
    border: 0;
    border-radius: 0;
    margin-bottom: 0;
}
/* menu bg color */
.wrapper .navbar-default {
    background-color: #ccc;
    border-color: #999;
}

/** Left menu start **/
.sidebar .sidebar-nav.navbar-collapse {
    padding-left: 0;
    padding-right: 0;
}
/* logo */
.sidebar .sidebar-nav .sidebar-image {
    padding: 15px;
    text-align: center;
    background-color: #ccc;
    border-bottom: 1px solid #999;
}
.sidebar .sidebar-nav .sidebar-image img {
    width: 75%;
    height: auto;
    margin: auto;
}

/* menu items group */
/* 共用a style */
.sidebar a {
    color: #333;
    background-color: #eee;
    border-bottom: 1px solid #999;
}
/* menu group */
.sidebar .sidebar-nav > ul > li > a {
    font-weight: bold; 
    color: #333;
}
/* collapse on */
.sidebar .sidebar-nav > ul > li.active > a {
    font-weight: bold;
    color: mediumvioletred;
}
.sidebar .sidebar-nav ul li a:hover {
    background-color: hotpink;
}
.sidebar .sidebar-nav ul li a.active {
    color: deeppink;
    font-weight: bold;
}

/* collapse icon */
.sidebar .sidebar-nav ul li .fa, .sidebar .sidebar-nav ul li .material-icons, .sidebar .sidebar-nav ul li .glyphicon {
    margin-right: 8px;
}
.sidebar .arrow {
    float: right;
}
.sidebar .fa.arrow:before {
    content: "\f104";
}
.sidebar .active > a > .fa.arrow:before {
    content: "\f107";
}

/* sub menu items */
.sidebar .sidebar-nav ul li ul.nav-second-level li a {
    padding-left: 4em;
    font-weight: normal; 
    font-family: "Helvetica", "Times New Roman", "微軟正黑體", "sans-serif";
    background-color: #c3c3c3;
}
.sidebar .sidebar-nav ul li ul.nav-second-level li a:hover {
    background-color: hotpink;
    color: white;
}
.sidebar .sidebar-nav ul li ul.nav-second-level li a.active {
    color: deeppink;
    font-weight: bold;
}
/** Left menu end **/

/** Top menu start **/
.menu-top {
    width: 100%;
    height: 50px;
}
.menu-top .header-title {
    font-family: "標楷體";
    color: #333;
    font-size: 24px;
    padding: 15px 15px 15px 10px;
    line-height: 25px;
    height: 35px;
}
.menu-top .navbar-top-links {
    margin-right: 0;
}
.menu-top .navbar-top-links li {
    display: inline-block;
}
.menu-top .navbar-top-links li:last-child {
    margin-right: 15px;
}
/* top menu items */
.menu-top .navbar-top-links li a {
    padding: 15px;
    min-height: 50px;
    color: deeppink;
    font-weight: bold;
    transition: background-color 1s;
}
.menu-top .navbar-top-links li a:hover {
    background-color: deeppink;
    color: #eee;
} 
.menu-top .navbar-top-links .dropdown-menu li {
    display: block;
}
.menu-top .navbar-top-links .dropdown-menu li:last-child {
    margin-right: 0;
}
.menu-top .navbar-top-links .dropdown-menu li a {
    padding: 3px 20px;
    min-height: 0;
}
.menu-top .navbar-top-links .dropdown-menu li a div {
    white-space: normal;
}
/* popup menu items*/
.menu-top .navbar-top-links .dropdown-user li a {
    color: #333;
}
.menu-top .navbar-top-links .dropdown-user li a:hover {
    background-color: lightpink;
}
/** Top menu end **/

/** Page client start **/
/* min-height set by js */
.page-wrapper {
    width: 100%;
    padding: 0 15px;
    background-color: white;
    border: 1px solid #999;
    overflow-y: scroll;
}

@media (min-width: 768px) {
    .page-wrapper {
        padding: 0 15px;
        background-color: white;
        border: 1px solid #999;
        min-height: 700px;
        overflow-y: scroll;
    }
}
/** Page client end **/

/** 共用設定 **/
/** Breadcrumb **/
.breadcrumb {
    font-size: 1.1em;
    font-weight: bold;
    color: #444;
    margin-bottom: 5px;
    background-color: transparent;
    border-bottom: 1px solid #ddd;
}
.breadcrumb i:before {
    content: " ";
    color: #999;
    margin: 5px 0 5px 0;
}
.breadcrumb i:after {
    content: " ";
}
.breadcrumb span:last-child {
    color: #d58512;
}
/** Breadcrumb end **/

/** Inquiry toolbar **/
.inquirybar {
    padding: 8px 15px;
    margin-bottom: 5px;
    border-radius: 4px;
    border: 1px solid #aaa;
    color: #666;
}
.inquirybar-default {
    background-color: #ebf6f7;
}
.inquirybar input.form-control {
    width: 180px;
}
.inquirybar .form-group {
    margin-right: 5px;
}
.inquirybar .radio, .inquirybar .checkbox {
    margin-bottom: 5px;
}
.inquirybar .form-inline {
    margin-bottom: 8px;
}
.inquirybar .form-inline:last-child {
    margin-bottom: 0;
}

/** Inquiry toolbar end **/

/** Action bar **/
div.actionbar {
    margin-bottom: 5px;
}
.table td.actionbar {
    text-align: center;
}
/** Action bar end**/

/** List table **/
.table thead {
    background-color: #5f9ea0; /*#337ab7;*/
    color: #eee;
}
.table thead tr th {
    text-align: center;
}
.data-warning .table thead {
    background-color: #ef5350;
}
/** List table end **/

/** Pagination **/
.pagination-info {
    margin-bottom: 15px;
    color: #333;
    font-weight: bold;
}
.pagination-info span {
    margin-right: 4px;
}
.pagination-info span:last-child {
    margin-left: 15px;
}
.pagination-btn {
    text-align: right;
}
.pagination-btn .pagination {
    margin-top: 0;
}
.pagination-btn .pagination > li > a {
    color: white;
    background-color: #2a83a2;
}
.pagination-btn .pagination > li > a:hover {
    background-color: #84b9cb;
}
.pagination-btn .pagination > li.active > a {
    background-color: #2ca9e1;
    border-color: #666;
}
/** Pagination end**/

/** Modal form **/
.modal .modal-dialog .modal-header {
    background-color: #337ab7;
}
/** Modal form end **/

/* Other define */
/* input required style */
.input-require {
    border-left: 4px solid red !important;
}
/* alert message */
.msg-alert {
    display: none;
}
.box-shadow {
    box-shadow: 6px 6px 10px #999;
}
.form-inline .form-control.input-w-lg {
    width: 500px;
}
.label.caption {
    display: block;
    width: 120px;
    margin-bottom: 0;
}
.icon-text-left {
    padding-left: 5px;
}
.icon-text-right {
    padding-right: 5px;
}
/* button wide */
.btn-xs-w {
    width: 6em;
}
.btn-sm-w {
    width: 8em;
}
.btn-md-w {
    width: 10em;
}
.btn-lg-w {
    width: 12em;
}
div.label-empty {
    display: inline-block;
    width: 100%;
    margin-bottom: 5px;
}
div.label-empty:before {
    content: "\a0"; /* add   to content */
}

/** 無panel or container表單 **/
.panel-form.none {
    margin: 15px;
}
.panel-form.none > div {
    margin-bottom: 15px;
}
/** end **/

/* Bootstrap redefine */
.panel-heading.none {
    padding: 5px 15px;
}
.form-control[disabled] {
    background-color: #cfcfcf;
}

.prompt {
    background-color: #ff8a80;
    color: white;
    padding: 8px 15px;
    border-radius: 4px;
    margin-left: 8px;
}
/** Other define end **/

/* google material icon */
.material-icons {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 18px; /* Preferred icon size is 24px */
    display: inline-block;
    line-height: 1;
    text-transform: none;
    letter-spacing: normal;
    word-wrap: normal;
    white-space: nowrap;
    direction: ltr;
    /* Support for all WebKit browsers. */
    -webkit-font-smoothing: antialiased;
    /* Support for Safari and Chrome. */
    text-rendering: optimizeLegibility;
    /* Support for Firefox. */
    -moz-osx-font-smoothing: grayscale;
    /* Support for IE. */
    font-feature-settings: 'liga';
    vertical-align: middle; /* tristan */
}
/* google material icon end */

.padding-top-10 {
    padding-top: 10px;
}