* { margin:0; padding:0; box-sizing:border-box; -webkit-box-sizing:border-box; -webkit-appearance:none;}
body { font-family: 'Open Sans', sans-serif; font-size:16px; line-height:30px; color:#000; background: url(../images/bg-pattern.jpg) left top repeat; }
h1, h2, h3, h4, h5, h6, h7 { line-height:120%; padding:5px 0 0 0; font-weight:300; margin-bottom:20px; color:#761717; /* font-family: 'Montserrat', sans-serif; */ font-family: 'Sansita Swashed', cursive; }
h1.flat, h2.flat, h3.flat, h4.flat, h5.flat, h6.flat, h7.flat { margin-bottom: 0;}
.space-line {  width:100px; height:4px; background-color:#f00; display:inline-block; margin:10px 0 15px 0;}
h1 { font-size:54px; padding-bottom:10px;}
h1.clear { margin: 0; padding: 0; line-height: 60px;}
h2 { font-size:52px;}
h3 { font-size:42px;}
h4 { font-size:34px;}
h5 { font-size:26px;}
h6 { font-size:20px;}
.big-text { font-size: 34px;}
.clear-float { clear:both;}
a { text-decoration:none; color:inherit; transition:all ease-in-out 0.3s; -webkit-transition:all ease-in-out 0.3s;}
p, blockquote { margin-bottom:10px;}
.text-links { color:#4285f4;}
.text-links:hover { color:#f00;}
.box-links { background-color:#dd1c1c; color:#fff; display:inline-block; padding:5px 15px; word-break: break-word; }
img { max-width:100%; margin:0; padding:0; font-size:0; display:block;}
img.center { margin: 0 auto;}
.full-img { width: 100%; }
.text-center { text-align: center; justify-content: center; }
.text-right { text-align: right; justify-content: flex-end; }
.text-left { text-align:left; justify-content: flex-start; }
.box-this { padding: 20px; border:solid 1px #777; margin-bottom: 10px; display:inline-block; }
.no-break, .no-break-mob { white-space: nowrap; }
.hidden { display:none; }
ol {}
ul { margin: 0 0 20px 0; padding: 0; list-style: none;}
ul li { padding-left: 25px; position: relative;}
ul li:before { content: "\f0a4"; font-family: FontAwesome; font-size: 13px; color: #5d2e1b; position: absolute; left: 0; top: 0px;}
ul.clear li { padding-left: 0;}
ul.clear li:before { display: none;}
.spl-text { color: #f00; }
.text-30 { font-size: 30px; line-height: 42px; font-weight: 400; }
.sep-line { width:120px; height: 1px; margin: 20px 0; background-color: rgb(0 0 0 / 50%); display:block; }
blockquote { position:relative; font-style: italic; }
blockquote:before, blockquote:after {content:"\f10d"; font-size: 30px; margin-right: 5px; color: rgb(0 0 0 / 10%); font-family: fontAwesome;}
blockquote:after { content:"\f10e"; }
.img-block { background-repeat: no-repeat; background-size: cover; background-position: center center;}
.header-space { height: 150px; display:block }
.full-screen { width:100%; height: 100vh; }

/* menu */
header { position:absolute; width:100%; z-index:999; }
header.relative { position: relative; overflow: hidden; }
header.dark { background: linear-gradient(180deg, rgb(0 0 0 / 70%), rgb(0 0 0 / 00%)); }
.main-menu-icon { width: 40px; height: 40px; line-height:40px; text-align:center; color:#51575f; background-color:#fff; position: absolute; left: -50px; top: 20px; z-index: 1000; display: block; border-radius:50%; -webkit-border-radius:50%;}
.main-menu-icon:after { content:"\f0c9"; font-family:FontAwesome; font-size:18px;}
.main-menu-icon.active:after { content:"\f00d";}
.main-link-ul { font-size: 0; line-height:0; margin:0px 0 0 0; padding: 0; text-align:center; transition:all ease-in-out 0.3s; -webkit-transition:all ease-in-out 0.3s; overflow:hidden;}
.main-link-ul li { position: relative; display: block; margin:0; font-size: 16px; padding: 0; background: none; vertical-align:text-bottom;}
.main-link { font-size:15px; font-weight:700; line-height: 60px; padding: 0 10px 0px 30px; text-align: left; color: #fff; position:relative; display:block; transition: all ease-in 0.2s; -webkit-transition: all ease-in 0.2s; position:relative; }
.main-link:hover, .main-link.active { color:#000; background-color:#b4cc1d; }
.sub-link-ul { position: relative; background-color:#234997; box-sizing: border-box; -webkit-box-sizing: border-box; display:none;}
.main-link-ul li:first-child .sub-link-ul { display:block;}
.sub-link-ul li { float: none; margin: 0; display: block; }
.sub-link { width: 100%; line-height: 21px; text-align: left; color: #fff; margin: 0; display: block; font-size:14px; padding:10px 20px 10px 35px; box-sizing:border-box; -webkit-box-sizing:border-box;}
.sub-link:hover, .sub-link.active { background-color: #162d5d; }
.main-link-ul li .sub-link-ul li:last-child { margin-bottom: 00px; }
.menu-wrapper { overflow:auto; height: 100%; }
.main-menu { width: 300px; margin:0px auto 0 auto; text-align: center; position:fixed; right:0; top:0; background-color: rgba(0,0,0,0.5); transform:translateX(0%); -webkit-transform:translateX(0%); transition:all ease-out 0.3s; -webkit-transition:all ease-out 0.3s; z-index:9999; height: 100%; }
.main-menu.hide { transform:translateX(100%); -webkit-transform:translateX(100%);}
/* menu end */

.news-block { background: linear-gradient(334deg, #f3f3f3, #d9d9d9, #fff, #ddd); box-shadow: 5px 5px 10px rgb(0 0 0 / 50%); overflow: hidden;  border-width: 10px; border-style: solid; margin-bottom: 50px; padding:0px 0; animation: borderrotate 6s infinite linear; }
.news-block.dark { background: #5b7531; color:#fff; }
.news-block.dark * { color : #fff; }
.news-block.spl { background: linear-gradient(10deg, #fceb8e 0%, #fcc3d1 33%, #ffeebf 66%, #f5ff8f 100%); animation: borderrotategold 6s infinite linear; }
.news-block.spl h1, .news-block.spl h2, .news-block.spl h3, .news-block.spl h4, .news-block.spl h5 { color: #c0392b; }
.news-block.rose { background: linear-gradient(10deg, #ffedef, #e7c5cb, #fff3f4, #ffe2e4); animation: borderrotaterose 6s infinite linear;}
.news-block.rose h1, .news-block.rose h2, .news-block.rose h3, .news-block.rose h4, .news-block.rose h5 { color: #a72144; }

.news-block.blue { background: linear-gradient(10deg, #edffff, #c5dde7, #f3fcff, #e2f6ff); animation: borderrotateblue 6s infinite linear;}
.news-block.blue h1, .news-block.blue h2, .news-block.blue h3, .news-block.blue h4, .news-block.blue h5 { color: #1095d7; }

.news-block.green { background: linear-gradient(10deg, #edffee, #c5e7c5, #f3fff3, #e7ffe2); animation: borderrotategreen 6s infinite linear;}
.news-block.green h1, .news-block.green h2, .news-block.green h3, .news-block.green h4, .news-block.green h5 { color: #008f13; }

.news-block.special { position: relative; overflow: visible; }
.news-block.special:before { content:""; width: 50%; aspect-ratio:4/3; background: url(../images/corner-rt.png) left top no-repeat; background-size: contain; position: absolute; right: 0; top: 0; transform: translate(9%, -12%); z-index: 10; pointer-events: none; }
.news-block.special:after { content:""; width: 50%; aspect-ratio:4/3; background: url(../images/corner-lb.png) left top no-repeat; background-size: contain; position: absolute; left: 0; bottom: 0; transform: translate(-11%, 24%); z-index: 10; pointer-events: none; }

@keyframes borderrotate {
	0% { border-image: linear-gradient(0deg, #fff, #a5a5a5, #fff, #a5a5a5) 20; }
	50% { border-image: linear-gradient(180deg, #fff, #a5a5a5, #fff, #a5a5a5) 20; }
	100% { border-image: linear-gradient(360deg, #fff, #a5a5a5, #fff, #a5a5a5) 20; }
}
@keyframes borderrotategold {
	0% { border-image: linear-gradient(0deg, #fff79a, #B0801A, #D0AA2F, #fff79a, #dda42c, #B0801A) 20; }
	50% { border-image: linear-gradient(180deg, #fff79a, #B0801A, #D0AA2F, #fff79a, #dda42c, #B0801A) 20; }
	100% { border-image: linear-gradient(360deg, #fff79a, #B0801A, #D0AA2F, #fff79a, #dda42c, #B0801A) 20; }
}
@keyframes borderrotaterose {
	0% { border-image: linear-gradient(0deg, #e5acb3, #c05e6e, #f4dddf, #e38f95) 20; }
	50% { border-image: linear-gradient(180deg, #e5acb3, #c05e6e, #f4dddf, #e38f95) 20; }
	100% { border-image: linear-gradient(360deg, #e5acb3, #c05e6e, #f4dddf, #e38f95) 20; }
}
@keyframes borderrotateblue {
	0% { border-image: linear-gradient(0deg, #acdae5, #5ea9c0, #ddf0f4, #8fc4e3) 20; }
	50% { border-image: linear-gradient(180deg, #acdae5, #5ea9c0, #ddf0f4, #8fc4e3) 20; }
	100% { border-image: linear-gradient(360deg, #acdae5, #5ea9c0, #ddf0f4, #8fc4e3) 20; }
}
@keyframes borderrotategreen {
	0% { border-image: linear-gradient(0deg, #ade5ac, #41b93a, #e2f4dd, #4ecb4c) 20; }
	50% { border-image: linear-gradient(180deg, #ade5ac, #41b93a, #e2f4dd, #4ecb4c) 20; }
	100% { border-image: linear-gradient(360deg, #ade5ac, #41b93a, #e2f4dd, #4ecb4c) 20; }
}

section {position:relative; word-wrap: break-word; }
.wrapper-1000 { width:1000px; margin:0 auto; position:relative;}
.wrapper-1200 { width:1200px; margin:0 auto; position:relative;}
.wrapper-90p { width:95%; margin:0 auto; }
.flex-box, .mob-flex-box { display: flex; align-items: center; justify-content: center; }
.flex-content-top { align-items: flex-start;}
.flex-grow { flex-grow: 1;}
.flex-box.reverse, .mob-flex-box.reverse { flex-direction: row-reverse; }
.flex-2 { width:50%; position: relative; }
.flex-3 { width:33.33%; position: relative; }
.flex-gutter { width:5%;}
.extra-padding { padding:8% 10%;}
.extra-padding-rl { padding: 0 10%; }
.extra-padding-tb { padding: 10% 0; }
.mid-padding { padding:4% 5%;}
.mid-padding-rl { padding:0% 5%;}
.mid-padding-tb { padding:5% 0;}
.low-padding { padding:2% 3%;}
.padding-bottom-0 { padding-bottom:0;}
.padding-top-0 { padding-top: 0; }
.fix-padding-20 { padding:20px;}
.fix-padding-20-tb { padding:20px 0;}
.padding-top-20 { padding-top:20px;}
.fix-padding-10 { padding:10px;}
iframe { display: block; }

.grey-box { background-color:#5d2e1b; background: linear-gradient(234deg, #fbcf72, #ffec8d, #ffc956);}
.grey-box ul li:before { color:#fff;}
.space-after {margin-bottom:50px;}
.space-after-30 {margin-bottom:30px;}
.dark-box { background-color: #3e3e35; background: linear-gradient(-15deg, #fbcf72, #ffec8d, #ffc956); /* border-image: linear-gradient(158deg, #B0801A, #D0AA2F, #FFE065, #dda42c, #B0801A) 20; */ animation: borderrotategold 6s infinite linear; }
.light-grey-box { background-color: #cfcfc4; }


/* sliders */
.owl-dots { text-align:center; position: absolute; right:0; bottom:0; padding: 5px 10px; background-color: rgb(255 255 255 / 50%); }
.text-slider .owl-dots:before {content:"pages :"; font-size: 13px; margin-right: 7px;}
.owl-dots .owl-dot span { width: 40px; line-height: 35px; background-color: rgb(0 0 0 / 40%); display: block; margin: 0 5px; transition: all ease-out 0.3s; }
.owl-dots .owl-dot.active span { background-color: #5d2e1b; color:#fff; }

.image-slider .owl-dots .owl-dot span { width: 10px; height:10px; margin: 0 5px; }
.owl-dots .owl-dot.active span { background-color: #dd1c1c;}
/* sliders end */

.full-screen {overflow: hidden;}
.cover-pic-box { display:flex; justify-content: flex-end; }
#bg-video { min-width:70%; min-height: 70%; width: 70%; position:absolute; right:0; bottom:0; }
.intro { overflow: hidden; display:flex; flex-direction: column; align-items: flex-end; height: 100%; width: 100%; }
.intro .tai-maa { background:url(../images/tai-maa.jpg) center center no-repeat; background-color: #fff; background-size: cover; height: 100vh; width: 100%; margin: 0 auto; }
.intro .tai-maa.right { background-position: right top;}
.intro .tai-maa.left { background-position: left top; }
/* .intro.tai-maa.center { background-position: center top;} */ 
.intro h1 strong { position: absolute; right:3%; padding: 20px; bottom:5%; color:#000; text-shadow: none; font-size: 30px; /*background-color: rgb(0 0 0 /50%);  right: 5%; text-align: right; */ line-height: 40px; font-weight: normal; background: linear-gradient(202deg, rgb(203 159 66/ 1), rgb(229 192 71/ 1), rgb(255 224 101/ 1), rgb(245 199 103/ 1), rgb(195 147 46/ 1)); border-radius: 20px; }
.intro h1 strong.feb-2024 { bottom: 50%;}
.intro h1 strong.left { left:3%; right: auto; }
.cover-pic { max-height: 700px; }
.intro * { color:#fff; text-shadow: 3px 3px 5px rgb(0 0 0 / 80%); }
.info-intro { position:relative; z-index: 99;}
.logo { width: 250px; position:absolute; margin:20px 10px 10px 20px; display: block;}
.logo.right { right: 50px;}
header.relative .logo { position: relative; right: 0; left: 0;}
.quote-box { position:relative; }
.quote-box:before { content:"\f10d"; font-family:fontAwesome; font-size:50px; line-height: 100%; color:rgb(0 0 0 / 10%); margin-right: 10px;}

footer { text-align: center;}

/* dec 2021 */
.cake-img { }
.schedule-box { justify-content: flex-start; align-items: flex-start; }
.schedule-date { }

/* feb 2022 */
/*.timeline-wrapper { text-align: center;}
.timeline-carousel .item { position:relative; width: 80%; margin: 0 auto; font-size: 25px; line-height: 40px; padding:30px 30px; margin-top:30px; background-color:#06F; color:#fff; border-radius:30px; background-image: linear-gradient(#06F, #003bd1); box-shadow: 5px 5px 10px rgb(0 0 0 / 30%); }
.timeline-carousel .item:after { content:"▲"; font-size: 60px; color:#06F; position:absolute; left: 50%; transform:translateX(-50%); top: -30px;}
.custom-owl-dots { }
.custom-owl-dots .item { font-size: 30px; font-weight: bold; text-align: center; background-color: #D0D0D0; padding:20px 10px; cursor: pointer; }
.custom-owl-dots .owl-item.center .item { background-color:#06F; color: #fff; }
.custom-owl-dots .owl-item { }*/
/* .owl-stage { display: flex; align-items: center;}*/
.timeline-box { width:80%; background-color: #0B7596; color:#fff; padding:10px 0px 10px 10px; position: relative; display:flex; align-items: center; margin: 20px 0;}
.timeline-year { font-size: 30px; font-weight: bold; transform: rotate(-90deg); transform-origin: center center; padding: 20px 0; }
.timeline-text { width: 100%; background-color: #fff; color: #000; padding: 30px 60px 30px 30px; border-radius: 50px 0px 0px 50px; } 
.timeline-text:after { content: ""; width: 40px; height: 40px; padding: 10px; border-radius: 50%; background: url(../images/logo-icon-large.png) center center no-repeat #234997; background-size: contain; display: block; position: absolute; right: 0; top: 50%; transform: translate(40%, -50%); border: solid 7px #ffffff; box-shadow: 0px 0px 10px rgb(0 0 0 / 40%); }

.timeline-box.right { margin: 10px 0 10px auto; padding:10px 10px 10px 0; }
.timeline-box.right .timeline-text { padding: 30px 30px 30px 60px; border-radius:0 50px 50px 0;  }
.timeline-box.right .timeline-text:after { left: 0; transform: translate(-40%, -50%); }

.small-height .flex-2:nth-child(2) { overflow: auto; }
.hidden-title { font-size: 0; line-height: 0; margin: 0; padding: 0; }
.cover-video iframe { height: 560px; }
.left-border-box { padding-left: 20px; border-left: solid 5px rgb(0 0 0 / 7%); }

/*.porm-box { position: absolute; width: 75%; height: 84%; padding: 20px; left: 50%; top: 50%; transform: translate(-50%, -50%); text-align: center; overflow: auto;}*/
.poem-bg-1 { background: url("../images/bg-1.png") center top no-repeat, url("../images/bg-3.png") center bottom no-repeat, url("../images/bg-2.png") center top repeat-y; background-size: contain; padding: 7% 10%; text-align: center; margin-bottom: 20px; }


@media screen and (max-height:760px){
	.cover-pic { max-height: 620px;}
}
@media screen and (max-height:700px){
	.cover-pic { max-height: 560px;}
}

@media screen and (max-width:1300px){
	.extra-padding { padding:4% 5%;}
	.extra-padding-rl { padding: 0 5%; }
	.extra-padding-tb { padding: 5% 0; }
	.wrapper-1200 { width:96%;}
}

@media screen and (max-width:1000px){
	.flex-box { display:block;}
	.flex-2, .flex-3 { width:100%; }
	#bg-video { width:100%; min-height:0; }
	.cover-pic { max-width:80%; margin: 100px auto 0px auto; }
	.cover-pic-box { border-bottom:solid 5px #fff; margin-bottom: 30px;}
	h1 { font-size:45px; }
	h2 { font-size:42px; }
	h3 { font-size:36px; }
	h4 { font-size:30px; }
	.wrapper-1000, 	.wrapper-1200, 	.wrapper-90p { width:96%;}
	.space-after {margin-bottom:20px;}
	.space-after-30 {margin-bottom:10px;}
	
	.no-break { white-space:normal; }
	.mob-break { display: block; }
	
	.owl-dots { position: relative; }
	
	.extra-padding { padding:10% 2%;}
	.extra-padding-rl { padding: 0 2%; }
	.extra-padding-tb { padding: 10% 0; }
	.mid-padding { padding:8% 7%;}
	.mid-padding-rl { padding:0% 7%;}
	.mid-padding-tb { padding:8% 0;}
	.low-padding { padding:5% 6%;}
	.padding-bottom-0 { padding-bottom:0;}
	.padding-top-0 { padding-top: 0; }
	
	.owl-dots .owl-dot span { width: 25px; }
	.box-this { width:100%;}
	.logo { width: 200px; position: relative; transform: none; left:0; }
	.intro .tai-maa { height: 400px; }
	
	.intro h1 {width: 100%; background-color:rgb(255 255 255 / 70%); margin: 0; padding: 0; }
	.intro h1 strong { position: relative; border-radius: 0; font-size: 20px; background-color: #fff; text-align: center; width: 100%; display: block; padding: 5px 20px; right: 0; line-height: 30px; }
	.news-block { box-shadow: none;}
	
	header { position:relative; background-color: rgb(255 255 255 / 50%); overflow: hidden;}
	
	/*.timeline-carousel { font-size: 20px; line-height: 30px; padding:20px 20px; margin-bottom:30px; border-radius:20px; }
	.timeline-carousel:after { 50px; bottom: -20px;}*/
	
	section { overflow: hidden; }
	
	.timeline-box { width:90%; }
	.timeline-text, .timeline-box.right .timeline-text { line-height: 140%; padding: 25px 50px 25px 25px; }
	.timeline-box.right .timeline-text { padding: 25px 25px 25px 50px; }
	.timeline-text:after { width:30px; height: 30px;}
	.timeline-year { font-size : 18px; transform: rotate(-90deg) scale(1.7);}
	
	.mob-padding-bottom-0 { padding-bottom:0;}
	.mob-padding-top-0 { padding-top: 0; }
	
	.full-screen { height: 49vh; }
	.image-slider .owl-dots .owl-dot span { width: 7px; height: 7px; margin: 0 3px; }
	
	
}
@media screen and (max-width:720px){
.cover-video iframe { height: 250px; }
.news-block.special:before { width: 80%; transform: translate(9%, -12%); }
.news-block.special:after { width: 80%; transform: translate(-11%, 24%); }
	.intro .tai-maa { background-position: 34% center;}
	iframe { height: 250px !important; }
	.intro .tai-maa { height: 220px; }
	.poem-bg-1 { padding: 15% 10%; margin-bottom: 20px; }
}