* {
    font-family:"微軟正黑體", "新細明體";
    word-break: break-all;
}
h1, h2, h3, h4, h5, h6 {
    font-family: "微軟正黑體", "新細明體";
    color: #333333;
    line-height: 1.4666666667;
}
h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6  {
    margin-top: 0px;
    margin-bottom: 10px;
}
body {
    font-size: 16px;
    line-height: 1.4666666667;
    color: #333333;
    background-color: #ffffff;
    font-weight: 400;
}
a {
    color: #333;
}
hr {
    margin-top: 10px;
    margin-bottom: 10px;
    border: 0;
    border-top: 1px solid #eee;
}
form{ 
    margin: 0px; 
}
/* 解決 calendar套件 邊框不見問題 */
tbody{
	background-color: transparent;
}
.light-gray-bg {
    background-color: #FFFDE7;
}
.hr-1{
    margin-top: 10px;
    margin-bottom: 10px;
    border: 0;
    border-top: 5px solid #09afdf;
}
.block {
    margin-bottom: 10px;
}
.header-top-first li{
    color:#fff;
    font-size:17px;
}
.header-top.colored {
    background-color: #3F51B5;
    border-bottom: 1px solid #3F51B5;
}
.business-header {
    padding-top:20px;
    padding-bottom: 10px;
    background-color: #FFFDE7;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}
.business-header .business-header-logo{
    display:table;
}
.business-header .business-header-logo a{
    text-decoration: none;
}
.business-header .business-header-logo .business-header-logo-img{
    display:table-cell;
    width: 85px;
}
.business-header .business-header-logo .business-header-logo-img img{
    width:70px;
}
.business-header .business-header-logo .business-header-logo-text{
    display: table-cell;
    vertical-align: middle;
}
.business-header .business-header-logo .business-header-logo-text .logo-text{
    font-size: 33px;
    font-weight:700; 
}
.business-header .business-header-text{
    font-size: 30px;
    color:#0083b9;
    font-weight:700; 
}
@media (max-width: 500px){
.business-header .business-header-logo .business-header-logo-text .logo-text{
    font-size: 24px; 
}
.business-header .business-header-text{
    font-size: 25px;
    color:#0083b9;   
}
}

.navbar {
    position: relative;
    min-height: 50px;
    margin-bottom: 0px;
    border: 1px solid transparent;
    background-color: #ffe100;
    border: 0px solid transparent;
    border-top: #0083b9 5px solid;
}
.navbar-nav > li > a { 
    color:#000835;
}
.dropdown > a:before {
    font-family: 'FontAwesome';
    content: "";
    position: absolute;
    top: 31px;
    left: auto;
    right: 6px;
    line-height: 1;
    color: #d1d1d1;
    font-size: 14px;
}
@media (min-width: 768px){
.navbar-nav {
    float: right;
    margin: 0;
}
}
@media (max-width: 767px){
.navbar-nav .open .dropdown-menu {
    background-color: #FFCC80;  
}
}
.colored .btn-default {
    color: #ffffff;
    background-color: rgb(173, 181, 228);
    border-color: rgb(63, 81, 181);
}
.list-inline {
    margin-top: 4px;
    margin-bottom: 1px;
}
.nav > li > a:hover, .nav > li > a:focus {
    text-decoration: none;
    background-color: #0083B9;
    color: #ffffff;
}
.dropdown-menu > li > a {
    padding: 10px 20px;
    font-size: 14px;
    color: #000000;
}
.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus, .nav .open > a, .nav .open > a:hover, .nav .open > a:focus, .dropdown-menu > .active > a, .dropdown-menu > .active > a:hover, .dropdown-menu > .active > a:focus, .dropdown-menu .menu > .active > a, .dropdown-menu .menu > .active > a:hover, .dropdown-menu .menu > .active > a:focus {
    background-color: #0083B9;
    color: #ffffff;
    border-color: #0083B9;
}
.navbar-toggle {
    background-color: #2196F3;
    border: 1px solid #03A9F4;
}
.navbar-toggle .icon-bar {
    background-color: #fff;
}
.navbar-toggle-text{
    float:right;
}
.navbar-toggle-text span{
    color:#fff;
    display: inline;
}
.navbar-toggle-icon{
    float:left;
    padding-top: 5px;
    padding-right: 5px; 
}
.colored .btn-group .btn-login {
    color:#000;
}
.colored  .btn-signup{
    background-color: rgb(71, 85, 169);
    border-color: rgb(63, 81, 181);
}

/*左側總會長*/
.left-border{
    border:1px solid #bdbdbd; 
    padding:10px;
    background-color: #fff;
}
.left-border .left-title span{
    background-color: #3f51b5;
    padding: 5px;
    color: #fff;
    border-radius: 5px;
    padding-left: 10px;
    padding-right: 10px;
    position: relative;
    top: -25px;
    font-size: 20px;
}
.left-border .left-people-img{
    margin-top: -10px;
}
.left-border .left-title-bg .left-word-style1{
    font-size: 20px;
}
.left-border .left-title-bg .left-word-style2{
    font-size: 18px;color:#ff8f00;
}

.table {
    margin-bottom: 20px;
}
.contain-b-1{
    border:1px solid #bdbdbd;
}
.footer {
    font-size: 15px;
    line-height: 1.5;
}
.dark .subfooter {
    background-color: #3F51B5;
    border-color: #3F51B5;
}
.footer h2.title {
    font-size: 22px;
    text-transform: none;
    margin-bottom: 10px;
    color:#ffe100;
}
.subfooter p,
.subfooter p a,
.footer-content p,
.footer-content a,
.footer-content .list-icons,
.footer-content .list-icons i{
    color:#fff;
}
.dark .footer-content .nav-pills > li > a, .dark .footer-content .nav-pills > li.active > a, .dark .footer-content .nav-pills > li.active > a:focus, .dark .footer-content .nav-pills > li > a:focus {
    color: #fff;
    font-size:15px;
}
.table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td {
    padding: 15px 15px;
    border-top: 0px solid #f3f3f3;
}
.title-pic{
    display: inline;
    vertical-align: middle;
    max-width: 30px;
    margin-right: 5px;
}
.thumbnail {
    display: block;
    padding: 10px;
    margin-bottom: 20px;
    line-height: 1.42857143;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 4px;
    -webkit-transition: border .2s ease-in-out;
    -o-transition: border .2s ease-in-out;
    transition: border .2s ease-in-out;
}
.index-more{
    margin-top:0px;
}
.breadcrumb {
    padding: 0px 15px;
    background-color: transparent;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    margin-bottom: 0;
    font-size: 15px;
    padding-left: 0;
    margin-bottom: 5px;
    
}




/* overlay at start */
.mfp-fade.mfp-bg {
  opacity: 0;

  -webkit-transition: all 0.15s ease-out;
  -moz-transition: all 0.15s ease-out;
  transition: all 0.15s ease-out;
}
/* overlay animate in */
.mfp-fade.mfp-bg.mfp-ready {
  opacity: 0.8;
}
/* overlay animate out */
.mfp-fade.mfp-bg.mfp-removing {
  opacity: 0;
}

/* content at start */
.mfp-fade.mfp-wrap .mfp-content {
  opacity: 0;

  -webkit-transition: all 0.15s ease-out;
  -moz-transition: all 0.15s ease-out;
  transition: all 0.15s ease-out;
}
/* content animate it */
.mfp-fade.mfp-wrap.mfp-ready .mfp-content {
  opacity: 1;
}
/* content animate out */
.mfp-fade.mfp-wrap.mfp-removing .mfp-content {
  opacity: 0;
}


.page-contain{
    background-color:#fff;
    padding:20px;
}

.listing-item{
    padding: 5px;
}
.listing-item .body {
    padding: 8px;
}
.listing-item img{
    width:100%;
}
.listing-item .body h3{
    text-align:center;    
    margin-bottom: 2px;
}
.listing-item .body h5{
    text-align:center;
    font-size: 16px;
    margin-bottom: 3px;
}
.table .th-bg th{
    background-color: #ffe100;
}
.login-bg-1{
    background-color: #EEEEEE;
}
.form-control {
    color: #000000;
}
.form-title{
    color: #e53935;
    font-weight: 700;
}

.page-comments .page-comments-c-title {
    color: #3f51b5;
    font-weight: 700;
}
.page-comments .page-comments-d {
    border: 2px solid #09afdf;
    padding: 10px;
    margin-bottom: 10px;
    border-radius: 10px;
}
.page-comments .page-comments-b-title {
    color: #f44336;
    font-weight: 700;
}
.page-comments-d .comment-meta span {
    color: #D84315;
}
.page-comments-d .comment-meta {
    color: #000;
}
.message-title{
    background-color:#ffe100;
    padding:10px;
}
.comment-content {
    border-bottom: 1px solid #f1f1f1;
    margin-bottom: 20px;
    clear: both;
}

.d-flex{
    display: flex;
}

.flex-wrap{
    flex-wrap: wrap;
}

.order-1{
    -ms-flex-order:1;
    order:1;
}

.order-2{
    -ms-flex-order:2;
    order:2;
}

@media (min-width:992px){
    .order-lg-1{
        -ms-flex-order:1;
        order:1;
    }
    
    .order-lg-2{
        -ms-flex-order:2;
        order:2;
    }
}