/* Please keep this css at the last of all css/scss */

@import url('https://fonts.googleapis.com/css?family=Nunito:400,700');
@import url(css_icons.css);

html{font-size: 16px; background-color:#009EEC;}

body{
	background-color:transparent;
	padding:0;
	margin:0;
	font-family: "Nunito","Microsoft JhengHei","微軟正黑體","Microsoft YaHei","微软雅黑体",PMingLiU,"新細明體",'宋体', simsun,Helvetica, Arial,sans-serif;
	font-size: 1rem;
	color:#7b7b7b;
	line-height: 1.8em; 
	letter-spacing:0;
}

body>*{z-index: 1; position: relative}

html[lang=en-GB] body{font-family: Helvetica, Arial, "Microsoft JhengHei","微軟正黑體","Microsoft YaHei","微软雅黑体",PMingLiU,"新細明體",'宋体', simsun, sans-serif; font-size: 14px}

body.lock, body.mfp-zoom-out-cur{ overflow: hidden; }

html, body, a, a>img, .btn, button, .trans-effect, .hover-effect,  .trans-effect a, .hover-effect a, .trans-effect img, .hover-effect img{
 transition:0.5s all;
	-webkit-transition:0.5s all;
	-moz-transition:0.5s all;
	-o-transition:0.5s all;
	-ms-transition:0.5s all;
}

a{color: inherit;} /*a:focus, a:hover*/
a,a:focus, a:hover{text-decoration: none;}

h1,h2,h3,h4,h5,h6{
	margin:0;
	padding: 0;
	font-weight:normal;
 transition:0.5s all;
	-webkit-transition:0.5s all;
	-moz-transition:0.5s all;
	-o-transition:0.5s all;
	-ms-transition:0.5s all;
	/*color: #00a7b1;*/
	font-family: "Nunito","Microsoft YaHei","Microsoft JhengHei",PMingLiU,simsun,Helvetica, Arial,sans-serif;
}
.h1, h1{ font-size: 2.2em; margin-bottom: 0.5em}
.h2, h2{ font-size: 2em; margin-bottom: 0.5em}
.h3, h3{ font-size: 1.75em;  margin-bottom: 0.5em}
.h4, h4{ font-size: 1.5em; margin-bottom: 0.5em}
.h5, h5{ font-size: 1.1em;margin-bottom: 0.5em}
.h6, h6{ font-size: 1em; margin-bottom: 0}

p{margin:0 auto; text-align: justify;}
html[lang=en-GB] p{text-align: left;}

blockquote{border-left: none; margin: 0; font-size: 1rem; line-height: 1.25em;}

.text-center{text-align: center !important;}
.text-left{text-align: left !important;}
.text-right{text-align: right !important;}

.container{width:90%;max-width:1170px;margin:auto;}
.container-lg{width:90%; margin:auto;}
.container-md{max-width:962px;margin:auto;}
.container-sm{max-width:768px;margin:auto;}

.row-flex {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	margin-right: -15px;
	margin-left: -15px;
}
.row-flex>* {
	-ms-flex-positive: 1;
	flex-grow: 1;
	flex-shrink: 0;
	max-width: 100%;
	float: none;
}
.flex-center{display: flex; justify-content: center;}
.flex-center>*{flex-grow:0}

.flex-v-center{display: flex; flex-flow: column wrap; justify-content: center;}
.flex-v-bottom{align-items: flex-end; }

.flex-nowrap{flex-wrap: nowrap;}

.row-flex>.col {
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 100%;
	padding-left: 15px; padding-right: 15px;
}

.flex-nowrap>*{flex-shrink: 1;}

.row-flex.flex-grow-0>*{ flex-grow: 0}

/*.row-flex>.col-lg-1>div:not(.row), .row-flex>.col-lg-2>div:not(.row), .row-flex>.col-lg-3>div:not(.row), .row-flex>.col-lg-4>div:not(.row), .row-flex>.col-lg-5>div:not(.row), .row-flex>.col-lg-6>div:not(.row), .row-flex>.col-lg-7>div:not(.row), .row-flex>.col-lg-8>div:not(.row), .row-flex>.col-lg-9>div:not(.row), .row-flex>.col-lg-10>div:not(.row), .row-flex>.col-lg-11>div:not(.row), .row-flex>.col-lg-12>div:not(.row),
.row-flex>.col-md-1>div:not(.row), .row-flex>.col-md-2>div:not(.row), .row-flex>.col-md-3>div:not(.row), .row-flex>.col-md-4>div:not(.row), .row-flex>.col-md-5>div:not(.row), .row-flex>.col-md-6>div:not(.row), .row-flex>.col-md-7>div:not(.row), .row-flex>.col-md-8>div:not(.row), .row-flex>.col-md-9>div:not(.row), .row-flex>.col-md-10>div:not(.row), .row-flex>.col-md-11>div:not(.row), .row-flex>.col-md-12>div:not(.row),
.row-flex>.col-sm-1>div:not(.row), .row-flex>.col-sm-2>div:not(.row), .row-flex>.col-sm-3>div:not(.row), .row-flex>.col-sm-4>div:not(.row), .row-flex>.col-sm-5>div:not(.row), .row-flex>.col-sm-6>div:not(.row), .row-flex>.col-sm-7>div:not(.row), .row-flex>.col-sm-8>div:not(.row), .row-flex>.col-sm-9>div:not(.row), .row-flex>.col-sm-10>div:not(.row), .row-flex>.col-sm-11>div:not(.row), .row-flex>.col-sm-12>div:not(.row),
.row-flex>.col-xs-1>div:not(.row), .row-flex>.col-xs-2>div:not(.row), .row-flex>.col-xs-3>div:not(.row), .row-flex>.col-xs-4>div:not(.row), .row-flex>.col-xs-5>div:not(.row), .row-flex>.col-xs-6>div:not(.row), .row-flex>.col-xs-7>div:not(.row), .row-flex>.col-xs-8>div:not(.row), .row-flex>.col-xs-9>div:not(.row), .row-flex>.col-xs-10>div:not(.row), .row-flex>.col-xs-11>div:not(.row), .row-flex>.col-xs-12>div:not(.row){
	min-height: 400px;
}*/

.row-flex>*>div.row{height: auto !important;}

.d-flex{display:flex; flex-wrap: wrap;}
.d-flex>*{flex:1 1 auto; position: relative}
/*
.form-group .d-flex>label{order:2}
.form-group .d-flex>label+input[type=checkbox]{order: 1}
*/

.btn{font-size: 0.9rem;}
.btn-lg{font-size: 1rem;}
.btn-sm{font-size: 0.8rem;}
.btn-w{padding-left: 4em; padding-right: 4em;}
/*.btn+.btn{margin-left: 0.5rem;}*/
.btn-normal{ background-color: #FFF; color:#1ca5ad; border-color: #1ca5ad;}
.btn-normal:hover, .btn-normal:focus, .btn-normal:hover:focus, .btn-normal.active{ color:#fff; background-color: #008ed1; border-color: #008ed1;}
/*.btn-primary{ background-color: #005e91; border-color: #005e91;}
.btn-primary:hover, .btn-primary:focus, .btn-primary:hover:focus, .btn-primary.active{ background-color: #008ed1; border-color: #008ed1;}*/
.btn-secondary{background-color: #f6921e; border-color: #f6921e; color:#FFF;}
.btn-secondary:hover, .btn-secondary:focus, .btn-secondary:hover:focus, .btn-secondary.active{ background-color: #F93; border-color: #F93;color:#FFF;}
.btn-ghost{ background: rgba(0,0,0,0.35); border: 1px #fff solid; color:#fff; opacity:0.7;}
.btn-ghost:hover, .btn.btn-ghost:focus, .btn.btn-ghost:active{border: 1px #fff solid; color:#fff; opacity:1; }

.table{display:table; border-collapse: collapse;}
.table>.row, .table>.list-group-item__row{display:table-row; margin-left: auto; margin-right: auto;}
.table>.row:before, .table>.row:after, .table>.list-group-item__row:before, .table>.list-group-item__row:after{ display:none;}
.table>.row>div, .table>.list-group-item__row>div{display:table-cell; vertical-align: middle; float: none; padding: 8px; line-height: 1.42857143; border-top: 1px solid #ddd; }

.table-bordered>.row>div, .table-bordered>.list-group-item__row>div{
	    border: 1px solid #ddd;
}
.table-striped>.row:nth-of-type(odd), .table-striped>.list-group-item__row:nth-of-type(odd){background-color: #f9f9f9;}

a.list-group-item:focus, a.list-group-item:hover, button.list-group-item:focus, button.list-group-item:hover{background: #e7f7ff;}

.pagination, .pagination li, .pagination a{font-size: 14px;}
.pagination .fa{font-size: 20px;}

.img-responsive{margin: auto;}
.img-full{diplay:block; width:100%; margin: auto;}

.youtube-movie {
    width: 100%;
    padding-top: 56.25%;
    position: relative
}

.youtube-movie>iframe {
    width: 100% !important;
    height: 100% !important;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto
}

.thumb{overflow: hidden;}
.img-full-center{ position: absolute;
    min-width: 100%;
    min-height: 100%;
    top: 50%;
    left: 50%;
    -webkit-transform: scale(1) translateX(-50%) translateY(-50%);
    transform: scale(1) translateX(-50%) translateY(-50%);
    transition: 0.35s all;
    -webkit-transition: 0.35s all;
    -moz-transition: 0.35s all;
    -o-transition: 0.35s all;
    -ms-transition: 0.35s all;}

.thunb .img-full-center{width: 100%;}

.animated.fastest {
  -webkit-animation-duration: 250ms;
  animation-duration: 250ms;
}

.animated.slowest {
  -webkit-animation-duration: 5s;
  animation-duration: 5s;
}

svg{max-width: 100%; max-height: 100%;}

.bg-repeat{background-repeat: repeat;}
.bg-repeat-x{background-repeat: repeat-x; background-size: auto 100%}
.bg-repeat-y{background-repeat: repeat-y; background-size: 100% auto;}
.bg-center{background-repeat: no-repeat; background-position: center center;}
.bg-top{background-repeat: no-repeat; background-position: top center;}
.bg-top-fixed{background-repeat: no-repeat; background-position: top center; background-attachment: fixed;}
.bg-bottom{background-repeat: no-repeat; background-position: bottom center;}
.bg-bottom-fixed{background-repeat: no-repeat; background-position: bottom center; background-attachment: fixed;}
.bg-cover{background-repeat: no-repeat; background-position: center center; background-attachment: fixed; background-size: 100% auto;}
.bg-contain{background-repeat: no-repeat; background-position: center center; background-size: auto 100%;}
.bg-full{background-repeat: no-repeat; background-position: center center; background-attachment: fixed; background-size: 100% 100%;}

.wrapper-full-width{width: 100%; max-width:none; margin-left: 0; margin-right: 0;}
.wrapper-boxed{ width: 96%; max-width: 1200px; margin-left: auto; margin-right: auto;}
.wrapper-classic{width:100%; max-width: 960px; margin-left: auto; margin-right: auto;}

/*ul.check-list, ol.check-list{ list-style: none; padding: 0;}
ul.check-list>li, ol.check-list>li{padding-left: 2.4em;  position: relative; margin-bottom: 1.5em;}
ul.check-list>li:before, ol.check-list>li:before{content: "\f058"; font-family: "Font Awesome 5 Free"; display:block; font-size: 2em; color:#5cd023; position: absolute; top:0; left:0;}*/

.column-row{ position: relative; background-repeat: no-repeat; background-position: center center; background-size: cover; }
.column-row .container{ position: relative; padding-top: 80px; padding-bottom: 80px;}

#page-wrapper{min-height: 100vh; display:flex; flex-direction: column; justify-content:space-between;}
#page-wrapper>*:not(.main-content){flex-grow: 0; flex-shrink: 0;}
#page-wrapper>.main-content{flex-grow: 1}
#page-top{padding: 0.5rem; font-size: 0.9rem; height: 32px; display:flex; align-items: center; justify-content: flex-start;}

#page-header{ /*height: 180px;*/ display:block; clear: both;}
#page-header a{text-decoration: none;}
#page-header .header-text{max-width: 40%;}

/*#page-top{position: fixed; top:0; left:0; right:0; z-index: 2;
background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);
background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%);
background: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); 
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=0 );
}*/

header.page-top.fixed{background: rgba(255,255,255,1);
	-webkit-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.2);
-moz-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.2);
box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.2);
}
/*.page-top .logo{height: 100%; flex-shrink: 0; padding: 0 2rem; font-size: 1.5rem; font-weight: bold;  flex-grow:1; max-width: 415px;}*/
.header-banner{height:120px; padding: 10px 0;}
.header-banner>.container{position: relative;}
.header-banner>.container, .header-banner>.container>.row{ height: 100%}
/*.header-banner>.container>*{position: absolute; left:220px; right:0;}*/
.header-banner h1{font-size:2rem; font-weight: bold;margin: auto;}
.header-banner h1 .title-en{font-size: 0.5em;display:block;}
.header-banner h1+div{margin: auto;}
/*.header-banner h1 a{color: #00a7b1;}
.header-banner h1 a:hover{text-decoration: none;}*/

header.fixed .header-banner{height: 60px; padding: 5px;}
header.fixed .header-banner h1{font-size:1.5rem;}
header.fixed .logo{height: 60px; width: 80px;}

.header-banner .logo{ width: 140px; height: 100%; text-align: center; flex-grow: 0; position: relative; margin-right: 10px;}
.header-banner .logo img{max-height: 100%; }
.header-banner .logo svg{position: absolute; top: 0;right: 0;bottom: 0;left: 0; margin: auto;}
.header-banner .nav-wrapper{position: relative; flex-grow: 1; }

.header-hoz>.container>.row{flex-direction: row;}
.header-vert>.container>.row{flex-direction: column; align-items: center; justify-content: center;}
.header-vert>.container>.row>*:not(.logo){text-align: center; margin: 0; flex-grow: 0;}
.header-vert>.container>.row>.logo{margin-right: 0; margin-bottom: 5px;}
#page-header .header-vert>.container>.row>.header-text{max-width: 60%;}
.header-vert>.container>.row>.lang-switchs-pc{padding-right: 0; justify-content: center;}
.header-banner.header-vert .logo{height: auto;}
.header-banner.header-vert .logo svg{max-width: 100%; height: auto; position: relative;}


#mobile-menu{display: none; position: fixed; top: 4px; right: 4px; z-index: 8; 
	width: 64px; height: 64px; border-radius: 50%; background: #1ca5ad; color: #FFF; border: none; outline: none;
    -webkit-box-shadow: 0 0 20px rgba(0,0,0,0.25); -moz-box-shadow: 0 0 20px rgba(0,0,0,0.25); box-shadow: 0 0 20px rgba(0,0,0,0.25);
}
#mobile-menu.open{ transform: scale(0.8); }
#mobile-menu i{display: block;
  position: absolute;
  height: 2px;
  width: 36px;
  background: #FFF;
  border-radius: 2px;
  opacity: 1;
  left: 14px;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
}
#mobile-menu i:nth-child(1) { top: 35%;}
#mobile-menu i:nth-child(2),#mobile-menu i:nth-child(3) { top: 50%;}
#mobile-menu i:nth-child(4) {top: 65%;}
#mobile-menu.open i:nth-child(1) { width: 0%; left: 50%;}
#mobile-menu.open i:nth-child(2) {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}
#mobile-menu.open i:nth-child(3) {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
#mobile-menu.open i:nth-child(4) {/*top: 14px;*/ width: 0%; left: 50%; }

#top-menu{ position:relative; left:0; right:0; z-index: 3; height: 70px; /*height: 100%;background-color: #FFF;*/
	/*-webkit-box-shadow: 0 0 10px rgba(0,0,0,0.25); -moz-box-shadow: 0 0 10px rgba(0,0,0,0.25); box-shadow: 0 0 10px rgba(0,0,0,0.25);*/
}
#top-menu.fixed{position: fixed; top:0; left:0; right:0;}
#top-menu.open:before{content: ""; display:block; position: fixed; top:0; right:0; bottom:0; left:0; background-color: rgba(8, 60, 97, 0.88); z-index: 6;}

#top-menu .navbar>li>a{
		transition:none;
	-webkit-transition:none;
	-moz-transition:none;
	-o-transition:none;
	-ms-transition:none;
}

#top-menu .navbar>li>.sub>li>a{
	transition:0.5s height;
	-webkit-transition:0.5s height;
	-moz-transition:0.5s height;
	-o-transition:0.5s height;
	-ms-transition:0.5s height;
}

.top-menu-hover, #top-menu .navbar>li, #top-menu .navbar>li>.sub, #top-menu .navbar>li>.sub>li{
	transition:0.5s all;
	-webkit-transition:0.5s all;
	-moz-transition:0.5s all;
	-o-transition:0.5s all;
	-ms-transition:0.5s all;
}


.navbar {
	margin-bottom: 0; padding: 0; /*font-size: 1rem;*/ min-height: 0;
	height: 100%; list-style:none;display:flex;align-items:stretch;justify-content:space-between; border: none;
}

.navbar>li {
    /*margin: 10px;height: 100%; flex-grow:1;*/  background-color:transparent; border-radius: 0;
}
.navbar li, .navbar li>a{ white-space: nowrap; }

.navbar>li>a {
   display:flex; align-items: center; justify-content: center; padding: 0 15px;; text-align:center;color:inherit; height: 100%; /*border-radius: 0.75rem; line-height: 60px;*/
}

.navbar>li>a>.fa{ font-size: 32px; line-height: 1.5em; margin-right: 10px}

.navbar.item-glow{justify-content:center;}
.navbar.item-glow>li{flex-grow: 1;}
.navbar.item-between{justify-content: space-between}
.navbar.item-around{justify-content:space-around}
.navbar.item-center{justify-content: center}
.navbar.item-left{justify-content: flex-start}
.navbar.item-right{justify-content: flex-end}

.navbar.item-center>li{margin-left: 0.5em; margin-right: 0.5em;}
.navbar.item-left>li{margin-right: 1em;}
.navbar.item-right>li{margin-left: 1em;}

html[lang=en-GB] .navbar>li>a{font-size: 12px;}
html[lang=en-GB] .navbar>li>a>.fa{font-size: 18px; margin-right: 5px;}

/*.navbar>li:hover>a, .navbar>li>a:hover, .navbar>li>a:focus, .navbar>.active>a, .navbar>.active>a:focus, .navbar>.active>a:hover {
    background-color: #005e91; color:#FFF; border-radius: 0.75rem; outline: none;
}*/

/*.navbar>li.parent:hover>a, .navbar>li.parent>a:hover, .navbar>li.parent>a:focus, .navbar>.active.parent>a:focus, .navbar>.active.parent>a:hover {border-radius: 0.75rem 0.75rem 0 0}*/

.navbar>li>.sub{padding: 0; min-width: 100%; position: absolute;top:100%; /*background: #005e91;*/ list-style: none; text-align: left; /*border-radius: 0 0 0.75rem 0.75rem;*/ overflow: hidden;}
.navbar>li>.sub>li>a{ color:#FFF; font-size: 0.9em;
	height: 0; padding: 0 1rem; line-height: 40px; outline: none;
	overflow: hidden;
	letter-spacing: 0; text-decoration: none;
	display: block;
	transition: 0.35s all;
	-webkit-transition: 0.35s all;
	-moz-transition: 0.35s all;
	-o-transition: 0.35s all;
	-ms-transition: 0.35s all;}
.navbar>li>.sub>li>a:hover{/*background-color:rgba(0,0,0,0.2);*/}

html[lang=en-GB] .navbar>li>.sub>li>a{font-size: 12px;}

.navbar>li:hover>.sub>li>a, .navbar>li:focus>.sub>li>a, .navbar>li>a:hover+button+.sub>li>a, .navbar>li>a:focus+button+.sub>li>a{height: 40px;}

/*#top_menu_1, #top_menu_6{ background-color:#c8d93b; }
.navbar>li#top_menu_1:hover>a, .navbar>li#top_menu_1>a:hover, .navbar>li#top_menu_1>a:focus, .navbar>#top_menu_1.active>a, .navbar>#top_menu_1.active>a:focus, .navbar>#top_menu_1.active>a:hover, .navbar>li#top_menu_6:hover>a, .navbar>li#top_menu_6>a:hover, .navbar>li#top_menu_6>a:focus, .navbar>#top_menu_6.active>a, .navbar>#top_menu_6.active>a:focus, .navbar>#top_menu_6.active>a:hover, .navbar>li#top_menu_1>.sub, .navbar>li#top_menu_6>.sub{
	background-color: #9ec12f;
}

#top_menu_2, #top_menu_7{ background-color:#ffaa1e; }
.navbar>li#top_menu_2:hover>a, .navbar>li#top_menu_2>a:hover, .navbar>li#top_menu_2>a:focus, .navbar>#top_menu_2.active>a, .navbar>#top_menu_2.active>a:focus, .navbar>#top_menu_2.active>a:hover, .navbar>li#top_menu_7:hover>a, .navbar>li#top_menu_7>a:hover, .navbar>li#top_menu_7>a:focus, .navbar>#top_menu_7.active>a, .navbar>#top_menu_7.active>a:focus, .navbar>#top_menu_7.active>a:hover, .navbar>li#top_menu_2>.sub, .navbar>li#top_menu_7>.sub{
	background-color: #ff7f00;
}

#top_menu_3, #top_menu_8{ background-color:#fc5e8f; }
.navbar>li#top_menu_3:hover>a, .navbar>li#top_menu_3>a:hover, .navbar>li#top_menu_3>a:focus, .navbar>#top_menu_3.active>a, .navbar>#top_menu_3.active>a:focus, .navbar>#top_menu_3.active>a:hover, .navbar>li#top_menu_8:hover>a, .navbar>li#top_menu_8>a:hover, .navbar>li#top_menu_8>a:focus, .navbar>#top_menu_8.active>a, .navbar>#top_menu_8.active>a:focus, .navbar>#top_menu_8.active>a:hover, .navbar>li#top_menu_3>.sub, .navbar>li#top_menu_7>.sub{
	background-color: #ff3d79;
}

#top_menu_4, #top_menu_9{ background-color:#cf88c2; }
.navbar>li#top_menu_4:hover>a, .navbar>li#top_menu_4>a:hover, .navbar>li#top_menu_4>a:focus, .navbar>#top_menu_4.active>a, .navbar>#top_menu_4.active>a:focus, .navbar>#top_menu_4.active>a:hover, .navbar>li#top_menu_9:hover>a, .navbar>li#top_menu_9>a:hover, .navbar>li#top_menu_9>a:focus, .navbar>#top_menu_9.active>a, .navbar>#top_menu_9.active>a:focus, .navbar>#top_menu_9.active>a:hover, .navbar>li#top_menu_4>.sub, .navbar>li#top_menu_7>.sub{
	background-color: #bf5aad;
}

#top_menu_5, #top_menu_10{ background-color:#27bfca;}
.navbar>li#top_menu_5:hover>a, .navbar>li#top_menu_5>a:hover, .navbar>li#top_menu_5>a:focus, .navbar>#top_menu_5.active>a, .navbar>#top_menu_5.active>a:focus, .navbar>#top_menu_5.active>a:hover, .navbar>li#top_menu_10:hover>a, .navbar>li#top_menu_10>a:hover, .navbar>li#top_menu_10>a:focus, .navbar>#top_menu_10.active>a, .navbar>#top_menu_10.active>a:focus, .navbar>#top_menu_10.active>a:hover, .navbar>li#top_menu_5>.sub, .navbar>li#top_menu_10>.sub{
	background-color: #008ab1;
}*/


#top-menu.fixed .navbar{height: 60px;}
#top-menu.fixed .navbar>li>a, #top-menu.fixed .navbar>li>a>.fa{line-height: 60px;}
#top-menu .nav>li>a:focus, #top-menu .nav>li>a:hover{background-color: transparent; color:inherit;}

.menu-hide{display: none !important;}
.showsub{ height: 64px; width: 64px; position: absolute; top: 0; right: 0; background: rgba(255,255,255,0.25); border: none; color: #fff; font-size: 24px;}

.lang-switchs-pc{display:flex; align-items: center; justify-content:flex-end; padding-right: 15px;}
.lang-switch{width: 36px; height: 36px; font-size: 14px; border-radius: 50%; text-align: center;  display:flex; align-items: center; justify-content: center; margin: 0 10px 0 0; cursor: pointer;
	/*border: 1px #009eec solid; color:#009eec;*/}
/*.lang-switch:hover, .lang-switch.active{text-decoration: none; background:#009eec; color:#fff; }*/

.lang-switchs-mob{display:flex; align-items: center; justify-content: center; width: 100%; height: 64px;}
/*.lang-switchs-mob .lang-switch{width: 48px; height: 48px; font-size: 1rem; border-color: #FFF; color:#FFF;}
.lang-switchs-mob .lang-switch:hover, .lang-switchs-mob .lang-switch.active{background: rgba(255,255,255,0.2);}*/

.main-content{ }
.main-content .container-fullw{padding: 40px 0; background: #fff;}
.main-content .container{}
.main-content .container .inpage { width: 100%; background: #fff; margin: 1rem auto 0; border-radius: 1rem; padding: 0 30px 30px; display:inline-block}

.main-content .background-none{background: none !important; color: #0a4363; /*font-size: 1.25em*/}
.main-content .background-color-1{background-color: #c8d93b}
.main-content .background-color-2{background-color: #ffaa1e}
.main-content .background-color-3{background-color: #fc5e8f}
.main-content .background-color-4{background-color: #cf88c2}
.main-content .background-color-5{background-color: #27bfca}
.main-content .background-color-6{background-color: #009eec}

.main-content .flex-v-center>*{width: 100%;}

span.cube{padding: 10px;}

.main-content hr{max-width: 80%; margin: 60px auto;}

.main-content ul {
	padding-left: 1.5em;
}
.main-content li {
	margin-bottom: 0.5em;
}

.main-content ul{
	list-style: none; padding-left: 0.25em; 
}
.main-content ul>li{ 
	position: relative; padding-left:1.25em; line-height: 1.45em;
}
.main-content ul>li:before, .main-content ul[type=disc]>li:before, sections ul[type=circle]>li:before, .main-content ul.dot>li:before{
	content: ""; display:inline-block; width: 0.5em; height:0.5em; min-width: 8px; min-height: 8px; border-radius: 50%; position: absolute; top:0.35em; left:0; /*margin-top: -0.25em;*/
}
.main-content ul[type=square]>li:before, .main-content ul.square>li:before, .main-content ul.cube>li:before{
 border-radius: 0;
}
.main-content ul.arrow>li:before{
	content: ""; display:inline-block; width: 0; height: 0; background-color:transparent; border-radius: 0; position: absolute; top:0; left:0; margin-top: 1%;
	border: 8px currentColor solid;
	border-color:transparent transparent transparent currentColor;
}

/*.main-content ul.check>li{padding-left: 1.5em;}
.main-content ul.check>li:before{
	content: "\f058"; font-family: 'Font Awesome 5 Free'; font-weight: 400; font-size: 1.2em; background-color:transparent; border-radius: 0; top:-0.1em; left:0; color:#1ca5ad;
}
.main-content ul.check>li.empty:before{content: "\f111";}*/

ol[type="a"], .main-content ol{ counter-reset: item-counter;  padding-left: 0;  }
ol[type="a"]>li, .main-content ol>li{position:relative; list-style: none; counter-increment: item-counter; padding-left: 2em }
ol[type="a"]>li:before, .main-content ol>li:before {
	content: counter(item-counter)'.';
	display: inline-block; width: 2em; height: 1.8em; text-align: center;
	position: absolute; top:0; left:0;
	 font-weight: bold;
}
/*.main-content ol.circle>li:before{width: 1.4em; height: 1.4em; font-size: 0.8em; line-height: 1.3em; border-radius: 50%; overflow: hidden; content: counter(item-counter); display: inline-block; position: absolute; top:0; left:0; text-align: center;background-color: #1ca5ad; color: #FFF;}
.main-content ol.square>li:before{width: 1.4em; height: 1.4em; font-size: 0.8em; line-height: 1.3em; border-radius: 0; overflow: hidden; content: counter(item-counter); display: inline-block; position: absolute; top:0; left:0; text-align: center;background-color: #1ca5ad; color: #FFF;}
.main-content ol.circle-border>li:before{width: 1.4em; height: 1.4em; font-size: 0.8em; line-height: 1.4em; border-radius: 50%; overflow: hidden; content: counter(item-counter); display: inline-block; position: absolute; top:0; left:0; text-align: center;background-color: #FFF; border: 1px #1ca5ad solid; color: #1ca5ad;}
.main-content ol.square-border>li:before{width: 1.4em; height: 1.4em; font-size: 0.8em; line-height: 1.4em; border-radius: 0; overflow: hidden; content: counter(item-counter); display: inline-block; position: absolute; top:0; left:0; text-align: center;background-color: #FFF; border: 1px #1ca5ad solid; color: #1ca5ad;}*/
ol[type="A"]>li:before, ol.upper-letter>li:before, .main-content ol[type="A"]>li:before, .main-content ol.upper-letter>li:before{ content: counter(item-counter,upper-latin)')';}
ol[type="a"]>li:before, ol.lower-letter>li:before, .main-content ol[type="a"]>li:before, .main-content ol.lower-letter>li:before{ content: counter(item-counter,lower-latin)')';}
.main-content ol[type="I"]>li:before, .main-content ol.upper-roman>li:before{ content: counter(item-counter,upper-roman)}
.main-content ol[type="i"]>li:before, .main-content ol.lower-letter>li:before{ content: counter(item-counter,lower-roman);}
.main-content ol.leading-zero>li:before{ content: counter(item-counter,decimal-leading-zero);}
.main-content ol.chinese>li:before, .main-content ol[type=一]>li:before{ content: counter(item-counter,cjk-ideographic);}
.main-content ul.list-none, .main-content ol.list-none{list-style:none; padding-left: 0;}
.main-content ul.list-none>li, .main-content ol.list-none>li{padding-left: 0;}
.main-content ul.list-none>li:before, .main-content ol.list-none>li:before{display:none !important;}
/*main.main-content li{margin-bottom: 0.5em;}*/

.main-content ul.list-group{padding-left: 0;}
.main-content .list-group>li{padding: 0.5em 1em; margin: 0 auto}
.main-content .list-group>li:before{content: none !important}


.page-header{border-bottom: none;}
.page-header h1{text-align: center; position: relative; padding-bottom: 2rem; margin-bottom: 1.5rem}
.page-header h1:after{content: ""; display:inline-block; width: 80%; height: 8px; border-radius: 8px; background-color: #00a7b1; position: absolute; right:0; bottom:0; left: 0; margin: auto;}
.page-header .desc{max-width: 80%; margin: 0 auto;}

#showcase{ max-height: 360px; overflow: hidden; text-align: center;}
#showcase_inpage{max-height: 360px; overflow: hidden; text-align: left; display:flex; flex-direction: column; align-items:stretch; justify-content: center; position: relative}
#showcase_inpage>.container{z-index: 1}
#showcase_inpage h1{margin: 0 auto;}
/*
.home-slider{padding-left: 0; padding-right: 0; margin-bottom: 0; width: 100%; padding-top: 30.4%; position: relative; list-style: none;}
.home-slider .owl-stage-outer{ position: absolute; top:0; right:0; bottom:0; left:0; height: 100%;}
.home-slider .owl-stage{display:flex;}
.home-slider .owl-stage, .home-slider .owl-stage>*, .home-slider .owl-stage>*>*, .home-slider .owl-item{position: relative; height: 100%; background-size: cover;}
.home-slider .owl-item{ opacity: 0.35; 
	transition: 1s opacity;
	-webkit-transition: 1s opacity;
	-moz-transition: 1s opacity;
	-o-transition: 1s opacity;
	-ms-transition: 1s opacity;
}
.home-slider .owl-item.center{opacity:1;}
.home-slider .owl-item *{ height: 100%;}
.home-slider .home-slider_item{width:1170px; height:585px; padding: 0 10px; }
.home-slider .home-slider_item>*{width: 100%; height: 100%;  background-size: 100%; border-radius: 2rem;}

.home-slider.owl-theme .owl-dots, ul.home-slider.owl-theme .owl-nav{position: absolute;}
.home-slider__image{height: 100%; background-size: 100%;}
*/


/*.owl-carousel .owl-stage{display:flex; flex-wrap: nowrap;}*/
.owl-carousel .owl-dots, .owl-carousel .owl-nav{text-align: center; -webkit-tap-highlight-color: transparent; }

.owl-carousel .owl-nav{ position: absolute; top:0; right:0; bottom: 0; left:0; margin: auto; max-width: 1170px; pointer-events: none; }
.owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev{ position: absolute; min-width: 32px; min-height: 32px; color: #fff; top:0; bottom:0; margin: auto 0; outline: none; pointer-events: all;}

.owl-carousel .owl-nav button:hover{background: rgba(0,0,0,0.35);}
.owl-carousel button.owl-next{right:-32px;}
.owl-carousel button.owl-prev{left:-32px;}
.owl-carousel:hover button.owl-next{right:-32px; opacity: 1}
.owl-carousel:hover button.owl-prev{left:-32px; opacity: 1}

.owl-carousel .owl-dots{min-height: 32px; display:flex; align-items: center; justify-content: center;}
.owl-carousel .owl-dots .owl-dot { zoom: 1;}
.owl-carousel button.owl-dot{ outline: none}
.owl-carousel .owl-dots .owl-dot span {
	width: 12px;
	height: 12px;
	margin: auto 8px;
	background: rgba(0,0,0,0.35);
	color:#FFF;
	display: block;
	position: relative;
	border-radius: 32px;
}

.owl-carousel .owl-dots .owl-dot span:before{content: ""; display:block; width: 100%; height: 100%; border-radius: 32px; background-color: currentColor; opacity: 0;
	-webkit-backface-visibility: visible;
	transition: opacity .5s ease;
}
.owl-carousel .owl-dots .owl-dot.active span:before, .owl-carousel .owl-dots .owl-dot:hover span:before{
opacity: 1;
}





.home-slider{margin: 1rem auto;}
.home-slider .owl-nav button.owl-next, .home-slider .owl-nav button.owl-prev{ position: absolute; width: 64px;height: 64px; background: #ffaa1e; border-radius: 50%; color: #fff;  font-size: 40px; opacity: 0.8;}
.home-slider-item{position: relative; width: 1170px;}
.home-slider-item:before{content: ""; display:block; padding-top: 50%;}
.home-slider-item>img{position: absolute; top:0; right:0; bottom:0; left:0; margin: auto; border-radius: 2rem;}

/*Colorful Block*/
.block-colorful{border-radius: 1rem; padding: 15px;position: relative;}
.block-colorful-inner{background-color: #FFF; border-radius: 1rem; padding: 10px; min-height: 400px;}

.block-colorful-inner .block-title{color:#fff; margin: -10px -10px 10px; padding: 10px;}
.block-colorful.color-1, .block-colorful.color-1 .block-title{background-color: #c8d93b}
.block-colorful.color-2, .block-colorful.color-2 .block-title{background-color: #ffaa1e}
.block-colorful.color-3, .block-colorful.color-3 .block-title{background-color: #fc5e8f}
.block-colorful.color-4, .block-colorful.color-4 .block-title{background-color: #cf88c2}
.block-colorful.color-5, .block-colorful.color-5 .block-title{background-color: #27bfca}
.block-colorful.color-6, .block-colorful.color-6 .block-title{background-color: #009eec}


/**/
a.feature_icon{text-align: center; width: 200px; height: 200px; border-radius: 50%; display:flex; flex-direction: column; align-items: center; justify-content: center; margin: 1rem auto 0; font-size: 1.5rem; color:#fff;}
a.feature_icon:hover, a.feature_icon:focus{ text-decoration: none; color:#fff; transform: scale(1.1);
}
.feature_icon .fa, .feature_icon .fas{font-size: 80px; color:#FFF; width: 100%; margin-bottom: 0.5rem}

/*News Headline*/
.block-news-headline{}
.block-news-headline>*{display: flex;}
.block-news-headline .news-item{ display: flex; flex-wrap: wrap; flex-direction: column; padding-bottom: 3rem; margin-bottom: 2rem; position: relative;}
.news-item .thumb{
	width: 100%;
	padding-top: 53.7%;
	overflow: hidden;
	position: relative;
	border: 1px #ddd solid;
	border-radius: 4px;
	background-color: #fafafa;
}
.news-item .title{margin: 1rem 0; font-weight: bold;}
.news-item .more{position: absolute; right:0; bottom: 0; left:0; min-height: 36px; padding: 2px; border-top: 1px #ddd solid; display: flex; justify-content: flex-end;}
.news-item .more a{color:#666; font-weight: bold}

.text-list .list-item>a{display:flex; width: 100%; padding: 5px; border-bottom: 1px #5fa5da dashed;}
.text-list .list-item>a:hover, .text-list .list-item>a:focus{ text-decoration: none; background-color: #eafafb}
.text-list .date{width:120px; font-size: 0.8em; flex-grow: 0; flex-shrink: 0; }
.text-list .title{flex-grow: 1; flex-shrink: 0; }
.text-list .list-item .fa, .text-list .list-item .fas{ font-size: 1.5em; margin-right: 0.25em;}

/**/

.round-img{ width: 100%; border-radius: 50%; overflow: hidden; position: relative; border: 10px #00a7b1 solid; }
.round-img:before{content: ""; display:block; position: relative; width: 100%; padding-top: 100%; }
.round-img .img-full-center{max-height: 100%; }

.ex-img-cont{overflow: hidden; position: initial; padding: 0; }
.ex-img-cont>*{position: absolute; height: 100%;
    top: 0;
    left: 0;
    background-position: 50% 50%;
    display: block;
    overflow: hidden;
}

.list-round-img{ width: 80%; margin: 0 auto;}
.list-round-img .list-round-img-item{ width: 240px; margin: 0 auto 2rem}
.list-round-img .list-round-img-item p{margin-left: 1em; margin-right: 1em; text-align: justify;}
.list-round-img .list-round-img-item p:first-letter{font-size: 2em; color:#00a7b1}

/**/
.filter-group{margin: 1rem auto;}
.row-sm{width: 80%; max-width: 962px; margin-left:auto; margin-right: auto;}

/**/
.block-school{}
.block-school .row-flex>*{flex-grow: 0; padding-bottom: 2rem;}
.block-school .row-flex>.col{flex-grow: 1 }
.block-school .thumb{ background-color: #FFF; padding: 10px; margin-bottom: 1.5rem; display:block; border-radius: 3px; min-height: 180px; 
	-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.2);
	-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.2);
	box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.2);
}
.block-school .thumb:hover, .block-school .thumb:focus{text-decoration: none;}
.block-school .thumb .inner-photo{width: 100%; position: relative; overflow: hidden}
.block-school .thumb .inner-photo:before{content: ""; display: block; padding-top: 66%;}
.block-school .thumb .inner-photo img{width: 100%; height: auto;}
.block-school .thumb .caption{text-align: right; color:#7b7b7b; margin-bottom: 0;}

/*Book Wrapper*/
.book-details{ padding-bottom: 3rem; border-bottom: 1px #ddd solid;}
.book-wrapper{display:flex; flex-wrap: nowrap; align-items: center; margin-top: 3rem}
.book-wrapper.reverse{flex-direction:row-reverse;}
.book-wrapper.small-cover{}
.book-wrapper .book-cover{max-width: 360px;}
.book-wrapper .book-intro{padding-left: 2rem;}
.book-wrapper.reverse .book-intro{padding-left: 0; padding-right: 2rem;}
.book-wrapper .book-intro blockquote{position: relative; border-radius: 1rem; padding: 1rem; margin: 1rem 0; background-color: #f8f9d5; color: #316732;}
.book-wrapper .book-intro blockquote:before{ content: ""; position: absolute; height: 0; width: 0; 
    border-top: 0.5rem solid transparent; border-right: 1rem solid #f8f9d5; border-bottom: 0.5rem solid transparent; border-left: none;
    top: 1rem; right:auto; bottom:auto; left: -1rem; }
.book-wrapper.reverse .book-intro blockquote:before{ border-right: none; border-left: 1rem solid #f8f9d5; top: 1rem; right:-1rem; bottom:auto; left: auto;}
.book-wrapper .action-group{margin: 1rem 0;}
.book-wrapper .action-group .btn{text-transform:uppercase; margin:0 1rem 1rem 0;}
.book-wrapper .action-group .btn:hover, .book-wrapper .book-intro .action-group .btn:focus{transform: translateY(-5px);}
.book-description{margin: 1rem;}

.book-preview{margin-top: 2rem;}
.book-preview>*{margin-bottom: 1rem;}

/*Album Masonry*/
.row.masonry{margin-left: auto; margin-right: auto; width: 100%;}
.masonry .item{padding-left: 5px; padding-right: 5px; margin-bottom: 10px;}
.masonry .item .lightbox-item{position: relative; box-shadow: 0 0 5px rgba(0,0,0,0.25); border-radius: 8px; overflow: hidden;}
.masonry .item .lightbox-item .port-overlay-cont{display:none;}
.masonry .item .lightbox-item a>img{transform: scale(1);}
.masonry .item .lightbox-item a:hover>img{transform: scale(1.1);}
.masonry .item .lightbox-item figcaption{position: absolute; top:0; right:0; bottom:0; left:0; display:flex; flex-wrap: wrap; flex-direction: column; align-items: center; justify-content: center; text-align: center; background-color: rgba(0,0,0,0.5); color:#FFF; opacity: 0; pointer-events: none;}
.masonry .item .lightbox-item figcaption .fa{font-size: 64px; width: 100%;}
.masonry .item .lightbox-item:hover figcaption{opacity: 1;}

/*Artlice List*/
/*.article-list{}
.article-list .list-group-item, .blog-list .list-group-item, .praise-list .list-group-item{ border: none; margin-bottom: 3rem }
.article-list>.row-flex-wrap>*{display: flex;}
.article-list .thumb, .blog-list .thumb{text-align: center;}
.article-list .thumb img, .blog-list .thumb img, .praise-list .thumb img{margin: 0 auto; transform: scale(1);}
.article-list .list-group-item:hover .thumb img{transform: scale(1.1);}
.article-list h4.subtitle{font-size: 0.777rem; color:#666;}
.article-list .author{font-size: 0.8rem; text-align: right; font-style: italic; line-height: 1.1em; margin-bottom: 8px;}
.article-list .intro{font-size: 0.89rem; line-height: 1.1em; color:#7b7b7b; text-align: justify; margin-top: 1em;}
.article-list .intro .readmore{color: #008ed1; font-weight: bold; margin-left: 0.35em}*/

/*blog*/
.blog-list{}
.blog-list .list-item{padding-top: 2em; padding-bottom: 2em; margin-bottom: 0; position: relative;}
.blog-list .list-item:after{content: ""; display:block; width: 60%; height: 1px; background: #ddd; position: absolute; bottom: 0; left:0; right:0; margin: 0 auto;}
.blog-list .thumb{max-height: 240px;}
.blog-list .list-item:hover .thumb img{transform: scale(1.05);}
.blog-list .date{font-size: 0.9em; line-height: 1em; position: relative; opacity: 0.6; /* padding-left: 32px; margin: 1rem 0;*/}
/*.blog-list .date:before{font-family: "FontAwesome"; font-size: 24px; content: "\f15f"; display: inline-block; position: absolute; left:0; top:0; }*/
.blog-list .intro{display:flex; flex-wrap: wrap; align-items: center; line-height: 1.5em; text-align: left; margin: 1em 0;}
.blog-list .intro>*{flex-grow: 0; width: 100%;}
.blog-list .intro .readmore{color: #008ed1; font-weight: bold; margin-left: 0.35em}

.blog-detail-page{}
.blog-detail-page img{ max-width: 100%;}
.blog-cover{margin-bottom: 2rem;}

.couse-list{}
.couse-list .list-item{padding: 2em; margin-bottom: 2em; border-radius: 8px; 
-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.15);
-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.15);
box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.15); 
}
.couse-list .thumb{ height: 255px; flex-shrink: 0;display: flex;align-items: center; justify-content: center;}
.couse-list .thumb img{margin: auto;}
.couse-list .action-group{text-align: right;}

/*praise*/
.praise-list .list-group-item blockquote{position: relative; border-radius: 1rem; padding: 1rem; margin: 1rem 0; background-color: #f8f9d5; color: #316732;}
.praise-list .list-group-item blockquote:before{ content: ""; position: absolute; height: 0; width: 0; 
    border-top: 0.5rem solid transparent; border-right: 1rem solid #f8f9d5; border-bottom: 0.5rem solid transparent; border-left: none;
    top: 1rem; right:auto; bottom:auto; left: -1rem; }
.praise-list .list-group-item.reverse blockquote:before{ border-right: none; border-left: 1rem solid #f8f9d5; top: 1rem; right:-1rem; bottom:auto; left: auto;}
.praise-list .author{display:flex; min-width: 100%; justify-content: flex-end; align-items: center; font-style: italic; font-weight: bold;}
.praise-list .author:before{content: ""; display:inline-block; width: 6rem; height: 1px; margin-right: 0.5em; background-color: #7b7b7b;}


/*event*/
.event-photo-list{}
.event-photo-list .row-flex-wrap>*{display:flex;}
.event-photo-list .list-group-item{margin-bottom: 2rem; width: 100%;}
.event-photo-list .list-group-item:hover{transform: scale(1.05);}
.event-photo-list .list-group-item .cover{height: 200px; width: 100%; background-position: center center; background-size: cover;}

/*album*/
.album{}

.album .row-flex>*{ flex-grow: 0;}
.album .thumb{display:block; overflow: hidden; max-width: 100%; position: relative;}
.album .thumb img{max-width: 100%;}
.album .thumb:hover img{ transform: scale(1.05); }
.album .album-item{
background-color: #FFF;
    padding: 1em;
    margin-bottom: 1.5rem;
    display: block;
    border-radius: 4px;
    /*min-height: 100%;
    transform: scale(1);*/
    -webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.2);
    -moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.2);
    box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.2);
}

.album .album-item figcaption{margin-top:0.25em;}

/*shop*/
.shop-list{align-items: center;}
.shop-brand{padding: 2rem 1rem; text-align: center;}
.shop-brand img{max-width: 100%;}

/**/
.contact-info{ padding: 0;}
.contact-info li{font-size: 1.5rem; list-style: none; margin-bottom: 1rem;}
form#contact_form{ background-color: #1ca5ad; color: #FFF; padding: 2rem; border-radius: 8px; margin: 0 auto;}
form#contact_form h1, form#contact_form h2, form#contact_form h3{color:#fff;}

#page-footer{ line-height: 1.25em; padding-top: 60px; padding-bottom: 60px; /*font-size: 0.875rem; line-height: 1.25em; text-align: center; padding: 1.5rem;*/}
#page-footer>*, #page-footer .row-flex{height: 100%;}
#page-footer .copyright{ padding-top: 40px; text-align: center; font-size: 12px;}

.soc-icon{font-size: 32px;}

.floating-character {
	position: fixed; right:2%; bottom:15%; z-index: 7;
    animation-name: floating;
    animation-duration: 3s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
}

.tmpl-webpage{display:none;}
.tmpl-webpage.show{display:block;}


/*.model-custom{position: fixed; top:0; right:0; bottom:0; left:0; opacity: 1; z-index: -3; display: flex; align-items: center; justify-content: center;
	transition: z-index 0.5s step-end, opacity 0.5s linear;
	-webkit-transition: z-index 0.5s step-end, opacity 0.5s linear;
	-moz-transition: z-index 0.5s step-end, opacity 0.5s linear;
	-o-transition: z-index 0.5s step-end, opacity 0.5s linear;
	-ms-transition: z-index 0.5s step-end, opacity 0.5s linear;
}
.model-custom.m-on{z-index: 9999 !important; opacity: 1;
	transition: z-index 0.5s step-start, opacity 0.5s linear;
	-webkit-transition: z-index 0.5s step-start, opacity 0.5s linear;
	-moz-transition: z-index 0.5s step-start, opacity 0.5s linear;
	-o-transition: z-index 0.5s step-start, opacity 0.5s linear;
	-ms-transition: z-index 0.5s step-start, opacity 0.5s linear;
}
.model-custom.m-off{z-index: -9999 !important; opacity: 0;
	
}
.model-custom .pre-model{position: fixed; top:0; right:0; bottom:0; left:0; background: rgba(0,0,0,0.5); opacity: 0; z-index: -1;
	transition:0.5s opacity;
	-webkit-transition:0.5s opacity;
	-moz-transition:0.5s opacity;
	-o-transition:0.5s opacity;
	-ms-transition:0.5s opacity;
}
.model-custom.m-on .pre-model{z-index: 1;opacity:1;}*/
.auto-pop{display: none;}
.mag-model{display:none; width: 96%; max-width: 1170px; margin: 0 auto;}
.mfp-container .mag-model{display: block;}
.mag-model .inbox{width: 100%; height: auto; position: relative; z-index: 2; overflow: hidden; background-color: #FFF; border-radius: 8px; max-width: 100%;
/*-webkit-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.5);
-moz-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.5);
box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.5);*/
}
.mag-header{padding: 10px 20px; font-size: 1.5em; color:#888;
/*-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.1);
-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.1);
box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.1);*/
}
.mag-model .btn-close{width: 36px; height: 36px; font-size: 1.5em; line-height: 0; background: #FFF; position: absolute; right:10px; top:7px; color:#BBB; border: 2px #BBB solid; border-radius: 50%; cursor: pointer; display:flex; align-items: center; justify-content: center;
/*	transition:0.5s all;
	-webkit-transition:0.5s all;
	-moz-transition:0.5s all;
	-o-transition:0.5s all;
	-ms-transition:0.5s all;*/
}

.mag-model .btn-close+.mag-header{padding-right: 40px;}

.mag-model .btn-close:hover{color:#666; border-color: #666;}
.mag-body{height:auto; /*max-height: 90%;*/ overflow-y: auto; padding: 20px;}



/*comming*/
.comming{margin-top: 4rem;}
.comming.row-flex-wrap{ justify-content: center; align-items: center;}

.back-top{display: block; width: 117px; height: 174px; text-align: center;border-radius: 50%;  margin: auto; position: fixed; right:10px; bottom: 10px; opacity: 0; transform: translateY(174px); font-size: 0.8rem; line-height: 1em; padding-top: 0.8em; z-index: 1;}
/*.back-top:after {
	top: 95%;
	left: 50%;
	border: solid transparent;
	content: "";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: #1ca5ad transparent transparent;
	border-top-color: #1ca5ad;
	border-width: 10px;
	margin-left: -10px;
}*/
.back-top.open{opacity: 1; transform: translateY(0);}

.back-top:hover{color:#FFF; text-decoration: none;}


.back-top.fire{
/*-webkit-transform: translateY(-2000px);
-moz-transform: translateY(-2000px);
-o-transform: translateY(-2000px);
transform: translateY(-2000px);*/
	bottom:150vh;
	-webkit-transition: 300ms bottom !important;
    -moz-transition: 300ms bottom !important;
    -o-transition: 300ms bottom !important;
    -ms-transition: 300ms bottom !important;
}

/*Animeations*/
@keyframes floating {
    from { transform: translateY(0);}
    65%  { transform: translateY(30px); }
    to   { transform: translateY(0); }    
}

.mfp-bg{position: fixed !important;top:0; right:0;bottom:0; left: 0; width: auto; height: auto !important;}
.mfp-container{overflow: hidden;top:0; right:0;bottom:0; left: 0; max-width: 100vw; max-height: 100vh;}
img.mfp-img{max-height: 100vh !important;}
.mfp-3d-unfold .mfp-content {
    perspective: 2000px; 
  }
  
.mfp-3d-unfold .mfp-with-anim {
    opacity: 0;
    transition: all 0.3s ease-in-out;
    transform-style: preserve-3d;
    transform: rotateY(-60deg);
  }
  
/*.mfp-3d-unfold.mfp-ready .mfp-with-anim , */
.mfp-3d-unfold.mfp-image-loaded .mfp-with-anim{
      opacity: 1;
      transform: rotateY(0deg);
    }

  /* animate out */
  .mfp-3d-unfold.mfp-removing .mfp-with-anim {
      transform: rotateY(60deg);
      opacity: 0;
    }

.mfp-3d-unfold.mfp-bg { opacity: 0;transition: all 0.5s; }
.mfp-3d-unfold.mfp-ready.mfp-bg {opacity: 0.8; }
.mfp-3d-unfold.mfp-removing.mfp-bg { opacity: 0; }
 




/*preloader*/
#preloader{
	background:#8fefff;
	/*height: 100%;
	width: 100%;*/
	position: fixed;
	z-index: 9999;
	margin: 0;
	top: 0; right:0; bottom:0; left:0;
}
#preloader-center{
	width: 100%;
	height: 100%;
	position: relative;
	}
#preloader-center-absolute {
	position: absolute;
	top: 0; right:0; bottom:0; left: 0; margin: auto;
	height: 32px; width:185px;
	display:flex; align-items: center;
}
#preloader .chip{
	width: 32px;
	border-radius: 50%;
	height: 32px;
	margin-right:5px;
	background-color: #c8d93b;
	-ms-transform: scale(0); 
   	-webkit-transform: scale(0);
    transform: scale(0);
	-webkit-animation: loader-animate 1s infinite;
	animation: loader-animate 1s infinite;
	/*float: left;*/
	}

#preloader .chip.ch10 {
	margin-right: 0px;
	}

#preloader .chip.ch10{
	background-color: #27bfca;
	-webkit-animation-delay: 0.9s;
    animation-delay: 0.9s;	
	}
#preloader .chip.ch9{
	background-color: #cf88c2;
	-webkit-animation-delay: 0.8s;
    animation-delay: 0.8s;	
	}	
#preloader .chip.ch8{
	background-color: #fc5e8f;
	-webkit-animation-delay: 0.7s;
    animation-delay: 0.7s;	
	}
#preloader .chip.ch7{
	background-color: #ffaa1e;
	-webkit-animation-delay: 0.6s;
    animation-delay: 0.6s;	
	}
#preloader .chip.ch6{
	background-color: #c8d93b;
	-webkit-animation-delay: 0.5s;
    animation-delay: 0.5s;	
	}
#preloader .chip.ch5{
	background-color: #27bfca;
	-webkit-animation-delay: 0.4s;
    animation-delay: 0.4s;
	}
#preloader .chip.ch4{
	background-color: #cf88c2;
	-webkit-animation-delay: 0.3s;
    animation-delay: 0.3s;		
	}
#preloader .chip.ch3{
	background-color: #fc5e8f;
	-webkit-animation-delay: 0.2s;
    animation-delay: 0.2s;	
	}
#preloader .chip.ch2{
	background-color: #ffaa1e;
	-webkit-animation-delay: 0.1s;
    animation-delay: 0.1s;
	}						


@-webkit-keyframes loader-animate {
  50% {
	-ms-transform: scale(1); 
   	-webkit-transform: scale(1);
    transform: scale(1);
	  /*height: 64px;
	  border-radius: 8px;*/
	  }
}

@keyframes loader-animate {
  50% {
	-ms-transform: scale(1); 
   	-webkit-transform: scale(1);
    transform: scale(1);
	  /*height: 64px;
	  border-radius: 8px;*/
	  }
}



/*responsive*/

@media (max-width: 1440px){ 
	/*.home-slider{padding-top: 42%;}*/
	
}

@media (min-width: 1281px){

}

@media (max-width: 1280px){ /*bootstrap xl*/
	.main-content{min-height: 600px;}
	/*.home-slider{padding-top: 46%;}*/
	.floating-character{bottom:0; right: 0;}
}
@media (max-width: 1080px){
	/*.home-slider{padding-top: 48%;}*/
	.home-slider-item{width: 100vw;}
	/*.home-slider .home-slider_item{ width: 970px; height: 485px; }*/
	.home-slider button.owl-next, .home-slider:hover button.owl-next{right:5px;opacity: 1}
	.home-slider button.owl-prev, .home-slider:hover button.owl-prev{left:5px;opacity: 1}
	
}

@media (max-width: 992px){ /*bootstrap lg*/
	
	.row-flex>.col-lg-1>div, .row-flex>.col-lg-2>div, .row-flex>.col-lg-3>div, .row-flex>.col-lg-4>div, .row-flex>.col-lg-5>div, .row-flex>.col-lg-6>div, .row-flex>.col-lg-7>div, .row-flex>.col-lg-8>div, .row-flex>.col-lg-9>div, .row-flex>.col-lg-10>div, .row-flex>.col-lg-11>div, .row-flex>.col-lg-12>div{
		height: auto; margin-bottom: 1rem;
	}
	
	#mobile-menu{display:block;}
	#top-menu, #top-menu.fixed{position: fixed; top: 70px; left: 0; right: 0; max-height: calc(100vh - 146px); overflow-y: auto; z-index: 6; height: auto !important;}
	#top-menu .navbar{display:none; background-color:transparent; z-index: 6;}
	#top-menu .navbar, #top-menu.fixed .navbar{ flex-direction: column; flex-wrap: wrap; height: auto;}
	#top-menu .navbar li{ width: 100%; margin: 0; border-radius: 0;}
	#top-menu .navbar>li>a, #top-menu.fixed .navbar>li>a, #top-menu .navbar>li>a>.fa, #top-menu.fixed .navbar>li>a>.fa{line-height: 64px; border-radius: 0;}
	#top-menu .navbar>li>.sub{ position:relative;top:0; /*display:none;*/ }
	#top-menu .navbar>li>.sub>li>a{height: 0; text-align: center;}
	#top-menu .navbar>li>.sub.open>li>a{height: 40px;}
	.menu-hide{display: inline-block !important;}
	.lang-switchs-pc{display:none;}

	/*.home-slider{padding-top: 50%;}
	.home-slider .home-slider_item{ width: 970px !important; height: 485px !important; }*/
	
	.main-content{padding-bottom: 20px;}
	.book-wrapper .book-cover{max-width: 240px;}
	.floating-character{max-width: 180px; bottom:-2%; right: 0;}
	.back-top{right:0;}
}

@media (max-width: 800px){ /*desktops min*/
}

@media (max-width: 768px){ /*tablet*/
	body{overflow-x: hidden;}
	html{font-size: 16px;}
	body{background-size:auto; background-attachment: fixed; line-height: 1.5em}
	#top{height: 120px;}
	
	.h1, h1{ font-size: 1.5rem;}
	.h4, h4{ font-size: 1rem;}
	.h5, h5{ font-size: 1rem;}
	
	.row-flex>.col-lg-1>div, .row-flex>.col-lg-2>div, .row-flex>.col-lg-3>div, .row-flex>.col-lg-4>div, .row-flex>.col-lg-5>div, .row-flex>.col-lg-6>div, .row-flex>.col-lg-7>div, .row-flex>.col-lg-8>div, .row-flex>.col-lg-9>div, .row-flex>.col-lg-10>div, .row-flex>.col-lg-11>div, .row-flex>.col-lg-12>div,
.row-flex>.col-md-1>div, .row-flex>.col-md-2>div, .row-flex>.col-md-3>div, .row-flex>.col-md-4>div, .row-flex>.col-md-5>div, .row-flex>.col-md-6>div, .row-flex>.col-md-7>div, .row-flex>.col-md-8>div, .row-flex>.col-md-9>div, .row-flex>.col-md-10>div, .row-flex>.col-md-11>div, .row-flex>.col-md-12>div{
	height: auto; margin-bottom: 1rem;
}
	
	html[lang=en-GB] .navbar>li>a{font-size: 1rem;}
	html[lang=en-GB] .navbar>li>a>.fa{font-size: 1,5rem; margin-right: 10px;}
	html[lang=en-GB] .navbar>li>.sub>li>a{font-size: 1rem;}
	
	.home-slider .owl-nav{width:750px;}
	/*.home-slider .home-slider_item{width: 750px; height:375px;}*/
	
	.page-header h1{padding-bottom: 1.5rem;}
	.page-header h1:after{height: 5px; border-radius: 5px;}
	
	/*main.main-content{ margin-top: 0;}*/
	.main-content{padding-bottom: 0;}
	.list-round-img .list-round-img-item{ width: 200px;}
	
	.block-school .row-flex>.col{ min-width: 50%; flex-shrink: 0; flex-grow: 0;}
	
	.book-wrapper{display:block; }
	.book-wrapper .book-cover{max-width: 200px; float: left;}
	.book-wrapper .book-intro{padding-left: 0;}
	.book-wrapper .book-intro .book-title, .book-wrapper .book-intro blockquote{margin-left: 220px}
	.book-wrapper.reverse .book-cover{float: right;}
	.book-wrapper.reverse .book-intro{padding-right: 0;}
	.book-wrapper.reverse .book-intro .book-title, .book-wrapper.reverse .book-intro blockquote{margin-left: 0; margin-right: 220px}
	
	.event-photo-list .list-group-item .cover{height: 240px;}
	.comming.row-flex-wrap h1{font-size: 2rem;}
	
	form#contact_form{max-width: 495px; margin: 2rem auto 0}
	
	#page-footer{height: 175px;}

}

@media (max-width: 736px){ /*iPhone 8+ landscape*/
	.home-slider .owl-nav{width:100%;}
	/*.home-slider .home-slider_item{width: 700px; height:350px;}*/

}

@media (max-width: 667px){ /*iPhone 8 landscape*/

	/*.home-slider .home-slider_item{width: 630px; height:315px;}*/
}

@media (max-width: 568px){ /*iPhone 5 landscape*/ 
	/*html{font-size: 14px;}*/
	body{ /*width: 98%; margin: 1% auto; padding-top: 60px*/}
	#top{height: 60px;}
	
	.h2, h2{ font-size: 1.25rem;}
	.h3, h3{ font-size: 1rem;}
	
	.container{width:  100%;}
	
	.row-flex>.col-lg-1>div, .row-flex>.col-lg-2>div, .row-flex>.col-lg-3>div, .row-flex>.col-lg-4>div, .row-flex>.col-lg-5>div, .row-flex>.col-lg-6>div, .row-flex>.col-lg-7>div, .row-flex>.col-lg-8>div, .row-flex>.col-lg-9>div, .row-flex>.col-lg-10>div, .row-flex>.col-lg-11>div, .row-flex>.col-lg-12>div,
.row-flex>.col-md-1>div, .row-flex>.col-md-2>div, .row-flex>.col-md-3>div, .row-flex>.col-md-4>div, .row-flex>.col-md-5>div, .row-flex>.col-md-6>div, .row-flex>.col-md-7>div, .row-flex>.col-md-8>div, .row-flex>.col-md-9>div, .row-flex>.col-md-10>div, .row-flex>.col-md-11>div, .row-flex>.col-md-12>div,
.row-flex>.col-sm-1>div, .row-flex>.col-sm-2>div, .row-flex>.col-sm-3>div, .row-flex>.col-sm-4>div, .row-flex>.col-sm-5>div, .row-flex>.col-sm-6>div, .row-flex>.col-sm-7>div, .row-flex>.col-sm-8>div, .row-flex>.col-sm-9>div, .row-flex>.col-sm-10>div, .row-flex>.col-sm-11>div, .row-flex>.col-sm-12>div{
	height: auto; margin-bottom: 1rem;
}
	
.table{display:block; }
.table>.row, .table>.list-group-item__row{display:block; }
.table>.row:before, .table>.row:after, .table>.list-group-item__row:before, .table>.list-group-item__row:after{ display:table;}
.table>.row>div, .table>.list-group-item__row>div{ display:blocl; float: left;}
	
	header.page-top{height: 60px;}
.header-banner, header.page-top.fixed .header-banner{ padding: 0; height: 60px;}
.header-banner .logo img{max-height: 60px;}
.header-banner .logo, .header-banner.fixed .logo { width: 80px; height: 60px; }
.header-banner h1, header.page-top.fixed .header-banner h1{width: 47%;}
	
	.home-slider .home-slider_item{width: 530px; height:265px;}
	.home-slider .owl-nav button.owl-next, .home-slider .owl-nav button.owl-prev{ width: 32px;height: 32px;font-size: 24px;}
	/*.home-slider button.owl-next{right:-32px;}
	.home-slider button.owl-prev{left:-32px;}*/
	.main-content{padding-bottom: 0; min-height: 0;}
	
	main.main-content .container-fullw{padding: 10px 0;}
	
	.page-header h1:after{width: 100%;}
	.page-header .desc{ max-width: 100%;}
	
	.block-school .row-flex>.col{ min-width: 100%; flex-shrink: 0; flex-grow: 0;}
	
	.book-wrapper{display:flex; flex-wrap: wrap; flex-direction:column }
	.book-wrapper .book-cover, .book-wrapper.reverse .book-cover{max-width: 90%; float: none; margin: 0 auto;}
	.book-wrapper .book-intro{}
	.book-wrapper .book-intro .book-title, .book-wrapper .book-intro blockquote, .book-wrapper.reverse .book-intro .book-title, .book-wrapper.reverse .book-intro blockquote{margin-left: 0; margin-right: 0; margin-top: 2rem}
	.book-wrapper .book-intro blockquote:before, .book-wrapper.reverse .book-intro blockquote:before, .praise-list .list-group-item blockquote:before{ content: ""; position: absolute; height: 0; width: 0;  border-top: none; border-right: 1rem solid transparent; border-bottom: 1rem solid #f8f9d5; border-left: 1rem solid transparent;
    top: -1rem; right:40%; bottom:auto; left: 40%; }
	.praise-list .list-group-item blockquote:before{right:auto; left:10%;}
	.book-wrapper .action-group .btn{margin-right: 0; width: 100%;}
	
	.blog-list .thumb{max-height: none;}
	
	.comming.row-flex-wrap img{max-width: 300px; margin: auto;}
	.comming.row-flex-wrap h1{font-size: 2.5rem;}
	
	.floating-character{animation-name:none;}
	.floating-character img{display:none;}
	.floating-character .back-top{transform: translateY(0) !important; position: relative; left: 0;top: -15px;}
	.floating-character .back-top:after{ border-color: transparent transparent #1ca5ad transparent; top:-18px; }
	
	.text-list .list-item>a{ flex-direction: column;}
	
}

@media (max-width: 480px){ /*Android*/
	header.page-top .header-banner h1, header.page-top.fixed .header-banner h1{font-size: 12px;}
	.home-slider .home-slider_item{width: 450px; height:275px;}
	a.feature_icon{width: 160px; height: 160px;}
	.feature_icon .fa, .feature_icon .fas{font-size: 64px;}
	
}
@media (max-width: 414px){ /*iPhone 8+*/
	.home-slider .home-slider_item{width: 380px; height:190px;}
	
}

@media (max-width: 375px){ /*iPhone 8*/
	.home-slider .home-slider_item{width: 340px; height:170px;}
	a.feature_icon{width: 130px; height: 130px; font-size: 1rem;}
}

@media (max-width: 320px){ /*iPhone 5*/
	.home-slider .home-slider_item{width: 290px; height:145px;}
}