@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap');


:root {
  --primary-color : #00B2E3;
  --secondary-color:#5a8eaf;
  --darkbule-color:#211a4e;
}



body {
  position: relative;
  font-family: 'Roboto', sans-serif;
  scroll-behavior: smooth;
}

p {
  font-family: 'Roboto', sans-serif;
  margin-bottom: 0;
  color: #62646a;
  font-size: clamp(12px,2vw,14px);
  line-height: 22px;
}

h1,h2,h3,h4,h5,h6 {
  color: var(--primary-color) !important;
  font-family: 'Roboto', sans-serif;
  letter-spacing: 1;
}

.title h1,.title h2,.title h3,.title h4,.title h5,.title h6 {
  color: #333 !important;
  font-weight: 600 !important;
}

.sub-title h1,.sub-title h2,.sub-title h3,.sub-title h4,.sub-title h5,.sub-title h6 {
  color: #333 !important;
}

span {
  color: #62646a;
  font-family: 'Roboto', sans-serif;
}

a {
  /*display: block;*/
  font-size: clamp(12px,2vw,14px);
  color: #626468;
  font-family: 'Roboto' sans-serif;
}

a:hover {
  text-decoration: none;
}

ul {
  padding: 0 !important;
  margin:0 !important;
  list-style: none;
}

ul li {
  font-family: 'Roboto', sans-serif;
  color: #62646a;
  font-size: 14px;    
}

.pa-tb {
  padding:70px 0;
}

.ma-tb {
  margin:70px 0;
}

.ma-t {
  margin-top: 70px
}

.ma-b {
  margin-bottom: 70px
}

.pa-t {
  padding-top: 70px;
}

.pa-b {
  padding-bottom: 70px;
}









.alert {
  position: absolute!important;
  margin-bottom: 0!important;
  top: 115px;
  z-index: 9;
  left: 50%;
  transform: translateX(-50%);
}


.goal-img img,
.logo img,
.focus-img img,
.news-detail-post-img img,
.publish-detail-img img
{
  height: 100%;
  width: 100%;
  object-fit: contain;
}

.album-slider-img img,
.news-detail-post-img img.logo-img, 
.newsletter-list-img img.logo-img, 
.carousel-news-img img.logo-img,
.post-card-img img.logo-img,
.popular-post-img img.logo-img,
.goal-carousel-img img, 
.banner-img img,
.carousel-img img,
.banner img,
.carousel-news-img img,
.post-card-img img,
.popular-post-img img,
.gif-post-img img,
.detail-content-img img,
.image-list img,
.related-news-img img,
.carousel-img img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  transition: all 0.5s ease;
}

.caroursel-news-title .title h4,
.post-date {
  color: #fff!important;
  text-shadow: 1px 1px 5px #000;
  font-weight: 600;
}

.btn-primary {
  background: var(--primary-color) !important;
  border-color: var(--primary-color) !important;
  color: #fff;
}

.btn-primary:hover {
  background: var(--secondary-color) !important;
  border-color: var(--secondary-color) !important;
  color: #fff;

}

.footer-link .title h5,
.quick-link li a,
.copyright p,
.unhabitat-focus .title h4,
.unhabitat-focus p,
.our-work .title h4,
.our-work p,
.footer-link .latest-story-card .sub-title h6  {
  color: #fff !important;
}

.form-control,
.btn {
  outline: none !important;
  box-shadow: none !important;
}




/*header start*/
#navbar {
  position: fixed;
  top: 0;
  width: 100%;
  transition: top 0.8s;
  z-index: 9999;
  background: rgba(0,0,0,.5);
  padding: 20px 0;
}

.logo {
  width: 350px;
  overflow: hidden;
}

#topNav {
  transition: all 0.5s ease;
}

.sticky-nav {
  position: fixed;
  top: -20px;
  left: 0;
  width: 100%;
  z-index: 9;
  padding: 20px 0;
  transition: all 0.5s ease;
}


.sticky-nav .header-nav {
  line-height: 50px;
}

.top-header {
  line-height: 100px;
}

.search {
  text-align: right;
  vertical-align: middle;
  padding-top: 35px;
}

.search form {
  position: relative;
}

.search form p {
  position: absolute;
  right: 12px;
  top: -30px;
}

.search input {
  width: 50%;
  margin-left: auto !important;
  padding: 0 36px 0 10px;
}
.header-nav {
  box-shadow: 0 1px 5px 1px rgba(0,0,0,.15);
}

.navbar-dark .navbar-nav .nav-link {
  text-transform: uppercase;
  font-size: 14px;
  color: #fff;
}


.navbar-dark .navbar-nav .nav-link:focus, .navbar-dark .navbar-nav .nav-link:hover,
.nav-item .sub-menu > ul li .sub-menu-1 ul li a:hover  {
  box-shadow: 0 1px 5px 1px rgba(0,0,0,.15);	
}

.navbar-dark .navbar-nav .active> .nav-link,
.navbar-dark .navbar-nav .nav-link:focus, .navbar-dark .navbar-nav .nav-link:hover,
.nav-item .sub-menu > ul li .sub-menu-1 ul li a:hover {
  color: var(--primary-color) !important;

}
.navbar-dark .navbar-nav .nav-link:focus {
  color: #fff !important;
}

.navbar-dark .navbar-nav .active {
  background: var(--primary-color);
}

.navbar-dark .navbar-nav .active> .nav-link,
.navbar-dark .navbar-nav .nav-link:hover {
  color: #fff !important;
}

.navbar .nav-item {
  margin-right: 10px ;
  position: relative;
}

.navbar .nav-item:last-child {
  margin-right: 0;
}

.nav-item .sub-menu {
  opacity: 0;
  visibility: hidden;
  position: absolute;
  top: 55px;
  background: rgba(255,255,255,.8);
  transition: all 0.6s ease;
  width: 200px;
}

.nav-item .sub-menu > ul {
  padding: 0px !important;
  width: 100%;
  list-style: none;
}

.nav-item .sub-menu > ul li {
  width: 100%;
  position: relative;
}

.nav-item > .sub-menu > ul > li > a{
  padding:10px;
  color: #000 !important;
}

.nav-item:hover .sub-menu {
  opacity: 1;
  visibility: visible;
  top: 40px;
}

.nav-item .sub-menu > ul li .sub-menu-1 {
  position: absolute;
  top: 0;
  left: 210px;
  background: rgba(255,255,255,.8);
  transition: all 0.6s ease;
  visibility: hidden;
  opacity: 0;
  width: 200px;
}

.nav-item .sub-menu > ul li:hover .sub-menu-1 {
  opacity: 1;
  visibility: visible;
} 

.nav-item .sub-menu > ul li .sub-menu-1 ul li a {
  padding:10px;
  color: #000 !important;
  display:block;
}

.dropdown-menu > li {
  line-height: 25px;
}

.dropdown-menu li a {
  color: #6a6264 !important;
}

.dropdown ul > li {
  position: relative;
  z-index: 2;
}

.dropdown ul > li ul {
  position: absolute;
  top: 0;
  right: -250px;
  width: 250px;
  background: #fff;
  visibility: hidden;
  opacity: 0;
  transition: all 0.5s ease;
  z-index: -1;
  border: 1px solid rgba(0,0,0,.15);
  border-radius: .25rem;
  padding: 10px 20px !important;
}

.dropdown ul > li:hover ul {
  visibility: visible;
  opacity: 1;
}

.dropdown ul > li ul li a {
  font-size: 13px;
}

.dropdown-menu > li > ul li {
  line-height: 16px;
  border-bottom: 1px solid #fff;
}

.dropdown-menu li a:hover,
.dropdown-menu li a:active {
  color: var(--primary-color) !important;
}

.sticky-container{
  padding:0px;
  margin:0px;
  position:fixed;
  right:-170px;
  top:230px;
  width:210px;
  z-index: 1100;
}
.sticky li{
  list-style-type:none;
  background-color:#fff;
  box-shadow: 0 1px 5px 1px rgba(0,0,0,.15);
  color:#efefef;
  height:43px;
  padding:0px;
  margin:0px 0px 1px 0px;
  -webkit-transition:all 0.25s ease-in-out;
  -moz-transition:all 0.25s ease-in-out;
  -o-transition:all 0.25s ease-in-out;
  transition:all 0.25s ease-in-out;
  cursor:pointer;
}
.sticky li:hover{
  margin-left:-115px;
}
.sticky li img{
  float:left;
  margin:5px 4px;
  margin-right:5px;
}
.sticky li p{
  padding-top:5px;
  margin:0px;
  line-height:16px;
  font-size:11px;
}
.sticky li p a{
  text-decoration:none;
  color:#2C3539;
}
.sticky li p a:hover{
  text-decoration:underline;
}

/*header ends*/











/*footer start*/
footer {
  background: #222;
  z-index: 99;
  position: relative;
}

.unhabitat-logo ul  {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

.footer-logo {
  margin-bottom: 20px;
}

.footer-border-top {
  border-top: 1px solid #707173;
  padding-top: 20px;
}

.footer-logo .logo {
  width: 350px;
  height: 35px;
  overflow: hidden;
}

/*.footer-logo .headquater-logo {
  height: 58px;
  width: auto;
}*/


.footer-quick-link h2 {
  font-size: 16px;
  font-weight: 700;
}

.footer-quick-link ul li span,
.footer-quick-link ul li p,
.footer-quick-link ul li a {
  padding: 10px 0;
  color: #bbb;
  display: block;
  margin-bottom:0;
}

.footer-quick-link ul li a:hover {
  color: #fff;
}

.footer-social-link li {
  display: inline-block;
  margin-right: 10px;
  width: 30px;
  height: 30px;
  border: 1px solid #707173;
  border-radius: 50%;
  position: relative;
}

.footer-social-link li:last-child {
  margin-right: 0px;
}

.footer-social-link li a {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
}

.footer-social-link li:hover a i{
  color: var(--primary-color);
}

.footer-subscribe {
  border: 1px solid #707173;
  padding: 10px;  
  margin-top: 10px;
}

.footer-subscribe h5 {
  font-size: 16px;
  font-weight: 700;
}

.footer-subscribe form .form-control {
  width: 100%;
}

.copyright {
  border-top: 1px solid #707173;
  padding: 20px 0;
}

.copyright p {
  color: #bbb !important;
}

.footer-subscribe .form-group {
  position: relative;
}

.footer-subscribe .form-group .form-control {
  padding-right:120px;
  width: 100%;
}

.footer-subscribe .form-group button {
  position: absolute;
  right: 0;
  top:0;
  height: 100%;
  margin: 0;
}
/*footer ends*/













/*home start*/
.popup .modal-dialog {
  max-width: 50%;
  margin-top: 60px;
}

.popup .modal-content {
  background:transparent;
  border:none;
}

.popup .modal-header {
  border:none;
}

.popup .close span{
  background: var(--primary-color);
  color: #fff;
  padding: 5px 10px;
}

.carousel-img {
  height: 600px;
  width: 100%;
  overflow: hidden;
}
.banner {
  position: relative;
  overflow: hidden;
}

/*@-webkit-keyframes zoom {
from {
-webkit-transform: scale(1,1);
}
to {
-webkit-transform: scale(1.5,1.5);
}
}

@keyframes zoom {
from {
transform: scale(1,1);
}
to {
transform: scale(1.5,1.5);
}
}*/



.banner img {
  -webkit-animation: zoom 50s; 
  animation: zoom 50s infinite;
}

.banner-image{
  height: 600px;
  overflow: hidden;
}


/*.overlay-bg:before {
content: "";
position: absolute;
top: 0px;
left: 0px;
width: 100%;
height: 100%;
background: #000;
opacity: .4;
z-index: 1;
transition: all 0.5s ease;
}*/

.banner-feature {
  position: absolute;
  left: 50%;
  padding-top: 30px;
  padding-bottom: 30px;
  transform: translate(-50%,-100%);
  z-index: 2;
  width: 100%;
  text-align: center;
  background: rgba(0,0,0,0.5);
}

.banner-feature h1 {
  font-size: 30px;
  color: #fff !important;
}
.banner-feature p{
  color: #fff!important;
}

.banner-feature h1 a {


}

.container-title h3 {
  position: relative;
  padding-bottom: 20px;
  text-align: center;
  font-weight: 600;
}

/*.container-title h3:before {
content: '';
position: absolute;
bottom: 0;
height: 2px;
width: 100%;
background: #a3a3a3;
}*/

/*.container-title h3:after {
content: '';
position: absolute;
bottom: 0;
left: 0;
height: 2px;
width: 10%;
background: var(--danger);
}*/

.container-title h3 span {
  /*background: var(--primary-color);*/
  color: var(--primary-color);
  /*padding: 5px 15px;*/
}

.carousel-news-img {
  height: 250px;
  overflow: hidden;
  border-radius: 5px;
}

/*.home-card-carousel .owl-item {
margin-right: 2px !important;
}
*/

.home-card-carousel .item {
  padding: 0 !important;
}

.carousel-news,
.home-card-carousel {
  position: relative;
  border-radius: 5px;
  overflow: hidden;
}

.caroursel-news-title {
  position: absolute;
  bottom: 0px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 2;
  width: 100%;
  padding: 10px 25px;
  transition: all 0.6s ease;
}

.caroursel-news-title .title h4 {
  font-size: 18px;

}

.post-date {
  font-size: 12px;
}

.carousel-news:hover .caroursel-news-title {
  background: rgba(0,0,0,0.4);
}

/*.carousel-card:hover .overlay-bg:before{
opacity: .7;
transform: scale(1.1);
}*/

.carousel-card:hover .carousel-news-img img,
.main-post-card:hover .post-card-img img,
.gallery:hover .image-list img{
  transform: scale(1.1);
}

.home-card-carousel .owl-nav button  {
  position: absolute;
  right: 0;
  top: -55px;
  height: 30px;
  width: 30px;
  background: #a3a3a3 !important;
}

.home-card-carousel .owl-nav button span {
  display: none;
}

.home-card-carousel .owl-nav button:before  {
  content: '\f054';
  font-family: "Font Awesome 5 Free";
  display: inline-block;
  vertical-align: middle;
  font-weight: 900;
  color: #fff;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
}

.home-card-carousel .owl-nav .owl-prev {
  right: 40px;
  transform: rotate(180deg);
}

.box-shadow {
  box-shadow: 0 1px 5px 1px rgba(0,0,0,.15);
}

.right-container {
  /*padding-bottom: 80px;*/
}



.home-main-post {
  background: #fff;
  margin-top: -8px;
}

.left-col {
  border-top: 2px solid var(--primary-color);
  margin-bottom: 40px;
  padding-bottom: 20px;
}

.left-col .title h6,
.right-col .title h6 {
  padding: 12px 0;
  background: #fff;
  font-size: 18px !important;
}

.post-card-img {
  height: 350px;
  overflow: hidden;
  position: relative;
  border-radius: 5px;
}

.post-card-img:before,
.overlay-bg:before {
  /*content: '';*/
  position: absolute;
  top: 0;
  left: 0;
  background-image: linear-gradient(rgba(255,255,255,0),rgba(0,0,0,.8));
  height: 100%;
  width: 100%;
  z-index: 1;
}

.post-card-img a {
  display: initial;
}

.main-post-card .sub-title {
  padding: 0 15px;
  font-size: 18px !important;
}

.main-post-card .sub-title h5 {
  font-size: 16px !important;
  font-weight: 500;
}

.sub-title .post-date,
.notice .post-date {
  color: #62646a !important;
  text-shadow: none;
  font-weight: 600;
}

.main-post-card {
  background: #fff;
  height: 100%;
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  transition: all 0.5s ease;
  /*border:1px solid var(--primary-color);*/
  position: relative;
  overflow: hidden;
  border-radius: 5px;
}

.post-card-content {
  position: absolute;
  /* bottom: -50px; */
  bottom: 0px;
  z-index: 2;
  padding: 10px 0;
  transition: all 0.6s ease-in-out;
  width: 100%;
  padding: 20px;
}

.recent-publish .post-card-content {
  /*bottom:-100px;*/
  visibility:hidden;
  opacity:0;
}

.recent-publish .main-post-card:hover .post-card-content {
  /*bottom:-100px;*/
  visibility:visible;
  opacity:1;
}

.post-card-content .sub-title h5 {
  color: #fff !important;
  text-shadow: 1px 1px 5px #000;
  font-weight: 600;

}

.post-card-content .post-date {
  color: #fff !important;
}

.main-post-card .content {
  padding: 10px 15px;
  text-align: justify;
}

.post-card-content .content {
  opacity: 0;
  visibility: hidden;
  transition: all 0.6s ease-in-out;
  height: 85px;
  width: 100%;
}

.post-card-content .content p {
  color: #fff;
  text-shadow: 2px 2px 4px #000;
}

.main-post-card a:hover h5{
  color: var(--secondary-color) !important;
}

.main-post-card:hover .post-card-content {
  position: absolute;
  bottom: 0px;
  z-index: 2;
}

.main-post-card:hover .post-card-content .content {
  opacity: 1;
  visibility: visible;
}

.main-post-card:hover .post-card-content {
  background: rgba(0,0,0,0.4);
}

.recent-publish .main-post-card:hover {
  /*box-shadow: 0 1px 15px 1px rgba(0,0,0,.7);*/
}

.half-post-card-img {
  height: 225px;
}

.full-post-card-img {
  height: 475px;
}

.home-video-img {
  height: 200px;
}

.post-card-half-img {
  height: 230px;
}

.half-post-card-content {
  /*bottom:-80px;*/
  padding-bottom:30px;
}

.half-post-card-content .content p {
  font-size: 13px;
}

.post-card-half-img:before {
  /*transition: all 0.6s ease;*/
}

.main-post-card:hover .post-card-half-img:before {
  /*background: rgba(0,0,0,.7); */
}

/*.card-zoom:hover {
box-shadow: 0 1px 15px 1px rgba(0,0,0,.7);
}*/







.left-col .view-more {
  padding: 10px 0;
}

.popular-post-list:hover .popular-post-img {
  transform: scale(1.1);
}

.popular-post-img {
  height: 80px;
  overflow: hidden;
  transition: all 0.6s ease;
}

.popular-post .sub-title h6,
.latest-story-card .sub-title h6 {
  font-size: 14px;
}

.popular-post .sub-title a:hover h6,
.latest-story-card .sub-title a:hover h6 {
  color: var(--primary-color) !important;
}

.recent-publish .main-post-card .sub-title {
  padding: 10px 15px;
}

.gif-post {
  margin-bottom: 40px;
}

.gif-post-img {
  height: 180px;
  overflow: hidden;
}

.sidebar hr {
  border-top: 2px solid #fff;
}

.column img {
  opacity: 0.8;
  cursor: pointer;
}

.column img:hover {
  opacity: 1;
}
/* Expanding image text */
#imgtext {
  position: absolute;
  bottom: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  font-size: 20px;
}

/* Closable button inside the image */
.closebtn {
  position: absolute;
  top: 0px;
  right: 15px;
  color: white;
  cursor: pointer;
  padding: 5px 10px;
}


.post-card-img iframe {
  width: 100%;
  height: 100%;
}

.story-card-img {
  height: 150px;
}

.meta-data span {
  font-size: 12px;
}

.latest-story-card {
  background: #fafafa;
  margin-bottom: 15px;
  /*height: 80px;*/
  overflow: hidden;
  /*border: 1px solid var(--primary-color);*/
}

.latest-story-card:hover {
  /*box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.4);*/
}

.latest-story-card .sub-title {
  padding: 5px;
}

/*.popular-post .sub-title h6, .latest-story-card .sub-title h6 {
margin-bottom: 0;
height: 65px;
overflow: hidden;
}*/

.unhabitat-focus,
.our-work {
  /*background: #1a3667;*/
  background: var(--primary-color);
  color: #fff;
  text-align: center;
  padding:90px 50px;
  /*margin-bottom: 40px;*/
  z-index: 3;
  position: relative;
}


.focus-img {
  height: 80px;
  width: 80px;
  overflow: hidden;
  margin:0 auto;
}

.unhabitat-focus p,
.our-work p {
  font-size: 17px;
}

.focus-card p{
  font-size: 15px;
  margin-top: 10px;
}

.our-work-card p strong {
  font-size: 22px;
}


.btn {
  text-transform: uppercase;
  transition: all 0.5s ease;
  position: relative;
  overflow: hidden;
  margin: 0px 10px;
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  -webkit-transition-property: color;
  transition-property: color;
  padding: 5px 15px !important;
  font-size: 12px !important;
  border-radius: 0;
}

.btn::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 0%;
  background: var(--primary-color);
  z-index: -1;
  transition: all 0.s ease;
  transition: 0.8s;
}

.btn2 {
  color: #fff;
  border: 2px solid var(--primary-color);
  transition: all 0.5s ease;
  padding: 10px 30px !important;
  background: var(--primary-color);
}

.btn2:hover,
.btn3:hover {
  background-color: #00619a;
  border-color: #00619a;
  color: #fff;
}

.goal-img {
  height: 115px;
  width: 100%;
  overflow: hidden;
}

.goal-carousel-img {
  height: 365px;
  width: 100%;
  overflow: hidden;
}

.featured-post,
.recent-video {
  background: #f8f9fa;
}

.lastest-story-card {
  transition: all 0.6s ease;
}

.lastest-story-card:hover {

}
.project-carousel-indicators {
  width: 100%;
  margin: 0;
}
.project-carousel-indicators li {
  height: auto;
  width: 100%;
  text-align: center;
  text-indent: 1px !important;
  box-shadow: 0 0 15px 5px rgba(0,0,0,0.1);
  margin-right: 10px;
  opacity: 1;
  border: none;
  background-color: #fff;
  padding: 5px 10px;
}

.project-carousel-indicators {
  position: static;
}

.project-carousel-indicators .active {
  background-color: var(--primary-color);
  color: #fff;
}

.not-assign {
  background: #e9ecef;
  display: block;
  width: 100%;
}
.flex-center {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  width: 100%;
  background: #F0F1F3
}

.tab-btn .btn-view-all {

}
/*home ends*/



/*.btn1::before, .btn2::before {
bottom: 0;
transition: all 0.5s ease;
border: 100% 100% 0% 0%;
}

.btn1:hover, .btn2:hover {
color: var(--primary-color);
transition: all 0.5s ease;
border: 2px solid #fff;
}

.btn:hover::before {
height: 100%;
transition: all 0.5s ease;
background-color: #fff;
}*/



















/*about start*/
/*.about-page {
margin: 100px 0;
}*/
.banner-feature .banner-title h2 {
  color: #fff !important;
}

.banner-feature  .breadcrumb {
  background: none;
  justify-content: center;
}

.banner-feature  .breadcrumb .breadcrumb-item a{
  color: #fff;
}

.banner-feature  .breadcrumb .breadcrumb-item.active {
  color: var(--primary-color);
  font-weight: 600;
}

.about-page .left-col,
.notice .left-col {
  border-top: none;
  padding: 0 10px;
}


.about-page .sidebar li {
  border-bottom: 1px solid #ddd;
}

.about-page .sidebar li a{
  padding: 10px 0;
  text-transform: uppercase;
  color: 
}

.about-page .left-col .sidebar li.active a,
.about-page .sidebar li a:hover,
.link-list ul li.active a {
  color: var(--primary-color);
}

.detail-content-img {
  height: 300px;
  overflow: hidden;
  margin-bottom: 15px;
}

.detail-content .content p {
  margin-bottom: 10px;
  text-align: justify;
}

.detail-content ul {
  padding-left: 15px !important; 
}

.detail-content ul li {
  font-family: 'Poppins', sans-serif;
  list-style: circle;
  font-size: clamp(12px,2vw,14px);
}
/*about end*/













/*featured news list start*/
.news-post-list .post-card-content {
  /*bottom:-90px;*/ 
}

.pagination {
  justify-content: center;
}

.page-link {
  color: var(--primary-color) !important;
}

.popular-post {
  background: #f6f6f6;
  padding: 30px;
}

.popular-post .title {
  margin-bottom: 20px;
  border-bottom: 2px solid #fff;
}

.popular-post-list {
  margin-bottom: 20px;
}

.popular-post-list:last-child {
  margin-bottom: 0;
}

.popular-post-list .popular-post-img {
  height: 60px;
}

.popular-post-list .sub-title h6 {
  max-height: 60px;
  overflow: hidden;
  font-size: 12px;
}

.popular-post-list:last-child {
  border-bottom: none;
}

.popular-post {
  overflow: hidden;
  border:1px solid #ddd;
}
/*featured news list ends*/






/*news detail post start*/
.header-margin {
  margin-top: 125px;
}

.news-post-list,
/*.news-detail,*/
.gallery-list,
.publish,
.notice {
  /*margin: 100px 0;*/
}

.news-detail .left-col {
  border-top: none;
}

.news-detail-post .title h4 {
  max-height: 60px;
  overflow: hidden;
  color:#0265B5 !important;
}

.news-detail-post-img {
  /*height: 400px;*/
  overflow: hidden;
}

.news-detail-post .content,
.share-plugin {
  /*padding: 0 30px; */
}

.news-detail-post .post-date {
  color: #62646a !important;
  text-shadow: none;
}

.news-detail-post .content p {
  margin-top: 10px;
}

.share-plugin ul li {
  display: inline-block;
  margin-bottom: 15px;
}


.twitter {
  transform: translateY(6px);
}

.sidebar-tab .nav-tabs {
  border-bottom: none !important; 
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1;
  position: relative;
}

.sidebar-tab .nav-tabs .nav-item.show .nav-link, 
.sidebar-tab .nav-tabs .nav-link.active {
  background: var(--primary-color);
  color: #fff;
  border-radius: 5px;
}

.sidebar-tab .nav-tabs .nav-link:focus, 
.sidebar-tab .nav-tabs .nav-link:hover {
 border-color:transparent; 
 background: var(--primary-color);
 color: #fff;
}

.sidebar-tab .nav-tabs .nav-link {
  box-shadow: 0 0 15px 5px rgba(0,0,0,0.1);
  margin-right: 10px;
  background: #fff;
  border-radius:5px;
}

/*.sidebar-tab .tab-content {
  margin-top: 15px;
  }*/

  .sidebar-tab .tab-news {
    box-shadow: 0 1px 5px 1px rgba(0,0,0,.15);
    padding: 20px;
    position: relative;
    top: -20px;
    background: #fafafa;
  }

  .sidebar-tab .tab-news .latest-story-card {
    /*border-bottom: 1px solid #eee;*/
    background: #fff;
    margin-bottom:15px;
    margin-top: 15px;
  }

  .nav-link:focus, 
  .nav-link:hover,
  .nav-pills .nav-link.active, 
  .nav-pills .show>.nav-link {
    background: var(--primary-color);
    color: #fff;
  }

  .nav-pills .nav-link {
    box-shadow: 0 0 15px 5px rgba(0,0,0,0.1);
    margin-right: 10px;
  }

  .tab-rows {
    justify-content:center;
    align-items: center;
  }

  .tab-rows .sub-title h6 {
    margin-bottom: 0;
    font-size: 13px;
  }

  .btn3 {
    color: #fff;
    border: 2px solid var(--primary-color);
    transition: all 0.5s ease;
    padding: 5px 10px !important;
    background: var(--primary-color);
  }

  .breadcrumb .breadcrumb-item {
    font-size: 14px !important;
  }

  .breadcrumb .breadcrumb-item a {
    display: inline-block;
  }

  .breadcrumb-item.active {
    color: var(--primary-color);
  }
  /*news detail post ends*/














  /*galeery start*/
  .gallery {
    overflow: hidden;
    margin-bottom: 25px;
  }

  .image-list {
    height: 200px;
    overflow: hidden;
  }

  .image-list a {
    display: inline-block;
/*  width: 100%;
height: 100%;
overflow: hidden;*/
}

.lb-data .lb-caption,
.lb-data .lb-number { 
  color: #fff !important;
}

.album-slider-img {
  height:300px;
  width:100%;
  overflow:hidden;
}


.album-slider-img:hover img {
  transform:scale(1.1);
}
/*gallery ends*/


















/*recent publish detail start*/
.publish-detail-img {
  height:400px;
  overflow: hidden; 
}

.publish-detail {
/*  padding: 50px 25px;
position: relative;*/
}

.publish-detail .content p strong {
  display: block;
  font-size: 14px;
}

.publish-detail .content p  {
  font-size: 12px;
}

.publisher {
  line-height: 16px;
}

.publisher strong {
  font-size: 14px;
  color: #62646a;
  display: block;
}

.publisher span {
  font-size: 12px;
}

.publish-detail .title,
.publish-detail .content,
{
  /*padding: 0 30px;*/
}
/*
.link-list {
background: #f8f9fa;
padding: 30px !important;
}*/

.meta-content {
  justify-content: center;
  align-items: center;
}

.link-list .sub-title h6,
.link-list ul li a:hover {
  color: var(--primary-color) !important;
}

.link-list ul li {
  padding:5px 30px;
  position: relative;
  /*margin-left: 25px;*/
  /*border-bottom: 2px solid #fff;*/
}

.link-list ul li:active a {
  color: var(--primary-color);
}

.link-list ul li:last-child {
  border-bottom: none;
}

/*.link-list ul li a {
padding: 5px 0;
}*/

.link-list ul li:before {
  content:'\f249';
  font-family: "Font Awesome 5 Free";
  display: inline-block;
  padding-right: 3px;
  vertical-align: middle;
  font-weight: 900;
  position: absolute;
  left: 0;
}
/*recent publush detail ends*/












/*notice start*/
.notice-detail {
  padding: 30px;
}
.read-more-content {
  display: none;
}

.read-more-btn {
  cursor: pointer;
  margin-top: 15px;
  color: var(--primary-color) !important;
}

.read-more-btn:hover {
  color: var(--primary-color) !important;
  text-decoration: underline !important;
}

/*.notice-detail {
  margin-bottom: 25px;
  border-top: 2px solid var(--primary-color);
  }*/

/*.notice-detail:last-child {
  margin-bottom: 0;
  }*/

  .notice-detail .content p {
    margin-top: 15px;
  }

  .notice-detail .title h5 {
    color: var(--primary-color) !important;
  }

  .notice-detail-content .share-plugin {
    border-top: 1px solid #ddd;
    margin-top: 10px;
    padding: 10px 0 0 0;
  }

  .notice-detail-content .share-plugin ul li {
    margin-bottom: 0
  }

  .notice .sidebar.stick ,
  .notice .sidebar.abs {
    width: 350px;
    box-shadow: none;
  }

  .read-more-content ul {
    padding-left: 15px !important;
  }

  .read-more-content ul li {
    list-style: circle !important;
  }
  /*notice end*/















  /*project list start*/
  .carousel-img {
    height: 600px;
    overflow: hidden;
  }

  #projectCarousel .carousel-item .banner-feature h1 {
    font-size: 30px;
  }

  .project-list {
    padding-top: 0;
  }

  .project .sidebar.stick {
    width: 285px;
  }

  .project .sidebar.abs {
    width: 285px;
  }

  .related-news-list {
    /*padding: 0 20px 20px 20px;*/
  }

  .related-news {
    background: #fafafa;
    /*border-top: 1px solid #ddd;*/
    padding: 20px;
    /*  border: 1px solid var(--primary-color);*/
  }

  .related-news-img {
    height: 125px;
    overflow: hidden;
  }

  .related-news-card:hover .content h6 {
    color: #1a3667 !important;
  }

  .related-news-card .content span {
    color:#626262 !important;
  } 

  .related-news a,
  .project .news-detail-post .content p a {
    display: inline-block;
  }


  .related-news .content p,
  .related-news .content p a {
    font-size: 12px;
    line-height: 15px;
    height: 15px;
  }

  .related-news .content p a {
    color: var(--primary-color);
  }

  .related-new-detail {
    padding: 10px 0;
  }

  .project .news-detail-post .content .title a:hover h4 {
    color: var(--primary-color) !important;
  }

  .publication-carousel .owl-nav button::before  {
    content: '\f054';
    font-family: "Font Awesome 5 Free";
    display: inline-block;
    vertical-align: middle;
    font-weight: 900;
    color: var(--secondary-color);
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
  }

  .publication-carousel .owl-nav button {
    height: 20px;
    width: 20px;
    background: #fff !important;
    position: absolute;
    top: 50%;
  }

  .publication-carousel .owl-nav button.owl-prev {
    left: -2px;
    transform: rotate(180deg);
  } 

  .publication-carousel .owl-nav button.owl-next {
    right: -2px;
  } 

  .publication-carousel .owl-nav button span {
    display: none;
  }

  .publication-carousel .owl-nav button::before {
    font-size: 12px;
  }

  .publication-carousel .caroursel-news-title .title h4 {
    font-size: 16px;
  }

  .left-col .related-news {
    border-top: none;
  }

  .newsletter-list-img {
    height: 350px;
  }



  .search-input .form-group,
  .sidebar .form-group  {
    position: relative;
  }

  .search-input .form-group button,
  .sidebar .form-group button{
    position: absolute;
    top:0;
    right: 0;
    margin: 0;
    height: 100%;
  }

  .search-input .form-group .form-group {
    padding-right: 55px;
  }

  .search-input .title h5,
  .sidebar .title h5 {
    color: var(--primary-color) !important;
  }

  .project-report-list tbody td {
   font-size: 14px;
 }

 .project-report-list .td-download {
   color: var(--secondary-color);
   font-style: italic;
 }

 .internation-publication li {
  list-style: disc;
}
/*project list ends*/

















/*events start*/
.event-card {
  background: #eaeaf3;
  padding: 25px;
}

.date {
  font-size: 30px;
  line-height: 22px;
  color: #3b416e;
}

.date span {
  display: block;
  color: #3b416e;
  font-size: 14px;
}

.event-card .content {
  margin-top: 50px;
}

.event-card .content .title h4{
  color: #3b416e !important;
}

.meta-time p {
  color: var(--primary-color);
}

.notice-detail {
  border-top: none;
}

.event-detail .post-date {
  text-shadow: none;
  color: #62646a !important;
}

.location-detail iframe {
  width: 100%;
  height: 335px;
}
/*events ends*/












.thumbs img {
  width: 16%;
  height: 120px;
  object-fit: contain;
}

.preview {
  width: 100%;
  overflow: hidden;
}

.preview img {
  width: 100%;
  height: auto;

}

.thumbs > div .img-preview-content {
  display: none;
}

.img-preview {
  position: relative;
}

.preview p {
  color: #fff;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  z-index: 99999;
  width: 100%;
  padding: 10px 20px;
  background: rgba(0,0,0,0.5);
}


.video-card {
  position: relative;
  transition: all 0.6s ease;
}

.video-card-img {
  height: 270px;
  width: 100%;
  overflow: hidden;
  border-radius: 5px;
  transition: all 0.6s ease;
}

.video-card-img img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  transform: scale(1.5);
}

.video-card-img:hover {
  transform: translateY(-10px);
}

.video-card:before {
  content: '';
  position: absolute;
  border: white solid 4px;
  top: 4px;
  left: 4px;
  right: 4px;
  bottom: 4px;
  opacity: 0;
  transition: all 0.6s ease;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: opacity;
  transition-property: opacity;
  visibility: hidden;
}

.video-card:hover:before {
  opacity: 1;
  z-index: 2;
  visibility: visible;
}

.video-card-title {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  padding:0 20px;
  z-index: 2;
}

.video-card-title h6 {
  color: #fff !important;
  text-align: center;
  text-shadow: 1px 1px 5px #000;
  font-weight: 600;
}

.video-card-img:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  background: rgba(0,0,0,0.3);
  height: 100%;
  width: 100%;
  z-index: 1;
}








/* search btn starts*/
#search-btn{
  padding: 10px;
  border-radius: 2px;
  color: #fff;
  background: var(--primary-color);
  margin-left: 20px;
}

#search-btn:hover{
  cursor: pointer;

}

#search-overlay{
  display:none;
  z-index: 9;
}

.block {
  position: fixed;
  top: 0;
  right: 0;
  bottom:0 ;
  left: 0;
  overflow: auto;
  text-align: center;
  background: rgba(0, 0, 0, 0.9);
  border: #a0a0a0 solid 1px;
  margin: 0;
}

.block:before {
  content: '';
  display: inline-block;
  height: 100%;
  vertical-align: middle;
  margin-right: 0;
}

.centered {
  display: inline-block;
  vertical-align: middle;
  width: 50%;
  padding: 10px 15px;
  color: #FFF;
  border: none;
  background: transparent;
}

#search-box {
  position: relative;
  width: 100%;
  margin: 0;
}

#search-form .form-control {
  display: inline-block;
  padding-right: 55px !important;
}

#search-form button {
  display: inline-block;
  background: transparent !important;
  border:none !important;
  color: #ddd;
  position: absolute;
  right: 34px;
  bottom: 0;
  height: 100%;
}

#search-box input[type="text"] {
  width: 90%;
  padding: 20px;
  color: #333;
  outline: none;
  font-size: 1.4em;
}

#close-btn{
  position: fixed;
  top: 1em;
  right: 1em;
  height: 50px;
  width: 50px;
  background: var(--primary-color);
  border-radius: 50%;
  transition: all 0.6s ease; 
}

#close-btn:hover{
  background: #fff;
  color: var(--primary-color);
  cursor: pointer;
}

#search-box .fa-times:before {
  position: relative;
  top: 9px;
}

#search-box button i {
  font-size: 30px;
  color: var(--primary-color);
}
/* search btn ends */


.result .latest-story-card {
  background: none;
  margin-bottom: 15px;
  padding-bottom: 15px;
}

.result .popular-post-img {
  height: 150px;
}

.page-item.active .page-link {
  color: #fff !important;
  z-index: 3;
  color: #fff;
  background-color: var(--primary-color);
  border-color: var(--primary-color);
}




.contact-form-card{
  padding: 50px;
  text-align: center;
  box-shadow: 0 -3px 9px 2px rgb(0,0,0,0.1);
}
.contact-form-card label{
  text-align: left;
  font-size: 16px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.contact-form-card input{
  border: none;
  border-bottom: 2px solid #adadad;
  border-radius: 0;
  padding-left: 0;
  margin-top: 30px;
}
.contact-form-card input:hover{
  border-bottom: 2px solid var(--primary-color);
  transition: 0.4s;
}
.contact-form-card input:focus{
  border-bottom: 2px solid var(--primary-color);
}
.contact-form-card textarea{
  border: none;
  border-bottom: 2px solid #adadad;
  border-radius: 0;
  padding-left: 0;
  margin-top: 30px;
}
.contact-form-card textarea:hover{
  border-bottom: 2px solid var(--primary-color);
  transition: 0.4s;
}
.contact-form-card textarea:focus{
  border-bottom: 2px solid var(--primary-color);
}

.contact-card {
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: 100%;
  width: 100%;
  /*border-left: 1px solid #ddd;*/
  padding-left: 50px;
}

.map iframe {
  width:100%;
  height:400px;
}

.g-recaptcha {
  display: flex;
  justify-content: center;
  align-items:center;
}













/*career start*/
.our-career .title h3 {
  color: var(--primary-color) !important;
}

.career-card {
  background:#fff;
  box-shadow: 0px -1px 16px -6px #B9B8C6;
  height:200px;
  padding:20px;
  border-left:3px solid var(--primary-color);
  margin-top:20px;
  transition:all 0.5s ease;
}

.career-card:hover {
  box-shadow: 0 6px 8px 0 rgb(54 77 114 / 8%), 0 2px 4px 0 rgb(54 77 114 / 18%);
  transform: translateY(-2px);
}

.popular-post .sidebar .career-card {
  padding:10px;
  box-shadow:none;
  height:auto;
  border-left:none;
}
.gmail-share-button{
  background-color: #EA4335;
  padding: 3px 8px;
  border-radius: 3px;
  color:#fff;
  font-size:13px;
}
.gmail-share-button:hover{
  color:#fff;
  background-color:#BB001B;
}








.publish-table tbody tr th {
  width: 26%;
}

.publish-table td, .table th {
  padding: 3px 0;
  font-size: 12px;
}

.publish-table td span a {
  font-size: 12px;
}

.publish-table td span i {
  color: #00A651;
}









/*new changes*/
/*home impact*/
.listar-feature-item-wrapper {
  padding-right: 27px;
}

.listar-feature-item.listar-feature-has-link
~ .listar-feature-fix-bottom-padding.listar-fix-feature-arrow-button-height {
  position: relative;
  display: block;
  width: 100%;
  height: 30px;
}

.listar-feature-item .listar-feature-item-inner {
  padding: 50px 30px;
  border-radius: 6px;
  z-index: 5;
  position: relative;
  height: 100%;
}

.listar-feature-right-border {
  position: absolute;
  width: calc(100% + 24px);
  height: calc(100% + 24px);
  top: -12px;
  left: 50%;
  overflow: hidden;
}

.listar-feature-right-border:before,
.listar-hovering-features
.listar-feature-item
a:hover
~ .listar-feature-item-inner
.listar-feature-right-border:before,
.listar-hovering-features-grey
.listar-feature-item
a:hover
~ .listar-feature-item-inner
.listar-feature-right-border:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  border: 11px solid #258bd5;
  border-radius: 800px;
  left: -50%;
}

.listar-feature-item.listar-feature-has-link .listar-feature-item-inner:after {
  content: "";
  background-color: #fff;
  z-index: 6;
  position: absolute;
  background-repeat: no-repeat;
  background-position: center center;
}

.listar-feature-icon-wrapper {
  width: 50px;
  height: 50px;
  line-height: 50px;
  border-radius: 500px;
  position: relative;
  background-color: #fff;
  box-shadow: 8px 8px 30px rgba(0, 0, 0, 0.06);
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  left: 50%;
  vertical-align: middle;
  margin-left: -44px;
  top: -17px;
  margin-top: -74px;
}

.listar-feature-with-image .listar-feature-content-wrapper {
  top: 10px;
}


.listar-feature-item .listar-feature-item-title {
  padding-top: 0;
  margin: 0 0 20px;
  text-align: center;
  line-height: 1.5;
}

.listar-feature-item .listar-feature-item-title > span {
  box-shadow: 15px 20px 30px rgba(80, 80, 80, 0.12),
  5px 0px 40px rgba(80, 80, 80, 0.1);
  padding: 10px 20px;
  display: inline-block;
  position: relative;
  background-color: #fff;
}

.listar-feature-item .listar-feature-item-title span {
  display: inline-block;
  font-size: 14px;
  line-height: normal;
  font-weight: 400;
  text-shadow: none;
  border-radius: 50px;
  color: #252525;
  font-size: 18px;
}

.pset {
  padding-top: 100px;
  overflow: hidden;
}

.listar-feature-item.listar-feature-has-link .listar-feature-item-inner:after {
  margin-left: -25px;
  width: 50px; 
  height: 50px;
  border-radius: 50px;
  box-shadow: 10px 10px 40px rgba(80, 80, 80, 0.15),
  15px 15px 30px rgba(80, 80, 80, 0.05), 0 0 120px rgba(80, 80, 80, 0.6);
  bottom: -30px;
  /*background-image: url("https://image.flaticon.com/icons/svg/2316/2316674.svg");*/
  background-size: 40%;
  color: #555;
  line-height: 52px;
}




/*home ongoing tabs*/
.ongoing-tab-publication-img {
  height: 480px;
}
.ongoing-tab-news .carousel-news-img {
  height: 200px;
}
.owl-theme .owl-nav {
  position: absolute;
  top: 0;
  right: 10px;
}
.owl-nav button {
  height: 25px;
  width: 25px;
  background: #fff !important;
}
.btn-view-all {
  display: inline-block;
  color: #fff;
  border-color: #fff;
  background: 0 0;
  text-align: left;
}
.btn-view-all:hover {
  color: #000;
  background: #fff;
}
.project-donor {
  margin-bottom: 20px;
}
.project-donor .title {
  margin-bottom: 15px;
}
.project-donor-img {
  height: 100px;
  width: 100%;
  transition: all 0.5s ease;
  overflow: hidden;
  border: 1px solid #fff;

}
.project-donor-img img {
  height: 100%;
  width: 100%;
  object-fit: contain;
  transition: all 0.5s ease;
}
.project-donor-img:hover {
  border: 1px solid #ddd;
}
.project-donor-img a {
  display: block;
}
.lb-image {
    height:450px !important;
}


