@charset "UTF-8";

body * {
	/*  font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif, \5FAE\8EDF\6B63\9ED1\9AD4; */
	font-family: Helvetica,Arial,SimSun-ExtB,微軟正黑體,細明體_HKSCS-ExtB,sans-serif;
}

@font-face {
  font-family: '微軟正黑體';
  unicode-range: U+7db0, U+78A7, U+7B75;
  font-style: normal;
  font-weight: normal;
  src: local(微軟正黑體), local(Microsoft JhengHei);
}

/*icon styles*/
.fi-social-facebook {
	color: dodgerblue;
	font-size: 2rem;
}

.fi-social-youtube {
	color: #42785d;
	font-size: 2rem;
}

.fi-social-pinterest {
	color: darkred;
	font-size: 2rem;
}

i.fi-social-instagram {
	color: brown;
	font-size: 2rem;
}

i.fi-social-tumblr {
	color: navy;
	font-size: 2rem;
}

.fi-social-twitter {
	color: skyblue;
	font-size: 2rem;
}

/* .top-bar-left a img { */
/* 	width: 20rem; */
/* 	heigh: 1.5rem; */
/* } */
input[type=search] {
	height: 1rem;
}

.top-bar input {
	max-width: 150px;
	margin-right: 0;
}

.top-bar-right {
	display: inline-flex;
}

#main-menu {
	/* 	background: transparent; */
	display: block;
}

/* #main-menu a { */
/* 	color: white; */
/* } */
.drilldown .is-drilldown-submenu-parent>a::after {
	right: 0;
}

.menuBar .title-bar, .menuBar .top-bar {
	transition: padding-top .25s ease;
}

.menuBar.shrink {
	/*   height: 2.5em; */
	
}

.cpt {
	margin-right: .5em;
	width: 2em;
	line-height: 2em;
	background-color: lightgray;
	display: inline-block;
	text-align: center;
	border-radius: 50%;
	color: black;
	font-size: 0.875rem;
	padding: 0;
	margin-left: 0.5rem;
	margin-bottom: 0;
	vertical-align: baseline;
}

.menuBar.shrink .title-bar, .menuBar.shrink .top-bar {
	padding-top: 0.1em;
	padding-bottom: 0.1em;
}

.menuBar .dropdown.menu li {
	/*   float: left; */
	
}

.menuBar .dropdown.menu .is-dropdown-submenu {
	border: none;
	/*   background-color: #2c3840; */
}

.fullWidth {
	/* 	vertical-align: middle; */
	width: 100%;
	/* 	height: auto; */
}

.fullSize {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.fullHeight {
	height: 100%;
	object-fit: cover;
}

.box {
	position: relative;
	padding-top: 56%; /* 16:9 default */
}

body .box75 {
	position: relative;
	padding-top: 75%; /* 4:3 */
}

.box28 {
	position: relative;
	padding-top: 28%; /* 16:3 */
}

.pin {
	position: absolute;
	left: 0;
	top: 0;
	max-height: 100%;
	max-width: 100%;
	justify-content: center;
	display: flex;
}

img.shrink {
	object-fit: contain !important;
}

.pin_YouTube {
	position: absolute;
	left: 0;
	top: 0;
	object-fit: unset !important;
	object-position: center center;
	max-height: 100%;
	max-width: 100%;
	width: 100%;
	height: 100%;
    border: none;
}

.orbit-container button {
	background: rgba(0, 0, 0, 0.5);
}

.orbit-previous, .orbit-next {
	z-index: 1;
}

div.orbit-caption {
	padding: .5rem;
}

.orbit-caption p {
	margin-bottom: 0;
}

/* div.orbit-caption .focusInfosPanelCaption p { */
/* 	overflow: hidden; */
/* 	max-height: 1.6rem; */
/* 	text-overflow: ellipsis; */
/* 	white-space: nowrap; */
/* } */
@media screen and (max-width: 39.9375em) {
	button.orbit-previous, button.orbit-next {
		display: none;
	}
}

div .orbit-bullets button {
	width: 0.6rem;
	height: 0.6rem;
	margin: 0.2rem;
}

.marginBottom.orbit-slides-container {
	margin-bottom: 1rem;
}

div.single button.orbit-previous, div.single button.orbit-next, div.single nav.orbit-bullets {
	display: none;
}

.ptr-refresh #ptrhead img {
	display: block;
}

#ptrhead img {
	display: none;
	margin-left: auto;
	margin-right: auto;
}

.maskLine {
	height: 1.5rem;
	position: absolute;
	left: 0;
	bottom: 0;
	background: linear-gradient(rgba(255, 255, 255, 0), white);
	width: 100%;
}

.fadeBox {
	padding: 0;
	position: relative;
	background: white;
	overflow-y: hidden;
}

.truncate, .truncate>p {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.line2Truncate, .line2Truncate>p {
	overflow: hidden;
	display: -webkit-box;
	-webkit-line-clamp: 2; /* number of lines to show */
	-webkit-box-orient: vertical;
	white-space: normal;
}

.line1Truncate, .line1Truncate>p {
	overflow: hidden;
	display: -webkit-box;
	-webkit-line-clamp: 1; /* number of lines to show */
	-webkit-box-orient: vertical;
	white-space: normal;
}

.line3Truncate, .line3Truncate>p {
	overflow: hidden;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	white-space: normal;
}

.mainSection {
	margin-top: 1rem;
}

.contentDivider {
	height: .5rem;
	width: 100%;
	background-color: #e9cb4b;
	position: relative;
	margin-bottom: 1rem;
	z-index: 0;
}

.contentDivider:before {
	content: "";
	width: 30%;
	border-top: .4rem solid rgb(244, 244, 242);
	border-right: .5rem solid transparent;
	position: absolute;
	min-width: 11rem;
	top: -.05rem
}

ul.light {
	list-style: none;
	margin-left: 0;
}

ul.whiteCard>li {
	box-shadow: 1px 1px 2px -1px rgba(0, 0, 0, 0.5);
	background-color: white;
	margin-bottom: 1rem;
}

.whiteCard.menu>li>ul, .whiteCard.menu>li>ul a {
	margin: 0;
	padding: 0;
}

.whiteCard.menu>li>ul a.cell {
	margin-bottom: 1rem;
}

.whiteCard.menu>li>ul * {
	font-family: FontAwesome;
	line-height: 1.2;
}

.button.moreLink {
	border-radius: .5rem;
	padding: .3rem .3rem .3rem .3rem;
	background-color: #b97c48;
	color: white;
	margin-bottom: 0;
}

.button.moreLink:hover, .button.moreLink:focus {
	color: white;
	background-color: #9a5c26;
}

.contentDividerContainer {
	/* margin-bottom: .25rem;
	margin-top: -.5rem; */
	margin-bottom: 1rem;
}

#iconScrollTop {
	position: fixed;
	right: 1em;
	bottom: 3rem;
	z-index: 999999;
}

img.cell.orbit-image {
	top: 0;
	height: 100%;
	width: auto;
	max-width: unset;
}

.ouro {
	position: absolute;
	display: inline-block;
	height: 46px;
	width: 46px;
	margin: -23px 1em 1em -23px;
	border-radius: 50%;
	background: none repeat scroll 0 0 #DDDDDD;
	overflow: hidden;
	/*     box-shadow: 0 0 10px rgba(0,0,0,.1) inset, 0 0 25px rgba(0,0,255,0.075); */
	box-shadow: 6px 5px 10px -1px #8a8a8a;
}

.ouro:after {
	content: "";
	position: absolute;
	top: 9px;
	left: 9px;
	display: block;
	height: 28px;
	width: 28px;
	background: none repeat scroll 0 0 #F2F2F2;
	border-radius: 50%;
	box-shadow: 0 0 10px rgba(0, 0, 0, .1);
}

.ouro>span {
	position: absolute;
	height: 100%;
	width: 50%;
	overflow: hidden;
}

.ouroLeft {
	left: 0
}

.ouroRight {
	left: 50%
}

.anim {
	position: absolute;
	left: 100%;
	top: 0;
	height: 100%;
	width: 100%;
	border-radius: 999px;
	/* background: none repeat scroll 0 0 #508EC3; */
	background: none repeat scroll 0 0 #f4c904;
	opacity: 0.8;
	-webkit-animation: ui-spinner-rotate-left 3s infinite;
	animation: ui-spinner-rotate-left 3s infinite;
	-webkit-transform-origin: 0 50% 0;
	transform-origin: 0 50% 0;
}

.ouroLeft .anim {
	border-bottom-left-radius: 0;
	border-top-left-radius: 0;
}

.ouroRight .anim {
	border-bottom-right-radius: 0;
	border-top-right-radius: 0;
	left: -100%;
	-webkit-transform-origin: 100% 50% 0;
	transform-origin: 100% 50% 0;
}

/* v3 */
.ouro3 .anim {
	-webkit-animation-delay: 0s;
	-webkit-animation-duration: 2s;
	-webkit-animation-timing-function: linear;
	animation-delay: 0s;
	animation-duration: 2s;
	animation-timing-function: linear;
}

.ouro3 .ouroRight .anim {
	-webkit-animation-name: ui-spinner-rotate-right;
	-webkit-animation-delay: 0;
	-webkit-animation-delay: 1s;
	animation-name: ui-spinner-rotate-right;
	animation-delay: 0;
	animation-delay: 1s;
}

/* round variation */
.round .ouro:after {
	display: none
}

/* double variation */
.double .ouro:after {
	height: 13px;
	width: 13px;
	left: 7px;
	top: 7px;
	border: 10px solid #ddd;
	background: transparent;
	box-shadow: none;
}

@keyframes ui-spinner-rotate-right {
	0%{transform:rotate(0deg)}
	25%{transform:rotate(180deg)}
	50%{transform:rotate(180deg)}
	75%{transform:rotate(360deg)}
	100%{transform:rotate(360deg)}
}

@keyframes ui-spinner-rotate-left {
	0%{transform:rotate(0deg)}
	25%{transform:rotate(0deg)}
	50%{transform:rotate(180deg)}
	75%{transform:rotate(180deg)}
	100%{transform:rotate(360deg)}
}

@-webkit-keyframes ui-spinner-rotate-right {
	0%{-webkit-transform: rotate(0deg)}
	25%{-webkit-transform:rotate(180deg)}
	50%{-webkit-transform:rotate(180deg)}
	75%{-webkit-transform:rotate(360deg)}
	100%{-webkit-transform:rotate(360deg)}
}

@-webkit-keyframes ui-spinner-rotate-left {
	0%{-webkit-transform: rotate(0deg)}
	25%{-webkit-transform:rotate(0deg)}
	50%{-webkit-transform:rotate(180deg)}
	75%{-webkit-transform:rotate(180deg)}
	100%{-webkit-transform:rotate(360deg)}
}
div#ajaxLoader, .ouroMask {
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	background-color: rgba(0, 0, 0, 0.6);
	/*   background-color: #e6e6e6;  */
	z-index: 40000;
	text-align: center;
}

.ouroMask {
	background-color: rgb(244, 244, 242);
}

.sideLabel {
	color: #9a9a9a;
	margin: 1rem 0rem 0.2rem 0rem;
}

.indentContent {
	text-align: justify;
	text-indent: 32px;
	word-wrap: break-word;
}

button.radius, .button.radius {
	border-radius: 3px;
}

button.round, .button.round {
	border-radius: 1000px;
}

.ellipsisLastLine {
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
}

.form-container label {
	font-size: 1rem;
}

.fbTooltip {
	max-width: 400px;
	border-radius: .7rem;
}

.fbTooltip.icons {
	display: flex;
	background-color: #4267b2;
}

.icons.tooltip.bottom::before {
	border-bottom-color: #4267b2;
}

.icons.tooltip.right::before {
	border-right-color: #4267b2;
}

.fbTooltip .ico {
	width: 5rem;
	height: 5rem;
	background-position: center;
	background-size: cover;
	border-radius: 1000px;
}

.fbTooltip .ico:hover, .fbTooltip .ico:active {
	box-shadow: 0 0 5px rgba(0, 0, 0, .3);
	transform: scale(1.05);
	transition: all 0.2s cubic-bezier(0, 1.01, 0.56, 2.65);
}

.fbTooltip .gcsFb.ico {
	background-image: url(/news/img/gcsFbIcon.png);
}

.has-tip {
	border-bottom: none;
	cursor: pointer;
}

.fbTooltip .civilProtectionFb.ico {
	background-image: url(/news/img/civilProtectionFbIcon.jpg);
}

.fbTooltip .ncvFb.ico{
	background-image: url(/news/img/ncvFbIcon.jpg);
}

.fbTooltip .rlMargin{
	margin: 0 1rem;	
}

.infoLead, .mainBody .infoLead {
	font-size: 1.6rem;
	font-weight: bolder;
	line-height: 1.4rem;
}

.orbit-slide-number {
	position: absolute;
	top: 10px;
	left: 10px;
	font-size: 1rem;
	color: #fff;
	background: transparent;
	font-weight: bolder;
	text-shadow: 2px 2px 4px black;
}

span.slide-number {
	font-size: 1.2rem;
}

.noMargin {
    margin: 0rem !important;
}

.noMarginBottom {
    margin-bottom: 0rem !important;
}

@media screen and (max-width: 39.9375em) {

	.grid-container {
		overflow: hidden;
	}
	
	.button-group.small-only-expanded .button {
		-webkit-box-flex: 1;
		-webkit-flex: 1 1 0px;
		-ms-flex: 1 1 0px;
		flex: 1 1 0px;
	}
	.button.small-only-expanded {
		display: block;
		width: 100%;
		margin-right: 0;
		margin-left: 0;
	}
	.mainSection {
		/*  margin-top: 0;  */
	}
	.infoLead {
		font-size: 1.4rem;
		line-height: 1.2rem;
		padding-left: 1rem;
	}
}

@media screen and (min-width: 40em) and (max-width: 63.9375em) {
	.button.medium-only-expanded {
		display: block;
		width: 100%;
		margin-right: 0;
		margin-left: 0;
	}
}

@media screen and (max-width: 63.9375em) {
	.button.medium-down-expanded {
		display: block;
		width: 100%;
		margin-right: 0;
		margin-left: 0;
	}
}

@media print , screen and (min-width: 40em) {
	.button.medium-expanded {
		display: block;
		width: 100%;
		margin-right: 0;
		margin-left: 0;
	}
}

@media screen and (min-width: 64em) and (max-width: 74.9375em) {
	.button.large-only-expanded {
		display: block;
		width: 100%;
		margin-right: 0;
		margin-left: 0;
	}
}

@media screen and (max-width: 74.9375em) {
	.button.large-down-expanded {
		display: block;
		width: 100%;
		margin-right: 0;
		margin-left: 0;
	}
}

@media print , screen and (min-width: 64em) {
	.button.large-expanded {
		display: block;
		width: 100%;
		margin-right: 0;
		margin-left: 0;
	}
}

/*  temp fix for foundation 6.5.3 orbit bug */
.orbit-slide{
	position:absolute;
	top:0;
	left:0;
}

@media print {
	.localeOption {
	    margin-right: 0!important;
	}
	.appLogo, .playStoreIcon, .appStoreIcon {
		max-width: 5rem !important;
	}
	.gcsLogo {
		max-width: 15rem !important;
	}
	.top-bar a {
		padding-left: 0rem !important;
		padding-right: 0.1rem !important;
	}
	.bannerIcon {
		max-height: 2rem;
	}
	html {
		font-size: 90% !important;
	}
	a[href]:after {
		content: none !important;
	}
	a {
		text-decoration: none !important;
	}
	.hideForPrint {
		display: none !important;
	}
	ul.director a.ui-button{
		background-color:white!important;
	}
}


@media all and (-ms-high-contrast:none) {
	.grid-container.full{
		width: 100%;
	}
	
	.shareBtnContainer, .captionContainer, .deptInfoContainer{
		position: relative;
	}
	
	h5.captionLabel span, .captionLabel span, .shareBtn::before, .deptInfoContainer .render_timeago_css, .deptInfoContainer .deptLabel{
		text-shadow: none;
		color: black;
	}
	.line2Truncate, line2Truncate>p{
		line-height: 1;
	}
	
	span.line2Truncate{
		height: 2em;	
	}
	.hotNewsCardContainer .slideInfo, .topicsItemContainer .slideInfo {
		background: white
	}
	div a.shareBtn {
		color: #f4c904;
	}
	.INewsBox {
		background:#fad4d9
	}
	
	.INewsSlick button.slick-arrow i.fa-play-circle{
		color: #a79b9d;
	}
	
	.INewsSlick button.slick-arrow.slick-disabled i.fa-play-circle{
	    color: #d5babe;
	}
	
	.INewsSlick button.slick-arrow{
		background: transparent;
	}
	.menuBar.sticky.is-at-top.is-stuck.shrink, .menuBar.sticky.is-at-top.is-stuck.shrink #main-menu, .menuBar.sticky.is-at-top.is-stuck.shrink #main-menu a, .menuBar.sticky.is-at-top.is-stuck.shrink #main-menu ul{
		background-color: #2c3840;
		color: white;
	}
	.sticky.is-at-top.is-stuck.shrink#menuBar ul li a:hover, .sticky.is-at-top.is-stuck.shrink#menuBar ul li a:focus{
		background-color: #44545f;
	}
	
	.menuBar.sticky.is-at-top.is-stuck.shrink #main-menu a.covid19Menu{
		color: #f4c904
	}
	.forecastListViewContainer div.columns:nth-child(odd){
		background: #e5e5e4;
	}
	img.orbit-image{
		width: auto;
	}
	.photoBox{
		text-align: center;
	}
	.autoHideYoutube{
		display: none !important;
	}
	
	.severeWeatherPanel .weatherMarqueeContainer{
		line-height: auto;
	}
	
	.weatherMarquee > .grid-x{
		height: 2.5rem;
		flex-wrap: nowrap;
	}
	
}