@import url(reset.css);
@import url(https://use.fontawesome.com/releases/v5.10.1/css/all.css);
@import url(https://maxcdn.bootstrapcdn.com/font-awesome/latest/css/font-awesome.min.css);
@import url(foundation.css);
@import url(framework.css);
@import url(basic.css);
@import url(w3.css);

body{
    color: #151514;
}

a:hover,
.focus {
    color:#151514;
}

.navigation{
    display:inline-block;
}

/*li 設position:relative; 是為了讓ul有定位點,relative會讓li保留在原位不會徧離*/
.navigation li{
    position:relative;
    /*text-align: left;*/
}

/*第一層橫向***********************/

.navigation > li{
    display:inline-block;
    z-index: 2;
}

/*第一層 end****************************************/

/*第二層直向****************************************/

.navigation > li > ul{
    display:none;
    position:absolute;
    left: 0px;
    padding-top:15px; /* 與第一層和第二層的高度間隔*/
}

.navigation > li:hover > ul{
    display: block;
}

/*第二層 end **********************************/

/*第三層以後橫向*****************************/

.navigation ul > li > ul{
    display:none;
    position:absolute;
    left:100%;
    top:0px;
}

.navigation ul > li:hover > ul{
    display: block;
}

/* 第三層 end **********************************/

/* 第一層的樣式 */
.navigation > li > a{
    display:block;
    height:45px;
    padding:0px 15px;
    padding-top:15px;
    font-size:15px;
    text-decoration:none;
    color:#FFF;
    white-space: nowrap;
}

/* 第一層的樣式 hover和focus*/
.navigation > li:hover > a,
.navigation .focus.icon-down:after,
.navigation .focus{
    border-radius:25px;
    color: #5EA9E2;
    background-color: #F5F6F8;
    /* background-color: #2196f3; */
}

/* 第二層以後的樣式 */
.navigation > li > ul a{
    display:block;
    width:250px;
    height:44px;
    border-left:1px solid #eaeaec;
    border-right:1px solid #eaeaec;
    border-bottom:1px solid #eaeaec;
    padding:0px 15px;
    padding-top:14px;
    padding-bottom:10px;
    text-align: left;
    text-decoration:none;
    font-size:15px;
    color:#666;
    background-color:#F5F6F8;
}
/* 第二層以後的樣式 hover */
.navigation > li > ul a:hover{
    color:#FFF;
    border-left:1px solid #5EA9E2;
    border-right:1px solid #5EA9E2;
    border-bottom:1px solid #5EA9E2;     
    background-color: #5EA9E2;
}

/* 下拉選單上緣線條 */
 
.navigation ul > li:first-of-type > a{
    /* border-top:3px solid #2196f3; */
    /* border-top:1px solid #eaeaec; */
}

/* 最後一個下拉選單往左移 */
/*
.navigation > li:last-of-type > ul{
    left: -103px;
}
*/
/* 向下箭頭 */
.navigation .icon-down:after{
    font-family: FontAwesome;
    content:"\f107";
    font-size:8px;
    color:#FFF;
    position: relative;
    right:-6px;
}
/* 向下箭頭 hover */
.navigation > li:hover .icon-down:after{
    color: #5EA9E2;
}

/* 向右箭頭 */
.navigation .icon-right:after{
    font-family: FontAwesome;
    content:"\f105";
    font-size:8px;
    color:#999;
    position: absolute;
    right:10px;
    top:16px;
}   

/* 向右箭頭 hover */
.navigation .icon-right:hover:after{
    color:#FFF;
}



.navigation-rwd {
    display: none;
    width: 100%;
    font-size: 15px;    
}

.navigation-rwd li{
    position: relative;
}

/* 第二層以後縮排 */
.navigation-rwd > li ul a{
    padding-left: 23px;
}

/****************************************/

/* 第一個選單上緣線條 */
/* 
.navigation-rwd > li:first-of-type > a{
    border-top:4px solid #0076f9;
}
 */
/* 選單項目樣式 */
.navigation-rwd a{
    display:block;
    padding-left:10px;
    line-height: 30px;
    text-decoration:none;
    border-bottom:1px solid #eaeaec;
    background-color: #F5F6F8;
}

/* 選單項目樣式hover */
.navigation-rwd a:hover{
    color: #FFF;
    background-color: #5EA9E2;
}

/* 向下箭頭 */
.navigation-rwd .icon-down:after{
    font-family: FontAwesome;
    content:"\f107";
    /*color:#666;*/
    position: absolute;
    right:5px;
}

/* 向上箭頭 */
.navigation-rwd .icon-up:after{
    font-family: FontAwesome;
    content:"\f106";
    /*color:#666;*/
    position: absolute;
    right:5px;
}

.pagination {
    margin-bottom:50px;
    text-align: center;
}

.pagination li {
    display: inline-block;
}

.pagination a {
    display: block;
    width: 40px;
    height: 40px;
    margin-right: 5px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    text-align: center;
    line-height: 39px;
    text-decoration: none;
    background-color: #f5f6f8;
}

.pagination a:hover,
.pagination .focus,
.pagination .jump-page:hover {
    border: 1px solid #2196F3;
    color: #FFF;
    background-color: #2196F3;
}

.pagination li:nth-of-type(1) i,
.pagination li:nth-of-type(2) i {
    position: relative;
    left: -1px;
    top: 0px;
    font-size:16px;
}

.pagination li:nth-last-of-type(1) i,
.pagination li:nth-last-of-type(2) i {
    position: relative;
    left: 1px;
    top: 0px;
    font-size:16px;
}

.pagination.show-for-small-only{
    margin-bottom: 20px;
}

.pagination .jump-page{
    width: 85px;
    margin-right: 5px;
    border: 0px solid #e5e6e8;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;  
    background-color: #f5f6f8;  
}

.owl-theme .owl-dots { position:absolute;left:0px;right:0px;bottom: 0px;margin:auto; }

.owl-theme .owl-dots .owl-dot span{ background-color:#FFF; }

.owl-theme .owl-dots .owl-dot.active span,.owl-theme .owl-dots .owl-dot:hover span{background: #2196f3}

/* ************************************************************************************************************************************************ */ 

.first-color-text,.first-color-text-c > *,.first-color-text-cc > * > *,.first-color-text-ccc > * > * > *,.first-color-text-cccc > * > * > * > * { color: #5EA9E2; }
.first-color-text-hover:hover,.first-color-text-hover-c > *:hover,.first-color-text-hover-cc > * > *:hover,.first-color-text-hover-ccc > * > * > *:hover,.first-color-text-hover-cccc > * > * > * > *:hover { color: #5EA9E2; }

.first-color-background,.first-color-background-c > *,.first-color-background-cc > * > *,.first-color-background-ccc > * > * > *,.first-color-background-cccc > * > * > * > * { background-color: #5EA9E2; }
.first-color-background-hover:hover,.first-color-background-hover-c > *:hover,.first-color-background-hover-cc > * > *:hover,.first-color-background-hover-ccc > * > * > *:hover,.first-color-background-hover-cccc > * > * > * > *:hover { background-color: #5EA9E2; }

.first-color-border,.first-color-border-c > *,.first-color-border-cc > * > *,.first-color-border-ccc > * > * > *,.first-color-border-cccc > * > * > * > * { border: 1px solid #5EA9E2; }
.first-color-border-hover:hover,.first-color-border-hover-c > *:hover,.first-color-border-hover-cc > * > *:hover,.first-color-border-hover-ccc > * > * > *:hover,.first-color-border-hover-cccc > * > * > * > *:hover { border: 1px solid #5EA9E2; }

.second-color-text,.second-color-text-c > *,.second-color-text-cc > * > *,.second-color-text-ccc > * > * > *,.second-color-text-cccc > * > * > * > * { color: #F5F6F8; }
.second-color-text-hover:hover,.second-color-text-hover-c > *:hover,.second-color-text-hover-cc > * > *:hover,.second-color-text-hover-ccc > * > * > *:hover,.second-color-text-hover-cccc > * > * > * > *:hover { color: #F5F6F8; }

.second-color-background,.second-color-background-c > *,.second-color-background-cc > * > *,.second-color-background-ccc > * > * > *,.second-color-background-cccc > * > * > * > * { background-color: #F5F6F8; }
.second-color-background-hover:hover,.second-color-background-hover-c > *:hover,.second-color-background-hover-cc > * > *:hover,.second-color-background-hover-ccc > * > * > *:hover,.second-color-background-hover-cccc > * > * > * > *:hover { background-color: #F5F6F8; }

.second-color-border,.second-color-border-c > *,.second-color-border-cc > * > *,.second-color-border-ccc > * > * > *,.second-color-border-cccc > * > * > * > * { border: 1px solid #F5F6F8; }
.second-color-border-hover:hover,.second-color-border-hover-c > *:hover,.second-color-border-hover-cc > * > *:hover,.second-color-border-hover-ccc > * > * > *:hover,.second-color-border-hover-cccc > * > * > * > *:hover { border: 1px solid #F5F6F8; }

.color1-text,.color1-text-c > *,.color1-text-cc > * > *,.color1-text-ccc > * > * > *,.color1-text-cccc > * > * > * > * { color: #5EA9E2; }
.color1-text-hover:hover,.color1-text-hover-c > *:hover,.color1-text-hover-cc > * > *:hover,.color1-text-hover-ccc > * > * > *:hover,.color1-text-hover-cccc > * > * > * > *:hover { color: #5EA9E2; }

.color1-background,.color1-background-c > *,.color1-background-cc > * > *,.color1-background-ccc > * > * > *,.color1-background-cccc > * > * > * > * { background-color: #5EA9E2; }
.color1-background-hover:hover,.color1-background-hover-c > *:hover,.color1-background-hover-cc > * > *:hover,.color1-background-hover-ccc > * > * > *:hover,.color1-background-hover-cccc > * > * > * > *:hover { background-color: #5EA9E2; }

.color1-border,.color1-border-c > *,.color1-border-cc > * > *,.color1-border-ccc > * > * > *,.color1-border-cccc > * > * > * > * { border: 1px solid #5EA9E2; }
.color1-border-hover:hover,.color1-border-hover-c > *:hover,.color1-border-hover-cc > * > *:hover,.color1-border-hover-ccc > * > * > *:hover,.color1-border-hover-cccc > * > * > * > *:hover { border: 1px solid #5EA9E2; }

/* ************************************************************************************************************************************************ */ 

.tag {
    display: none;
}

/*
.old-display-none{
    display:none;
}
*/
.old-header1{
    padding-top:5px !important;
    padding-bottom:0px !important;
}

.old-header2{
    height:80px !important;
}

.old-header3{
    padding-top:5px !important;
}

.old-header4{
    padding-top:20px !important;
}

/*****************************************************************************************************************************/
/*****************************************************************************************************************************/

.new-display-none{
    display:none;
}

body{
    background:#f7f6f4;
}

.navigation > li > ul{
    /*padding-top:25px;*/ /* 與第一層和第二層的高度間隔*/
}

/* 第一層的樣式 */
.navigation > li > a{
    display:block;
    height:45px;
    margin:0px 15px;
    padding:0px 0px;
    padding-top:15px;
    font-size:15px;
    font-weight:bolder;
    text-decoration:none;
    color:#151514;
    white-space: nowrap;
}

/* 第一層的樣式 hover和focus*/
.navigation > li:hover > a,
.navigation .focus.icon-down:after,
.navigation .focus{
    border-radius:0px;
    color: #151514;
    background-color: #FFF;
    border-bottom:3px solid #151514;
    /* background-color: #2196f3; */
}
.navigation .focus.icon-down:after{
    border-bottom:0px;
}
/* 第二層以後的樣式 */
.navigation > li > ul a{
    display:block;
    width:250px;
    height:44px;
    border-left:1px solid #151514;
    border-right:1px solid #151514;
    border-bottom:1px solid #151514;
    padding:0px 15px;
    padding-top:14px;
    padding-bottom:10px;
    text-align: left;
    text-decoration:none;
    font-size:15px;
    color:#FFF;
    background-color:#151514;
}
/* 第二層以後的樣式 hover */
.navigation > li > ul a:hover{
    color:#c99e59;
    border-left:1px solid #151514;
    border-right:1px solid #151514;
    border-bottom:1px solid #151514;     
    background-color: #151514;
}

.navigation-rwd a{
    color:#FFF;
    display:block;
    padding-left:10px;
    line-height: 30px;
    text-decoration:none;
    border-bottom:1px solid #151514;
    background-color: #151514;
}

/* 選單項目樣式hover */
.navigation-rwd a:hover{
    color: #c99e59;
    background-color: #151514;
}

/* 向下箭頭 */
.navigation .icon-down:after{
    color:#151514;
}
/* 向下箭頭 hover */
.navigation > li:hover .icon-down:after{
    color:#151514;
}

/* 向右箭頭 */
.navigation .icon-right:after{
    color:#151514;
}   

/* 向右箭頭 hover */
.navigation .icon-right:hover:after{
    color:#151514;
}

.pagination a:hover,
.pagination .focus,
.pagination .jump-page:hover {
    border: 1px solid #c99e59;
    color: #FFF;
    background-color: #c99e59;
}

.first-color-text,.first-color-text-c > *,.first-color-text-cc > * > *,.first-color-text-ccc > * > * > *,.first-color-text-cccc > * > * > * > * { color: #c99e59; }
.first-color-text-hover:hover,.first-color-text-hover-c > *:hover,.first-color-text-hover-cc > * > *:hover,.first-color-text-hover-ccc > * > * > *:hover,.first-color-text-hover-cccc > * > * > * > *:hover { color: #c99e59; }

.first-color-background,.first-color-background-c > *,.first-color-background-cc > * > *,.first-color-background-ccc > * > * > *,.first-color-background-cccc > * > * > * > * { background-color: #c99e59; }
.first-color-background-hover:hover,.first-color-background-hover-c > *:hover,.first-color-background-hover-cc > * > *:hover,.first-color-background-hover-ccc > * > * > *:hover,.first-color-background-hover-cccc > * > * > * > *:hover { background-color: #c99e59; }

.first-color-border,.first-color-border-c > *,.first-color-border-cc > * > *,.first-color-border-ccc > * > * > *,.first-color-border-cccc > * > * > * > * { border: 1px solid #c99e59; }
.first-color-border-hover:hover,.first-color-border-hover-c > *:hover,.first-color-border-hover-cc > * > *:hover,.first-color-border-hover-ccc > * > * > *:hover,.first-color-border-hover-cccc > * > * > * > *:hover { border: 1px solid #c99e59; }

.second-color-text,.second-color-text-c > *,.second-color-text-cc > * > *,.second-color-text-ccc > * > * > *,.second-color-text-cccc > * > * > * > * { color: #f7f6f4; }
.second-color-text-hover:hover,.second-color-text-hover-c > *:hover,.second-color-text-hover-cc > * > *:hover,.second-color-text-hover-ccc > * > * > *:hover,.second-color-text-hover-cccc > * > * > * > *:hover { color: #f7f6f4; }

.second-color-background,.second-color-background-c > *,.second-color-background-cc > * > *,.second-color-background-ccc > * > * > *,.second-color-background-cccc > * > * > * > * { background-color: #f7f6f4; }
.second-color-background-hover:hover,.second-color-background-hover-c > *:hover,.second-color-background-hover-cc > * > *:hover,.second-color-background-hover-ccc > * > * > *:hover,.second-color-background-hover-cccc > * > * > * > *:hover { background-color: #f7f6f4; }

.second-color-border,.second-color-border-c > *,.second-color-border-cc > * > *,.second-color-border-ccc > * > * > *,.second-color-border-cccc > * > * > * > * { border: 1px solid #f7f6f4; }
.second-color-border-hover:hover,.second-color-border-hover-c > *:hover,.second-color-border-hover-cc > * > *:hover,.second-color-border-hover-ccc > * > * > *:hover,.second-color-border-hover-cccc > * > * > * > *:hover { border: 1px solid #f7f6f4; }

.color1-text,.color1-text-c > *,.color1-text-cc > * > *,.color1-text-ccc > * > * > *,.color1-text-cccc > * > * > * > * { color: #c99e59; }
.color1-text-hover:hover,.color1-text-hover-c > *:hover,.color1-text-hover-cc > * > *:hover,.color1-text-hover-ccc > * > * > *:hover,.color1-text-hover-cccc > * > * > * > *:hover { color: #c99e59; }

.color1-background,.color1-background-c > *,.color1-background-cc > * > *,.color1-background-ccc > * > * > *,.color1-background-cccc > * > * > * > * { background-color: #c99e59; }
.color1-background-hover:hover,.color1-background-hover-c > *:hover,.color1-background-hover-cc > * > *:hover,.color1-background-hover-ccc > * > * > *:hover,.color1-background-hover-cccc > * > * > * > *:hover { background-color: #c99e59; }

.color1-border,.color1-border-c > *,.color1-border-cc > * > *,.color1-border-ccc > * > * > *,.color1-border-cccc > * > * > * > * { border: 1px solid #c99e59; }
.color1-border-hover:hover,.color1-border-hover-c > *:hover,.color1-border-hover-cc > * > *:hover,.color1-border-hover-ccc > * > * > *:hover,.color1-border-hover-cccc > * > * > * > *:hover { border: 1px solid #c99e59; }

.background-color-f-hover:hover,.background-color-f-hover-c > *:hover,.background-color-f-hover-cc > * > *:hover,.background-color-f-hover-ccc > * > * > *:hover,.background-color-f-hover-cccc > * > * > * > *:hover { background-color: #f7f6f4; }

.new-border-0,.new-border-0-c > *,.new-border-0-cc > * > *,.new-border-0-ccc > * > * > *,.new-border-0-cccc > * > * > * > * { border-width: 0px !important; }
.new-border-bottom,.new-border-bottom-c > *,.new-border-bottom-cc > * > *,.new-border-bottom-ccc > * > * > *,.new-border-bottom-cccc > * > * > * > * { border-bottom: 1px solid #bebeba !important; }
.new-border,.new-border-c > *,.new-border-cc > * > *,.new-border-ccc > * > * > *,.new-border-cccc > * > * > * > * { border: 1px solid #bebeba !important; }


.new-thead-background > * > *{
    background:#bebeba !important;
}

.new-border-color{
    border:0px solid #bebeba !important;
}

.new-background-white{
    background:#FFF !important;
}

.new-background-black{
    background:#151514 !important;
}

.new-color-white{
    color:#FFF !important;
}

.new-color-black{
    color:#151514 !important;
}

.new-border-right{
    border-right:1px solid #f7f6f4 !important;
}

.new-font-bolder{
    font-weight:bolder !important;
}

input[type="text"],
input[type="password"],
input[type="number"] {
    background-color: #FFF;
}

textarea {
    background-color: #FFF;
}

select {
    background-color: #FFF;
}