@font-face {
	font-family:'DFLi';
	src:url('DFLi.ttf');
	font-weight:bold;    
}

@font-face {
	font-family:'Microsoft JhengHei';
	src:url('Microsoft JhengHei.ttf');
	font-weight:normal;    
}

@font-face {
	font-family:'Microsoft JhengHei';
	src:url('Microsoft JhengHei Bold.ttf');
	font-weight:bold;
    
}
@import url('https://fonts.googleapis.com/css2?family=Lato&display=swap');
/*------------------------------------*\
    MAIN
\*------------------------------------*/
/* global box-sizing */
*,
*:after,
*:before {
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	-webkit-font-smoothing:antialiased;
	font-smoothing:antialiased;
	text-rendering:optimizeLegibility;
}

/* html element 62.5% font-size for REM use */
html {
	font-size:62.5%;
}
body {
	font-family:'DFLi', sans-serif;	
	color:#000;
	font-size:18px;
	line-height:26px;
	overflow-x: hidden;
	font-weight:500;
}
/* clear */
.clear:before,
.clear:after {
    content:' ';
    display:table;
}
.clear:after { clear:both;}

.clear {*zoom:1; clear:both;}

img {max-width:100%;	vertical-align:bottom;}

a {	color:#000;	text-decoration:none;}

a:hover {text-decoration:none; color:inherit;}

a:focus {outline:0;text-decoration:none;}

a:hover, a:active {	outline:0;}

input:focus, textarea:focus, button:focus {	outline:0;	border:0;}

ul,li,h1,h2,h3,h4 {list-style-type:none;margin:0;padding:0}

p:not(:last-child){margin-bottom:25px;}

p:last-child{margin-bottom:0px;}







/*------------------------------------*\
	        HEADER
\*------------------------------------*/

.top-header {
    position: absolute;
    width: 100%;
    background: linear-gradient(to bottom, rgb(255 255 255 / 90%), transparent);
    z-index: 9;
    padding: 10px 0 0 0;
}

.header .container {    position: relative;  }


.logo-side {     position: relative;    z-index: 9;  }

.lang a {display:inline-block; width:50px; height:50px; background:#69d3f3; color:#fff; border-radius:100%; line-height:50px; text-align:center;}
.lang a:hover {
    background: #3596f0;
}

.menu-bar {  position:relative; background:#32c3ef;  }

.nav_area > ul > li {    display: inline-block;    padding: 0 20px;   }



nav.nav_area {    padding-top: 10px;  padding-bottom:10px;  }

.nav_area ul li:last-child{padding-right:0; border-right:0;  }

.nav_area ul li a { color: #fff; font-size: 19px;  display: inline-block; }

ul.sub-menu {    position: absolute;  background:#3594ed;      z-index: 555;	text-align:left;	padding:10px 0;   }

ul.sub-menu li a{color:#fff; line-height:20px;  padding:3px 10px 7px 10px; font-size:15px; display:inline-block; text-transform:capitalize;   } 

ul.sub-menu li{	display:block;}

ul.sub-menu li a{width:90%;}

.header .lang span{color:#fff; }

ul.sub-menu li.menu-item-has-children {    position: relative;  }

ul.sub-menu li.menu-item-has-children .arrow{color:#fff;  padding-left: 0;  }

span.arrow  {  font-size:16px; color:#fff;   }
.menu-bar ul.menu {
    position: relative;
    z-index: 11;
}


.footer {
    padding: 30px 0 0 0;
    position: relative;
    background:url(../image/footer-bg.png) no-repeat center ;
	background-size:cover;
	color:#fff;
}

.footer i{color:#fff; padding-right:10px;}


.wrapper{position:relative;}

.footer span {font-size:20px; font-family:'Microsoft JhengHei'; line-height:30px;   font-weight:bold; display: inline-block;
    padding: 0 20px 0 0;}

a.btn {
    color: #fff;
    background: #4d97e6;
    padding: 5px 20px;
    font-size: 19px;
    font-weight: 500;
    margin: 10px 0;
    border: 2px solid #4d97e6;
    border-radius: 3px;
	    white-space: nowrap;
}

a.btn:hover {background:transparent; color: #4d97e6; }

.copyright  {    font-weight: 400;     font-size: 14px;   }

.bottom-footer {    border-top: 2px solid rgb(255 255 255 / 30%);    padding: 15px 0;    margin-top: 25px;  }


/*------------------------------------*\
	        MAIN
\*------------------------------------*/

.logo-slider .owl-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: calc(100% + 100px);
    display: flex;
    justify-content: space-between;
    left: -50px;
    margin:0;
    z-index: -1;
}

 .home-slider .owl-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
/*    width: calc(100% + 100px);*/
    display: flex;
    justify-content: space-between;
    left: -50px;
    margin:0;
    z-index: 2;
}

.logo-slider.owl-theme .owl-nav button, .home-slider.owl-theme .owl-nav button  {
    height: 40px;
    width: 40px;
    background: #999;
    color: #fff;
    border-radius: 100%;
    font-size: 27px;
}
/*
.lock {
    max-height: 960px;
    overflow: scroll;
}
*/
.home-slider .owl-nav {width:100%; max-width:90%; right:0; left:0; margin:0 auto;}
.home-slider.owl-theme .owl-nav button  { background: #36aafa;}

.logo-section {    background: #ebf6ff;     padding: 40px 0;  }
.logo-section .owl-carousel .owl-stage-outer img {    width: auto;  display:table; margin:0 auto;}

.ser-item h3 {
	font-size:20px; font-weight:bold; color:#fff; position:absolute; bottom:50px; text-align:center; width:100%; left:0;
}


.service-section .row .top-space {margin-top:80px;}
.ser-item {    position: relative;  }

.service-section .row {    flex-wrap: initial;       padding: 0 50px;  }

.service-section .row > * {
	padding:0;
    flex: 0 0 30%;
    max-width: 30%;
    margin-left: -47px;
}

.service-section .row > *:first-child{z-index:4;}
.service-section .row > *:nth-child(2){z-index:3;}
.service-section .row > *:nth-child(3){z-index:2;}
.service-section .row > *:last-child{z-index:1;}

/* h3.red {    -webkit-text-stroke-width: 1px;  -webkit-text-stroke-color: #cc0000; }
h3.orange {      -webkit-text-stroke-width: 1px;  -webkit-text-stroke-color: rgb(255, 115, 0); }
h3.green {      -webkit-text-stroke-width: 1px;  -webkit-text-stroke-color:  #009933; }
h3.purple {      -webkit-text-stroke-width: 1px;  -webkit-text-stroke-color: #660099;}
h3.black {      -webkit-text-stroke-width: 1px;  -webkit-text-stroke-color: black;} */




.widget {    background: #fff;    box-shadow: 0 0 5px #b1b1b1;  }


.widget-title {    padding: 0  10px 0 0;   }

.widget-title h3 {    width: 75%;  font-size: 26px;  color: #fff;  
    clip-path: polygon(0 0, 100% 0%, 82% 99%, 0% 100%);    background: #49c3fc;    padding: 5px 25px 5px 10px;  }
	
.news-widget 	.widget-title h3 {  background: #4d97e6;  }
.activity-widget 	.widget-title h3 {  background: #666ecd;  }
.video-widget 	.widget-title h3 {  background: #6fcf49;  }
.video-widget 	 {  background: #cceebf; margin-bottom:0px; }

.widget-title a {
    display: inline-block;
    background: #8c4ec3;
    color: #000;
    font-size: 16px;
    font-weight: bold;
    padding: 2px 5px;
    border: 1px solid #fff;
    border-radius: 4px;
}


.event-widget .widget-title a {    background: #bff1fc;  }
.news-widget .widget-title a {    background: #c0dffc;  }
.activity-widget .widget-title a {    background: #c7cbf5;  }
.video-widget .widget-title a {    background: #caf5c7;  }




.home-sidebar .fc-row.fc-widget-header tr {   background: #2da7db;    font-size: 10px;     color: #fff;  }
.home-sidebar .fc-content > * {    display: none;  }
.home-sidebar span.fc-day-number {    font-size: 12px;  }

.home-sidebar .fc-toolbar.fc-header-toolbar { background: transparent;  color: #7366c5;  padding: 0; margin: 0 0 5px 0;    font-size: 14px; }
.home-sidebar div#calendar {    background: #ebebeb;    padding: 10px 10px 0; }
.home-sidebar #calendar .fc-view-container {    background: #fff;  }

.home-sidebar .fc-unthemed th,.home-sidebar .fc-unthemed td,.home-sidebar .fc-unthemed thead,.home-sidebar .fc-unthemed tbody,.home-sidebar .fc-unthemed .fc-divider,.home-sidebar .fc-unthemed .fc-row,.home-sidebar .fc-unthemed .fc-content,.home-sidebar .fc-unthemed .fc-popover, .home-sidebar.fc-unthemed .fc-list-view,.home-sidebar .fc-unthemed .fc-list-heading td {
    border-color: #2da7db;
}

.home-sidebar .fc th,.home-sidebar .fc td {border-width:2px; text-align:center; }
.eve-item {    background: #f4f4f4; padding:3px 10px;  margin-bottom:8px; }
.eve-item:last-child{margin-bottom:0;}
.eve-item span.al-date {    background: #d0e0ff;    color: #000;    padding: 2px 5px; font-size:12px;    border-radius: 3px;    font-weight: bold;  }
.eve-item  .al-title{font-size:13px; font-weight:bold; }
.fc-toolbar h2 {color: #2da7db; font-size:22px;}



ul.news-list li {
    padding-bottom: 13px;
    border-bottom: 1px solid #ddd;
    margin-bottom: 13px;
	font-size:12px;
	line-height:14px;
}

span.date-box {
    background: #0472c7;
    display: block;
    text-align: center;
    color: #fff;
    padding: 2px 8px;
}

span.date-box b {    font-size: 15px;  }

ul.news-list > li > span { color: #0472c7; display:block; text-align:center;margin-right: 20px;}

ul.news-list li > b {font-size:14px;}

.act-right h4 {
    color: #666ecd;
}
.act-right {
    font-size: 14px;
    line-height: normal;
    padding-left: 15px;
    font-weight: bold;
}

.act-item:not(:last-child) {
    padding-bottom: 15px;
    border-bottom: 1px solid #ddd;
    margin-bottom: 15px;
}

.al-img img {
    transition: all .8s;
}
.al-img:hover img {
    transform: scale(1.2);
}
.al-img {
    overflow: hidden;
    height: 150px;
}

.act-item > div {
    min-width: 90px;
    max-width: 90px;
}


.service-inner {
  
    color: #fff;
    height: 100%;
    width: 100%;
    border: 2px solid #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    border-radius: 100%;
    overflow: hidden;
    padding: 15px;
}

.service-inner h2{font-size:28px;  text-align: center; padding-bottom:10px; }

.ser-hover {
    position: absolute;
    top: 45%;
    height: 250px;
    width: 250px;
    border-radius: 100%;
    padding: 10px;
    top:10%;
    visibility: hidden;
    transition: all .4s;
    opacity: 0;
}

.service-section .row > div:hover .ser-hover{
    visibility:visible; opacity:1;
}


.ser-hover:before {
    content: '';
    border-top: 12px solid transparent;
    border-bottom: 12px solid transparent;
    border-right: 30px solid #fa3821;
    display: block;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: -28px;
}

.ser-hover.hover1 {
    background: #fa3821;left: 85%;
}

.ser-hover.hover2 {
    top:-40%; background: rgb(255, 115, 0);left: 80%;height:600px; width:600px;
}

.ser-hover.hover2:before {border-right: 30px solid rgb(255, 115, 0);}

.ser-hover.hover3 {
    background: #01b050;left: 85%; height:400px; width:400px;
}

.ser-hover.hover3:before {border-right: 30px solid #01b050;}

.ser-hover.hover4 {
    background: #8a4eb8;left: 20%;
    width: 400px;
    height: 400px;
    top: 5%;
}



.ser-hover.hover4:before {border-right: 30px solid #8a4eb8;}

.service-inner ul li:before {
    content: '\f105';
    font-size: 14px;
    padding-right: 4px;
    font-weight: 700;
    font-family: 'Font Awesome 5 Free';
}


.ser-hover.hover3 ul {    column-count: 2;      }
.ser-hover.hover2 ul {    column-count: 3;      }
.ser-hover ul li{font-size: 14px;}
.big-ul{max-width:356px;margin:0 auto;}
.ser-hover ul li a {color:#fff;}
.ser-hover.hover4 ul {    column-count: 2;      }

/*------------------------------------*\
	        SUBPAGE
\*------------------------------------*/

.trans-bg {    background: rgb(255 255 255 / 50%);  }

.main {    background: url(../image/main-bg.png) no-repeat top center;	background-size: cover;  }

h1.page-title:before {
    content: '';
    display: block;
    width: 350px;
    height: 200px;
    background: #3290ef;
    opacity: .91;
    position: absolute;
    left: -73px;
    bottom: -40px;
    clip-path: circle(50% at 50% 100%);
}

.album-banner h1.page-title:before{background:#666ecd;}
.banner {position:relative; overflow:hidden;}

h1.page-title {
    font-size: 40px;
    line-height: 60px;
    color: #fff;
    position: absolute;
    bottom: 15px ;
    padding-left:15px;
}

.album-banner h1.page-title {padding-left:0;}


h1.page-title  span {position:relative;}


.banner > img {    width: 100%;    object-fit: cover; }

.sub-banner img {    height: 330px;    object-fit: cover;  }

ul.sidemenu > li:not(:last-child){border-bottom:1px dashed #26b3e9; }
ul.sidemenu > li > a {position:relative;}
ul.sidemenu > li > a:before { content: "\f061";
    font-family: 'Font Awesome 5 Free';
    color: #26b3e9;
    display: inline-block;
    right: 0px;
    position: absolute;
    font-weight: 700;
    border: 2px solid;
    width: 30px;
    text-align: center;
    border-radius: 15px; }

ul.sidemenu li li {    padding: 0 0 0 12px;font-size: 15px; 	 }

.sidebar h3 {
    font-size: 22px;
    font-family: Roboto, sans-serif;
    font-weight: 400;
    text-transform: uppercase;
    margin-bottom: 25px;
    border-bottom: 2px solid red;
    padding-bottom: 5px;
}


ul.sidemenu > li:hover {color:#32c3ef; }
.sidebar> ul:before {content:''; width:100%; display:block; height:5px; background:linear-gradient(to right, #6173ca, #32c3ef); }
.sidebar > ul{   	position: relative;     background: rgb(255 255 255 / 50%);  padding-bottom:60px;    }

ul.sidemenu li {   position:relative;   padding: 15px  ;  font-family:'Microsoft JhengHei'; font-weight:bold; font-size: 16px; color: #000; list-style:none !important;  }

ul.side-sub-menu {    padding: 8px 0;  }

ul.side-sub-menu li.active a{color:#000;}

label.side-title {
    background: #5e77cc;
    color: #fff;
    display: block;
    font-size: 25px;
	
    font-weight: bold;
    padding: 15px 20px;
	
}

.sidebar{margin-bottom:20px;}

.pagination {    display: block;    margin: 0px;  }
.pagination .link1 {      color: #fff;    background: #656464; }
.pagination a {display: inline-block; height: 30px; width: 30px; vertical-align: middle; text-align: center; line-height: 30px; margin: 0 4px;  }
.pagination a.active {    background: #4d97e6;    color: #fff; }
.pagination a i {    height: 30px;    line-height: 30px; }

.pagination a.link {    padding-top: 6px;  }


#button.show {
    opacity: 1;
    visibility: visible;
}
#button {
    display: inline-block;
    background-color: #999999;
    width: 50px;
    height: 50px;
    text-align: center;
    border-radius: 100%;
    position: fixed;
    bottom: 30px;
    right: 30px;
    transition: background-color .3s, opacity .5s, visibility .5s;
    opacity: 0;
    visibility: hidden;
    z-index: 1000;
	cursor:pointer;
}
#button::after {
    content: "\f106";
    font-family: 'Font Awesome 5 Free';
    font-weight: 700;
    font-style: normal;
    font-size: 30px;
    line-height: 45px;
    color: #fff;
}

span.selectarrow {
    position: absolute;
    right: 10px;
    top: 8px;
}


.mb-40{margin-bottom:40px;}



.news-item {
    padding: 0 15px 25px;
    border-bottom: 2px solid rgb(77 151 230 / 35%);
    margin-bottom: 25px;
}
.news-item h3{font-size:18px; font-weight:bold;  font-family:'Microsoft JhengHei';  }

.news-left {padding-right: 30px; }
.news-left img{max-width:180px;}

.album-left {    padding: 0;  }
.album-right .news-date{padding-bottom:0;}
.album-right h3 {
    color: #000;
    font-size: 20px;
    font-weight: bold;
    line-height: 26px;
	font-family:'Microsoft JhengHei';
	text-transform:uppercase;
}
.album-right p{	font-size: 15px;    font-weight: bold;	font-family:'Microsoft JhengHei'; line-height: 18px; }

a.view {font-family:'Microsoft JhengHei'; font-weight: bold; border:2px solid #457b1f; 
    background: #457b1f;
    color: #fff;
    font-size: 18px;
    padding: 8px 25px;
	transition:all .3s;
}

a.view:hover { background:#fff; color: #457b1f; }
.album-item {  margin-left: 0;    margin-right: 0;  padding: 0 0px 25px;    border-bottom: 2px solid #ddd;    margin-bottom: 25px; }


.news-date{    color: #fff;    font-size: 14px;    background: #4e97e6;    padding: 3px 10px;     border-radius: 3px; margin-bottom:5px;  display:inline-block;}

.single-post h3{
	color: #000;
    font-size: 30px;
    font-weight: bold;
    line-height: 26px;
	padding-bottom: 15px;
    margin-bottom: 25px;
    border-bottom: 2px dashed #4e97e6;
    
}

.more-btn{font-family:'Microsoft JhengHei'; font-weight: bold; border:1px solid #457b1f;  color: #457b1f;font-size: 18px;
    padding: 8px 25px;   }
	
.more-btn:hover{ color:#fff; background: #457b1f;  }

.title-part:before {
    content: '';
    display: inline-block;
    width: 6px;
    height: 32px;
    background: #1683e9;
    position: absolute;
}

.select-drop {width:180px; padding:5px; border:1px solid #ddd; -webkit-appearance:none; }
.custom-drop {
    position: relative;
    display: table;
    margin: 0 auto;
}


.news-right {     padding-right: 20px;}
a.download-btn {    display: inline-block;    padding: 0 20px;     color: #4d97e6;  }
a.download-btn .fa-2x {
    font-size: 2.5em;
}

.title-part h2 {
    font-size: 30px;
    padding-left: 20px;
    border-bottom: 2px dashed #a8cf47;
    margin-bottom: 20px;
    padding-bottom: 10px;
	font-weight: bold;	font-family:'Microsoft JhengHei';
}







.sec-title {
    position: relative;
    border-bottom: 2px dotted #5ae9fa;
    margin-bottom: 30px;
    padding-left:20px;
}

.sec-title:before {
    content: '';
    width:9px;
    height: 40px;
    background: #5ae9fa;
    display: inline-block;
    position: absolute;
    left: 0;
}

.sec-title h2 {
    font-size: 32px;
    color: #000000;
    
}
.al-item {      border: 1px solid #32c3ef;  margin-bottom: 30px;    background: #fff; box-shadow:0 0 5px #ddd; padding:5px; }

.album-txt .al-date {font-size: 14px;     color: #666ecd;    font-weight: bold;  }

.album-txt:before {    font-family: 'Font Awesome 5 Free';  color: #666ecd;     font-weight: 900;    content: '\f0da';    position: absolute;    left: 0;     top: 2px;}
.album-txt { position:relative;    padding-left: 10px; }


.al-title {  font-weight: bold; font-size: 15px;    line-height: normal; padding-top: 5px;  }
.album-date {color:#14a3d9;}



ul.sidemenu li a {
    display: block;
    padding-right: 30px;
}

.hover2 .service-inner ,.hover2  .ser-hover ul li a{
    /* color: #000; */
    color: white;
}


/*------------------------------------*\
	        MIN WIDTH
\*------------------------------------*/

.mb-40 {    margin-bottom: 40px;  }
ul.sub-menu li.menu-item-has-children i:before {    content: "\f105"; }


@media(min-width:1151px){


}



@media(min-width:992px){
	.sec-title .custom-drop {  position:absolute;  right: 0;    top: 0;  }
	
.nav_area ul li:hover ul.sub-menu {	display:block;}
.nav_area > ul > li > ul.sub-menu {   margin-top: 22px;  }

.nav_area > ul > li ul.sub-menu {transform-origin: 50% 0;  transform: scaleY(0) translateZ(0);  transition: transform 0.3s, opacity 0.3s; display: block;  }

ul.sub-menu {min-width: 150px;}

ul.sub-menu li ul.sub-menu {    left: 100%;    top: -10px;    width: 100%;  }

.nav_area > ul > li:hover > ul.sub-menu, .nav_area ul.sub-menu > li:hover > ul.sub-menu {   transform: scaleY(1) translateZ(0);   }

.nav_area ul li:hover ul.sub-menu {    display: block; }
	
ul.menu{display:block !important;    }

span.arrow{display: inline-block; padding-left:5px;}

label.toggle {    display: none;  }

.more-btn{margin-right:40px;}




.small .activity-item {   display: flex; align-items: flex-start;   }

.activity-item.seagreen .album-txt:before {
    right: 0;
    left: auto;
    transform: rotate(-180deg) translateY(20px);
}


}


@media(min-width:768px){	

.flogo {    border-right: 2px solid #fff;    padding-bottom: 0 !important;  }
label.side-title { pointer-events:none;}

.headline {
    align-items: center;
}

ul.sidemenu {    display: block !important;  }

.news-right {    padding-right: 85px;  }
.news-item  {position:relative; }
.news-item a.btn {    position: absolute;
    right: 0;}

}




/*------------------------------------*\
	        MAX WIDTH
\*------------------------------------*/
.wrapper {    overflow-x: hidden;  }

@media (max-width:1200px){
	.container {
    max-width: 100%;
}
}

@media (max-width:1100px){

	.nav_area > ul > li {padding-right:15px;}
	.header:after {display:none;}
	.nav_area > ul > li {		padding: 0 10px 0 0;  }
	.nav_area > ul > li a {    font-size: 16px;  }
	h2.fancy-title{font-size:24px;}

}

@media (max-width:1024px){
h2.fancy-title{font-size:22px;}
}


@media (max-width:991px){
	.logo img {  object-fit: contain;  height: 60px;   }
	
	
	.container {    max-width: 100%;  }
	.album-col {    margin-bottom: 20px;  }
	.top-header {padding:10px 0;}
	
	
	.menu-bar ul.menu  {    display: none; position:absolute; width:100%; left:0;  text-align: left;    background:#32c3ef;  z-index:2;    padding: 15px 10px;
    z-index: 10;  top: 80px;}
	
	
	.header .row {    align-items: center;  }
	.toggle {        color: #3192e9;    font-size: 22px;   margin:0;text-align: right;    display: block;  } 	
	.menu-side { position: initial;    }
	
	
	
	.nav_area ul li a {    line-height: 40px;    font-size: 14px; color:#fff; }
	
	nav.nav_area ul li{display:block;     position: relative;    border: 0; }
	
	span.arrow {
    position: absolute;
    right: 10px;
    color: #fff;
    top: 10px;
    width: 40px;
    text-align: center;
    height: 30px;
	}
		
	ul.sub-menu {    display: none;    position: relative;  	    background: transparent; padding:0; }	
	
	ul li .sub-menu li a {    line-height: 14px;  }	
	
	.header .container {    position: initial; }
	ul.sub-menu span.arrow {    right: 10px;    text-align: right;  }
	
	span.arrow.close-icon i:before {    content: '\f106';  }
	ul.sub-menu li.menu-item-has-children  span.arrow.close-icon i:before {    content: "\f106";  }
	
	nav.nav_area {    padding-top: 0;    padding-bottom: 0;  }
	
	.header {position: relative;}
	.logo-side {    max-width: 65%;    flex: 0 0 65%;   }
	.menu-bar .toggle{       position: absolute;    top: 35px;    right: 15px;    z-index: 999; } 
	
	
	
	h1.page-title:before {    width: 290px;    height: 112px; left: -42px; }
	h1.page-title , .album-banner h1.page-title{    padding-left: 30px;  }
	
	.service-section .row > * {    margin-left: 0;    flex: 0 0 25%;    max-width: 25%;  }

	.logo-slider .owl-nav {
    position: relative;
    width: 100%;
    left: 0;
    transform: none;
    justify-content: center;
    margin-top: 25px;
}

	.home-slider .owl-item img {    min-height: 250px;    object-fit: cover;  }


    .ser-hover ul li{font-size:12px; line-height: 16px; }
    .ser-hover.hover2 {top: -80%; left: 43%;height: 450px;  width: 450px;  }
    .ser-hover.hover3 {    top: -30%;    left: 40%;  }
    .ser-hover.hover4 {left: 0; top: -30px;  }
    
    .service-inner h2 {font-size:22px;}
    li.lang {    text-align: center;  }
    .nav_area ul li.lang a { font-size: 18px;  line-height: 50px; }
    .video-widget {    margin-bottom: 40px;  }
}


@media (max-width:767px){
	
	h1.page-title, .single-post h3 {font-size:26px; line-height: 30px;}
	.banner > img {    min-height: 200px;  }
	.single-post {padding:0 15px;}
	
	label.side-title1 {display:none !important;}
	
	
	ul.sidemenu {
    display: none;
}

	.copyright {    text-align: center;  }
	
	.sidebar h3{display:none;} 	
	
	label.toggle-sidemenu {
    font-size: 24px;
    border-bottom: 2px solid red;
    display: block;
    margin-bottom: 20px;
    padding-bottom: 10px;
	}
	
	
	label.side-title {padding:20px 15px;}
	
	
	
	
	.album-right {    margin-bottom: 15px; } 	
	.album-left {    text-align: center;margin-bottom: 10px;  }
	.news-left {    padding-right: 0;    margin-bottom: 10px;    text-align: center; }
	
	.fc-toolbar h2 {    font-size: 20px;  }
	
	
	.ser-item {    margin: 0 auto 20px; }
	
	.event-box {width:100%;}
	.album-col {    margin-bottom: 20px;    max-width: 290px;    margin: 0 auto 20px;  width:100%;}
	.content {    margin-bottom: 25px;   }
	.headline span {width:170px;      padding-top: 12px;   }
	
	.footer span {font-size:16px;}
	.copyright {     font-size: 14px; }
	.footer {    padding: 30px 0 10px 0;  }
	.trans-bg > .row {    margin: 0;}
	
	.al-item img {    margin: 0 auto;    display: table;  }
	.news-item {    display: block !important;  }
	.news-right {    min-width: 100%;    padding: 0 0 15px 0;  }
	
	
	.service-section .row {    flex-wrap: wrap;  }
	.service-section .row > * {    margin-left: 0;    flex: 0 0 100%;    max-width: 100%; 	}
	.service-section .row .top-space {    margin-top: 0;  }
	
	.ser-item {    margin: 0 auto 20px;    text-align: center; }
	.news-item a.btn.read-more , a.download-btn{    display: table;    margin: 0 auto;  }
	h1.page-title:before {width:260px;}
	
	
	.ser-hover {    left: 10% !important;  }
	.ser-hover.hover3, .ser-hover.hover4 {top:0;}
	 .ser-hover.hover4 {     width: 300px;    height: 300px; }
	 .ser-hover.hover2 {
    top: 0; left:50% !important;transform: translateX(-50%);
        width: 400px;
    height: 400px;
}

    .ser-hover.hover2 ul {
        column-count: 3;
    }
    .hover2 .service-inner {
      overflow-y: scroll;
    }
    
    

}


@media (max-width:600px){
	
	.sec-title h2 {      padding-top: 10px;
    padding-bottom: 10px;
    font-size: 22px;}
	
}