/*
Theme Name: swap
Author: Dicky
Author URI: http://swwwap.hk
Description: This is a  bootstrap theme for wordpress. 
Version: 1.0
License: swwwap
*/

/*Wordpress editor styles start*/



body {width: 100%;height: 100%;color: #fff;background-color: #EFEFEF;font-family: 'Lato', sans-serif;;overflow-x: hidden}
 html {width: 100%;height: 100%;}
footer{background: #333;;padding: 20px 0  14px 0;width: 100%;position: relative}

.ui-loader{display: none !important}
input {
    border-radius: 0 !important; 
}


input{outline: none}
.main-color-bg{background: #FF6A00}
.education-color-bg{background: #80b2be !important}
.healthcare-color-bg{background: #9bc698 !important}
.buddhism-color-bg{background: #e17f6e !important}

.color-black{color: #333}
.color-gray{color: #4A4A4A}

.color-white{color: #FFF}
.color-education{color: #80b2be}
.color-healthcare{color: #9bc698}
.color-buddhism{color: #e17f6e}
.color-news{color: #8b8bbe}
.color-orange,.contact-wrapper a{color: #FF6A00}
.color-orange{color: #FF6A00}
.color-orange-green{color: #73EDD5}



.grant-giving-bg,
.grant-giving-past-bg,
#grant-giving .ion-android-arrow-back,
#grant-giving .banner-border{background: #BAA2CF}
.grant-giving-color,
#grant-giving .back-to-list h5,
#grant-giving fix-top-btn h5,
#grant-giving .single-title{color: #BAA2CF}
.wellbeing-bg,
#wellbeing .ion-android-arrow-back,
#wellbeing .banner-border{background: #e17f6e}
.wellbeing-color,
#wellbeing .back-to-list h5,
#wellbeing .fix-top-btn h5,
#wellbeing .single-title{color: #e17f6e}
.mindful-living-bg,.banner-border,
#mindful-living .ion-android-arrow-back,
#mindful-living .banner-border{background: #E08C94}
.mindful-living-color,
#mindful-living .back-to-list h5,
#mindful-living .fix-top-btn h5,
#mindful-living .single-title{color: #E08C94}
.impact-strategy-bg,
#impact-strategy .ion-android-arrow-back,
#impact-strategy .banner-border{background: #9bc698}
.impact-strategy-color,
#impact-strategy .back-to-list h5,
#impact-strategy .fix-top-btn h5,
#impact-strategy .single-title{color: #9bc698}
.education-excellence-bg,
#education-excellence .ion-android-arrow-back,
#education-excellence  .banner-border{background: #80b2be}
.education-excellence-color,
#education-excellence .back-to-list h5,
#education-excellence .fix-top-btn h5,
#education-excellence .single-title{color: #80b2be}

.education-excellence-icon{background: #FFF url(../img/icon/icon-a.png) no-repeat center center  ;;background-size:55%}
.impact-strategy-icon{background: #FFF url(../img/icon/icon-b.png) no-repeat center center  ;;background-size:60%}
.mindful-living-icon{background: #FFF url(../img/icon/icon-c.png) no-repeat center center  ;;background-size:60%}
.wellbeing-icon{background: #FFF url(../img/icon/icon-d.png) no-repeat center center  ;;background-size:65%}
.grant-giving-icon{background: #FFF url(../img/icon/icon-e.png) no-repeat center center  ;;background-size:60%}

#education-excellence .fix-top-icon{background: #80b2be url(../img/icon/education-excellence-icon.png) no-repeat center center  ;;background-size:70%}
#impact-strategy .fix-top-icon{background: #9bc698 url(../img/icon/impact-strategy-icon.png) no-repeat center center  ;;background-size:70%}
#mindful-living .fix-top-icon{background: #E08C94 url(../img/icon/mindful-living-icon.png) no-repeat center center  ;;background-size:70%}
#wellbeing .fix-top-icon{background: #e17f6e url(../img/icon/wellbeing-icon.png) no-repeat center center  ;;background-size:70%}
#grant-giving .fix-top-icon{background: #BAA2CF url(../img/icon/grant-giving-icon.png) no-repeat center center  ;;background-size:70%}


.past-section{padding: 60px 0}

/*#education .border-bottom-section,
#education .single-right-block .content-list-details li span,
#education .banner-border,
#education .link-btn,
.education-listing .icon-wrapper,
#education .bottom-section-overlay,
.education-single .single-left-block .tag-list li:hover
{background: #80b2be}
#healthcare .border-bottom-section,
#healthcare .single-right-block .content-list-details li span,
#healthcare .banner-border,
#healthcare .link-btn ,
#healthcare .bottom-section-overlay,
.healthcare-single .single-left-block .tag-list li:hover


{background: #9bc698}
#buddhism .border-bottom-section,
#buddhism .single-right-block .content-list-details li span,
#buddhism .banner-border,
#buddhism .link-btn,
#buddhism .bottom-section-overlay,
.buddhism-single .single-left-block .tag-list li:hover
{background: #e17f6e}


#education .home-button h6,
#education .hashtag-wrapper h3,
.back-to-list h5,
#education .fix-top-btn h5,
#education .hashtag-wrapper a,
.education-single a,
.education-single .info-list-alt 

{color: #80b2be}
#healthcare .home-button h6,
#healthcare .hashtag-wrapper h3,
#healthcare .fix-top-btn h5,
#healthcare .hashtag-wrapper a,
.healthcare-single a,
.healthcare-single .info-list-alt 

{color: #9bc698}
#buddhism .home-button h6,
#buddhism .hashtag-wrapper h3,
#buddhism .fix-top-btn h5,
#buddhism .single-title,
#buddhism .hashtag-wrapper a,
.buddhism-single a,
.buddhism-single .info-list-alt 

{color: #e17f6e}
*/

a:hover{text-decoration: none}
a:visited,a:focus{outline: 0;text-decoration: none}
a{color: none}



.click-btn{margin: 20px auto;display: inline-block;background: #6a777a;padding:10px 20px;
	-webkit-transition: background .3s ease-in-out;
    -moz-transition: background .3s ease-in-out;
    transition: background .3s ease-in-out;	
}
.click-btn:hover{background: #FF6A00}
.title-border{height: 80px;width: 1px;margin: 20px auto 40px auto;background: #666}
/* menu */
.lang-btn-wrapper{width: 100%;overflow: hidden}
.lang-btn-list{margin-top: 20px}
.lang-btn-list li {
	background: #FFF;display: inline;float: left;padding:6px 8px;-webkit-border-radius: 30px;margin-right: 10px;
-moz-border-radius:30px;border-radius: 30px;
}
.lang-btn-list li.active{background: #FF6B00}
.lang-btn-list li a{color: #333}

.lang-btn-list li.active a{color: #FFF}

.navbar-custom {margin-bottom: 0;border-bottom: 1px solid rgba(255,255,255,.3);font-family:"Lato","Fira Sans",Arial,sans-serif;background-color: #000;}
.navbar-custom .navbar-brand {font-weight: 700;}
.navbar-custom .navbar-brand:focus {outline: 0;}
.navbar-custom .navbar-brand .navbar-toggle {padding: 4px 6px;font-size: 16px;color: #fff;}
.navbar-custom .navbar-brand .navbar-toggle:focus,
.navbar-custom .navbar-brand .navbar-toggle:active {
    outline: 0;
}

.navbar-custom a {color: #333;}
.navbar-custom .nav li a {
	-webkit-transition: background .3s ease-in-out;
    -moz-transition: background .3s ease-in-out;
    transition: background .3s ease-in-out;
}

.navbar-custom .nav li a:hover {outline: 0;color: rgba(255,255,255,.8);background-color: transparent;}
.navbar-custom .nav li a:focus,.navbar-custom .nav li a:active {outline: 0;background-color: transparent;}
.navbar-custom .nav li.active {outline: 0;}
.navbar-custom .nav li.active a {background-color: rgba(255,255,255,.3);}
.navbar-custom .nav li.active a:hover {color: #fff;}
/* desktop menu */

.navbar-toggle-desktop{position: fixed;top:0;right:0;background: #6a777a;text-align: center;padding:4px 16px;z-index: 1099;cursor: pointer;width: 70px;height: 70px;
	-webkit-transition: background .3s ease-in-out;
    -moz-transition: background .3s ease-in-out;
    transition: background .3s ease-in-out;	
}
.navbar-toggle-desktop:hover{background: #FFF;}
.navbar-toggle-desktop i  {color:#FFF}
.navbar-toggle-desktop:hover i {color:#FF6A00 !important}

.navbar-toggle-desktop i {font-size: 42px;
	-webkit-transition: background .3s ease-in-out;
    -moz-transition: background .3s ease-in-out;
    transition: background .3s ease-in-out;		
}
.navbar-toggle-desktop i.ion-android-close{}
.navbar-toggle-desktop:hover i{color:#6a777a}
.navbar-show-desktop{position: fixed;right:-50vw;width: 50vw;top:0;height: 100%;background: #6a777a;z-index: 1098;padding: 60px; 
	-webkit-transition: all .4s ease-in;
    -moz-transition: all .4s ease-in;
    transition: all .4s ease-in;
    opacity: 0	;

}
.navbar-show-desktop.active{right:0;opacity: 1}
#menu-main-menu a{color: #FFF;font-weight: 400;margin: 4px 0;font-size: 42px;line-height:58px;cursor: pointer}
#menu-main-menu .sub-menu a{font-size: 24px;line-height:32px}
.navbar-show-desktop a{color: #FFF}
.navbar-show-desktop-bg {position: fixed;width: 100%;height: 100%;left: 0;top:0;z-index: 1098;background: rgba(255,255,255,.6);display: none }

.sub-menu li{margin-bottom: 4px;cursor: pointer;text-transform: none}
.sub-menu li:last-child{margin-bottom: 20px;overflow: hidden}
.sub-menu{max-height: 0;overflow: hidden;
	-webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
}
.sub-menu li ul{position: relative;overflow: hidden}


#menu-main-menu li.active .sub-menu{max-height: 360px;margin-left: 30px}



#search{border: none;border-bottom: 1px solid  #999;background: none;box-shadow: none;color: #FFF;width: 80%;position: relative;font-family: 'Lato', sans-serif;font-size: 20px;font-weight: 300;margin-top: 20px}
.search-btn{;font-size: 24px;position: relative;bottom:0;right:20px;cursor: pointer}


.scroll-menu{position: fixed;width: 100%;height: 70px;top:0;z-index: 99;}
.scroll-background{position: absolute;width: 100%;height: 100%;top:0;left:0;background: #FFF;	-webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;}
.scroll-background.active{top:0}
.scroll-logo{margin-top: 10px}

.fix-menu{position: absolute;width: 100%;height: 56px;;height:57px;top:0;z-index: 99;}
.menu-white-bg{background: #FFF}
/* intro */
.intro {display: table;width: 100%;height: auto;padding: 100px 0;color: #fff;background-color: #000;-webkit-background-size: cover;-moz-background-size: cover;background-size: cover;-o-background-size: cover;pointer-events: none}
.tran-bg{position: absolute;top:-80px;height: 80px; background: url(../img/home-tran.png) no-repeat bottom center scroll;;width: 100%;background-size: 100% 100%;opacity: 1}
.intro .intro-body {display: table-cell;vertical-align: middle;padding-bottom: 180px;opacity: 0}
.intro .intro-head {position: absolute;width: 100%;bottom:120px;}
.intro .intro-body .container,.intro .intro-head .container{padding: 0}

.intro-border-top{height: 1px ;width: 0;background: #4A4A4A;}
.intro-slider-caption{opacity: 0}

.intro {height: 100%;padding: 0;}  
.slider-ss{background: url(../img/intro-bg.jpg) no-repeat bottom center scroll;-webkit-background-size: cover;-moz-background-size: cover;background-size: cover;-o-background-size: cover;position: absolute;top:0;width: 100%;height: 100%}
#header-fixed.active{
  -webkit-filter: blur(2px);
  -moz-filter: blur(2px);
  -o-filter: blur(2px);
  -ms-filter: blur(2px);
  filter: blur(2px);	
}

section,footer{overflow: hidden}
/* home page */
.header-overlay{background: #000;position: absolute;width: 100%;height: 100%;top:0;left: 0;opacity: .4;pointer-events: none;
	-webkit-transition: all .8s ease-in-out;
    -moz-transition: all .8s ease-in-out;
    transition: all .8s ease-in-out;	
}
.intro #section05 a span {border-color: #333;border-left: 2px solid #333;border-bottom:2px solid #333}
.header-overlay.active{opacity: .85;background: #FFF;}
.home-section-block{margin: 80px auto}
.content-wrapper{position: relative;padding: 80px 0;background: rgba(255,255,255,1)}
.home-transition{position: absolute;bottom:0;width: 100%;left: 0;height: 60px;;background-size: 100% 100%;opacity: 1;pointer-events: visible}
.intro p,.brand-heading {color: #FFF}
.brand-heading {letter-spacing: 1.4px}
#header-fixed{position: fixed;top:0;left: 0;width: 100%;height: 100%;z-index: 0;opacity: 0}
.home-page .flexslider{margin-bottom: 0;width: 100%}
.home-page {padding-top: 20px}
.home-icon-wrapper{padding-top: 40%}
.home-icon{width: 60px;;padding: 10px;margin: 0 auto 10px auto;
-webkit-border-radius: 40px;
-moz-border-radius: 40px;
border-radius: 40px;
background: #FFF
}
.info-content .flexslider a h4{ padding: 4px}
.home-page section,.intro-head .container,.intro-body .container {max-width: 1140px}
.home-page .content-block-wrapper p { opacity: 1;	-webkit-transition: all .8s ease-in-out;
    -moz-transition: all .8s ease-in-out;   transition: all .8s ease-in-out;}
.flex-control-nav{z-index: 999}
.ss-wrapper{width: 100%;height: 80vh;background-size: cover !important;background-position:center top ;background-repeat: no-repeat;}
/*.flexslider-home .ss-wrapper{height: 60vh}*/
.flexslider-home .flex-control-paging {opacity: 0;pointer-events: none}
.home-slider-dot{margin-top: 10px;opacity: 0}
.home-slider-dot li{width: 10px;height: 10px;background: #999;float: left;margin-right: 10px;-webkit-border-radius: 40px;-moz-border-radius: 40px;border-radius: 40px;cursor: pointer;pointer-events: auto}
.home-slider-dot li.active{background: #FF6A00;}
.home-slider-des li{display: none}
.home-slider-des li:nth-child(1){display: block}

.intro-head-bg{position: fixed;left: 0;top:0;width: 40%;background: url(../img/home-bg-tran.png) center center;background-size:100%;height: 100%;opacity: .6;}

.intro-slider-caption,.intro-border-top,.intro-head-bg{	-webkit-transition: all .8s ease-in-out;    -moz-transition: all .8s ease-in-out;    transition: all .8s ease-in-out;}
.intro-border-top.active{width: 100%}
.intro-slider-caption.active{opacity: 1}

.logo-white{display: none}

.intro.intro-white-bg .logo-black{display: block}
.intro.intro-white-bg .logo-white{display: none}

.intro.intro-none-bg .logo-black{display: none}
.intro.intro-none-bg .logo-white{display: block}

.intro.intro-none-bg .intro-slider-caption{color: #FFF}
.intro.intro-none-bg .intro-border-top{background: #FFF}


/* 20200507 */
.home-logo{position: absolute;width: 100%;top:60px}
.btn-bg {background: #6A777A;color: #FFF}
.btn-bg a{color: #FFF}
.qoute{display: inline-block;background: url(../img/open-q.png) left 10px top 10px no-repeat ;padding:20px 40px;background-size: 25px;margin-left: -20px;position: relative}
.qoute span{position: absolute;width: 25px;height: 25px;background: url(../img/close-q.png) center center no-repeat ;background-size: contain;bottom:50px;right: 0px}
.btn{border-radius: 0;;padding: 4px 30px 2px 30px}
.slider-container{width: 100%;height: 20vh;background: #FFF;overflow: hidden}
.row-no-padding{margin: 0 !important}

.slider-info-block{position: relative;}
.slider-info-block .info{padding: 20px 40px;padding-right: 120px;height:20vh;position:relative}
.slider-info-block .info-bg{position: absolute;width: 100%;height: 100%;left: 0;top:0;z-index: -1;opacity: .6}
.section-entry{background: rgba(0,0,0,.05);padding: 14px 0 28px 0;overflow: hidden}
.section-entry ul li{width: 20%;float: left;text-align: center}
.section-entry ul li span{width: 90px;height: 90px;border-radius: 100%;display: block;margin: 20px auto 15px auto}
.section-entry ul li h5{line-height: 1em}
.icon-slide{position: absolute;right: 40px;top:20px;width: 60px;height: 60px;z-index: 2;border-radius: 100%;background-size: 30px}
.home-slide-img{width: 100%;position: relative;right: 0;height: 40vh;top:0}

.news-home{position: relative;width: 100%;height: 60vh;background: #FFF;padding: 40px}
.flexslider-news .flex-control-nav,.flexslider-home-txt .flex-control-nav
{right: 0;text-align: right;bottom: 30px;;padding: 0 30px;width: auto;display: inline-block}
.flexslider-news .flex-control-nav a,.flexslider-home-txt .flex-control-nav a{font-size: 1px}
.slider-info-block .flex-control-paging li a{background: rgba(255,255,255,.4);box-shadow: none}
.slider-info-block .flex-control-paging li a.flex-active{background: rgba(255,255,255,1);}

.grantgiving-past-list li{padding: 20px 0 ;border-bottom: 1px solid #999;overflow: hidden}
.past-title,.past-year{width: 15%;float: left;padding-right:40px}
.past-title{width: 35%}
.past-year .btn{float: right;margin-right: -40px}
.home-news-btn{position: absolute;bottom:30px;left: 40px;z-index: 2}
.left-arrow,.right-arrow{cursor: pointer}
.left-arrow{width: 20px;height: 20px;background: aqua;position: absolute;left: 40px;bottom:30px;z-index: 2;background: url(../img/left-arrow.png) center center no-repeat ;background-size: contain}
.right-arrow{width: 20px;height: 20px;background: aqua;position: absolute;left: 80px;bottom:30px;z-index: 2;background: url(../img/right-arrow.png) center center no-repeat ;background-size: contain}
.flexslider-txt{position: absolute;right: 0;top:0;width: 100%;height: 30vh}
.flexslider-txt li{position: absolute;right: 0;top:0;width: 100%;height: 30vh;opacity: 0;transition: all 0.6s cubic-bezier(0.65, 0, 0.35, 1);}
.flexslider-txt li.active{z-index: 2;opacity: 1}

.back-to-list.gg-past {display: inline-block;position: relative;float: right;margin-top: 0}
.back-to-list.gg-past h5{position: relative;margin-top: 15px;;float: right}
.back-to-list.gg-past i{margin-top: 0}

.past-ss-wrap{margin-top: 120px}

/* column */

.top-block-column{min-height: 420px;}
.side-block-column{min-height:620px}
.info-left{min-height:300px}
.info-right{min-height: 300px}
.bottom-side-column{min-height: 320px}
.top-block-column,
.bottom-side-column,
.side-block-column,
.info-left,.info-right
{cursor: pointer;}
.min-height-60{min-height: 60px;}

.section-column{background: #000;text-align: left;cursor: pointer;overflow: hidden}


.content-block-wrapper{position: absolute;width: 50%;z-index: 8;padding: 20px 0;height: 100%}
.background-image{width: 100%;height: 100%;position: absolute;left:0;top:0;opacity: .7;
	-webkit-transition: all .4s ease-in-out;
    -moz-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;	
}
.top-block-column .content-block-wrapper{width: 30%}

/*.section-column:hover .background-image{
  opacity: .6;
  width: 103%;
  height: 103%;
  top:-1.5%;
  left: -1.5%;
  -webkit-filter: blur(1px);
  -moz-filter: blur(1px);
  -o-filter: blur(1px);
  -ms-filter: blur(1px);
  filter: blur(1px);
}
*/

.border-bottom-section{position: absolute;width: 100%;height: 10px;left: 0;bottom:0;z-index: 7;cursor: pointer;
	-webkit-transition: all .4s ease-in-out;
    -moz-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;	
}
.bottom-section-overlay{position: absolute;width: 100%;height: 100%;left: 0;bottom:0;z-index: 7;cursor: pointer;	-webkit-transition: all .4s ease-in-out;    -moz-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;opacity: 0;}
.section-column:hover .border-bottom-section{opacity: .8}
.section-column:hover .bottom-section-overlay{opacity: .6}

.info-content{position: absolute;padding:10px 30px 20px 0;bottom:0;text-align: left;width: 100%}
.hastag{background: #6a777a;padding: 6px 12px 8px 12px;position: absolute;left: 15px;bottom: 20px;cursor: pointer;z-index: 10;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
-webkit-transition: all .4s ease-in-out;
-moz-transition: all .4s ease-in-out;
transition: all .4s ease-in-out;
font-family: "Lato",sans-serif ;
font-style: normal !important
}
.new-title{position: absolute;top:20px;text-align: left;left: 15px}
.hastag{cursor: pointer}
.hastag:hover{background: #6a777a}
.hastag span{margin-left: 10px}
.hastag.active span{margin-left:0;display: none }
.hastag.active {background: #CCC;color: #FFF}
.hashtag-wrapper{position: absolute;width: 100%;bottom: 0%;left: 0;background: #EEE;padding: 20px;z-index: 8;height: 100%;display: none}
.hashtag-wrapper h3{font-weight: 300;/* text-transform: capitalize */}
.hashtag-wrapper h3 span{margin-bottom: 10px;display: inline-block}

#education .hashtag-wrapper h1 span{border-color: #80b2be}
#healthcare .hashtag-wrapper h1 span{border-color: #9bc698}
#buddhism .hashtag-wrapper h1 span{border-color: #e17f6e}


.home-button {background: #FFF;display: inline-block;padding: 4px 20px;font-weight: 400;opacity: 0;margin-top:10px;
-webkit-transition: all .4s ease-in-out;
-moz-transition: all .4s ease-in-out;
transition: all .4s ease-in-out;	
}
.section-column:hover .home-button {opacity: 1;margin-top:0}



.demo a {
	position: absolute;
	left: 49.4%;
	z-index: 2;
	display: inline-block;
	-webkit-transform: translate(0, -50%);
	transform: translate(0, -50%);
	color: #fff;
	font : normal 400 12px/1 'Josefin Sans', sans-serif;
	letter-spacing: .1em;
	text-decoration: none;
	transition: opacity .3s;
}
.demo a:hover {
	opacity: .5;
}

#section05 a {
	padding-top: 70px;
	cursor: pointer
}
#section05 a span {
	position: absolute;
	top: 0;
	left: 50%;
	width: 18px;
	height: 18px;
	border-left: 1px solid #fff;
	border-bottom: 1px solid #fff;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
	-webkit-animation: sdb05 1.5s infinite;
	animation: sdb05 1.5s infinite;
	box-sizing: border-box;
}
@-webkit-keyframes sdb05 {
	0% {
		-webkit-transform: rotate(-45deg) translate(0, 0);
		opacity: 0;
	}
	50% {
		opacity: 1;
	}
	100% {
		-webkit-transform: rotate(-45deg) translate(-20px, 20px);
		opacity: 0;
	}
}
@keyframes sdb05 {
	0% {
		transform: rotate(-45deg) translate(0, 0);
		opacity: 0;
	}
	50% {
		opacity: 1;
	}
	100% {
		transform: rotate(-45deg) translate(-20px, 20px);
		opacity: 0;
	}
}

/* listing */
#banner{position: relative;overflow: hidden;padding-top: 70px}

.listing-block{margin-top: 140px}
.listing-block a:hover{text-decoration: none}
.img-wrapper{position: relative}
.img-wrapper .img-overlay{position: absolute;width: 100%;height: 100%;opacity: 0;
-webkit-transition: all .4s ease-in-out;
-moz-transition: all .4s ease-in-out;
transition: all .4s ease-in-out;	
}
.listing-block a:hover .img-overlay{opacity: .4}


.header-banner-overlay{position: absolute;top:0;left: 0;width: 100%;height: 100%;z-index: 2}
.listing-icon-wrapper{position: relative;text-align: center;margin:80px 0 120px}
.listing-color-overlay{position: absolute;top:0;left: 0;width: 100%;height: 100%;background: rgba(0,0,0,.4);z-index: 0}

.header-info{text-align: center}
.icon-wrapper{padding: 18px;display: inline-block;overflow: hidden;-webkit-border-radius: 60px;
-moz-border-radius: 60px;
border-radius: 60px;margin-bottom: 10px}

#banner #section05 a span{top:-50px;border-color:#FFF;border-bottom:2px solid #FFF;border-left:2px solid #FFF}
.intiatives-listing .content-wrapper{position: relative;padding: 80px 0 60px 0;background: rgba(255,255,255,1)}


/* single */

.single .content-wrapper{position: relative;padding: 60px 0;background: rgba(255,255,255,.85)}
.fix-top-btn{position: fixed;top:0;right:76px;display: inline;background: #FFF;z-index: 100;height: 56px}
.fix-top-btn.fix-top{position: fixed;top:0;right:53px;display: none;background: none;z-index: 120;height: 56px}

.fix-top-btn h5{font-size: 16px;letter-spacing: 0;margin-top: -1px}
.fix-top-btn {padding:6px 20px}
.fix-top-btn.education h4{color:#80b2be}
.fix-top-btn.education{border-bottom: 4px solid #80b2be}
.fix-top-icon{width: 36px;height: 36px;;background: url(../img/edu-white.svg) center center no-repeat #80b2be;display: inline-block;position: relative;top:12px;margin-right: 10px;background-size: 60%;-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;}
.single .content-wrapper p{margin-bottom: 20px;margin-right: 20px}

.banner-border{height: 6px;}
.single-left-block p{margin-right: 20%;margin-bottom: 20px}
.single-left-block .icon-list,.single-left-block .info-list,.single-left-block .tag-list{display: block;width: 100%;float: left}
.single-left-block .info-list li{position: relative}
.info-list-alt{position: absolute;background:#FCFCFC;left: 60px;padding-left: 0 !important;padding-right: 10px;color: #FFF ;opacity: 0;top:0;padding-top:6px;height: 100%;width: 90%;color: #6a777a;cursor: default}
.single-left-block .info-list li:hover .info-list-alt,.info-list-alt.active{opacity: 1}
.single-left-block .icon-list h6{background: #6a777a;color:#FCFCFC;position: absolute;opacity: 0;-webkit-transition: all .4s ease-in-out;
-moz-transition: all .4s ease-in-out;transition: all .4s ease-in-out;padding: 2px 10px 2px 10px;bottom:-30px	}
.single-left-block .icon-list .core-link{position: absolute;height: 100%;width: 100%;}
.single-left-block .icon-list li:hover>h6{opacity:1}
.single-left-block .icon-list li{width: 40px;height: 40px;margin-right: 20px;display: inline-block;float: left;position: relative}
.icon-list h6{ text-transform: capitalize }
/*Alan change*/ 
.single-left-block .icon-list li.initiate{background: url(../img/philosophy/initiate.svg)center center no-repeat ;background-size: cover}
.single-left-block .icon-list li.capacity-building {background: url(../img/philosophy/capacity-building.svg)center center no-repeat ;background-size: cover}
.single-left-block .icon-list li.capacity-building h6{width: 115px}
.single-left-block .icon-list li.innovate{background: url(../img/philosophy/innovate.svg)center center no-repeat ;background-size: cover}
.single-left-block .icon-list li.catalyst-for-collaboration{background: url(../img/philosophy/catalyst-for-collaboration.svg)center center no-repeat ;background-size: cover}
.single-left-block .icon-list li.catalyst-for-collaboration h6{width: 160px}
.single-left-block .icon-list li.impact{background: url(../img/philosophy/impact.svg)center center no-repeat ;background-size: cover}
/*Alan change*/ 

.info-list{ /* text-transform: capitalize */ }
.info-list li h5{padding-left: 60px}
.info-list .year{background: url(../img/single/year.svg)center left no-repeat ;background-size:50px}
.info-list .partners{background: url(../img/single/partners.svg)center left no-repeat ;background-size:50px}
.info-list .location{background: url(../img/single/location.svg)center left no-repeat ;background-size:50px}
.info-list .beneficiaries{background: url(../img/single/beneficiaries.svg)center left no-repeat ;background-size:50px}
.info-list .awards{background: url(../img/single/awards.svg)center left no-repeat ;background-size:50px}
.info-list .no_of_activities{background: url(../img/single/no_of_activities.svg)center left no-repeat ;background-size:50px}
.info-list .no_of_beneficiaries{background: url(../img/single/no_of_beneficiaries.svg)center left no-repeat ;background-size:45px}
.back-to-list h5{position: absolute;margin-top: 12px;margin-left: 10px;margin-bottom: 12px;-webkit-transition: all .4s ease-in-out;-moz-transition: all .4s ease-in-out;transition: all .4s ease-in-out;}
.back-to-list:hover h4{color: #333}
.back-to-list:hover .ion-android-arrow-back{background: #333}


.single-left-block .info-list {border-top: 1px solid #000;margin: 20px 0}
.single-left-block .info-list li{width: 100%;border-bottom: 1px solid #000;padding: 6px 0}
.single-left-block .tag-list {margin-bottom: 40px}
.single-left-block .tag-list li{display: inline-block;padding:4px 10px;background: #6A777A;margin-bottom: 10px;margin-right: 10px;-webkit-transition: all .4s ease-in-out;-moz-transition: all .4s ease-in-out;transition: all .4s ease-in-out;}
.single-left-block .tag-list li h5{display: inline ;color: #fff}


.single-right-block .content-list-details li{padding-left: 60px;margin-bottom: 20px}
.single-right-block .section-break{margin: 30px 0 ;width: 100%;height: 1px ;}
.single-right-block td{border: 1px solid #333;font-size: 16px;color: #4A4A4A;width: 30%;padding: 10px}
.single-right-block td:nth-child(2n){width: 60%}
.single-right-block td p{font-size: 16px}
.single-right-block table{margin: 20px 0}
.noborder td,.withborder td{width: 30% !important}
.noborder td{ border: 0px; }
#slider-images-single {width: 100%}
#slider-images-single .flex-control-nav{position: relative;display: inline;margin-left: -6px;top:0;z-index: 2;left: 0;display: inline;bottom:auto;text-align: left}
#slider-images-single .flex-caption{margin-top: 30px;font-size: 15px}
.caption-wrapper{position: relative;}
.single .flexslider{margin-bottom: 20px !important}
.single .flex-direction-nav a{top:36%}

#slider-qoute .slides .qoute-img-wrapper{width: 30%;float: left;min-height: 340px;background-repeat: no-repeat !important;background-size: cover !important;background-position: center center !important}
.qoute-wrapper{float: left;width: 70%;text-align: center;padding: 20px  }
.qoute-wrapper p{text-align: left !important;font-size: 16px;line-height: 24px}
#slider-qoute .flex-control-nav{bottom: 20px;z-index: 2 /* 100 */;text-align: left;padding-left: 14px;position: relative !important}
#slider-qoute {background: #EEE}
.qoute-img{width: 100% !important;float: right;padding-top: 22px;padding-right: 20px}

.flex-direction-nav a{top:40%;margin: 0;height: 80px;color: #FFF;text-shadow:none}
.flex-direction-nav .flex-next i,.flex-direction-nav .flex-prev i{font-size: 60px}
.flex-direction-nav a.flex-next::before,.flex-direction-nav a::before{content: "" !important}
.flexslider .slides img.img-pro{width: auto;height: 400px}
.flex-pauseplay{opacity: 0}


.content-list-details li{position: relative}
.content-list-details li span{position: absolute;left: 0;top:4px;text-align: center;padding: 2px;width: 25px;height: 25px;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
}
.link-btn{padding:10px 20px;display: inline-block;
-webkit-transition: all .4s ease-in-out;
-moz-transition: all .4s ease-in-out;
transition: all .4s ease-in-out;		
}
.link-btn:hover{background: #333}
.ion-android-arrow-back{font-size: 32px;padding: 0 8px;width: 40px;height: 40px;color: #FFF;cursor: pointer;margin-top: 40px;display: inline;
-webkit-border-radius: 40px;
-moz-border-radius: 40px;
border-radius: 40px;
-webkit-transition: all .4s ease-in-out;
-moz-transition: all .4s ease-in-out;
transition: all .4s ease-in-out;		
}

.education-single .single-title{color: #80b2be}
.single-banner-cre{background: #FCFCFC;color: #333;padding: 10px 20px;text-align: right}
.education-single .back-to-list .inline-block{margin-top: 10px !important}

#buddhism .banner-border .border-right{background: #FF907D}
#buddhism .banner-border,#buddhism .ion-android-arrow-back {background: #e17f6e}
#buddhism .fix-top-icon{background: url(../img/buddhism-white.svg) center center no-repeat #e17f6e ;background-size: 60%}
#buddhism .back-to-list h5{margin-top: 0px;color: #e17f6e; width: 180px;}

#healthcare .banner-border .border-right{background: #739371}
#healthcare .banner-border,#healthcare .ion-android-arrow-back {background: #9bc698}
#healthcare .fix-top-icon{background: url(../img/healthcare-white.svg) center center no-repeat #9bc698 ;background-size: 60%}
#healthcare .back-to-list h5{margin-top: 0px;color: #9bc698; width: 180px;}

#education .banner-border .border-right{background: #5E828B}
#education .banner-border,#education .ion-android-arrow-back {background: #80b2be}
#education .fix-top-icon{background: url(../img/edu-white.svg) center center no-repeat #80b2be ;background-size: 60%}
#education .back-to-list h5{margin-top: 0px;color: #80b2be}


.back-to-top{position: absolute;left: 15px;bottom:40px;cursor: pointer}

/* 2021 */
.fuel-btn{padding-left: 90px;position: relative;padding-top: 15px}
.fuel-btn span{content:"　";position: absolute;left: 0;height: 70px;width: 70px;top:5px;border-radius: 100%}
.fuel-list-wrap{padding: 40px;background: #FFF}
.project-fuel-color{color:#9bc698}
.impact-strategy-bg,
#fuel .ion-android-arrow-back,
#fuel .banner-border{background: #9bc698}
.fuel-color,
#fuel .back-to-list h5,
#fuel .fix-top-btn h5,
#fuel .single-title{color: #9bc698}
.section-entry ul{width: 75%}
.home-bottom-block{position: relative;overflow: hidden}
.ss-icon{position: absolute;right: 0;top:0;width: 25%;height: 100%;background: #999}
.ss-icon ul{margin: 0 auto;text-align: center;margin-top: 20px}
.ss-icon li{width: 25px;height: 25px;float: none;margin: 0 20px;display: inline-block;}
.ss-icon li.ss1{background: url('../img/icon/icon-linkedin.svg') center center no-repeat;background-size: contain}
.ss-icon li.ss2{background: url('../img/icon/icon-youtube.svg') center center no-repeat;background-size: contain;
	width: 29px;
	height: 26px;}
.ss-icon li.ss3{
	background: url('../img/icon/icon-dhcf.svg') center center no-repeat;
	background-size: contain;
	width: 33px;
	height: 27px;
}
.sc-logo{margin: 0 auto 10px auto;padding-top: 20%}



/* news listing */
#news-content{height: 100%}
#news-content .col-lg-12{padding: 0 !important}
.news-listing{position: absolute;left:  0;width: calc(36% - 60px) !important;top:0;height: 100%;overflow: hidden;overflow-y: scroll;padding: 30px;padding-right: 90px;padding-bottom: 160px;background: #FFF}

.news-contentl{position: fixed;right: 0;width:  60% ;top:0;height: 100%;overflow: hidden;overflow-y: scroll;padding: 30px;padding-right: 60px;padding-bottom: 160px}
.news-listing,.news-contentl{padding-top: 160px}
#news-content a{ color: #8b8bbe}
.news-background{height: 100%;position: absolute;top:0;width:70%;background: #F4F6FF;right:-9999px;margin-right: 9999px}
.news-background-left{height: 100%;position: absolute;top:0;width: 30%;background: #FFF;left:-9999px;margin-left: 9999px}
#news-content .icon-wrapper{background: #8b8bbe}


.news-inner-listing-content{max-height: 0;-webkit-transition: all .4s ease-in-out;
-moz-transition: all .4s ease-in-out;transition: all .4s ease-in-out;	overflow: hidden}
.news-inner-listing-content.active{max-height: 9999px}

.flexslider{background: none;border: 0;}
#news-inner .flexslider{background: none;border: 0;margin-bottom: 20px}
#news-inner .flex-control-nav{bottom: 10px;text-align: left;margin-left: -5px;position: relative}
#news-inner .flex-direction-nav a{top:34% !important}

.news-title-listing li{position: relative;float: left;cursor: pointer}
.news-title-listing li.active a h3{color: #8b8bbe}
.news-title-listing p{line-height: 20px}
.news-couner{position: absolute;right:-20%;top:0;height: 100%;width: 40px;}
.page-nav{position: relative;float: left;display: inline;width: 20px;height: 20px;background: #6a777a;-webkit-border-radius: 40px;text-align: center;margin:4px;cursor: pointer;
-moz-border-radius: 40px;
border-radius: 40px;
-webkit-transition: all .4s ease-in;
-moz-transition: all .4s ease-in;
transition: all .4s ease-in;}
.page-nav h6{color: #FFF}
.page-nav:hover,.page-nav.active{background: #8b8bbe}
.news-block .tag-list {margin-bottom: 40px}
.news-block .tag-list li{display: inline-block;padding:4px 10px;background: #6A777A;margin-bottom: 10px;margin-right: 10px;-webkit-transition: all .4s ease-in;-moz-transition: all .4s ease-in;
transition: all .4s ease-in;}
.news-block .tag-list li:hover{background: #8b8bbe}
.news-block .tag-list li h5{display: inline ;color: #fff}
.news-block h3{padding-right: 10%}
.news-preloader{position: absolute;top:0;left: 20px;display: none}
#news-content .flexslider .slides img.img-pro{width: auto;height: 400px}
#news-content #slider-images .flex-caption{margin-top: 10px !important}
.news-wrapper {font-family: "Lato",sans-serif;color:#4a4a4a}
#news-inner-content ul li{list-style:disc;font-size: 18px;margin-bottom: 10px;margin-left:  16px;padding-left: 10px}
#news-inner-content ul {margin-bottom: 20px}
#news-inner-content ol li{/*list-style:decimal*/;font-size: 18px;margin-bottom: 10px;margin-left:  10px;padding-left: 30px;position: relative}
#news-inner-content ol li span.number-ball{position: absolute;top:10px;left: -10px;background: #8B8BBE;line-height: 24px}
#news-inner-content ol {margin-bottom: 20px}

.row table {
	font-size: 18px;
	line-height: 32px;
}

table p {
	line-height: 24px !important;
}

/* how section */
.how-section{padding: 60px 0 ;overflow: hidden;position: relative;}
.how-do-we .number-ball{padding-top:0px;width: 20px;height: 20px;line-height: 20px}
.how-do-we a{color: #FF6A00}
.how-do-we p.extra{text-align: left}
#ss4{margin-bottom: 0}
.how-do-border-bottom{position: fixed;bottom:0;width: 100%;height: 80px;left: 0;z-index: 9;background: #e5e5e5}

.how-do-border-bottom .bg-how{background: url(../img/home-tran-ss.png)center bottom no-repeat ;background-size: 100% 100%;height: 40px;position: absolute;top:-40px;width: 100%;}
.how-do-border-bottom ul {position: absolute;bottom:0;width: 100%;margin-bottom: 0;}
.how-do-border-bottom .ss-break{width: 24.9%;border-bottom: 10px solid #6a777a;padding-bottom: 10px;float: left;margin-right: 0.1%}
.how-do-border-bottom .ss-break h5{padding: 0 30px}
.number-ball{background: #333;-webkit-border-radius: 40px;-moz-border-radius: 40px;border-radius: 40px;width: 24px;height: 24px;display: inline-block;color: #FFF;text-align: center;font-size: 12px;margin-top: -8px;margin-right: 10px}

.how-do-we .point-form p{overflow: hidden}

.ss1-img{display: block}

.ss-break{cursor: pointer}
.ss-break.active{border-color: #FF6A00}
.ss-break.active h5{color: #333}

.reject.reject-2{left: 75%}

.step-by-step{position: fixed;right:20px;top:100px;z-index: 9;display: inline;text-align: center}
.step-by-step ul li{-webkit-border-radius: 40px;-moz-border-radius: 40px;border-radius: 40px;background: #FFF;;width: 40px;height: 40px;padding: 8px;padding: 8px;margin-bottom: 10px; -webkit-transition: all .4s ease-in;
-moz-transition: all .4s ease-in;
transition: all .4s ease-in;margin-left: auto;margin-right: auto}
.step-by-step ul li.active{background: #FF6A00;;width: 40px;height: 40px;padding: 8px;}
.step-by-step ul li.active h5{color: #FFF}

.how-do-we  .point-form li{position: relative;margin-right: 8%}
.how-do-we  .point-form{padding-left: 40px;}
.how-do-we  .number-ball{position: absolute;left: -40px;top:14px}
.how-do-we  .point-form p{text-align: left !important}
.how-do-we  .step-by{overflow: hidden;margin-bottom: 20px}
.how-do-we  .step-by li { width: calc(25% - 65px);float: left;text-align: center;margin: 0 0;padding-bottom: 40px; }
.how-do-we  .step-by li .step-wrapper{background: #FFF;-webkit-border-radius: 100%;-moz-border-radius: 100%;border-radius: 100%;height: 180px;width: 180px;	cursor: pointer;position: relative;margin:  0 auto}
.how-do-we  .step-by li .step-wrapper,
.how-do-we  .step-by li,
.step-wrapper-arrow,
.step-by li h4 {
padding: 0;
}
.step-wrapper h4{position: absolute;width: 80%;top:50%;transform: translateY(-50%);left: 10%}
.step-wrapper-arrow{background: url(../img/arrow.svg) no-repeat top center;background-size: 100%;margin-left: -15px;margin-right: -15px;min-height: 100px;margin-top: 60px;padding-top: 30px;}
.step-wrapper-arrow h6{letter-spacing: 0;line-height: 14px}
.how-do-we  .step-by li:nth-child(2),
.how-do-we  .step-by li:nth-child(4),
.how-do-we  .step-by li:nth-child(6)
{width: 80px !important;margin: 0;background: none;position: relative}
.step-wrapper h4{color: #FF6A00}
.how-do-we  .step-by li:hover .step-wrapper,.how-do-we  .step-by li.active .step-wrapper{background:  #FF6A00}
.how-do-we  .step-by li:hover .step-wrapper h4,.how-do-we  .step-by li.active .step-wrapper h4{color: #FFF}
.reject{background: url(../img/arrow-down.svg) no-repeat top center;background-size:auto 100%;height: 40px;padding-top: 50px;margin-top: 0px;display: inline-block}


.step-by-wrapper.fix{position: fixed;top:0;width: 100%;left: 0;z-index: 2;opacity: 1;padding-top: 77px;display: none}
.step-by-wrapper.fix .bg{background: #f5f5f5;width: 100%;height:100%;position: absolute;top:0;display: block}
.step-by-wrapper.fix.show{display: block !important}
.step-by-wrapper.active .step-by{margin: 40px auto;display: inline-block}
.step-by-wrapper.active .step-by li{width: 130px;margin: 0 10px}
.step-by-wrapper.active .step-by li .step-wrapper{height: 140px ;width: 140px;padding: 0;position: relative;text-align: center}
.step-by-wrapper.active .step-by li .step-wrapper-arrow{margin-top: 40px}
.step-by-wrapper.active .step-by li h4{font-size: 16px;line-height: 18px;top: 50%;position: absolute;transform: translateY(-50%);width: 80%;left: 10%}

.circle-text-list{position: absolute;top:0;width: 100%;height: 100%}
.circle-text-list li{width: 30%;left: 35%;height: 25%;margin-bottom: 0;position: relative;text-align: center;}
.circle-text-list li h4{position: absolute;transform: translate(-50%,-50%);top: 50%;left: 50%;color: #FF6A00}

#step-by-wrapper-id{min-height: 314px}


.step-by-wrapper.bottom .step-by{width: 1170px;margin: 0 auto;padding-left: 15px}



.how-do-we .step-by-wrapper.bottom h4{font-size: 18px}
.how-do-we .step-by-wrapper.bottom .step-by li{width: 14%;margin: 0 1.5%}
.how-do-we .step-by-wrapper.bottom .step-by li .step-wrapper{height: 160px;padding: 50px 0}
.how-do-we .step-by-wrapper.bottom .step-wrapper-arrow{margin-top: 40px}
.how-do-we .step-by-wrapper.bottom .reject{background: url(../img/arrow-down.svg) no-repeat center center;background-size:auto 70% !important;padding-top:40px}

/*#ss1 ul li{width: 50%;float: left}

/* what section */
.what-do-we {padding-bottom: 0;overflow: hidden}
.what-wrapper{position: relative;padding-top: 60px;}
.what-left-block{position: absolute;width: 50%;height: 100%;background: #FF6A00;left: 0;margin-bottom: 0;top:0;}
.what-right-block{position: absolute;width: 50%;height: 100%;background: #FFF;right: 0;margin-bottom: 0;top:0;}
.what-left-block-margin{position: absolute;left: -9999px;background: #FF6A00;width: 9999px;top:0;height: 100%}
.what-right-block-margin{position: absolute;right: -9999px;background: #FFF;width: 9999px;top:0;height: 100%}
.what-icon{position: absolute;top:6px}
.what-icon i{font-size: 24px}
.what-list li{position: relative;margin-left: -36px}
.what-list p{padding-left: 36px}
.what-inner-2{margin-left: -20px}
/* team */
.team-list {text-align: center}
.team-list li{display: inline-block;float: none;width: 33% !important}

/* foundation */
.foundation .content-wrapper{overflow: hidden}


/* core-values */
.core-values p{margin: 0 20px}
.core-value-list li{width: 20%;float: left;}
.core-value-list li:nth-child(2){padding:0 30px}

.core-value-list li .core-wrapper{cursor: pointer !important;}
.core-value-list{margin: 60px auto 120px auto;overflow: hidden}
.core-value-list li h3{-webkit-transition: all .4s ease-in;
-moz-transition: all .4s ease-in;
transition: all .4s ease-in;}
.core-value-list li:hover h3{color: #FF6A00}


/* people */
.people p{margin-bottom: 20px}
/* .people p strong{    font-size: 20px;font-family: "Baskervville";    line-height: 30px; color: #ff6a00;margin-bottom: 10px;font-weight: normal} */
.people p.title{    font-size: 24px;font-family: "Baskervville";    line-height: 30px; color: #ff6a00;margin-bottom: 20px;font-weight: normal}
.people .bold { font-weight: bold; }

/* contact  */

.text-pp-wrap li{color: #4A4A4A;list-style:    disc !important;margin-left:40px }
.text-pp-wrap .sub-menu li:last-child{overflow: visible}
.sitemap .sub-menu{display: block;max-height: 999px}
.sitemap  a{ color: #4A4A4A}
.cookie-banner {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 10%;
  width: 100%;
  padding: 20px 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background-color: #4A4A4A;
  z-index: 999
}
.cookie-banner p{margin-bottom: 0;color: #FFF}
.cookie-banner a{color: #FF6A00;text-decoration: underline}
.close-cookies {
  height: 20px;
  border: none;
  cursor: pointer;
}
.how-section ol li{list-style: disc;margin-left: 20px;color: #4A4A4A;margin-bottom: 10px}