/**************************************** 
Fonts 
****************************************/
@font-face {
	font-family: 'MyriadPro';
	src: url('../fonts/MyriadPro-Regular.eot');
	src: url('../fonts/MyriadPro-Regular.eot?#iefix') format('embedded-opentype'),
		url('../fonts/MyriadPro-Regular.woff') format('woff'),
		url('../fonts/MyriadPro-Regular.ttf')  format('truetype');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'MyriadPro-It';
	src: url('../fonts/MyriadPro-It.eot');
	src: url('../fonts/MyriadPro-It.eot?#iefix') format('embedded-opentype'),
		url('../fonts/MyriadPro-It.woff') format('woff'),
		url('../fonts/MyriadPro-It.ttf')  format('truetype');
	font-weight: normal;
	font-style: italic;
}
@font-face {
	font-family: 'MyriadPro';
	src: url('../fonts/MyriadPro-Semibold.eot');
	src: url('../fonts/MyriadPro-Semibold.eot?#iefix') format('embedded-opentype'),
		url('../fonts/MyriadPro-Semibold.woff') format('woff'),
		url('../fonts/MyriadPro-Semibold.ttf')  format('truetype');
	font-weight: 500;
	font-style: normal;
}
@font-face {
	font-family: 'MyriadPro';
	src: url('../fonts/MyriadPro-Bold.eot');
	src: url('../fonts/MyriadPro-Bold.eot?#iefix') format('embedded-opentype'),
		url('../fonts/MyriadPro-Bold.woff') format('woff'),
		url('../fonts/MyriadPro-Bold.ttf')  format('truetype');
	font-weight: bold;
	font-style: normal;
}


/**************************************** 
Animation
****************************************/
@keyframes new_blink{
 	0% { color: red; }
	50% { color: #ffc800; }
	50.01% { color: #ffc800; }
	100% { color: red; }
}
/* 添加兼容性前缀 */
@-webkit-keyframes new_blink {
    0% { color: red; }
	50% { color: #ffc800; }
	50.01% { color: #ffc800; }
	100% { color: red; }
}
@-moz-keyframes new_blink {
    0% { color: red; }
	50% { color: #ffc800; }
	50.01% { color: #ffc800; }
	100% { color: red; }
}
@-ms-keyframes new_blink {
    0% { color: red; }
	50% { color: #ffc800; }
	50.01% { color: #ffc800; }
	100% { color: red; }
}
@-o-keyframes new_blink {
    0% { color: red; }
	50% { color: #ffc800; }
	50.01% { color: #ffc800; }
	100% { color: red; }
}


/****************************************
Skip to content
****************************************/
a[href="#h1_maincontent"].sr-only-focusable:active,
a[href="#h1_maincontent"].sr-only-focusable:focus {
	position: absolute;
    z-index: 99999;
    background: white;
    padding: 10px 15px;
    margin: 15px;
    border: 3px solid #0066cc;
    box-sizing: border-box;
}
.anchor {
    display: block;
    position: relative;
    top: -165px;
    visibility: hidden;
}


/**************************************** 
Basic 
****************************************/
html, body {
	padding: 0;
	margin: 0;
}
body {
	font-family: 'MyriadPro', 'Microsoft JhengHei', 微軟正黑體, 微軟雅黑體, 細明體_HKSCS, Arial, sans-serif;
	letter-spacing: 1.5px;
    line-height: 1.5;
}
strong {
    font-family: 'MyriadPro', Yu Gothic, MS Gothic, 微軟正黑體, serif;
}
a {
	color: #000000;
	text-decoration: none;
	text-decoration-skip-ink: none;
}
a:hover {
	color: #0066CC;
}

a.grey_link, a.grey_link *{
	color:#999 !important;	
}
.italic {
	font-style: italic !important;
}
.line-through {
	text-decoration: line-through !important;
}
.underline {
	text-decoration: underline !important;
}
.overline {
	text-decoration: overline !important;
}
.btn {
	background-color: #0066CC;
	color: white !important;
	font-size: 14px;
	padding: 5px 20px;
	border-radius: 30px;
	transition: 0.2s all ease;
	text-decoration:none !important;
}
.btn:hover {
	color: white;
    background-color: #fc0000;
}
.btn_2{
	background-color: transparent;
	border-radius: 10px;	
	border: #0066CC 2px solid;
	color: #0066CC  !important;
	
}
.btn:hover {
	color: white !important;
    background-color: #0066CC;
}

.access {
    height: 1px;
    left: 0;
    overflow: hidden;
    position: absolute;
    top: -500px;
    width: 1px;
}
[v-cloak] {
	display: none;
}
.content_pi {
	color: #551F81 !important;
	font-weight: bold !important;
	border:none !important;
	max-width:none !important;
	display:inline !important;
	padding:0px !important;
	
}
.vertical-middle {
	display: flex !important;
	flex-direction: column !important;
	justify-content: center !important;
	align-items: center !important;
}

/**************************************** 
Nav 
****************************************/
nav div.desktop  {
	font-size: 16px;
	line-height: 18px;
	letter-spacing: 1.5px;
	box-shadow: 0px 0px 10px rgba(0,0,0,0.2);
	background: white;
	position: fixed;
	width: 100%;
	z-index: 9999;
}
nav div.desktop > div.container-fluid {
	padding: 0;
}
nav div.desktop hr {
	border: 0;
    border-top: 1px solid #CCCCCC;
}
nav div.desktop .top-bar .logo > a > img {
	max-width: 100%;
	padding: 10px 0;
	cursor: pointer;
}
nav div.desktop .links ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
	overflow: hidden;
	background-color: white;
	width: auto;
	float: right;
}
nav div.desktop .links ul li {
	float: left;
	transition: 0.15s all ease;
}
nav div.desktop .links ul li:not(.no-effects) a {
	transition: 0.15s all ease;
	padding: 33px 0;
	display: block;
	text-decoration: none;
}
nav div.desktop .links ul li:not(.no-effects):first-child {
	border-left: 1px solid transparent;
}
nav div.desktop .links ul li:not(.no-effects) > a > span {
	border-left: 1px solid #CCCCCC;
	/*display: block;*/
	color: #000000;
	text-align: center;
	padding: 0 15px;
	align-items: center;
    display: flex;
	/*max-width: 325px;
	font-size: 100%;*/
	max-width: 300px;
	font-size: 91%;
}
nav div.desktop .links ul li:not(.no-effects):hover,
nav div.desktop .links ul li:not(.no-effects).active {
	color: white;
	background-color: #fc0000;
}
nav div.desktop .links ul li:not(.no-effects):hover > a > span,
nav div.desktop .links ul li:not(.no-effects).active > a > span{
	border-left: 1px solid transparent;
	color: white;
}
nav div.desktop .links ul li:not(.no-effects):hover + li > a > span ,
nav div.desktop .links ul li:not(.no-effects).active + li > a > span {
	border-left: 1px solid transparent;
}
nav div.desktop .links ul li:not(.no-effects):last-child > a > span {
	border-right: 1px solid #CCCCCC;
}
nav div.desktop .main-menu .right ul li.text-size:hover + li > a > span,
nav div.desktop .main-menu .right ul li.text-size:focus + li > a > span  {
	border-left: 1px solid #CCCCCC;
}
nav div.desktop .links ul li:not(.no-effects):last-child:hover > a > span,
nav div.desktop .links ul li:not(.no-effects):last-child.active > a > span {
	border-right: 1px solid transparent;
}
nav div.desktop .links .social-icons {
	padding: 32px 14px;
	/*margin-top: -2px;*/
	line-height: 16px;
}
nav div.desktop .links .social-icons > a img {
	height: 20px;
    width: auto;
	padding: 0 3px;
}
/* Main Menu Left */
nav div.desktop .main-menu .left {
	padding-right: 0;
}
nav div.desktop .main-menu .left ul {
	float: left;
}
nav div.desktop .main-menu .left ul li {
	float: left;
	padding: 0;
	
}
nav div.desktop .main-menu .left ul li:not(.no-effects) > a {
	padding: 11px 0;
	/*display: block;*/
	text-decoration: none;
	display: flex;
}
nav div.desktop .main-menu .left ul li > a {
	height: 59px;
}
nav div.desktop .main-menu .left ul li:not(.no-effects) > a span {
	padding: 0 21px;
}
nav div.desktop .main-menu .left ul li .submenu li a{
	display: inline-flex;	
}

/* Main Menu Right */
nav div.desktop .main-menu .right {
	padding-left: 0;
}
nav div.desktop .main-menu .right ul {
	float: right;
}
nav div.desktop .main-menu .right ul li {
	float: left;
}
nav div.desktop .main-menu .right ul li span {
	line-height: 18px;
}

nav div.desktop .main-menu .right ul li input {
	border: 0;
	border-bottom: 1px solid #000000;
	/*width: 70px;*/
	width: 65px;
}
nav div.desktop .main-menu .right ul li > a{
	padding: 11px 0;
}

nav div.desktop .main-menu .right ul li > a > span{
	height: 37px;
}

nav div.desktop .main-menu .right ul li:not(.no-effects) a {
	/*padding: 22px 0;*/
    display: block;
	text-decoration: none;
}
nav div.desktop .main-menu .right ul li:nth-last-child(2) > a span {
	border-right: 1px solid #CCCCCC;
}
nav div.desktop .main-menu .right ul li:nth-last-child(2).active > a span,
nav div.desktop .main-menu .right ul li:nth-last-child(2):hover > a span {
	border-right: 1px solid transparent;
}
nav div.desktop .main-menu .right ul li.search > span{
	display:flex;

	align-items: center;
}
	
nav div.desktop .main-menu .right ul li input {
	margin-left: 15px;
	height: 20px;
}
nav div.desktop .main-menu .right ul li input:focus {
	border-bottom: 2px solid #fc0000;
	outline: none;
}
nav div.desktop .main-menu .right ul li.no-effects > a span{
	border-left: 0 !important;
	border-right: 1px solid #CCCCCC;
	color: #000000;
	text-decoration: none;
	padding-left: 3px;
	padding-right: 15px;
}
nav div.desktop .main-menu .right ul li.no-effects > a:focus span,
nav div.desktop .main-menu .right ul li.no-effects > a:hover span, 
nav div.desktop .main-menu .right ul li.search > span > a:focus span, 
nav div.desktop .main-menu .right ul li.search > span > a:hover span, 
nav div.desktop .main-menu .right ul li.search > span > a {
	color: #fc0000;
	text-decoration: none;
}
nav div.desktop .main-menu .right ul li.search > span > a span  {
	display:flex;
	height: 37px;
	align-items: center;
	border-left: 0 !important;
	border-right: 1px solid #CCCCCC;
	color: #000000;
	text-decoration: none;
	padding-left: 3px;
	padding-right: 15px;
	
}
/* Main Menu Text Size */
nav div.desktop .main-menu .right ul li.text-size {
    color: #000000;
    background-color: white;
	padding: 11px 16px 11px 0;
}
nav div.desktop .main-menu .right ul li.text-size > span > span,
nav div.desktop .main-menu .right ul li.text-size > span > a {
	display: inline-block;
    color: #000000 !important;
	padding: 0;
}
nav div.desktop .main-menu .right ul li.text-size > span {
	border-left: 1px solid #CCCCCC;
	padding-left: 16px;
	display: flex;
	height: 37px;
    align-items: center;
}

nav div.desktop .main-menu .right ul li.text-size > span > a {
	border-left: 0 !important;
	padding: 0;
    margin-left: 3px;
}
nav div.desktop .main-menu .right ul li.text-size > span > a.small {
	font-size: 85%;
    line-height: 16px;
}
nav div.desktop .main-menu .right ul li.text-size > span > a.normal {
	font-size: 102%;
    line-height: 16px;
}
nav div.desktop .main-menu .right ul li.text-size > span > a.large {
	font-size: 120%;
	line-height: 16px;
}
nav div.desktop .main-menu .right ul li.text-size > span > a.active,
nav div.desktop .main-menu .right ul li.text-size > span > a:hover {
	text-decoration: underline;
	color: #fc0000 !important;
}
nav div.desktop .main-menu .right ul li:hover + li.text-size > span ,
nav div.desktop .main-menu .right ul li.active + li.text-size > span {
	border-left: 1px solid transparent;
}
nav div.desktop .main-menu .right ul li.text-size:hover + li > span > a span ,
nav div.desktop .main-menu .right ul li.text-size.active + li > span > a span {
	border-left: 1px solid #CCCCCC;
}
/* Main Menu Search */
nav div.desktop .main-menu .right ul li.search {
    padding: 11px 0;
}
/* Submenu */
nav div.desktop .submenu {
	position: absolute;
	display: none;
	z-index: 99;
	width: 100%;
    left: -10%;
	background: white;
	padding: 0px;
	border-top: 2px solid #fc0000;
	box-shadow: 0px 10px 15px rgba(0,0,0,0.2);
	margin-top: -2px;
	padding-right: 100%;
    padding-left: 10%;
    box-sizing: content-box;
}
nav div.desktop .submenu {
	/*display: none;*/
}

nav div.desktop .main-menu .left ul li:hover .submenu, nav div.desktop .submenu.active {
	display: block;
}
nav div.desktop .submenu ul {
	list-style: none;
	margin: 0;
	padding: 0;
	width:100%;
}
nav div.desktop .submenu ul li {
	/*text-indent: -18px;
    padding: 10px;
	padding-left: 35px;*/
	padding: 0 10px  !important;
}
nav div.desktop .submenu ul li:hover, nav div.desktop .submenu ul li.active {
    background-color: #fc0000;
}
nav div.desktop .submenu ul li a {
    color: #000000;
	text-decoration: none;
	padding: 10px !important;
	width: 90% !important;
	display: inline-flex !important;
	line-height: 1.5;
	height:auto !important;
}
nav div.desktop .submenu ul li:hover > a, nav div.desktop .submenu ul li.active > a {
    color: white;
}
nav div.desktop .submenu ul li:before {
	content: "\f0da";
	font-family: "FontAwesome";
	padding-right: 5px;
	color: #000;
}
nav div.desktop .submenu ul li:hover:before, nav div.desktop .submenu ul li.active:before {
	color: white;
}
nav div.desktop div.social-share {
	margin-left: -1px;
	position: absolute;
	display: none;
	z-index: 99;
	background: white;
	padding: 10px;
	border-top: 2px solid #fc0000;
	box-shadow: 0px 10px 15px rgba(0,0,0,0.2);
}
nav div.desktop li.social-share-list > button > span {
	padding: 22px 15px;
    display: block;
    text-decoration: none;
}
nav div.desktop li.social-share-list.active div.social-share {
	display: flex !important;
}
nav div.desktop div.social-share > a {
	display: inline-block;
	padding: 0 !important;
}
nav div.desktop div.social-share img {
	display: inline-block;
	padding: 2px;
}
nav div.desktop .main-menu .right ul li.print a > span > span {
	line-height: 16px;
}
#wechat-qrcode {
	display: none;
}
/*** Scrolled Desktop Nav ***/
nav div.desktop .top-bar .logo > a > img,
nav div.desktop .top-bar .links ul li:not(.no-effects) a,
nav div.desktop .top-bar .links .social-icons {
	transition: 0.5s all ease;
}
nav.scrolled div.desktop .top-bar .logo > a > img {
	max-width: 90%;
	padding: 5px 0;
}
nav.scrolled div.desktop .top-bar .links ul li:not(.no-effects) a {
    padding: 28px 0;
}
nav.scrolled div.desktop .top-bar .links .social-icons {
	padding: 27px 10px;
}

nav li.other-langs-list .other-langs-icon:before {
	content: "";
	background-repeat: no-repeat;
	background-position: 50% 50%;
    background-size: contain;
	background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjxzdmcgaGVpZ2h0PSIyMHB4IiB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAyMCAyMCIgd2lkdGg9IjIwcHgiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6c2tldGNoPSJodHRwOi8vd3d3LmJvaGVtaWFuY29kaW5nLmNvbS9za2V0Y2gvbnMiIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj48dGl0bGUvPjxkZXNjLz48ZGVmcy8+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIiBpZD0iUGFnZS0xIiBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSI+PGcgZmlsbD0iIzAwMDAwMCIgaWQ9IkNvcmUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yOTYuMDAwMDAwLCAtMjk2LjAwMDAwMCkiPjxnIGlkPSJsYW5ndWFnZSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjk2LjAwMDAwMCwgMjk2LjAwMDAwMCkiPjxwYXRoIGQ9Ik0xMCwwIEM0LjUsMCAwLDQuNSAwLDEwIEMwLDE1LjUgNC41LDIwIDEwLDIwIEMxNS41LDIwIDIwLDE1LjUgMjAsMTAgQzIwLDQuNSAxNS41LDAgMTAsMCBMMTAsMCBaIE0xNi45LDYgTDE0LDYgQzEzLjcsNC43IDEzLjIsMy42IDEyLjYsMi40IEMxNC40LDMuMSAxNiw0LjMgMTYuOSw2IEwxNi45LDYgWiBNMTAsMiBDMTAuOCwzLjIgMTEuNSw0LjUgMTEuOSw2IEw4LjEsNiBDOC41LDQuNiA5LjIsMy4yIDEwLDIgTDEwLDIgWiBNMi4zLDEyIEMyLjEsMTEuNCAyLDEwLjcgMiwxMCBDMiw5LjMgMi4xLDguNiAyLjMsOCBMNS43LDggQzUuNiw4LjcgNS42LDkuMyA1LjYsMTAgQzUuNiwxMC43IDUuNywxMS4zIDUuNywxMiBMMi4zLDEyIEwyLjMsMTIgWiBNMy4xLDE0IEw2LDE0IEM2LjMsMTUuMyA2LjgsMTYuNCA3LjQsMTcuNiBDNS42LDE2LjkgNCwxNS43IDMuMSwxNCBMMy4xLDE0IFogTTYsNiBMMy4xLDYgQzQuMSw0LjMgNS42LDMuMSA3LjQsMi40IEM2LjgsMy42IDYuMyw0LjcgNiw2IEw2LDYgWiBNMTAsMTggQzkuMiwxNi44IDguNSwxNS41IDguMSwxNCBMMTEuOSwxNCBDMTEuNSwxNS40IDEwLjgsMTYuOCAxMCwxOCBMMTAsMTggWiBNMTIuMywxMiBMNy43LDEyIEM3LjYsMTEuMyA3LjUsMTAuNyA3LjUsMTAgQzcuNSw5LjMgNy42LDguNyA3LjcsOCBMMTIuNCw4IEMxMi41LDguNyAxMi42LDkuMyAxMi42LDEwIEMxMi42LDEwLjcgMTIuNCwxMS4zIDEyLjMsMTIgTDEyLjMsMTIgWiBNMTIuNiwxNy42IEMxMy4yLDE2LjUgMTMuNywxNS4zIDE0LDE0IEwxNi45LDE0IEMxNiwxNS43IDE0LjQsMTYuOSAxMi42LDE3LjYgTDEyLjYsMTcuNiBaIE0xNC40LDEyIEMxNC41LDExLjMgMTQuNSwxMC43IDE0LjUsMTAgQzE0LjUsOS4zIDE0LjQsOC43IDE0LjQsOCBMMTcuOCw4IEMxOCw4LjYgMTguMSw5LjMgMTguMSwxMCBDMTguMSwxMC43IDE4LDExLjQgMTcuOCwxMiBMMTQuNCwxMiBMMTQuNCwxMiBaIiBpZD0iU2hhcGUiLz48L2c+PC9nPjwvZz48L3N2Zz4=");
	width: 16px;
    height: 100%;
}

nav li.other-langs-list.active .other-langs-icon:before, 
nav li.other-langs-list a:hover .other-langs-icon:before {
	background-image: url("data:img/svg+xml;base64,iVBORw0KGgoAAAANSUhEUgAAAFMAAABTCAYAAADjsjsAAAACuUlEQVR4nO2dUY+EIAyEdXP//y97yeXcEJcV2pm2gJ3HfWjL5yDgCu7HcWzBYhawRzblJyCn5dW7xnaF6wkzogucOV2gWsMMv4f8q6zDDKwVzFEg1mTm1hc74OAgS9HrZDpzFoilqC5lOXNGkKUo9aPOnB1iKdiliDNXAllK3S4tTG+Q3isbVfs0MKNADg9UChMFuTtCYeQStVcCEwFZNkwS5wpDAqccUBCo3fX2wkRBjiAEalf7e2BqQdaKR1zZ+r2mWj4zoBbLyW0gN36TSX0tmBpXMgptxfDIUdMtjzuYbJBRk/y7vFSgzG7O6jq9cbzzNfUNptRFrYKil56t/FKg1Xg1mGyQlrEic39wQrv56KO2VFB7rjBXfRIkkXoeO9rzTM+/gemymrQ/UiXM7OI6vbmlM4k6YaYrMf3xS2cSlTCJSphEvfJ+SdORziRKsgKiP0wF4kbkC/vb4pHqhbna0yETPdGZZgPuajBDe1DeM/vVvFAJk6iESVTCJCphErUazND/kNKZRCVMojxedn2MnujMITaiWrnT2/W5Np9Br3y8RtOeziQqYRKVMIk6YeZ9E9Mfv3QmUSXMdKdOb27pTKKQ17DRPYxoTMvYlM375gknkHqzLNrNVwMKtacGk7JbSylprMjcH5y+OZMNNHqmwN6OWI3HHM1ZLumN452vqTuY7JF1xHksdRt4y5mWUxVEjOMp6AcTWE3aUaDWF8Qkfg9M5pu2jHks6krkAJdbWb/segx2uqsZyE3YzdGDljSnAF4br3ElekG765WuzXewME+XMnKJDKQZgKIOuBv+ZETtaD7FEYyAVO1DpkarPkxWtws9VkJz8uCogs3BmrTP7lJK/cyjxWd0KdUEFsvJWVxKr9Pqcwwju3S6b1ucKguPBLvEV1dKRbh12e8BnUKOzpXG9tO2bb9B/Xq/4W+MAgAAAABJRU5ErkJggg==");
}

nav div.desktop li.other-langs-list {
	direction: rtl;
}
nav div.desktop li.other-langs-list div.other-langs {
	position: absolute;
	display: none;
	z-index: 99;
	background-color: white;
	padding: 10px;
	border-top: 2px solid #fc0000;
    box-shadow: 0px 10px 15px rgba(0, 0, 0, 0.2);
}
nav div.desktop li.other-langs-list.active div.other-langs {
	display: flex !important;
	flex-direction: column;
    align-items: center;
    text-align: center;
}
nav div.desktop li.other-langs-list div.other-langs a {
	padding: 10px 0;
	white-space: nowrap;
}
/**************************************** 
Mobile Menu 
****************************************/
nav div.mobile {
	border-bottom: 1px solid #004A95;
	z-index: 99;
	position: fixed;
    width: 100%;
	background: white;
}
nav div.mobile-spacer {
	height: 100px;
}
nav div.mobile > div {
	padding: 0;
}
nav div.mobile > div img {
	max-width: 100%;
	padding: 10px 0 10px 15px;
}
nav div.mobile .icons {
	text-align: right;
}
nav div.mobile .icons a {
	max-width: 25%; 
	display: inline-flex;
	justify-content: center;
	align-items: center;
	height: 100%; 
	padding: 10px;
	font-size: 30px;
	font-weight: bold;
	text-decoration: none;
	color: #000000;
	transition: 0.3s all ease;
	-ms-transform: rotate(0deg); /* IE 9 */
	-webkit-transform: rotate(0deg); /* Safari 3-8 */
	transform: rotate(0deg);
}
nav div.mobile .icons > a:last-child {
	margin-right: 10px;
}
nav div.mobile .icons > a:last-child.active {
	-ms-transform: rotate(180deg); /* IE 9 */
	-webkit-transform: rotate(180deg); /* Safari 3-8 */
	transform: rotate(180deg);
	color: #fc0000;
}
nav div.mobile .icons > a:last-child.active span.fa-bars:before {
	content: "\f00d";
	font-family: FontAwesome;
	padding: 0 1px 0 .5px;
}
.modal-backdrop.show {
	display: none;
}
/* Mobile Search */
#mobile-search {
	padding: 0 !important;
	background: white;
	z-index: 100;
}
#mobile-search .modal-dialog {
	width: 100%;
    max-width: 100%;
	margin: 0;
}
#mobile-search .modal-content {
	margin: 0;
    padding: 0;
    border-radius: 0;
	border: 0;
}
#mobile-search .modal-header {
	padding: 10px 0 10px 15px;
	border-bottom: 1px solid #004A95;
}
#mobile-search .modal-header img {
	height: 100%;
	width: auto;
}
#mobile-search .modal-header a {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	height: 100%; 
	padding: 10px;
	font-size: 30px;
	font-weight: bold;
	text-decoration: none;
	color: #000000;
	transition: 0.3s all ease;
}
#mobile-search .modal-header a:first-child {
	padding: 0;
}
#mobile-search .modal-header a:last-child {
	margin-right: 10px;
}
#mobile-search .modal-header a:hover {
	color: #fc0000;
}
#mobile-search .modal-body {
	width: 100%;
	padding: 2.5rem 2rem;
}
#mobile-search .modal-body p {
    font-size: 40px;
    margin-bottom: 30px;
    font-weight: bold;
    /*background: #eeeeee;*/
    line-height: 0.3;
    overflow: visible;
}
#mobile-search .modal-body > input {
	width: 80%;
    border: none;
    border-bottom: 2px solid #fc0000;
    font-size: 26px;
	outline: none;
	padding: 0 0 5px;
	color: #0066CC;
	border-radius: 0;
}
#mobile-search .modal-body > a {
    display: inline-block;
    float: right;
    font-size: 36px;
	color: #000000;
}

/* Mobile Other language */
#m-other-langs {
	padding: 0 !important;
	background: white;
	z-index: 100;
}
#m-other-langs .modal-dialog {
	width: 100%;
    max-width: 100%;
	margin: 0;
}
#m-other-langs .modal-content {
	margin: 0;
    padding: 0;
    border-radius: 0;
	border: 0;
}
#m-other-langs .modal-header {
	padding: 10px 0 10px 15px;
	border-bottom: 1px solid #004A95;
}
#m-other-langs .modal-header img {
	height: 100%;
	width: auto;
}
#m-other-langs .modal-header a {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	height: 100%; 
	padding: 10px;
	font-size: 30px;
	font-weight: bold;
	text-decoration: none;
	color: #000000;
	transition: 0.3s all ease;
}
#m-other-langs .modal-header a:first-child {
	padding: 0;
}
#m-other-langs .modal-header a:last-child {
	margin-right: 10px;
}
#m-other-langs .modal-header a:hover {
	color: #fc0000;
}
#m-other-langs .modal-body {
	width: 100%;
	padding: 2.5rem 2rem;
}
#m-other-langs .modal-body p {
    font-size: 40px;
    margin-bottom: 30px;
    font-weight: bold;
    /*background: #eeeeee;*/
    line-height: 0.3;
    overflow: visible;
}
#m-other-langs .modal-body .other-langs {
	display: flex;
	flex-direction: column;
}
#m-other-langs .modal-body .other-langs > a {
    display: inline-block;
    float: right;
    font-size: 1.5rem;
	color: #000000;
	padding: 5px 0;
	text-decoration: none;
}
#m-other-langs .modal-body .other-langs > a:focus,
#m-other-langs .modal-body .other-langs > a:hover {
	color: #0066CC;
}
#m-other-langs .modal-body .other-langs > a[dir=rtl] {
	text-align: left;
}

/* Mobile Nav */
#mobile-nav {
	padding: 0 !important;
	background: white;
	z-index: 100;
}
#mobile-nav .modal-dialog {
	width: 100%;
    max-width: 100%;
	margin: 0;
}
#mobile-nav .modal-content {
	margin: 0;
    padding: 0;
    border-radius: 0;
	border: 0;
}
#mobile-nav .modal-header {
	padding: 10px 0 10px 15px;
	border-bottom: 1px solid #004A95;
}
#mobile-nav .modal-header img {
	height: 100%;
	width: auto;
}
#mobile-nav .modal-header a {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	height: 100%; 
	padding: 10px;
	font-size: 30px;
	font-weight: bold;
	text-decoration: none;
	color: #000000;
	transition: 0.3s all ease;
}
#mobile-nav .modal-header a:first-child {
	padding: 0;
}
#mobile-nav .modal-header a:last-child {
	margin-right: 10px;
}
#mobile-nav .modal-header a:hover {
	color: #fc0000;
}
#mobile-nav .modal-body {
	width: 100%;
	padding: 1rem 2rem;
}
#mobile-nav .modal-body a.main-menu {
    display: block;
	width: 100%;
    font-size: 30px;
    font-weight: bold;
    color: #000000;
    padding: 7px 0px;
    text-decoration: none;
}
#mobile-nav .modal-body a.main-menu:focus,
#mobile-nav .modal-body a.main-menu.active {
    color: #0066CC;
}
#mobile-nav .modal-body a.main-menu[data-toggle=collapse]:after {
    content: "\f107";
	font-family: FontAwesome;
	float: right;
}
#mobile-nav .modal-body a.main-menu[data-toggle=collapse].active:after {
    content: "\f106";
}
#mobile-nav .modal-body div.sub-menu {
    margin-bottom: 10px;
}
#mobile-nav .modal-body div.sub-menu a {
	width: 100%;
    display: block;
    font-size: 22px;
    padding: 7px 0;
    font-weight: normal;
	text-decoration: none;
	line-height: 1.2;
}
#mobile-nav .modal-body div.social-icons {
	margin: 10px 0 30px;
	max-width: 100%;
}
#mobile-nav .modal-body div.social-icons > div > div {
	border-top:	1px solid #000000;
	padding: 30px 0 0 0;
}
#mobile-nav .modal-body div.social-icons > div > div a {
	margin-right: 5px;
}
#mobile-nav .modal-body div.text-size {
	margin: 10px 0 20px;
	max-width: 100%;
	font-size: 30px;
}
#mobile-nav .modal-body div.text-size > div > div {
	padding: 0;
}
#mobile-nav .modal-body div.text-size > div > div a {
	padding-left: 5px;
}
#mobile-nav .modal-body div.text-size > div > div a:hover,
#mobile-nav .modal-body div.text-size > div > div a.active {
	text-decoration: underline;
    color: #fc0000;
}
#mobile-nav .modal-body div.text-size > div > div a.small {
	font-size: 80%;
}
#mobile-nav .modal-body div.text-size > div > div a.normal {
	font-size: 102%;
}
#mobile-nav .modal-body div.text-size > div > div a.large {
	font-size: 120%;
}

nav div.mobile a.btn-other-langs .other-langs-icon:before {
	content: "";
	background-repeat: no-repeat;
	background-position: 50% 50%;
    background-size: contain;
	background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjxzdmcgaGVpZ2h0PSIyMHB4IiB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAyMCAyMCIgd2lkdGg9IjIwcHgiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6c2tldGNoPSJodHRwOi8vd3d3LmJvaGVtaWFuY29kaW5nLmNvbS9za2V0Y2gvbnMiIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj48dGl0bGUvPjxkZXNjLz48ZGVmcy8+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIiBpZD0iUGFnZS0xIiBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSI+PGcgZmlsbD0iIzAwMDAwMCIgaWQ9IkNvcmUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yOTYuMDAwMDAwLCAtMjk2LjAwMDAwMCkiPjxnIGlkPSJsYW5ndWFnZSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjk2LjAwMDAwMCwgMjk2LjAwMDAwMCkiPjxwYXRoIGQ9Ik0xMCwwIEM0LjUsMCAwLDQuNSAwLDEwIEMwLDE1LjUgNC41LDIwIDEwLDIwIEMxNS41LDIwIDIwLDE1LjUgMjAsMTAgQzIwLDQuNSAxNS41LDAgMTAsMCBMMTAsMCBaIE0xNi45LDYgTDE0LDYgQzEzLjcsNC43IDEzLjIsMy42IDEyLjYsMi40IEMxNC40LDMuMSAxNiw0LjMgMTYuOSw2IEwxNi45LDYgWiBNMTAsMiBDMTAuOCwzLjIgMTEuNSw0LjUgMTEuOSw2IEw4LjEsNiBDOC41LDQuNiA5LjIsMy4yIDEwLDIgTDEwLDIgWiBNMi4zLDEyIEMyLjEsMTEuNCAyLDEwLjcgMiwxMCBDMiw5LjMgMi4xLDguNiAyLjMsOCBMNS43LDggQzUuNiw4LjcgNS42LDkuMyA1LjYsMTAgQzUuNiwxMC43IDUuNywxMS4zIDUuNywxMiBMMi4zLDEyIEwyLjMsMTIgWiBNMy4xLDE0IEw2LDE0IEM2LjMsMTUuMyA2LjgsMTYuNCA3LjQsMTcuNiBDNS42LDE2LjkgNCwxNS43IDMuMSwxNCBMMy4xLDE0IFogTTYsNiBMMy4xLDYgQzQuMSw0LjMgNS42LDMuMSA3LjQsMi40IEM2LjgsMy42IDYuMyw0LjcgNiw2IEw2LDYgWiBNMTAsMTggQzkuMiwxNi44IDguNSwxNS41IDguMSwxNCBMMTEuOSwxNCBDMTEuNSwxNS40IDEwLjgsMTYuOCAxMCwxOCBMMTAsMTggWiBNMTIuMywxMiBMNy43LDEyIEM3LjYsMTEuMyA3LjUsMTAuNyA3LjUsMTAgQzcuNSw5LjMgNy42LDguNyA3LjcsOCBMMTIuNCw4IEMxMi41LDguNyAxMi42LDkuMyAxMi42LDEwIEMxMi42LDEwLjcgMTIuNCwxMS4zIDEyLjMsMTIgTDEyLjMsMTIgWiBNMTIuNiwxNy42IEMxMy4yLDE2LjUgMTMuNywxNS4zIDE0LDE0IEwxNi45LDE0IEMxNiwxNS43IDE0LjQsMTYuOSAxMi42LDE3LjYgTDEyLjYsMTcuNiBaIE0xNC40LDEyIEMxNC41LDExLjMgMTQuNSwxMC43IDE0LjUsMTAgQzE0LjUsOS4zIDE0LjQsOC43IDE0LjQsOCBMMTcuOCw4IEMxOCw4LjYgMTguMSw5LjMgMTguMSwxMCBDMTguMSwxMC43IDE4LDExLjQgMTcuOCwxMiBMMTQuNCwxMiBMMTQuNCwxMiBaIiBpZD0iU2hhcGUiLz48L2c+PC9nPjwvZz48L3N2Zz4=");
	display: inline-block;
	width: 28px;
    height: 28px;
	margin-bottom: -3px;
}


/**************************************** 
Footer
****************************************/
footer #scroll-to-top {
	position: fixed;
	bottom: 34px;
    right: 0;
	z-index: 99;
	font-size: 18px;
	border: none;
	outline: none;
	background-color: #08396B;
	color: white;
	cursor: pointer;
	padding: 15px;
	transition: 0.3s all ease;
}
footer #scroll-to-top:hover {
	box-shadow: 2px 2px 10px rgba(0,0,0,0.3);
}
footer #scroll-to-top:focus {
	/*border: 3px solid #0066cc;*/
	outline:3px solid #0066cc;
}
footer .container-fluid {
	padding: 0;
	font-size: 14.5px;
}
footer .container-fluid .row {
	margin: 0;
}
footer .container-fluid .sp-line,
footer .container-fluid .sp-line .col-sm-12 {
	padding: 0;
}
footer .container-fluid .sp-line .col-sm-12 hr {
	margin: 0;
	padding: 0;
	background-color: #08396B;
	height: 4px;
}
footer .right .icons img {
	max-height: 40px;
	width: auto;
	margin: 0 5px;
}
footer .container-fluid .details {
	margin-top: 30px;
	margin-bottom: 15px;
    display: flex;
    justify-content: center;
    align-items: flex-end;
}
footer .container-fluid .details > div {
	padding: 0;
}
footer .container-fluid .details .left {
    display: flex;
    justify-content: flex-start;
    align-items: flex-end;
}
footer .container-fluid .details .right {
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
}
footer .container-fluid .details .right .icons {
	order: 2;
}
footer .container-fluid .details .right .text {
	order: 1;
	margin-right: 10px;
}
footer .container-fluid .details .left .text a {
	padding: 0 5px;
}

	
/**************************************** 
Home Slider 
****************************************/
#home-slider, #subsite-slider {
    width: 100%;
}
#home-slider .carousel-control, #subsite-slider .carousel-control {
    margin-top: 20px;
}
#home-slider .carousel-indicators li, #subsite-slider .carousel-indicators li {
	width: 40px;
    height: 4px;
	background-color: #FFF !important;
	box-shadow: 1px 1px 4px #000;
	border:none;
	margin-bottom:10px;
	opacity: 1;
}
#home-slider .carousel-indicators .active, #subsite-slider .carousel-indicators .active {
	background-color: #fc0000 !important;
}
#home-slider .control-btn, #subsite-slider .control-btn {
	position: absolute;
    right: 0;
    bottom: 40px;
    left: 0;
    z-index: 20;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center;
    padding-left: 0;
    margin-right: 15%;
    margin-left: 15%;
    list-style: none;
}
#home-slider .control-btn, #subsite-slider .control-btn{
		
}
#home-slider .control-btn a, #subsite-slider .control-btn a{
	color: white !important;
    position: absolute;
    top: 0;
    left: calc(50% - 115px);
    width: 25px;
    height: 25px;
	transition: 0.15s all;
	text-shadow: 1px 1px 4px #000;
}
#subsite-slider .control-btn a{
    left: calc(50% - 190px);
	
}
#subsite-slider.hkas .control-btn a{
    left: calc(50% - 120px);
	
}
#subsite-slider.qsdiv .control-btn a,
#subsite-slider.psib .control-btn a{
    left: calc(50% - 100px);
	
}
.timeline-carousel .control-btn a{
	position: absolute;
	left: calc(50% - 190px);
}
#home-slider .control-btn a:hover, #subsite-slider .control-btn a:hover {
	color: #fc0000 !important;
}
#home-slider .carousel-inner .carousel-item, #subsite-slider .carousel-inner .carousel-item {
    width: 100%;
    height: 400px;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	-webkit-animation-name: sliderZoomOut; /* Safari 4.0 - 8.0 */
	-webkit-animation-duration: 3s; /* Safari 4.0 - 8.0 */
	/*animation-name: sliderZoomOut;
	animation-duration: 1s;
	overflow: hidden;*/
}
/*@-webkit-keyframes sliderZoomOut {
  from {transform: scale(1.1);}
  to {transform: scale(1);}
}
@keyframes sliderZoomOut {
  from {transform: scale(1.1);}
  to {transform: scale(1);}
}*/
#home-slider .carousel-control-next, #subsite-slider .carousel-control-next {
	right: 0;
}
#home-slider .carousel-control-prev, #subsite-slider .carousel-control-prev {
	left: 0;
}
#home-slider .carousel-control-next, #home-slider .carousel-control-prev, #subsite-slider .carousel-control-next, #subsite-slider .carousel-control-prev {
	opacity: 1;
	width: auto;
	background: rgba(127,127,127,1);
	top: 45%;
	bottom: auto;
	padding: 15px 5px;
	z-index: 11;
}
#home-slider .carousel-control-next:focus ,#home-slider .carousel-control-prev:focus, #subsite-slider .carousel-control-next:focus ,#subsite-slider .carousel-control-prev:focus{
	border: 3px solid #0066cc;
}
#home-slider .slider-text > .row > .col-md-6, #subsite-slider .slider-text > .row > .col-md-6, #subsite-slider .slider-text > .row > .col-md-8, #subsite-slider .slider-text > .row > .col-md-4 {
	height: 400px;
    display: table;
}
#home-slider .slider-text span.title, #subsite-slider .slider-text span.title {
	display: table-cell;
	font-size: 29px;
	line-height: 40px;
	font-weight: 500;
	color: white;
	vertical-align: middle;
	padding: 0 5%;
}
#home-slider a,
#home-slider a:hover,
#subsite-slider a,
#subsite-slider a:hover { 
	color: white;
	text-decoration: none;
}
#home-slider .black .slider-text span.title, #subsite-slider .black .slider-text span.title { 
	color: #000000;
}
#home-slider .white .slider-text span.title, #subsite-slider .white .slider-text span.title  { 
	color: white;
	
}

#subsite-slider .slider-text span.title{
	padding: 0 0 0 5% ;
}
#home-slider .carousel-item:nth-child(1) .slider-text span.title {
	margin-top:70px;
}
#home-slider .carousel-item:nth-child(2) .slider-text span.title {
	/* text-align: right; */
	text-align: left;
}
#home-slider .carousel-item:nth-child(3) .slider-text span.title {
	padding-right: 15%;
}
#home-slider .carousel-item:nth-child(4) .slider-text span.title {
	padding-right: 15%;
	/*color: #000000;*/
}

#subsite-slider .pruple_text{
	color:#4b3192;
	font-size:120%;	
	text-shadow: 2px 2px 1px #fff;
    margin-right: 2px;
}

#subsite-slider .orange_text{
	color:#e75b10;
	font-size:120%;	
	text-shadow: 2px 2px 1px #fff;
    margin-right: 2px;
}


/**************************************** 
5 Majors Items
****************************************/
section.major-items {
	margin: 45px 0 30px;
}
section.major-items .col {
	padding: 0;
	min-width: 100px;
}
section.major-items .section-head {
	text-align: center;
	background: white;
	color: #0066CC;
	border-bottom: 2px solid #fc0000;
	display: flex;
	justify-content: center;
	align-items: flex-end;; 
}
section.major-items .section-head h2 {
	font-size: 24px;
    padding: 15px 25px;
	margin-bottom: 0;
}
section.major-items .section-head h2.active:not(.no-target) {
	background: #fc0000;
	color: white;
}
section.major-items.no_header_link .section-head h2.active:not(.no-target) {
	background: white;
	color: #0066CC;
}

section.major-items .section-body {
	padding: 10px;
}
section.major-items .section-body div.category {
    font-size: 20px;
    font-weight: bold;
	padding: 25px 15px;
	margin-bottom: 5px;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
	background-position: center right;
	background-repeat: no-repeat;
}
section.major-items .section-body div.category h3{
	font-size: 20px;
    font-weight: bold;
	margin-bottom:0;
}
section.major-items .section-body ul, 
section.major-items .section-body li {
	margin-left: 0;
	padding-left: 0;
	list-style: none;
    list-style-type: none;
}
section.major-items .section-body li {
	font-size: 18px;
	line-height: 1.5;
	text-align: left;
	font-weight: normal;
    background-color: transparent;
	border-bottom: 1px solid #cccccc;
}
section.major-items .section-body li:last-child {
	border-bottom: 1px solid transparent;
}
section.major-items .section-body li a div {
    padding: 15px 10px;
	text-decoration: none;
	color: #000000;
}
section.major-items .section-body li a {
	text-decoration: none;
	color: #000000;
}
section.major-items .section-body li:hover {
    background-color: #fc0000;
	border-bottom: 1px solid #fc0000;
}
section.major-items .section-body li.no-hover {
	border-bottom: 0px;
}
section.major-items .section-body li.no-hover:hover {
    background-color: transparent;
	border-bottom: 0px;
}
section.major-items .section-body li:hover a div {
    color: white;
}
section.major-items .section-body li a.btn {
	font-size: 0.95em;
}
section.major-items .section-body li a.btn-green {
	color: white;
	background-color: #2b590d;
}
section.major-items .section-body li a.btn-green:hover {
	background-color: #3e8410;
}
section.major-items .section-body li a.btn-green div {
	color: white;
}
section.major-items .section-body li div.new_item_mark {
	display: inline-block;
    padding: 0 10px;
    font-weight: bold;
    font-style: italic;
    color: red;
    animation: new_blink 2s linear infinite;  
    -webkit-animation: new_blink 2s linear infinite;
    -moz-animation: new_blink 2s linear infinite;
    -ms-animation: new_blink 2s linear infinite;
    -o-animation: new_blink 2s linear infinite;
}
section.major-items .hidden-menu {
	position: absolute;
	width: 100vw;
    max-width: 400%;
    background: white;
	z-index: 9;
	border: 2px solid #fc0000;
    top: 116px; /*Controlled by script*/
	min-height: 500px; /*Controlled by script*/
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
	background-position: center right;
	background-repeat: no-repeat;
}
section.major-items .hidden-menu.target01 .section-body li a div {
    padding: 10px 10px;
    font-size: 90%;
}
section.major-items span.rnd_logo{
	vertical-align:middle;	
}
section.major-items span.rnd_logo img{
	margin-top: -9px;
    margin-left: 10px;
	
}

/**************************************** 
5 Majors Items (Mobile)
****************************************/
section.major-items.mobile {
	margin: 0;
}
section.major-items.mobile .row .item {
	width: 100%;
	margin: 2px 0;
}
section.major-items.mobile .row .item:first-child {
	margin-top: 4px;
}
section.major-items.mobile .row .item:last-child {
	margin-bottom: 4px;
}
section.major-items.mobile .row .item > a.btn {
	border-radius: 0;
}
section.major-items.mobile .row .item > a.btn:hover {
	color: white;
    background-color: #0066CC;
}
section.major-items.mobile .row .item > a.btn .title {
	padding: 10px 15px;
    text-align: left;
    font-size: 20px;
}
section.major-items.mobile .row .item > a.btn .title:after {
	content: "\f067";
	font-family: FontAwesome;
	float: right;
}
section.major-items.mobile .row .item > a.btn .title.active:after {
	content: "\f068";
	font-family: FontAwesome;
	float: right;
}
section.major-items.mobile .row .item .category > div {
	margin: 20px 0 10px;
	padding: 30px 20px;
	font-size: 24px;
    font-weight: bold;
	-webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-position: center right;
    background-repeat: no-repeat;
}
section.major-items.mobile .row .item .title {
    padding: 0 35px;
}
section.major-items.mobile .row .item .title a {
	text-decoration: none;
    color: #000000;
    border-bottom: 1px solid #cccccc;
    padding: 20px 0;
    display: block;
    font-size: 18px;
}
section.major-items.mobile .row .item .title:last-child a {
    border-bottom: 0;
}
section.major-items.mobile .row .item .title a.btn {
	display: inline-block;
	padding: 20px 30px;
	margin: 10px 0;
	font-size: 16px;
}
section.major-items.mobile .row .item .title a.btn-green {
	color: white;
	background-color: #3e8410;
}
section.major-items.mobile .row .item .title div.new_item_mark {
	display: inline-block;
    padding: 0 10px;
    font-weight: bold;
    font-style: italic;
    font-size: 18px;
    color: red;
    animation: new_blink 2s linear infinite;  
    -webkit-animation: new_blink 2s linear infinite;
    -moz-animation: new_blink 2s linear infinite;
    -ms-animation: new_blink 2s linear infinite;
    -o-animation: new_blink 2s linear infinite;
}



/**************************************** 
What's News
****************************************/
section.whats-news {
	background-color: #F7F7F7;
	padding: 80px 0 60px;
}
section.whats-news#hkas_whatsnew,
section.whats-news#qsdiv_whatsnew {
	padding: 40px 0 30px;
}
section.whats-news#hkas_whatsnew  .container-fluid{
	
		
}
section.whats-news h2, section.whats-news h2 a {
	color: #0066CC;
	font-size: 40px;
	text-align: center;
	text-decoration:none;
}
section.whats-news .news-item {
	position:relative;
	padding: 30px;
	transition: 0.3s all ease;
	border: 1px solid transparent;
	width: 33.3%;
}
section.whats-news#hkas_whatsnew .news-item,
section.whats-news#qsdiv_whatsnew .news-item{
	width: 100%;
}
section.whats-news .news-item > div {
	width: 100%;
}
section.whats-news .news-item > div a {
	color: #0066CC;
}
section.whats-news .news-item > div ul li {
	padding-bottom: 10px;
}
section.whats-news .news-item > div.date p span.fa {
	color: #999999;
	padding-right: 5px;
}
section.whats-news .news-item > div.date p {
	font-size: 17px;
	padding: 10px 0;
	border-bottom: 1px solid #000000;
}
section.whats-news .news-item > div.share-news {
	display: none;
	position: absolute;
    top: 0;
    text-align: right;
    right: 0;
    margin: 30px;
}
section.whats-news .news-item.active > div.share-news {
	display: block;
	animation-name: fadeInDown;
	animation-duration: .3s;
}
section.whats-news .news-item > div.share-news img {
	width: 30px;
}
section.whats-news .news-item > div.title a {
	display: block;
	font-weight: 500;
	font-size: 17px;
    line-height: 1.5;
    margin-bottom: 10px;
    text-align: justify;
    text-justify: distribute;
	color: #000000;
	text-decoration: none;
}
section.whats-news .news-item > div.title a:hover,
section.whats-news .news-item > div.title a:focus {
	color: #0066CC;
}
section.whats-news .news-item > div.content p {
	font-size: 15px;
	text-align: justify;
	text-justify: distribute;
}
section.whats-news .news-item > div.button {
	margin-top: 30px;
}
section.whats-news .news-item.active {
	background-color: white;
	border: 1px solid #0066CC;
}

section.whats-news .news-item.active > div.title p,
section.whats-news .news-item.active > div.content p {
	/*color: #0066CC;*/
}
section.whats-news .news-item.active > div.date p {
	border-bottom: 1px solid #0066CC;
}
section.whats-news .news-item.active > div.button button {
	background-color: #fc0000;
}


/**************************************** 
Section Logo Carousel 
****************************************/
section.logo-carousel {
	margin: 30px 0 60px;
}
section.logo-carousel div.slider-logo {
	max-width: 90%;
    margin: 0 auto;
}
section.logo-carousel div.slider-logo .slick-prev:before, .timeline-carousel .slick-prev:before {
	content: "\f053";
	font-family: FontAwesome;
}
section.logo-carousel div.slider-logo .slick-next:before, .timeline-carousel .slick-next:before  {
	content: "\f054";
	font-family: FontAwesome;
}
section.logo-carousel div.slider-logo .slick-prev:before, 
section.logo-carousel div.slider-logo .slick-next:before{
	color: #707071;
	opacity: 1;
}
.timeline-carousel .slick-next:before,
.timeline-carousel .slick-prev:before {
	color: #FFFFFF;
	opacity: 1;
}
.timeline-carousel .slick-disabled{
	display:none !important;
}
.timeline-carousel .slick-disabled:before{
	opacity: 0;
}
.timeline-carousel .slick-next,
.timeline-carousel .slick-prev {
	height:35px;
	width:35px;
	background: #707071;
    border-radius: 18px;
	padding: 8px;
}
.timeline-carousel .slick-next:hover,
.timeline-carousel .slick-prev:hover {
	text-decoration:none;
}

.timeline-carousel .slick-next:before,
.timeline-carousel .slick-prev:before {
	font-size:21px;
}
.timeline-carousel .slick-next:before {
	padding-left: 4px;
}
.timeline-carousel .slick-prev:before {
	padding-right: 4px;
}
section.logo-carousel div.slider-logo .slick-next {
	right: -5%;
}
section.logo-carousel div.slider-logo .slick-prev {
	left: -5%;
}
.timeline-carousel .slick-next {
	right: -10px;
	z-index:999;
	
}
.timeline-carousel .slick-prev {
	left: -38px;
	z-index:999;
}


section.logo-carousel div.slider-logo .slick-prev:focus, section.logo-carousel div.slider-logo .slick-next:focus , .timeline-carousel .slick-prev:focus,  .timeline-carousel .slick-next:focus{
	/*border: 3px solid #5E9ED6 ;

	outline:3px solid #0066cc;*/
}
section.logo-carousel div.slider-logo a img {
	margin: 0 auto;
	max-width: 100px;
	height: auto;
}
section.logo-carousel div.slider-logo .slick-track {
	display: flex;

}
section.logo-carousel div.slider-logo .slick-track .slick-slide {
	display: flex;
	height: auto;
	align-items: center;
	justify-content: center;
}
section.logo-carousel div.slider-logo .slick-dots li {
	margin: 0;
}
section.logo-carousel div.slider-logo .slick-dots li :focus{
	border: 3px solid #0066cc;
}
section.logo-carousel div.slider-logo .slick-dots li button:before {
	content: "\f10c";
	font-family: FontAwesome;
	color: black;
    opacity: 1;
}
section.logo-carousel div.slider-logo .slick-dots li.slick-active button:before {
	content: "\f111";
	font-family: FontAwesome;
}

section.logo-carousel div.control-btn a {
	position: absolute;
    left: calc(50% - 125px);
    bottom: -32px;
}

/**************************************** 
Section Banner 
****************************************/
section.banner div.image {
	padding: 0;
	height: 200px;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
	background-position: center right;
	background-repeat: no-repeat;
}
section.banner div.image p {
	padding: 0;
	margin: 0;
}
section.banner div.image div .col-sm-12 {
	width: auto;
	position: absolute;
    top: 50%;
    transform: translateY(-50%);
}
section.banner div.image .row > div {
	max-width: 50%;
}
section.banner div.image p {
	font-size: 40px;
	font-weight: 500;
}
section.banner div.image h1 {
	font-size: 30px;
}


/**************************************** 
Section Breadcrumb 
****************************************/
.breadcrumb {
	background: transparent;
	padding: 0;
}
section.breadcrumb ul.breadcrumb {
	list-style: none;
	padding: 15px 0;
	margin: 0;
	border-bottom: 1px solid #cccccc;
	border-radius: 0;
}
section.breadcrumb ul.breadcrumb li {
	display: inline;
	font-size: 15px;
}
section.breadcrumb ul.breadcrumb li+li:before {
	padding: 5px 10px;
	color: #666667;
	content: "\f105";
	font-family: "FontAwesome";
}
section.breadcrumb ul.breadcrumb[dir=rtl] li+li:before {
	content: "\f104";
}
section.breadcrumb ul.breadcrumb li a {
	color: #666666;
	text-decoration: none;
}
section.breadcrumb ul.breadcrumb li a:hover {
	color: #0066CC;
}


/**************************************** 
Section Content 
****************************************/
section.content article .back-btn {
	text-decoration: none;
	font-size: 18px;
}
section.content article .back-btn:hover {
	text-decoration: none;
}
section.content article .back-btn > span {
	font-size: 15px;
	margin-right: 3px;
}
section.content article .back-btn > span.fa {
	display: inline-block;
	border-radius: 60px;
	box-shadow: 0px 0px 0px 1px rgba(0,0,0,0.25);
	padding: 0.25em 0.3em;
	background: white;
	transition: 0.5s all ease;
}
section.content article .back-btn:hover > span.fa {
	box-shadow: 0px 0px 0px 1px #0066CC;
	background: #0066CC;
	color: white;
}
section.content {
	font-size: 17px;
	line-height: 1.5;
	margin-bottom: 70px;
}
section.content h1 {
	color: #000000;
	font-size: 36px;
    margin: 20px 0;
}
section.content p {
	color: #000000;
	margin: 15px 0;
	text-align: justify;
	text-justify: distribute;
}
section.content img {
	max-width: 100%;
}
section.content a {
	color: #666666;
	text-decoration: underline;
}
section.content a:hover {
	color: #0066CC;
	text-decoration: underline;
}
section.content .filter_wrapper {
	float: right;
	margin-top: 15px;
	margin-bottom: 20px;
}
section.content .filter_wrapper.left{
	float:left;	
}
section.content .filter_wrapper + h3,
section.content .filter_wrapper + h4{
	float:left;	
}
section.content .filter_wrapper select,  section.content .filter_wrapper input[type=text] , section.content .filter_section select , section.content .filter_section2 select{
	/*appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;*/
	-webkit-appearance: menulist-button;
	border: 3px solid #e6e6e6;
	border-radius: 0;
	font-weight: 400;
	color: inherit;
	padding: 7px;
	line-height: normal;
	transition: border-color 0.2s ease, outline 0.2s ease;
}
section.content .hkas_filter select,  section.content .hkas_filter input{
	width: 100%;	
}
section.content .hkas_filter label{
	margin: 10px;
}
section.content .hkas_filter input[type=submit]{
	width: auto;
	height: 100%;
    /*padding: 10px 30px;*/
	max-width:100%;
}
/* Section Content article */
section.content article {
	padding-right: 7%;
	margin-bottom: 25px;
}
section.content article a[data-link]:after {
	content: "\f107";
	font-family: FontAwesome;
	padding-left: 10px;
	text-decoration: none;
    display: inline-block;
}
section.content article a[data-link].active:after {
	content: "\f106";
}
/* h2 */
section.content article h2 {
	font-size: 27px;
}
section.content article h2,
section.content article h2 a,
section.content article h2 a:hover,
section.content article h2 a:focus,
section.content article h2 a:active {
	text-decoration: none;
	font-weight: normal;
	color: #0066CC;
	margin: 40px 0 20px;
}
/* h3 */
section.content article h3 {
	font-size: 21px;
}
section.content article h3,
section.content article h3 a,
section.content article h3 a:hover,
section.content article h3 a:focus,
section.content article h3 a:active {
	text-decoration: none;
	font-weight: bold;
	color: #08396B;
	margin: 20px 0 20px;
}
/* h4 */
section.content article h4 {
	font-size: 19px;
}
section.content article h4,
section.content article h4 a,
section.content article h4 a:hover,
section.content article h4 a:focus,
section.content article h4 a:active {
	text-decoration: none;
	font-weight: 600;
	color: #069;
	margin: 20px 0 20px;
}
section.content article div.table_div{
	overflow-x: auto;
	overflow-y: hidden;	
}
section.content article table {
	box-shadow: 0 0 30px rgba(0,0,0,0.05);
	margin-top: 0px;
	margin-bottom: -5px;
	transition: 0.5s all ease;
}
/*section.content article table:hover {
	box-shadow: 0 0 30px rgba(0,0,0,0.1);
}*/
section.content article table tr:nth-child(n) > th,
section.content article table tr:nth-child(n) > td.th {
	background-color: #08396B;
	color: white;
	font-weight: bold;
	padding: 10px 15px;
	border-right: 1px solid rgba(255,255,255,0.1);
	border-bottom: 1px solid rgba(0,0,0,0.1);
	vertical-align: middle;
}
section.content article table th:last-of-type,
section.content article table td.th:last-of-type {
	border-right: 1px solid transparent;
}
section.content article table tr:nth-child(n) > th a,
section.content article table tr:nth-child(n) > td.th a {
	color: white;
}
section.content article table tr:nth-child(n) > th a:hover,
section.content article table tr:nth-child(n) > td.th a:hover {
	color: #f0f0f0;
}
section.content article table tr > td {
	background-color: #f7f7f7;
	color: #000000;
	padding: 10px 15px;
	border-right: 1px solid rgba(0,0,0,0.1);
	border-bottom: 1px solid rgba(0,0,0,0.1);
	vertical-align: middle;
}
section.content article table.vTop tbody tr td{
	vertical-align:top;
	
}
section.content article table.vTop tr th{
	vertical-align:top;
	
}
section.content article table tr:nth-child(even) > td {
	background-color: #fdfdfd;
	color: #000000;
}
section.content article table tr > td:last-of-type {
	border-right: 1px solid transparent;
}
section.content article table tr:last-of-type > td {
	border-bottom: 1px solid transparent;
}
section.content article ul {
	margin-left: 20px;
	padding-left: 0;
}
section.content article ul li {
	margin: 2px 0;
}
section.content article ul {
	list-style: none;
	margin-left: 20px;
	margin-top: 10px;
	padding-left: 0;
}
section.content article ul > li:before {
	content: "\f101";
	font-family: FontAwesome;
	position: absolute;
	margin-left: -20px;
	color: #666666;
}
section.content article ul.type-1 {
	list-style: circle;
}
section.content article ul.type-1 > li:before {
	display: none;
}
section.content article ul.type-2 {
	list-style: disc;
}
section.content article ul.type-2 > li:before {
	display: none;
}
section.content article ul.type-3 {
	list-style: square;
}
section.content article ul.type-3 > li:before {
	display: none;
}
section.content article ul.type-4 > li:before {
	content: "\f105";
	font-family: FontAwesome;
	position: absolute;
	margin-left: -20px;
	color: #666666;
}
section.content article ul.type-5 > li:before {
	content: "\f0da";
	font-family: FontAwesome;
	position: absolute;
	margin-left: -20px;
	color: #666666;
}
section.content article ul.type-6 > li:before {
	content: "\f054";
	font-family: FontAwesome;
	position: absolute;
	margin-left: -20px;
	color: #666666;
}
section.content article ul.type-7 > li:before {
	content: "- ";
	font-family: FontAwesome;
	position: absolute;
	margin-left: -20px;
	color: #666666;
}
section.content article ol {
	margin: 5px 0 10px;
}
section.content article ol li {
	padding-left: 5px;
    text-align: justify;
    text-justify: distribute;
}
section.content article ol.type-1 {
	list-style-type: upper-roman;
}
section.content article ol.type-2 {
	list-style-type: lower-roman;
}
section.content article ol.type-2-2 { counter-reset: item ; padding: 0;}
section.content article ol.type-2-2 > li { display: table; counter-increment: item; }
section.content article ol.type-2-2 > li:before { content: " ("counter(item,lower-roman)") "; display: table-cell; width: 2.75em;}

section.content article ol.type-3 {
	list-style-type: upper-alpha;
}
section.content article ol.type-4 {
	list-style-type: lower-alpha;
}

section.content article ol.type-4-2 { counter-reset: item ; padding-left: 15px;}
section.content article ol.type-4-2 > li { display: table; counter-increment: item; }
section.content article ol.type-4-2 > li:before { content: " ("counter(item,lower-alpha)") "; display: table-cell; width: 1.75em;}

section.content article ol.type-4-3 { counter-reset: item ; padding-left: 15px;}
section.content article ol.type-4-3 > li { display: table; counter-increment: item; }
section.content article ol.type-4-3 > li:before { content: " "counter(item,lower-alpha)"). "; display: table-cell; width: 1.75em;}

section.content article ol.type-custom { padding-left: 0px; list-style-type: none; }
section.content article ol.type-custom > li { display: table; }
section.content article ol.type-custom > li .list_num { display: table-cell; width: 3.75em; }

section.content article ol.type-5 {
	list-style-type: decimal;
}
section.content article ol.type-5-2 { counter-reset: item ; padding-left: 15px;}
section.content article ol.type-5-2 > li { display: table; counter-increment: item; }
section.content article ol.type-5-2 > li:before { content: " ("counter(item,decimal)") "; display: table-cell; width: 1.75em;}

section.content article ol.type-6 {
	list-style-type: decimal-leading-zero;
}
section.content article ol.type-7 {
	list-style-type: cjk-ideographic;
}
section.content article ol.type-8 {
	list-style-type: lower-greek;
}

section.content article ol.type-9, section.content article ol.type-9 ol{
  list-style-type: none;
  counter-reset: item;
  margin: 0;
  padding: 0;
}

section.content article ol.type-9 > li {
  display: table;
  counter-increment: item;
  margin-bottom: 0.6em;
}

section.content article ol.type-9 > li:before {
    content: counters(item, ".") ".";
    display: table-cell;
    padding-right: 0.6em;    
}

section.content article ol.type-9 > li li {
    margin: 0;
	display: table;
  counter-increment: item;
  margin-bottom: 0.6em;
}

section.content article ol.type-9 > li li:before {
    content: counters(item, ".") " ";
	    display: table-cell;
    padding-right: 0.6em;
}


/* Section Filter Table */
section.content article .filter_mobile_submit {
	float: right;
    padding: 5px 0 5px 10px;
	display: none;
}
/* Section Content Submenu */
section.content .submenu h2 {
	font-size: 24px;
    color: #000000;
    border-bottom: 2px solid #fc0000;
    padding: 15px 15px 12px 0;
}
section.content .submenu ul {
	list-style: none;
	margin-left: 23px;
	padding-left: 0;
}
section.content .submenu ul li {
	padding: 3px 0;
	color: #0066CC;
}
section.content .submenu ul li:before {
	content: '\f0a9';
	font-family: FontAwesome;
	position: absolute;
	margin-left: -23px;
	margin-top: 1px;
}

section.content .submenu ul li.selected:before {
	content: '\f0ab';
}
section.content .submenu ul li a {
	font-size: 17px;
	text-decoration: none;
	color: #0066CC;
	line-height: 1;
}
section.content .submenu > ul  li.active, section.content .submenu > ul  li.selected {
	color: #fc0000;
}
section.content .submenu > ul > li:hover > a, section.content .submenu > ul > li > ul > li:hover > a, section.content .submenu > ul > li > ul.subsubmenu > li > ul.subsubsubmenu > li:hover > a {
	text-decoration: underline;
}
section.content .submenu > ul > li.active > a, section.content .submenu > ul > li.selected > a, section.content .submenu > ul > li > ul > li.active > a, section.content .submenu  ul li.selected > a, section.content .submenu  ul li.active > a {
	color: #fc0000;
	font-weight: bold;
	text-decoration: underline;
}
/*** Subsubmenu ***/
section.content .submenu > ul > li > ul.subsubmenu, section.content .submenu > ul > li > ul.subsubmenu > li > ul.subsubsubmenu{
	display:none;
}	


/**************************************** 
Text Size: AAA
****************************************/
/*** Smaller Size ***/
body.small-text { letter-spacing: 1px; }
body.small-text section.breadcrumb ul.breadcrumb li { font-size: 14px; }
body.small-text section.content{ font-size: 15px;}
body.small-text section.content article h1 { font-size: 32px; }
body.small-text section.content article h2 { font-size: 24px; }
body.small-text section.content article h3 { font-size: 19px; }
body.small-text section.content article h4 { font-size: 15px; }
body.small-text section.content .submenu h2 { font-size: 21px; }
body.small-text section.content .submenu ul li a { font-size: 15px; }
body.small-text section .btn { font-size: 13px; }
body.small-text section.major-items .section-head h2 { font-size: 18px; }  /* Home Page */
body.small-text section.major-items .section-body li { font-size: 16px; }
body.small-text section.whats-news h2 { font-size: 35px; }
body.small-text section.whats-news .news-item > div.date p { font-size: 15px; }
body.small-text section.whats-news .news-item > div.title a { font-size: 15px; }
body.small-text section.major-items .section-body li a div { padding: 12px 10px; }
body.small-text section.major-items .section-body li a.btn div { padding: 8px; }
body.small-text section.content article table tr:nth-child(n) > th,
body.small-text section.content article table tr:nth-child(n) > td.th,
body.small-text section.content article table tr > td {
	padding: 7px 10px;
}

/*** Larger Size ***/
body.large-text { letter-spacing: 2px; }
body.large-text section.breadcrumb ul.breadcrumb li { font-size: 17px; }
body.large-text section.content{ font-size: 22px;}
body.large-text section.content article h1 { font-size: 44px; }
body.large-text section.content article h2 { font-size: 36px; }
body.large-text section.content article h3 { font-size: 28px; }
body.large-text section.content article h4 { font-size: 22px; }
body.large-text section.content .submenu h2 { font-size: 32px; }
body.large-text section.content .submenu ul li a { font-size: 19px; }
body.large-text section .btn { font-size: 16px; }
body.large-text section.major-items .section-head h2 { font-size: 22px; }  /* Home Page */
body.large-text section.major-items .section-body li { font-size: 20px; }
body.large-text section.whats-news h2 { font-size: 45px; }
body.large-text section.whats-news .news-item > div.date p { font-size: 19px; }
body.large-text section.whats-news .news-item > div.title a { font-size: 19px; }
body.large-text section.major-items .section-body li a div {  }
body.large-text section.content article table tr:nth-child(n) > th,
body.large-text section.content article table tr:nth-child(n) > td.th,
body.large-text section.content article table tr > td {
	padding: 15px 20px;
}


/**************************************** 
Responsive: 1920* Full Width
****************************************/
@media only screen and (max-width: 1920px) {
	.container {
		max-width: 100%;
	}
	nav .container,
	section > .container,
	section.banner .image > .container,
	section.whats-news .container-fluid > .row > .container,
	footer .container.details	{
		max-width: 94%;
	}
	section.major-items .section-head h2 {
		font-size: 20px;
		padding: 15px 20px;
	}
}

@media only screen and (max-width: 1518px) {
	nav div.desktop .main-menu .left ul li:not(.no-effects) > a > span {
		padding: 0 0.7vw;
		/*font-size: 90%;*/
		font-size: 80%;
	}
}

/**************************************** 
Responsive: col-lg 
****************************************/
@media only screen and (max-width: 1459px) {
	.container {
		max-width: 100%;
	}
	nav .container,
	section > .container,
	section.banner .image > .container,
	section.whats-news .container-fluid > .row > .container,
	footer .container.details	{
		max-width: 94%;
	}
	section.major-items .section-head h2 {
		font-size: 20px;
		padding: 15px 20px;
	}
	/* Section Nav */
	nav div.desktop .main-menu .left ul li > a{
		height: 76px;
	}
	nav div.desktop .main-menu .left ul li > a > span {
		/*max-width: 305px;
		font-size: 95%;*/
		max-width: 250px;
		font-size: 88%;
	}
	nav div.desktop .main-menu .left ul li:not(.no-effects) > a > span {
		padding: 0 0.6vw;
		
	}
	nav div.desktop .links ul li:not(.no-effects) > a > span {
		padding: 0 10px;
	}
	nav div.desktop .links .social-icons {
		padding: 32px 7px;
	}
	nav div.desktop .main-menu .right ul li > a > span,
	nav div.desktop .main-menu .right ul li.text-size > span,
	nav div.desktop .main-menu .right ul li.search > span > a span{
		height: 54px;	
	}
	nav div.desktop .main-menu .right ul li input {
		width: 50px;
	}
	
	/*nav div.desktop .main-menu .right ul li.search{
		padding: 27px 0;	
	}
	nav div.desktop .main-menu .right ul li.text-size{
		padding: 27px 16px 27px 0;
	}
	nav div.desktop .main-menu .right ul li > a{
		padding: 27px 0;
	}*/
}

/**************************************** 
Responsive: col-md 
****************************************/
@media only screen and (max-width: 1199px) {
	nav div.desktop  {
		letter-spacing: 0.5px;
	}
	section.major-items .section-head h2 {
		font-size: 18px;
		padding: 15px 10px;
	}
	/* Section Nav */
	nav div.desktop .main-menu .left ul li > a > span {
		/*max-width: 200px;*/
		max-width: 177px;
	}
	nav div.desktop .main-menu .right ul li input {
		width: 50px;
	}
	nav div.desktop .links ul li:not(.no-effects) > a > span {
		padding: 0 7px;
	}
	nav div.desktop .main-menu .right ul li.text-size > span {
		padding-left: 10px;
	}
	nav div.desktop .main-menu .right ul li.text-size {
		padding-right: 10px;
	}
	nav div.desktop .links ul li:not(.no-effects) > a > span {
		font-size: 95%;
	}
	section.whats-news .news-item {
		width:100%;	
	}
}

@media only screen and (min-width: 1199px) and (max-width: 1200px) {
	
	
}

/**************************************** 
Responsive: col-sm 
****************************************/
@media only screen and (max-width: 991px) {
	footer .container-fluid .details {
		font-size: 115%;
	}
	footer .container-fluid .details {
		display: block;
		text-align: center;
	}
	footer .container-fluid .details .left,
	footer .container-fluid .details .right {
		display: block;
	}
	footer .container-fluid .details .icon,
	footer .container-fluid .details .text {
		margin-top: 15px;
	}
	/* Home Slider */
	#home-slider .slider-text span.title, #subsite-slider .slider-text span.title {
		font-size: 18px;
		padding: 5%;
		text-align: center;
		line-height: 25px;
	}
	#home-slider .black .slider-text span.title,
	#home-slider .white .slider-text span.title,
	#subsite-slider .black .slider-text span.title,
	#subsite-slider .white .slider-text span.title { 
		color: white;
		}
	#subsite-slider .black .slider-text span.title,
	#subsite-slider .white .slider-text span.title {
		text-align: center;
		padding:5% !important;
	}
	#home-slider .carousel-item:nth-child(1) .slider-text span.title, #subsite-slider .carousel-item:nth-child(1) .slider-text span.title {
		margin-top: auto;
	}
	#home-slider .carousel-item:nth-child(2) .slider-text span.title, #subsite-slider .carousel-item:nth-child(2) .slider-text span.title {
		text-align: center;
	}
	#home-slider .carousel-item:nth-child(3) .slider-text span.title, #subsite-slider .carousel-item:nth-child(3) .slider-text span.title {
		padding-right: 0;
	}
	#home-slider .carousel-item:nth-child(4) .slider-text span.title, #subsite-slider .carousel-item:nth-child(4) .slider-text span.title {
		padding-right: 0;
		color: white;
	}
	#home-slider div.carousel-inner:after, #subsite-slider div.carousel-inner:after {
		background: url(../images/home/mobile-mask.png);
		background-position: top left;
		background-repeat: repeat-x;
		background-size: contain;
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 70%;
	}

	#home-slider .carousel-inner .carousel-item, #subsite-slider .carousel-inner .carousel-item {
		height: 280px;
	}
	#home-slider .slider-text > .row > .col-md-6, #subsite-slider .slider-text > .row > .col-md-6, #subsite-slider .slider-text > .row > .col-md-8, #subsite-slider .slider-text > .row > .col-md-4 {
		height: auto;
	}
	#subsite-slider .pruple_text,
	#subsite-slider .orange_text{
		text-shadow: 1px 1px 1px #fff ;
		margin-right: 2px;
	}
	
	div[class*="col-"] {
		z-index: 10 !important;
	}
	/* What's news */
	section.whats-news {
		padding: 30px 0;
	}
	section.whats-news .news-item {
		padding: 15px 30px;
	}
	section.whats-news .news-item > div.share-news {
		margin: 15px 30px;
	}
	/* Section Banner */
	section.banner div.image .row > div {
		max-width: 100%;
	}
	section.banner div.image .row > div {
		max-width: 85%;
	}
	section.banner div.image p {
		font-size: 36px;
	}
	section.banner div.image:before {
		content: " ";
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background-image: linear-gradient(90deg, rgba(255,255,255,0.8), rgba(255,255,255,0.7), rgba(255,255,255,0));
		opacity: 1;
	}
	/* Section Breadcrumb */
	section.breadcrumb ul.breadcrumb li {
		width: 100%;
		font-size: 105%;
		margin: 3px 0;
	}
	section.breadcrumb ul.breadcrumb li:not(:first-child) {
		margin-left: 23px;
	}
	section.breadcrumb ul.breadcrumb[dir=rtl] li:not(:first-child) {
		margin-right: 23px;
	}
	section.breadcrumb ul.breadcrumb li:nth-child(2) {
		margin-left: 33px;
	}
	section.breadcrumb ul.breadcrumb[dir=rtl] li:nth-child(2) {
		margin-right: 33px;
	}
	section.breadcrumb ul.breadcrumb li:nth-child(3) {
		margin-left: 43px;
	}
	section.breadcrumb ul.breadcrumb[dir=rtl] li:nth-child(3) {
		margin-right: 43px;
	}
	section.breadcrumb ul.breadcrumb li:nth-child(4) {
		margin-left: 53px;
	}
	section.breadcrumb ul.breadcrumb[dir=rtl] li:nth-child(4) {
		margin-right: 53px;
	}
	section.breadcrumb ul.breadcrumb li:nth-child(5) {
		margin-left: 63px;
	}
	section.breadcrumb ul.breadcrumb[dir=rtl] li:nth-child(5) {
		margin-right: 63px;
	}
	section.breadcrumb ul.breadcrumb li:nth-child(6) {
		margin-left: 73px;
	}
	section.breadcrumb ul.breadcrumb[dir=rtl] li:nth-child(6) {
		margin-right: 73px;
	}
	section.breadcrumb ul.breadcrumb li+li:before {
		content: "\f148";
		position: absolute;
		transform: rotate(90deg);
		margin-left: -30px;
		padding: 0px 10px;
	}
	section.breadcrumb ul.breadcrumb[dir=rtl] li+li:before {
		content: "\f149";
		margin-right: -30px;
	}
	/* Section Content */
	section.content article {
		padding-right: 15px;
	}
	section.content img {
		float: none !important;
		display: block !important;
		padding: 0 0 0 0 !important;
		margin: 10px 0 10px 0 !important;
	}
	section.content .card-img-top img{
		margin: 0 !important;	
	}

	section.content .submenu ul li {
		padding: 6px 0;
	}
	section.content .submenu ul li a {
		font-size: 18px;
	}
	section.content article table tr > th,
	section.content article table tr > td {
		padding: 15px 10px;
	}
	section.content .filter_wrapper {
		float: none;
	}
	section.content article .filter_mobile_submit {
		display: block;
		padding: 0;
	}

}

/**************************************** 
Responsive: col-xs 
****************************************/
@media only screen and (max-width: 767px) {
	.container {
		max-width: 720px;
	}
	nav div.mobile .icons a {
		padding: 5px;
		font-size: 24px;
	}
}


/**************************************** 
Quality - SCL 
****************************************/
article .scl_logo{
	padding-bottom: 10px;	
}
.card{
	height: 100%;
	display:block;
}
.card-body{
	padding: 10px;	
}
.card h2.card-title{
	margin: 10px 0;	
}
.card-img-top img{
	width: 100%;	
}

.card .card-body ul li{
	text-align:left;	
}
.card .card-body ul li a{
	text-decoration:none;
}
.lab-listing {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	margin: 0;
}
.lab-listing > div[class*="col-"] {
	padding: 0;
	margin-bottom: -1px;
}
.lab-listing .lab-item {
	display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    justify-content: center;
    -ms-flex-align: center;
	align-items: center;
    height: 100%;
}
.lab-listing > div > .lab-item {
    padding: 10px;
    border: 3px double #dee2e6;
    margin-right: -1px;
}
.lab-listing img.thumb {
    width: 100%;
    height: auto;
    max-width: 200px;
    max-height: 200px;
    margin-bottom: 0.5em;
}
.lab-listing .lab-item a {
	width: auto;
	max-width: 100%;
	display: flex;
    align-items: center;
    flex-direction: column;
}
.lab-listing .lab-item a.btn {
    /*font-size: inherit;*/
    width: auto;
    max-width: 100%;
}
section.content .video_wrapper a.lightbox_btn {
	text-decoration: none;
}
section.content img.scl_video_thumb {
	width: 100%;
	max-width: 650px;
}



/**************************************** 
Timeline
****************************************/


.timeline-carousel {
  padding: 10px 20px 30px 40px;
  position: relative;
  overflow: hidden;
}
/*.timeline-carousel:after, .timeline-carousel:before {
  content: "";g
  position: absolute;
  display: block;
  top: 0;
  height: 100%;
  width: 6.9444%;
  background-color: #1d1d1e;
  z-index: 3;
  width: 6.9444%;
}*/
.timeline-carousel:after {
  left: 0;
}
.timeline-carousel:before {
  right: 0;
  opacity: 0;
}
.timeline-carousel .slick-list {
  overflow: visible;
}
.timeline-carousel .slick-list .slick-slide {
	margin: 0px 20px;
}
.timeline-carousel .slick-dots {
  bottom: -73px;
}
.timeline-carousel .slick-dots li button:focus {
    border: 3px solid #0066cc;
}
.timeline-carousel .slick-dots li button:active{
	outline:none;
	border: none;	
}
.timeline-carousel h1 {
  color: white;
  font-size: 46px;
  line-height: 50pd;
  margin-bottom: 40px;
  font-weight: 900;
}
.timeline-carousel__image {
  padding-right: 30px;
}
.timeline-carousel__item {
  cursor: pointer;
}
.timeline-carousel__item .media-wrapper {
	position: relative;
  border: 1px solid #cccccc;
  opacity: 0.4;
  padding-bottom: 71.4%;
  -webkit-transition: all 0.4s cubic-bezier(0.55, 0.085, 0.68, 0.53);
  -o-transition: all 0.4s cubic-bezier(0.55, 0.085, 0.68, 0.53);
  transition: all 0.4s cubic-bezier(0.55, 0.085, 0.68, 0.53);
}
.timeline-carousel__item .media-wrapper img {
	position: absolute;
	display: block;
    max-width: 100%;
    max-height: 100%;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 0 !important;
}
.timeline-carousel__item:last-child .timeline-carousel__item-inner:after {
  width: calc(100% - 30px);
}
.timeline-carousel__item-inner {
  position: relative;
  padding-top: 0px;
}
.timeline-carousel__item-inner:after {
  position: absolute;
  width: 100%;
  top: 45px;
  left: 0;
  content: "";
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}
.timeline-carousel__item-inner .year {
  font-size: 36px;
  line-height: 36px;
  color: white;
  display: table;
  letter-spacing: -1px;
  padding-right: 10px;
  background-color: #1d1d1e;
  z-index: 1;
  position: relative;
  margin: -15px 0 20px;
  font-weight: 900;
}
.timeline-carousel__item-inner .year:after {
  content: "";
  position: absolute;
  display: block;
  left: -10px;
  top: 0;
  height: 100%;
  width: 10px;
  background-color: #1d1d1e;
  z-index: 3;
}
.timeline-carousel__item-inner .month {
  /*font-size: 12px;*/
  text-transform: uppercase;
  /*color: #b38c52;*/
  display: block;
  margin-bottom: 10px;
  font-weight: 900;
}
.timeline-carousel__item-inner p {
  /*font-size: 12px;*/
  line-height: 18px;
  color: white;
  width: 95%;
  font-weight: 400;
  margin-bottom: 15px;
}
.timeline-carousel__item-inner .read-more {
  /*font-size: 12px;*/
  /*color: #b38c52;*/
  display: table;
  margin-bottom: 10px;
  font-weight: 900;
  text-decoration: none;
  position: relative;
}
.timeline-carousel__item-inner .read-more:after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -1px;
  width: 0;
  border-bottom: 2px solid #b38c52;
  -webkit-transition: all 0.2s cubic-bezier(0.55, 0.085, 0.68, 0.53);
  -o-transition: all 0.2s cubic-bezier(0.55, 0.085, 0.68, 0.53);
  transition: all 0.2s cubic-bezier(0.55, 0.085, 0.68, 0.53);
}
.timeline-carousel__item-inner .read-more:hover:after {
  width: 100%;
}
.timeline-carousel__item-inner .pointer {
  height: 29px;
  position: relative;
  z-index: 1;
  margin: -4px 0 16px;
}
.timeline-carousel__item-inner .pointer:after, .timeline-carousel__item-inner .pointer:before {
  position: absolute;
  content: "";
}
.timeline-carousel__item-inner .pointer:after {
  width: 9px;
  height: 9px;
  border-radius: 100%;
  top: 0;
  left: 0;
  background-color: #b38c52;
}
.timeline-carousel__item-inner .pointer:before {
  width: 1px;
  height: 100%;
  top: 0;
  left: 4px;
  background-color: #b38c52;
}
.timeline-carousel .slick-active .media-wrapper {
  opacity: 1 !important;
}

/*.slick-dots {
  bottom: 60px;
  list-style: none;
  position: absolute;
  width: 100%;
  left: 0;
  text-align: center;
  z-index: 2;
}
.slick-dots li {
  cursor: pointer;
  display: inline-block;
  margin: 0 6px;
  position: relative;
  width: 10px;
  height: 10px;
}
.slick-dots li:last-child {
  margin-right: 0;
}
.slick-dots li.slick-active button {
  background: #b38c52;
  border-color: #b38c52;
}
.slick-dots li button {
  display: block;
  font-size: 0;
  width: 10px;
  height: 10px;
  padding: 0;
  background-color: rgba(255, 255, 255, 0.6);
  border-color: rgba(255, 255, 255, 0.6);
  cursor: pointer;
  -webkit-transition: all 0.4s cubic-bezier(0.55, 0.085, 0.68, 0.53);
  -o-transition: all 0.4s cubic-bezier(0.55, 0.085, 0.68, 0.53);
  transition: all 0.4s cubic-bezier(0.55, 0.085, 0.68, 0.53);
}
.slick-dots li button:hover {
  background: #b38c52;
  border-color: #b38c52;
}*/
section.content article .slick-dots li:before{
	content:none;	
}




/**************************************** 
Phase 2 - SCL
****************************************/
div.scl_caesium_beam div{
	border: 1px solid #000;
	width: 100%;
	padding:10px;
	text-align:center;
}
div.scl_caesium_beam div.middle{
	border: none;
	padding:0px;
	
}
div.scl_caesium_beam div.middle > div{
	display:inline-block;
	border: none;
	width: 48%;
	padding: 0px;
}
div.scl_caesium_beam div.middle > div:last-child{
	border-left: 1px solid #000;
}
div.scl_caesium_beam div.middle > div:last-child > span{
	display: block;
	padding: 20px 0px 20px 10px ;
	text-align:left;
}


@media only screen and (max-width: 991px) {
	div.scl_caesium_beam div{
		width: 100%;
	}
}
div.btn_list > div{
	margin-bottom: 12px;	
}
div.btn_list > div > a{
	display: flex;
    align-items: center;
	border: #0066CC 2px solid;
	height: 100%;
	padding:20px 12px;
	border-radius: 0px 20px 0px 20px;
	text-decoration:none;

}
div.btn_list > div > a:hover{
	border: #fc0000 2px solid;
	text-decoration:none;
}

div.btn_list > div > a > div{
	width:100%;
	text-align:center;
	color: #0066CC;
}
div.btn_list > div > a:hover > div{
	color: 	#fc0000;
}
div.btn_list > div >  a > div > span{
	font-size: 75%;
	display:block;	
}
div.btn_list.si > div > a{
	border-radius: 30px;
	border: none;
	background:#0066CC;
}
div.btn_list.si > div > a.orange{
	background:#e86028;
}
div.btn_list.si > div > a.red{
	background:#c81028;
}
div.btn_list.si > div > a.yellow{
	background:#f8a808;
}
div.btn_list.si > div > a.green{
	background:#60a830;
}
div.btn_list.si > div > a.purple{
	background:#402880;
}
div.btn_list.si > div > a.purple_red{
	background:#a83088;
}

div.btn_list.si > div > a > div{
	color: #FFF;
}
div.img-thumbnail{
	padding: 1rem;
	margin:0px;
}
div.text-thumbnail{
	padding: 1rem;
	margin:0px;
}
div.img-thumbnail img{
	display:block !important;	
	margin: 0 auto !important;	
}
div.img-thumbnail.table-style img{
	display: unset !important;	
	margin: unset !important;	
}
section.content div.qsdiv_home section.sub_homesection,
section.content div.scl_home section.sub_homesection {
	margin: 10px 0 0 0;
}
section.content article section.sub_homesection{
	margin: 10px 0 30px;
}
section.content div.qsdiv_home section.sub_homesection > .container,
section.content div.scl_home section.sub_homesection > .container,
section.content article section.sub_homesection > .container{ 
	max-width:100%;
}
section.content div.qsdiv_home section.sub_homesection ul > li,
section.content div.scl_home section.sub_homesection ul > li,
section.content article section.sub_homesection ul > li{
	margin: 0;	
}
section.content div.qsdiv_home section.sub_homesection ul > li:before,
section.content div.scl_home section.sub_homesection ul > li:before,
section.content article section.sub_homesection ul > li:before{
	content: '';	
}
section.content div.qsdiv_home section.sub_homesection h2,
section.content div.scl_home section.sub_homesection h2,
section.content article section.sub_homesection h2{
	margin: 0;	
}
section.content div.qsdiv_home section.sub_homesection .hidden-menu,
section.content div.scl_home section.sub_homesection .hidden-menu,
section.content article section.sub_homesection .hidden-menu{
	max-width:300%;
}
section.content div.qsdiv_home section.sub_homesection  .hidden-menu.target01 .section-body li a div,
section.content div.scl_home section.sub_homesection  .hidden-menu.target01 .section-body li a div,
section.content article section.sub_homesection  .hidden-menu.target01 .section-body li a div{
	font-size: 100%;	
}
section.content div.qsdiv_home section.sub_homesection.mobile .row .item > a.btn,
section.content div.scl_home section.sub_homesection.mobile .row .item > a.btn,
section.content article section.sub_homesection.mobile .row .item > a.btn{
	color: white;
    font-size: 14px;
	text-decoration:none;
}
section.sub_homesection.mobile .item .container .title .our_recently_development {
	color: #0066CC;
}
.scl_box{
	background-color: #0066CC;
    color: white;
    font-size: 14px;
    padding: 5px 20px;
    border-radius: 10px;
    transition: 0.2s all ease;
	display:inline-block;
}
section.content .formula_wrapper {
	position: relative;
}
section.content .formula_wrapper img {
	max-width: 90%;
}
section.content .formula_wrapper .ref_num {
	position: absolute;
	right: 0;
	top: 0;
}

section.content div.scl_home section.sub_homesection ul > li.our_recently_development a div {
	color: #0066CC;
}
section.content div.scl_home section.sub_homesection ul > li.our_recently_development a:hover div {
	color: white;
}

/**************************************** 
Phase 2 - HKAS
****************************************/
section.content article ul.pagination {
	margin-left: 0px;
    margin-top: 20px;
}
section.content article ul.pagination > li:before{
	content:none;	
}
section.content article ul.pagination > li a{
	text-decoration:none;	
}
.hkas_service_list > div{
	margin-bottom: 10px;	
}

/* --------------- styles for tabs -----------------------*/

.invisible {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}



.example-tabs-tabs__list {
  margin: 0 !important;
  padding: 0 !important;
}
.example-tabs-tabs__list > li:before{
	content: '' !important;	
}
.example-tabs-tabs__item {
  display: inline-block;
	margin: 0 !important;
}

.example-tabs-tabs__link {
  display: inline-block;
  padding: 8px 10px;
  font-size:17px;
  /*border: #0066CC 2px solid;*/
  cursor: pointer;
  color: #148297;
  background: #eee;
  text-decoration:none !important;
  
}
@media only screen and (max-width: 991px) {
	.example-tabs-tabs__link {
		font-size:13px;
	}
}
[aria-selected="true"].example-tabs-tabs__link {
  color: #000;
  background: #edf4fb;
  
}

.example-tabs-tabs__content {
  /*border: #0066CC 2px solid;*/
  background: #edf4fb;
  padding: 1em;
}

[aria-hidden="true"].example-tabs-tabs__content {
  display: none;
}

.search_filter_table td{
	vertical-align: top !important;	
}
td.test_area span:first-child{
	white-space:nowrap;	
	padding-right: 2px;
}
td.test_area span{
	display:table-cell; 
		
}

tr.txt-red td, tr.txt-red td a{
	color:red !important;	
}


@media only screen and (max-width: 991px) {
	.page-link {
		padding: 10px 5px;
	}
}

/** Standards Compare Table **/
.standards_compare_wrapper .compare_box {
	padding: 10px;
	border-radius: 20px;
	margin-bottom: 15px;
}

.standards_compare_wrapper .compare_box .compare_title {
	color: white;
	font-size: 1.4em;
	font-weight: bold;
}
.standards_compare_wrapper .compare_box.green {
	background-color: #4cc884;
	border: 2px solid #41719c;
	color: white;
}
.standards_compare_wrapper .compare_box.dark_green {
	background-color: #00b050;
	border: 2px solid #41719c;
	color: white;
}
.standards_compare_wrapper .compare_box.purple {
	background-color: #9b6ebc;
	border: 2px solid #41719c;
	color: white;
}
.standards_compare_wrapper .compare_box.dark_purple {
	background-color: #7030a0;
	border: 2px solid #41719c;
	color: white;
}
.standards_compare_wrapper .compare_box.orange {
	background-color: #ff944c;
	border: 2px solid #41719c;
	color: white;
}
.standards_compare_wrapper .compare_box.dark_orange {
	background-color: #ff6600;
	border: 2px solid #41719c;
	color: white;
}

/** Hierarchy Table **/
.hierarchy_wrapper {
	text-align: center;
}

.hierarchy_wrapper .hierarchy_box {
	display: inline-block;
	width: 70%;
	max-width: 600px;
	padding: 20px;
}
.hierarchy_wrapper .hierarchy_box.dark_blue {
	background-color: #2f5597;
	color: white;
}

.hierarchy_wrapper .direction_box {
	text-align: center;
}
.hierarchy_wrapper .direction_box.dark_blue {
	color: #2f5597;
	font-size: 25px;
}

section.content article .cat_title {
	font-size: 24px;
	color: #00a5c9;
	margin-top: 35px;
}
body.small-text section.content article .cat_title {
	font-size: 22px;
}
body.large-text section.content article .cat_title {
	font-size: 31px;
}

/** Metrology and Our Everyday Life Style **/
.msg_box_wrap {
	display: flex;
	display: -ms-flexbox;
	-ms-flex-wrap: wrap;
	flex-direction: column;
	align-items: flex-start;
	max-width: 900px;
}
.msg_box_wrap > .msg_box {
    padding: 5px;
    margin: 10px 0;
    border-radius: 10px;
    width: auto;
    max-width: 80%;
}
.msg_box_wrap > .msg_box.style_1 {
	background: #c5f9c4;
	border: 1px solid #31c12f;
	border-right-width: 10px;
	align-self: flex-end;
	justify-content: flex-end;
}
.msg_box_wrap > .msg_box.style_2 {
	background: #d4f1ff;
	border: 1px solid #39a8f5;
	border-left-width: 10px;
}
.msg_box_wrap > .msg_box.style_3 {
	background: #ffefb6;
	border: 1px solid #ffc82c;
	border-left-width: 10px;
}
.msg_box_wrap > .msg_box > .spokesman {
	font-weight: bold;
}
.msg_box_wrap > .msg_box.style_1 > .spokesman {
	color: #197b01;
}
.msg_box_wrap > .msg_box.style_2 > .spokesman {
	color: #0037ff;
}
.msg_box_wrap > .msg_box.style_3 > .spokesman {
	color: #ff8100;
}
.trans_para {
	display: block;
	margin: 15px 0;
	width: 100%;
	text-align: center;
}
.trans_para span {
	background: #e3f2fd;
	padding: 5px;
}

.doc_wrapper {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
.doc_box {
    display: inline-block;
    margin: 15px 15px;
    max-width: 225px;
}
.doc_box a.doc_link {
    display: inline-block;
    position: relative;
	border: 1px solid #08396B;
    width: 225px;
    text-align: center;
}
.doc_box a.doc_link.type_pdf:before {
    content: 'PDF';
    position: absolute;
    bottom: 0;
    right: 0;
    background: #08396B;
    color: white;
    font-weight: bold;
    padding: 5px 10px;
}
.doc_box span.doc_title {
    display: block;
    padding: 8px 0;
    text-align: center;
    color: #08396B;
    font-weight: bold;
}
@media only screen and (max-width: 991px) {
	.doc_box a.doc_link img.doc_thumb {
		display: inline-block !important;
		margin:  0 !important;
	}
}

/**************************************** 
Right to Left Style
****************************************/
section.content article[dir=rtl] {
	padding-left: 7%;
	padding-right: 15px;
}

[dir=rtl], [dir=rtl] h1, [dir=rtl] h2, [dir=rtl] h3, [dir=rtl] h4, [dir=rtl] h5, [dir=rtl] h6, [dir=rtl] p {
	text-align: start;
}

section.content article[dir=rtl] ul {
	padding-right: 0;
	margin-right: 20px;
}

section.content article[dir=rtl] ul > li:before {
	content: "\f100";
	margin-left: 0;
	margin-right: -20px;
}