body.overflow-hidden {
    overflow: hidden;
}

/*彈出選單*/
#side-menu {
    display: none;
    position: fixed;
    width: 180px; /*寬度*/
    top: 0px;/*出現位置*/
    right: -180px;
    height: 100%;
    overflow-y: auto;
    z-index: 1035;
    background: #a0c26f;
    padding: 20px 5px;
    color: #333;
    transition: 0.4s;
}

body.side-menu-visible #side-menu {
    transform: translateX(-180px);
}

#side-menu .contents {
    margin-top: 15px;
}

#side-menu .nav-link {
    color: #333;
    font-size: 1.2em;
    font-weight: 600;
    padding: 12px 0;
}

    #side-menu .nav-link:hover {
        opacity: 0.8;
    }

#side-menu .close {
    font-size: 2em;
    font-weight: normal;
    margin-top: -15px;
    /*margin-right: -5px;*/
    opacity: 0.7;
    padding: 0;
}

.side-menu-overlay {
    position: fixed;
    left: 0;
    top: 0;
    min-width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.4);
    z-index: 100;
    display: none;
}

#side-menu.side-menu-left {
    right: auto;
    left: -180px;
}
#topmenu > li > a, #topmenu > li > a:hover, #topmenu > li > a:visited {
    color: white;
}

    #topmenu > li > a:hover {
        background-color: #77aa3e;
    }


/*彈出選單，被選取時的顏色*/
#topmenu > li.active, #topmenu > li.active a:hover {
    background-color: #648f34;
    color: white;
}

body.side-menu-visible #side-menu.side-menu-left {
    transform: translateX(180px);
}


/*系統設定*/
.upload-img {
    background-color: #99cc65;
}
.titleTr {
    background-color: #eeeeee;
    text-align: center;
}

td {
    word-wrap: break-word;
    word-break: break-all;
}

.gvHeader {
    padding: 5px;
    text-align: center;
}

.gvCell {
    padding: 5px;
}

.plink {
    cursor: pointer;
}

.pdate {
    color: #888888;
    font-size: 0.9em;
}

.home-content-div {
    padding: 5px;
    /*border-bottom: dashed 1px #CCCCCC;*/
    cursor: pointer;
    margin-bottom: 5px;
}

.bottom-border-div {
    border-bottom: dashed 1px #CCCCCC;
}

.badge-blue {
    background: #0099FF;
}

.badge-green {
    background: green;
}

.badge-yellow {
    background: #2b8211;
}

.badge-keyword {
    background: #ae6ff6;
    color: #FFFFFF;
    font-size: 0.95em;
    padding-top: 5px;
}

    .badge-keyword:hover {
        background: red;
    }

.stable {
    border: solid 1px #CCCCCC;
    border-collapse: separate;
    -webkit-border-top-left-radius: 5px;
    -webkit-border-top-right-radius: 5px;
    -moz-border-radius-topleft: 5px;
    -moz-border-radius-topright: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

    .stable th {
        padding: 3px;
        background-color: #eeeeee;
        vertical-align: middle;
        border-bottom: solid 1px #CCCCCC;
        text-align: center;
        font-weight: bold;
    }
    /*.stable thead tr td {
        padding: 17px;
        background-color: #333333;
    }*/
    .stable td {
        padding: 4px;
        border-bottom: solid 1px #CCCCCC;
    }

.form-divider {
    clear: both;
    height: 1px;
    border-bottom: solid 1px #CCC;
    margin-top: 6px;
    margin-bottom: 6px;
}



a:link {
    color: #0c5694;
    text-decoration: none;
    font-size: 1em;
}

a:hover,
a:focus {
    color: #0d3256;
    text-decoration: underline;
}

/*a:focus {
        outline: thin dotted #333;
        outline: 5px auto -webkit-focus-ring-color;
        outline-offset: -2px;
    }*/

a.light:link, a.light:visited {
    color: #FFFFFF;
    text-decoration: none;
}
a.light:hover, a.light:focus {
    color: #f7eb06;
    text-decoration: underline;
}



/*遮罩*/
.watermarked {
    background-color: #5C6A53;
    pacity: 0.4;
    filter: alpha( opacity=40 );
    -moz-opacity: 0.4;
    -webkit-opacity: 0.4
}

.lon-popup {
    display: none;
    z-index: 101;
    top: -300px;
    background: white;
    position: fixed;
    padding: 15px;
    box-shadow: 3px 3px 10px 1px #615E5E;
    -webkit-box-shadow: 3px 3px 10px 1px #615E5E;
    -moz-box-shadow: 3px 3px 10px 1px #615E5E;
    -o-box-shadow: 3px 3px 10px 1px #615E5E;
}

.lon-popup-mask {
    height: 2000px;
    width: 100%;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 100;
    background-color: #5C6A53;
    pacity: 0.4;
    filter: alpha( opacity=40 );
    -moz-opacity: 0.4;
    -webkit-opacity: 0.4
}


.replybody-title {
    border: solid 1px #CCCCCC;
    margin-bottom: 8px;
    padding: 5px;
}

.banner {
    margin-top: -10px;
    font-size: 1.2em;
    font-weight: bold;
    background: #90be5c;
    /*background: linear-gradient(135deg, rgba(174,188,191,1) 0%,rgba(10,14,10,1) 0%,rgba(10,14,10,1) 4%,rgba(10,14,10,1) 64%,rgba(10,14,10,1) 64%,rgba(110,119,116,1) 65%,rgba(224,224,224,1) 100%);*/
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    color: #000;
    border: solid 1px #2b8211;
    /*border-bottom:none;*/
    border-radius: 5px 5px 0 0;
    padding: 5px 5px 5px 10px;
}

.form-label {
    color: #2c6dc8;
    font-weight: bold;
}

.circle-icon {
    font-size: 1.5em;
    background-color: #648f34;
    color: white;
    border-radius: 30px;
    padding: 7px;
    vertical-align: middle;
}

    .circle-icon, .sm {
        font-size: 1em;
    }

.thead-dark {
    background-color: #648f34;
    color: white;
    text-align: center;
}
    .thead-dark td {
        text-align: center;
    }
    .title-cell {
        background-color: #EEE;
        text-align: right;
        white-space: nowrap;
    }

.list-group-item {
    border: solid 1px #648f34;
}

/*我的教案頁面，徵選年度*/
.year-badge {
    position: absolute;
    left: 20px;
    top: 5px;
    background-color: #648f34;
    color: white;
    padding: 3px;
    border-radius: 10px;
}

.ficon {
    margin-right: 7px;
    color: #FFFFFF;
}
.carousel {
    width: 100%;
    border: solid 1px #648f34;
    margin: 0 auto;
}
/*.banner-bg {
    background: linear-gradient(170deg, #f4ba4f 50%,#f8e6b2 12%,#f8e6b2 25%,#f4ba4f 39%,#f7e8c8 51%,#f8d189 60%,#f4ba4f 76%,#f4ba4f 100%);
}*/

.banner-bg {
    background: linear-gradient(170deg, #000000 50%,#595959 12%,#666666 25%,#474747 39%,#2c2c2c 50%,#4c4c4c 51%,#111111 60%,#648f34 76%,#1c1c1c 91%,#131313 100%);
}


/*bootstrap-navbar-default*/

.dropdown-menu .sub-menu {
    left: 100%;
    position: absolute;
    top: 0;
    visibility: hidden;
    margin-top: -1px;
}

.dropdown-menu li:hover .sub-menu {
    visibility: visible;
}
.dropdown-menu > li > a:hover {
    color: white;
    background-color: #77aa3e;
}

.dropdown:hover .dropdown-menu {
    display: block;
}
.dropdown-menu active {
    color: #FFF;
    background-color: #648f34;
}
.dropdown-menu > .active > a, .dropdown-menu > .active > a:hover {
    color: #FFF;
    background-color: #648f34;
}

.nav-tabs .dropdown-menu, .nav-pills .dropdown-menu, .navbar .dropdown-menu {
    margin-top: 0;
}
/*右選單，登入者名稱，移上顏色*/
.navbar-right > li > a:hover {
    background-color: #77aa3e;
}
.navbar-right > li > a {
    color: #ffffff;
}

.navbar-toggle .collapsed > span.icon-bar{
    color:red;
}

.navbar .sub-menu:before {
    border-bottom: 7px solid transparent;
    border-left: none;
    border-right: 7px solid rgba(0, 0, 0, 0.2);
    border-top: 7px solid transparent;
    left: -7px;
    top: 10px;
}

.navbar .sub-menu:after {
    border-top: 6px solid transparent;
    border-left: none;
    border-right: 6px solid #fff;
    border-bottom: 6px solid transparent;
    left: 10px;
    top: 11px;
    left: -6px;
}


.navbar-custom {
    position: fixed;
    bottom: 0;
    color: White;
    width: 100%;
    background-color: #2b8211;
    /*border-color: #bbbbbb;*/
    border-radius: 3px;
}
.out-frame {
    border: solid 1px #2b8211;
}
.navbar-default {
    background-color: #2b8211;
    border-color: #649c32;
}

    .navbar-default .navbar-brand {
        color: white;
    }

        .navbar-default .navbar-brand:hover,
        .navbar-default .navbar-brand:focus {
            color:rgba(0, 0, 0, .075);
            background-color: transparent;
        }

    .navbar-default .navbar-text {
        color: white;
    }

    .navbar-default .navbar-nav > li > a, .navbar-default .navbar-nav > li > div {
        color: white;
        padding: 15px 10px;
    }

        .navbar-default .navbar-nav > li > a:hover,
        .navbar-default .navbar-nav > li > a:focus,
        .navbar-default .navbar-nav > li > div:hover,
        .navbar-default .navbar-nav > li > div:focus {
            color: #e4f8d5;
            background-color: #77aa3e;
        }

        .navbar-default .navbar-nav > .active > a,
        .navbar-default .navbar-nav > .active > a:hover,
        .navbar-default .navbar-nav > .active > a:focus {
            color: #fff;
            background-color: #648f34;
        }

    .navbar-default .navbar-nav > .disabled > a,
    .navbar-default .navbar-nav > .disabled > a:hover,
    .navbar-default .navbar-nav > .disabled > a:focus {
        color: #ccc;
        background-color: transparent;
    }

    .navbar-default .navbar-toggle {
        border-color: #648f34;
    }

        .navbar-default .navbar-toggle:hover,
        .navbar-default .navbar-toggle:focus {
            background-color: #ddd;
        }

        .navbar-default .navbar-toggle .icon-bar {
            background-color: #888;
        }

    .navbar-default .navbar-collapse,
    .navbar-default .navbar-form {
        border-color: #e7e7e7;
    }

    .navbar-default .navbar-nav > .open > a,
    .navbar-default .navbar-nav > .open > a:hover,
    .navbar-default .navbar-nav > .open > a:focus {
        color: #555;
        background-color: #e7e7e7;
    }