﻿@charset "utf-8";
/* CSS Document */

/*    Notes

    CSS 具有後來覆蓋特性，Firefox、Chrome 要排在 IE 之前

    在語法結尾加上「\9」，可使之在 IE 向下相容
*/



html {
    position: relative;
    min-height: 100%;
}
body {
    font-size: 16px;
    color: #000;
    background-color: #FFE;
}
a {
    border-radius: 10px; /* IE 6+  */
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;

    text-decoration: underline;
    cursor: pointer;
}

div {
    word-wrap: break-word;
    word-break: normal;
}
input {
    padding: 0 5px;
}


/*    網站內容 */

/* 上方導覽列 */
#topBrand {
    padding: 5px 30px;
    color: #FFF;
    background-color: #344F4A;
}
@media (max-width: 768px) {
    #topBrand {
        padding: 5px 10px 20px 10px;
    }
}
#topBrand a {
    color: #FFF;
}
#topBrand a:link, #topBrand a:visited {
    text-decoration: none
}
#topBrand a:hover, #topBrand a:focus {
    color: #FFC;
}
#topBrand a:active {
    color: #FF5;
}
#siteName span:nth-child(1) {
    font-size: 28px;
    font-weight: bold
}
#siteName img {
    margin-top: 10px;
    margin-right: 10px;
}
#siteName span:nth-child(2) {
    font-size: 18px;
}
@media (max-width: 768px) {
    #siteName img {
        margin: 0;
    }
    #siteName span:nth-child(1) {
        font-size: 24px;
        font-weight: bold
    }
    #siteName span:nth-child(2) {
        font-size: 14px;
    }
}

#topMenu {
    margin: 0;
    padding: 5px 0;
    background-color: #344F4A;
    z-index: 20;
}
#topMenu a {
    color: #FFF;
}
#topMenu a:link, #topMenu a:visited {
    text-decoration: none;
    background: transparent;
}
#topMenu a:hover, #topMenu a:focus {
    color: #FFC;
}
#topMenu a:active {
    color: #FF5;
}
#topMenu ul {
    background-color: #344F4A;
}
#topMenu ul li {
    padding: 5px;
}


#container {
    margin: 0 auto;
    padding: 30px 40px 100px 40px;
}
@media (max-width: 768px) {
    #container {
        padding: 0 5px 100px 5px;
    }
}
    #container a:link {
        color: #42413C;
        text-decoration: underline;
    }
    #container a:visited {
        color: #6E6C64;
        text-decoration: underline;
    }
    #container a:hover, #container a:focus {
        color: #333;
        text-decoration: none;
    }
    #container a:active {
        color: #000;
    }
        #show ol li {
            padding: 3px;
        }
        #show a:link,
        #show a:visited {
            color: #0000FF;
        }
        #show a:hover,
        #show a:focus {
            color: #0000FF;
        }
        #show a:active {
            color: #0000FF;
        }
        #container .action a:link,
        #container .action a:visited {
            color: #0d6efd;
        }
        #container .action a:hover,
        #container .action a:focus {
            color: #0000FF;
        }
        #container .action a:active {
            color: #0000FF;
        }


/* 頁尾 */
footer {
    color: #FFF;
    text-align: center;
    background-color: #344F4A;

    width: 100%;
    padding: 10px 0;
    position: absolute;
    bottom: 0;
}

.nav-sidebar {
    width: 100%;
    padding: 8px 0;
    border-right: 1px solid #ddd;
}
.nav-sidebar a {
    color: #333;
    -webkit-transition: all 0.08s linear;
    -moz-transition: all 0.08s linear;
    -o-transition: all 0.08s linear;
    transition: all 0.08s linear;
    -webkit-border-radius: 4px 0 0 4px;
    -moz-border-radius: 4px 0 0 4px;
    border-radius: 4px 0 0 4px;
}
.nav-sidebar a:hover {
    background-color: rgb(226, 238, 248);
}

#menu a:link {
    color: #FFF;
    text-decoration: none;
}
#menu a:visited {
    color: #FFF;
    text-decoration: none;
}
#menu a:hover, #menu a:focus {
    color: #FFC;
    text-decoration: none;
}
#menu a:active {
    color: #FF5;
}

table.table-custom {
    border: #EEE 1px solid;
}
table.table-custom th {
    background-color: #A6BBCC;
    color: white;
}
table.table-custom.table-striped > tbody > tr:nth-child(odd) > td {
    background-color: #feffff;
}

.form-inline .form-control {
  display: inline-block;
  width: auto;
  vertical-align: middle;
}


@media (min-width: 767px) {
    .dontWrapIt{
        white-space: normal !important;
    }
}
@media (max-width: 768px) {
    .dontWrapIt{
        white-space: nowrap;
    }
}
