/*body{ font-size: 14px; }*/
html body{
font-family: 'NotoSansMonoCJKtc-Regular_1';
}
.clear::after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
width:0;
}
.col-xs-1, .col-sm-1, .col-md-1, .col-sm-1,
.col-xs-2, .col-sm-2, .col-md-2, .col-sm-2,
.col-xs-3, .col-sm-3, .col-md-3, .col-sm-3,
.col-xs-4, .col-sm-4, .col-md-4, .col-sm-4,
.col-xs-5, .col-sm-5, .col-md-5, .col-sm-5,
.col-xs-6, .col-sm-6, .col-md-6, .col-sm-6,
.col-xs-7, .col-sm-7, .col-md-7, .col-sm-7,
.col-xs-8, .col-sm-8, .col-md-8, .col-sm-8,
.col-xs-9, .col-sm-9, .col-md-9, .col-sm-9,
.col-xs-10, .col-sm-10, .col-md-10, .col-sm-10,
.col-xs-11, .col-sm-11, .col-md-11, .col-sm-11,
.col-xs-12, .col-sm-12, .col-md-12, .col-sm-12 {
position: relative;
height:100%;
min-height: 1px;
padding-right: 0;
padding-left: 0;
}
.row {
margin-right: 0;
margin-left: 0;
}
main{
/* padding-top:120px; */
}
@media (max-width: 768px) {
main{
/* padding-top:50px; */
}
}
/*html { font-size: 14px; }*/
.cus-brand img { display: block; width: auto; height: 95%; position: relative; margin-right: -15px;}
@media (min-width: 1024px) {
.cus-brand {
padding: 0;
position: relative;
}
.navbar {
border-radius: 0px;
}
/* .cus-brand img { height: 85%;} */
}
.cus-navbar .dropdown.open a,
.cus-navbar .dropdown.open a:focus { background-color: transparent; }
@media (min-width: 1024px) {
/* .cus-navbar .dropdown:hover > .dropdown-menu { opacity: 1; visibility: visible; } */
.cus-navbar .dropdown-menu { border-radius: 0; box-shadow: 0 3px 4px -2px rgba(0, 0, 0, 0.5); transition: opacity .5s ease; }
.cus-navbar .dropdown-menu > li > a { padding-right: 25px; }
.cus-navbar .dropdown-menu .dropdown > .dropdown-toggle .caret { position: absolute; right: 10px; top: 42%; }
.cus-navbar .dropdown-menu .dropdown > .dropdown-menu { left: 90%; top: 0; }
.dropdown:hover > ul.dropdown-menu{
display:block;
}
}
.btn-share .dropdown-menu,
.btn-font-size .dropdown-menu,
.btn-lang .dropdown-menu { border-radius: 0; box-shadow: 0 3px 4px -2px rgba(0, 0, 0, 0.5); }
.btn-lang .dropdown-menu { min-width: 80px; }
.btn-font-size .dropdown-menu { min-width: 50px; }
.btn-share .dropdown-menu { min-width: 20px; }
.btn-share .dropdown-menu > li a { padding-left: 8px; padding-right: 8px; }
.btn-print .dropdown-toggle,
.btn-print .dropdown-toggle:focus,
.btn-print .dropdown-toggle:hover,
.btn-print.open .dropdown-toggle,
.btn-print.open .dropdown-toggle:focus,
.btn-print.open .dropdown-toggle:hover,
.btn-share .dropdown-toggle,
.btn-share .dropdown-toggle:focus,
.btn-share .dropdown-toggle:hover,
.btn-share.open .dropdown-toggle,
.btn-share.open .dropdown-toggle:focus,
.btn-share.open .dropdown-toggle:hover,
.btn-font-size .dropdown-toggle,
.btn-font-size .dropdown-toggle:focus,
.btn-font-size .dropdown-toggle:hover,
.btn-font-size.open .dropdown-toggle,
.btn-font-size.open .dropdown-toggle:focus,
.btn-font-size.open .dropdown-toggle:hover,
.btn-lang .dropdown-toggle,
.btn-lang .dropdown-toggle:focus,
.btn-lang .dropdown-toggle:hover,
.btn-lang.open .dropdown-toggle,
.btn-lang.open .dropdown-toggle:focus,
.btn-lang.open .dropdown-toggle:hover { background-color: transparent; box-shadow: none; }
.btn-search .dropdown-toggle,
.btn-search .dropdown-toggle:focus,
.btn-search .dropdown-toggle:hover,
.btn-search.open .dropdown-toggle,
.btn-search.open .dropdown-toggle:focus,
.btn-search.open .dropdown-toggle:hover { background-color: transparent; box-shadow: none; }
.btn-lang button{
font-size:14px;
color: #eb3d3d !important;
text-shadow: 0 0 2px white;
}
.btn-lang button:before{
content: "\f107";
font-family: FontAwesome;
font-size: 12px;
left: auto;
position: absolute;
right: 0px;
top: 8px;
cursor: pointer;
}
.btn-lang .dropdown-menu a{
color: #c14545 !important;
}
.btn-search .dropdown-toggle{
border:0;
border-color:unset;
}
.glyphicon-search{
top:11px;
}
ul.dropdown-menu li{
background:#f2f5f9 none repeat scroll 0 0;
display: block;
padding: 14px 0px;
outline: 0;
}
.dropdown-menu {
padding:0 0;
}
.navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:focus, .navbar-default .navbar-nav>.open>a:hover{
color:unset;
}
header .navbar-nav>li{
font-size: 1.2em;
}
header .navbar-nav>li:before{
content: "\f107";
font-family: FontAwesome;
font-size: 12px;
left: auto;
position: absolute;
right: 0px;
top: 17px;
cursor: pointer;
}
header .navbar-default .navbar-nav>li, header .navbar-default .navbar-nav>li>a{ color:#eb3d3d; font-size:18px; font-family:NotoSansMonoCJKtc-Regular_1;}
header .navbar-default .navbar-nav>li, header .navbar-default .navbar-nav>li>a:lang(en){font-size:15px;}
header .navbar-default .navbar-nav>li:nth-child(2), header .navbar-default .navbar-nav>li:nth-child(2)>a{ color:#f45854; }
header .navbar-default .navbar-nav>li:nth-child(3), header .navbar-default .navbar-nav>li:nth-child(3)>a{ color:#1190ba; }
header .navbar-default .navbar-nav>li:nth-child(4), header .navbar-default .navbar-nav>li:nth-child(4)>a{ color:#ff9933; }
header .navbar-default .navbar-nav>li:nth-child(5), header .navbar-default .navbar-nav>li:nth-child(5)>a{ color:#0ba9c6; }
header .navbar-default .navbar-nav>li:nth-child(6), header .navbar-default .navbar-nav>li:nth-child(6)>a{ color:#5ec33f; }
header .navbar-default .navbar-nav>li:nth-child(7), header .navbar-default .navbar-nav>li:nth-child(7)>a{ color:#fb8986; }
header .navbar-default .navbar-nav>li:nth-child(8), header .navbar-default .navbar-nav>li:nth-child(8)>a{ color:#9c3fc3; }
header .navbar-default .navbar-nav>li:nth-child(9), header .navbar-default .navbar-nav>li:nth-child(9)>a{ color:#30a441; }
header .navbar-default .navbar-nav>li:nth-child(10), header .navbar-default .navbar-nav>li:nth-child(10)>a{ color:#30a441; }
.dropdown li ul li a{
border-bottom: 1px solid #eee;
display: block;
padding: 14px 30px;
outline: 0;
}
.dropdown-menu>li>a{
text-align:center;
white-space:unset;
font-weight:normal;
min-width:150px;
}
li.dropdown:nth-child(3) .dropdown-menu>li>a{ color:#1190ba; }
li.dropdown:nth-child(4) .dropdown-menu>li>a{ color:#ff9933; }
li.dropdown:nth-child(5) .dropdown-menu>li>a{ color:#0ba9c6; }
li.dropdown:nth-child(6) .dropdown-menu>li>a{ color:#5ec33f; }
li.dropdown:nth-child(7) .dropdown-menu>li>a{ color:#fb8986; }
li.dropdown:nth-child(8) .dropdown-menu>li>a{ color:#9c3fc3; }
li.dropdown:nth-child(9) .dropdown-menu>li>a{ color:#30a441; }
li.dropdown:nth-child(10) .dropdown-menu>li>a{ color:#30a441; }
li.dropdown .dropdown-menu>li:hover a{ color:#fff; }
li.dropdown:nth-child(3) .dropdown-menu>li:hover, li.dropdown:nth-child(3) .dropdown-menu>li a:hover{ background-color:#1190ba; }
li.dropdown:nth-child(4) .dropdown-menu>li:hover, li.dropdown:nth-child(4) .dropdown-menu>li a:hover{ background-color:#ff9933; }
li.dropdown:nth-child(5) .dropdown-menu>li:hover, li.dropdown:nth-child(5) .dropdown-menu>li a:hover{ background-color:#0ba9c6; }
li.dropdown:nth-child(6) .dropdown-menu>li:hover, li.dropdown:nth-child(6) .dropdown-menu>li a:hover{ background-color:#5ec33f; }
li.dropdown:nth-child(7) .dropdown-menu>li:hover, li.dropdown:nth-child(7) .dropdown-menu>li a:hover{ background-color:#fb8986; }
li.dropdown:nth-child(8) .dropdown-menu>li:hover, li.dropdown:nth-child(8) .dropdown-menu>li a:hover{ background-color:#9c3fc3; }
li.dropdown:nth-child(9) .dropdown-menu>li:hover, li.dropdown:nth-child(9) .dropdown-menu>li a:hover{ background-color:#30a441; }
li.dropdown:nth-child(10) .dropdown-menu>li:hover, li.dropdown:nth-child(10) .dropdown-menu>li a:hover{ background-color:#30a441; }
.navbar-default .navbar-nav>li>a:focus, .navbar-default .navbar-nav>li>a:hover{
color:unset;
}
header .navbar-default .navbar-nav>li:nth-child(2):before,
header .navbar-default .navbar-nav>li:nth-child(10):before{
display:none;
}
.dropdown li ul{
background: #f2f5f9 none repeat scroll 0 0;
left: 0;
padding: 0;
position: absolute;
top: 75px;
width: 215px;
visibility: hidden;
opacity: 0;
-webkit-transition: all 400ms ease;
-moz-transition: all 400ms ease;
-ms-transition: all 400ms ease;
-o-transition: all 400ms ease;
transition: all 400ms ease;
}
/* .dropdown:hover > ul.dropdown-menu{
display:block;
} */
.dropdown:hover > ul{
visibility: visible;
opacity: 1;
top: 45px;
}
.dropdown:hover > ul > li:hover ul{
visibility: visible;
opacity: 1;
top: 0;
}
.dropdown:hover > a:after{
visibility: visible;
opacity: 1;
left: -2px;
}
header {
display: block;
width: 100%;
margin: 0;
padding: 0;
position: absolute;
z-index: 3;
background:transparent;
}
header .cus-aside { position: relative; background:transparent; /* width:90%; */ }
header .cus-aside::after { content: ""; display: block; clear: both; }
header .cus-aside > div { float: right; }
header .cus-aside .btn { border: none; font-size:18px;}
header .cus-navbar { background-color: #fff; border: none; margin-bottom:0; width:100%;}
header .fixed-menu{
position: fixed;
top: 0;
left: 0;
width: 100%;
box-shadow: 0 3px 4px -5px rgba(0, 0, 0, 0.3);
background-color: #fff;
z-index: 2;
}
header .cus-brand:after{
background: rgba(0, 0, 0, 0) url(../images/common/LCPHKNS_logo_bg.png) no-repeat scroll center center / cover;
content: "";
height: 200px;
left: 0;
position: absolute;
top: -74px;
width: 200px;
z-index: -1;
}
header .fixed-menu .cus-brand:after{
display:none;
}
header .cus-navbar .container-fluid{
width:90%;
}
@media (max-width: 1500px) {
header .cus-navbar .container-fluid, header .cus-aside{
width:100%;
}
}
@media (max-width: 1076px) {
header .navbar-nav>li{
font-size:1.1em;
}
header .cus-navbar .container-fluid, header .cus-aside{
width:95%;
}
}
@media (max-width: 945px) {
header .navbar-default .navbar-nav>li>a{
font-size:14px;
}
}
@media (min-width: 1200px) {
header { padding-top: 20px; }
header .cus-navbar .container-fluid { padding-right: 0; width: 1170px; box-sizing: border-box;}
header .cus-navbar { border-bottom: none; }
}
@media (min-width: 1024px) {
header .cus-navbar { padding: 15px 0px; width: 100%;}
}
@media (max-width: 1024px) {
header .cus-aside { position: absolute; right: 70px; top: 10px; z-index: 2; }
header .cus-navbar { z-index: 1;}
header .cus-navbar .dropdown-menu { width: auto; margin-top: 0; padding-left: 15px; position: static; float: none; background-color: transparent; border: none; box-shadow: none; }
header .cus-navbar .dropdown-menu li a { padding: 5px 15px 5px 15px; line-height: 20px; color: #777; }
header .cus-navbar .dropdown-menu li a:hover { text-decoration: none; background-color: #f5f5f5; }
header .cus-navbar .open .dropdown-menu li a {padding-left: 15px; }
header .cus-brand:after{display:none;}
}
footer {
position: relative;
background-image: url(../images/common/footer_image.jpg);
background-size: cover;
background-position: center;
}
footer img{
width:100%;
}
@media (min-width: 1025px) {
footer > img{
display:none;
}
}
@media (max-width: 1024px) {
footer {
background-image:none;
}
footer .footer-content{
position:absolute;
top:5%;
}
}
footer a { color: #e16a5a; font-family:NotoSansMonoCJKtc-Regular_1;}
footer a:focus,
footer a:hover { color: #e16a5a; text-decoration: none; }
footer .footer-content{
display: flex;
flex-direction: column;
width:90%;
margin:0 auto;
padding:5% 0;
}
footer .cus-list-group .list-group-item { background: none; }
footer .cus-list-group .list-group-item .list-group-item {
padding: 5px 0;
}
/* footer .cus-list-group > .list-group-item > .list-group { margin-top: 20px; } */
footer .cus-list-group > .list-group-item > a { font-size: 28px;}
footer .cus-list-group > .list-group-item > .list-group { padding-left: 10px;}
footer .cus-list-group > .list-group-item > .list-group > .list-group-item a{ font-size: 18px;}
footer .copyright-desc { display: block; width: 100%; padding: 15px 0; position: relative; color: #e16a5a; font-size:20px;}
@media (min-width: 1200px) {
footer .footer-content .container{
width:100%;
}
}
@media (max-width: 1350px) {
footer .cus-list-group > .list-group-item > a { font-size: 22px;}
footer .cus-list-group > .list-group-item > .list-group > .list-group-item a{ font-size: 14px;}
footer .copyright-desc{ font-size: 18px; }
}
@media (max-width: 1150px) {
footer .cus-list-group > .list-group-item > a { font-size: 18px;}
footer .cus-list-group > .list-group-item > .list-group > .list-group-item a{ font-size: 12px;}
footer .copyright-desc{ font-size: 14px; }
}
@media (max-width: 991px) {
footer .cus-list-group > .list-group-item > a { font-size: 22px;}
footer .copyright-desc{ font-size: 20px; }
}
@media (max-width: 550px) {
footer .copyright-desc{ font-size: 14px; }
}
@media (min-width: 1024px) {
/* footer { padding-top: 40px; padding-bottom: 40px; } */
footer .cus-list-group { display: flex; flex-wrap: wrap; padding-left: 15px; }
footer .cus-list-group .list-group-item { flex: 1; border: none; }
}
@media (max-width: 1024px) {
footer .cus-list-group { padding-right: 0; }
footer .cus-list-group .list-group-item { display: none; }
footer .copyright { text-align: center; }
footer > .copyright{
top: 15%;
}
}
.search-area{
left: 0;
position: absolute;
top: 0;
width: 100%;
z-index: 99;
display: none;
margin-left: 0;
}
.search-area form {
background: #f2f5ff none repeat scroll 0 0;
width: 100%;
}
.search-area input {
background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
border: medium none;
font-size: 25px;
padding: 26px;
width: 100%;
}
.search-close {
color: #c7c7c7;
font-size: 25px;
left: auto;
position: absolute;
right: 30px;
top: 24px;
}
.search-close:hover,
.search-close:focus{
color: #c7c7c7;
}
@media (min-width: 1024px) {
li.mobile-show{
display:none;
}
/* .navbar-brand{
height:unset;
} */
}
@media (max-width: 1024px) {
.navbar-collapse{
padding-top:100px;
}
.search-area {
top: 67px;
}
.search-area input {
font-size: 16px;
height: 60px;
line-height: 1;
padding: 0 25px 5px;
width: 100%;
}
.search-close {
display: none;
}
li.mobile-hide, .mobile-hide{
display:none;
}
}
.gsc-control-cse {
height: 0px !important;
overflow: hidden;
padding: 0px !important;
}
.fa-remove:before, .fa-close:before, .fa-times:before {
content: "\f00d";
}
.navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:focus, .navbar-default .navbar-nav>.open>a:hover{
background-color:unset;
}
.navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:focus, .navbar-default .navbar-nav>.active>a:hover{
background-color:unset;
}
@media (min-width: 1024px){
.navbar-toggle {
display: none;
}
}
@media (max-width: 1024px){
.navbar-header {
float: none !important;
}
}
@media (max-width: 1024px){
.navbar-toggle {
display: block;
}
#header-navbar-collapse.navbar-collapse.collapse{
display:none !important;
}
#header-navbar-collapse.navbar-collapse.collapse.in{
display:block !important;
}
#header-navbar-collapse.navbar-collapse.collapse.in li{
width:100%;
}
}
.hide-more{
display:none;
}
/* cms popup */
.cms-popup .modal-content{
border-radius:0;
}
.cms-popup .modal-title{
width: calc(100% - 30px);
display: inline-block;
}
.cms-popup .btn{
border-radius:0;
}
.cms-popup .form-control{
margin-bottom:10px;
border-radius:0;
}