/* CSS Index
============================
1. reset
2. header
3. slider
4. about-area
5. features-box
6. department
7. team
8. video-area
9. counter

============================
*/


.dcaf-navy {
	color: #0f2652!important;
}

.dcaf-green {
	color: #006a66!important;
}

.dcaf-teal {
	color: #00b2a9!important;
}

.mb-30 {
	margin-bottom: 30px!important;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'saira', sans-serif!important;
    color: var(--dcaf-navy)!important;
    line-height: 1.2em!important;
    font-weight: 700!important;
    text-transform: inherit;
}


/*=============================
	1. Fonts
===============================*/

@font-face {
    font-family: 'Normal';
    font-style: normal;
    font-weight: 300;
    src:
        url('../fonts/Normal-Light.woff2') format('woff2'),
        url('../fonts/Normal-Light.woff') format('woff');
}

@font-face {
    font-family: 'Normal';
    font-style: normal;
    font-weight: 400;
    src:
        url('../fonts/Normal-Regular.woff2') format('woff2'),
        url('../fonts/Normal-Regular.woff') format('woff');
}

@font-face {
    font-family: 'Normal';
    font-style: normal;
    font-weight: 700;
    src:
        url('../fonts/Normal-Bold.woff2') format('woff2'),
        url('../fonts/Normal-Bold.woff') format('woff');
}


.bg-section,
.page-title,
.page-title h1 {
	display: none;
}

.transparent-header {
	height: 144px!important;
	background-color: var(--dcaf-navy)!important;
}

header .navbar {
	padding: 21px 0!important;
}


.list-wrap {
    margin: 0px;
    padding: 0px;
}

.list-wrap li {
    list-style: none
}

hr {
    border-bottom: 1px solid var(--dcaf-navy);
    border-top: 0 none;
    margin: 30px 0;
    padding: 0;
}

label {
    color: var(--dcaf-grey);
    cursor: pointer;
    font-size: 16px;
    font-weight: 400;
}

*::-moz-selection {
    background: var(--dcaf-navy);
    color: var(--dcaf-navy);
    text-shadow: none;
}

::-moz-selection {
    background: var(--dcaf-navy);
    color: var(--dcaf-navy);
    text-shadow: none;
}

::selection {
    background: var(--dcaf-navy);
    color: var(--dcaf-navy);
    text-shadow: none;
}

*::-moz-placeholder {
    color: var(--dcaf-grey);
    font-size: 18px;
    opacity: 1;
}

*::placeholder {
    color: var(--dcaf-grey);
    font-size: 18px;
    opacity: 1;
}



/*=============================
	AR Header
===============================*/
.ar-header {
    position: absolute;
    display: block;
    width: 100%;
    z-index: 99;
    top: 0;
    left: 0;
    right: 0;
    border-bottom: 1px solid rgba(255,255,255, 0.14);
}

.ar-header .auto-container {
    max-width: 1670px;
    width: 100%;
}

.ar-header__inner {
    position: relative;
    width: 100%;
}

.ar-header .menu-wrap {
    position: relative;
    display: block;
}

.ar-header .menu-area__inner {
    position: relative;
    display: block;
}

.ar-header .ar-nav {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
}

.ar-header .ar-nav.affix {
	position: relative!important;
}

.ar-header .navbar-wrap {
    position: relative;
}

.ar-header .navbar-wrap ul {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    padding: 0 0;
    margin: 0 0 0 auto;
		justify-content: flex-end;
}

.ar-header .navbar-wrap ul li {
    position: relative;
    display: block;
    list-style: none;
}

.ar-header .navbar-wrap ul li+li {
    margin-left: 60px;
}

.ar-header .navbar-wrap ul li a {
    position: relative;
    display: block;
    color: #fff!important;
    font-size: 18px;
    line-height: 24px;
    font-weight: 600;
    text-decoration: none;
    padding: 43.5px 0px 42.5px;
    z-index: 1;
}

.ar-header .navbar-wrap>ul>li::after {
    position: absolute;
    left: 0;
    bottom: 0;
    right: 0;
    height: 2px;
    background: var(--dcaf-yellow);
    border-radius: 0px;
    transition: transform 700ms ease;
    transform: scale(0, 1);
    transform-origin: left center;
    content: "";
}

.ar-header .navbar-wrap>ul>li.active:after,
.ar-header .navbar-wrap>ul>li:hover:after {
    transform: scale(1, 1);
    transform-origin: left center;
}

.ar-header .navbar-wrap>ul>li.active>a,
.ar-header .navbar-wrap>ul>li:hover>a {
    color: var(--dcaf-yellow);
}



/*=============================
	Sec Title CSS
===============================*/
.sec-title {
    position: relative;
    display: block;
    margin-top: -7px;
    padding-bottom: 57px;
}

.sec-title .sub-title {
    position: relative;
    display: block;
    margin-bottom: 10px;
}

.sec-title .sub-title h5 {
    color: var(--dcaf-navy);
    font-size: 16px;
    line-height: 26px;
    font-weight: 700;
    letter-spacing: 0.016em;
}

.sec-title h2 {
    color: var(--dcaf-navy);
    font-size: 44px;
    line-height: 60px;
    font-weight: 700;
    text-transform: none;
	margin-bottom: 0;
}

.sec-title p {
	  font-family: 'Normal', sans-serif;
    font-size: 18px !important;
    color: #000 !important;
    line-height: 1.4;
}


/*=============================
	Thm Btn
===============================*/
.thm-btn {
    position: relative;
    display: inline-flex;
    align-items: center;
    overflow: hidden;
    padding-top: 10px;
    padding-left: 45px;
    padding-right: 45px;
    padding-bottom: 10px;
    background-color: transparent;
    color: #fff!important;
    font-size: 16px;
    line-height: 40px;
    font-weight: 600;
	text-decoration: none;
    letter-spacing: 0.018em;
    font-family: var(--thm-font);
    border-radius: 0px;
    -webkit-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    transition: all 0.3s linear;
    z-index: 2;
}

.thm-btn:after {
    content: "";
    position: absolute;
    top: 0px;
    left: 0px;
    bottom: 0px;
    right: 0px;
    opacity: 1;
    transform: scaleX(1);
    transition-duration: 800ms;
    background-color: var(--dcaf-dark-green);
    z-index: -1;
}


/*.thm-btn:hover:after {
    transform: scaleX(0);
    transition-duration: 1500ms;
}*/

.thm-btn:before {
    position: absolute;
    top: 0px;
    left: 100%;
    right: -50px;
    content: "";
    background: var(--dcaf-green);
    -webkit-transform: translateY(100%);
    transform: translateY(100%);
    border-radius: 0%;
    transition-duration: 800ms;
    z-index: 1;
    bottom: 0;
}

.thm-btn:hover:before {
    left: 0px;
    right: 0px;
    -webkit-transform: translateX(0);
    transform: translateX(0);
}

.thm-btn .txt {
    position: relative;
    display: inline-flex;
    align-items: center;
    z-index: 1;
}

.thm-btn:hover,
.thm-btn:focus {
    color: #fff!important;
    -webkit-box-shadow: 2px 2px 20px 0px rgba(15,38,82, 0.1);
    -moz-box-shadow: 2px 2px 20px 0px rgba(15,38,82, 0.1);
    box-shadow: 2px 2px 20px 0px rgba(15,38,82, 0.1);
}





/*==================================
 HERO
====================================*/
.main-slider {
    position: relative;
    display: block;
    z-index: 1;
		padding-top: 0;
}

.main-slider .image-layer {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-attachment: scroll;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transition: -webkit-transform 7500ms ease;
    transition: -webkit-transform 7500ms ease;
    transition: transform 7500ms ease;
    transition: transform 7500ms ease, -webkit-transform 7500ms ease;
    z-index: 1;
}

.main-slider.main-slider .swiper-slide-active .image-layer {
    -webkit-transform: scale(1.07);
    transform: scale(1.07);
}

.main-slider .image-layer::before {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background: rgba(0,0,0, 0.6);
    content: "";
    z-index: -1;
}

.main-slider .shape1 {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    -webkit-transition: all 1200ms ease;
    transition: all 1200ms ease;
    -webkit-transform: translateX(-80px);
    transform: translateX(-80px);
    z-index: 1;
}

.main-slider .swiper-slide-active .shape1 {
    opacity: 1;
    filter: blur(0);
    -webkit-transform: translateX(0);
		transform: translateX(0);
    -webkit-transition-delay: 300ms;
		transition-delay: 300ms;
}

.main-slider__single {
    position: relative;
    display: block;
    padding: 300px 0 144px 0;
    z-index: 1;
}

.main-slider__content {
    position: relative;
    display: block;
    z-index: 3;
	text-align: right;
}

.main-slider__content .shape2 {
    position: absolute;
    bottom: 35px;
    right: 0;
    z-index: -1;
}

.main-slider__content h3 {
    color: var(--dcaf-yellow)!important;
    font-size: 60px;
    font-weight: 700;
    letter-spacing: -0.03em;
    margin-right: 89px;
    opacity: 0;
    -webkit-transition: all 1000ms ease;
    transition: all 1000ms ease;
    -webkit-transform: translateY(80px);
    transform: translateY(80px);
    z-index: 5;
}

.main-slider__content h5 {
    color: #fff!important;
    font-size: 30px;
    font-weight: 500!important;
		text-transform: none!important;
    letter-spacing: -0.03em;
	  margin-top: 34px;
    margin-right: 89px;
    opacity: 0;
    -webkit-transition: all 1000ms ease;
    transition: all 1000ms ease;
    -webkit-transform: translateY(80px);
    transform: translateY(80px);
    z-index: 5;
}

.main-slider .swiper-slide-active .main-slider__content h3,
.main-slider .swiper-slide-active .main-slider__content h5 {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
    -webkit-transition-delay: 900ms;
    transition-delay: 900ms;
}



.main-slider__content .btn-box {
    display: block;
    text-align: left;
    opacity: 0;
    -webkit-transition: all 1500ms ease;
    transition: all 1500ms ease;
    -webkit-transform: translateY(80px);
    transform: translateY(80px);
    z-index: 5;
	position: absolute;
	top: 0;
	left: 21px;
}

.main-slider .swiper-slide-active .main-slider__content .btn-box {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
    -webkit-transition-delay: 1500ms;
    transition-delay: 1500ms;
}

.main-slider__content .btn-box .btn-one {
    position: relative;
    display: block;
	margin-bottom: 21px;
}

.main-slider__content .btn-box .btn-one .thm-btn::before {
    background: var(--dcaf-yellow);
}

.main-slider__content .btn-box .btn-two {
    position: relative;
    display: block;
}

.main-slider__content .btn-box .btn-two a {
    position: relative;
    display: block;
	text-decoration: none;
}

.main-slider__icon {
    position: relative;
    display: flex;
    align-items: center;
}

.main-slider__icon i {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    overflow: hidden;
    color: var(--dcaf-dark-green);
    font-size: 34px;
    font-weight: 700;
}

.main-slider__icon span {
    position: relative;
    display: inline-block;
    color: var(--dcaf-dark-green);
    font-size: 20px;
    line-height: 26px;
    font-weight: 600;
    text-transform: capitalize;
}


#main-slider__pagination {
    position: absolute;
    top: 49%;
    left: 140px;
    width: 0px;
    z-index: 55;
}

#main-slider__pagination .swiper-pagination-bullet {
    position: relative;
    display: block;
    width: 20px;
    height: 20px;
    margin: 15px 0px;
    background: transparent;
    border: 1px solid #fff;
    border-radius: 50%;
    opacity: 1;
    transition: all 200ms linear;
    transition-delay: 0.1s;
}

#main-slider__pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
    background: transparent;
}

#main-slider__pagination .swiper-pagination-bullet::before {
    position: absolute;
    top: -1px;
    left: -1px;
    bottom: -1px;
    right: -1px;
    background: #fff;
    border-radius: 50%;
    transform: scale(1.0);
    transition: all 400ms linear;
    transition-delay: 0.1s;
    opacity: 1;
    content: "";
}

#main-slider__pagination .swiper-pagination-bullet.swiper-pagination-bullet-active::before {
    background: transparent;
    transform: scale(0.5);
    opacity: 0;
}






.theme-overlay {
    position: relative
}

.theme-overlay::before {
    background: var(--dcaf-navy) none repeat scroll 0 0;
    content: "";
    height: 100%;
    left: 0;
    opacity: 0.6;
    position: absolute;
    top: 0;
    width: 100%;
}

.separator {
    border-top: 1px solid var(--dcaf-navy);
}

.auto-container {
    position: static;
    max-width: 1320px;
    width: 100%;
    padding: 0px 15px;
    margin: 0 auto;
}


.custom-container {
    max-width: 1320px;
}



/***
=============================================
FOREWORD
=============================================
***/
.foreword {
    position: relative;
    display: block;
    background: #fff;
    padding: 89px 0;
    z-index: 1;
}

.foreword .shape1 {
    position: absolute;
    bottom: 0;
    right: 89px;
    z-index: -1;
}

.foreword .row {
    align-items: center;
}

.foreword__img {
    position: relative;
    display: block;
    margin-right: -20px;
}

.foreword__img img {
    border-left: 13px solid var(--dcaf-green);
}

.foreword__content {
    position: relative;
    display: block;
    margin-left: 70px;
}

.foreword__content .sec-title {
    padding-bottom: 28px;
}

.foreword__content .text-box {
    position: relative;
    display: block;
}

.foreword__content .text-box p {
    margin: 0;
}

.foreword__content .btn-box {
    position: relative;
    display: block;
    margin-top: 45px;
}


/***
=============================================
Video One
=============================================
***/
.video-one {
    position: relative;
    display: block;
    padding: 89px;
    background: var(--dcaf-navy);
    z-index: 1;
}

.video-one__pattern {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    opacity: 0.2;
    text-align: center;
    z-index: -1;
}

.video-one .auto-container {
    max-width: 1620px;
    width: 100%;
}

.video-one__inner {
    position: relative;
    display: block;
    padding: 129px 0px 140px;
    z-index: 1;
}

.video-one__inner .shape1 {
    position: absolute;
    left: 635px;
    bottom: 185px;
}

.video-one__bg {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-attachment: scroll;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    z-index: -1;
}

.video-one__bg::before {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background: #020d23;
    opacity: 0.6;
    content: "";
    z-index: -2;
}

.video-one__inner .title-box {
    position: relative;
    display: block;
}

.video-one__inner .title-box h2 {
    color: #fff!important;
    font-size: 80px;
}

.video-one__video-btn {
    position: relative;
    display: block;
    margin-top: 37px;
}

.video-one__icon {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff!important;
    width: 140px;
    height: 140px;
    background: rgba(255,255,255, 0.15);
    border-radius: 50%;
    transition: all 200ms linear;
    transition-delay: 0.1s;
    margin: 0 auto;
	text-decoration: none;
}

.video-one__icon i {
	font-size: 34px;
}

.video-one__icon:hover {
    background: var(--dcaf-navy);
    color: #fff!important;
}

.video-one__icon::before,
.video-one__icon::after {
    position: absolute;
    width: 140px;
    height: 140px;
    border-radius: 50%;
    background: transparent;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-animation-delay: .9s;
    animation-delay: .9s;
    content: "";
    box-shadow: 0 0 0 0 rgb(255 255 255 / 60%);
    -webkit-animation: ripple 3s infinite;
    animation: ripple 3s infinite;
    transition: all .4s ease;
}

.video-one__icon::after {
    -webkit-animation-delay: .6s;
    animation-delay: .6s;
}

.video-one__icon span {
    position: relative;
    display: inline-block;
    font-size: 22px;
    line-height: 22px;
}




/***
=============================================
STORIES
=============================================
***/


section.stories {
    position: relative;
    display: block;
    padding: 120px 0 90px;
    background: var(--dcaf-green);
    z-index: 1;
}

section.stories::before {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    content: "";
    background-image: url("https://dev.dcaf.ch/sites/default/files/annual-report-2025/graphics/tessellation.png");
    background-repeat: repeat;
    background-position: center center;
	background-size: contain;
    opacity: 0.12;
    z-index: -1;
}

.stories .sec-title h2 {
  color: #fff!important;
	font-size: 89px;
	letter-spacing: 1px;
	margin-bottom: 34px;
}

.stories .sec-title p {
	color: #fff!important;
	line-height: 1.5;
	font-weight: 600!important;
}

.stories .sec-title p a {
	text-decoration: underline;
}


.story {
    position: relative;
    display: block;
    padding: 55px;
    margin-bottom: 34px;
    overflow: hidden;
    z-index: 1;
    text-decoration: none !important;
    color: inherit;
}

.story:hover,
.story:focus {
    text-decoration: none !important;
		box-shadow: 0 0 11px rgba(33,33,33,.2);
		background: rgba(255,255,255,0.1);
}

.story::after {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    border: 1px solid var(--dcaf-navy);
    content: "";
}

.story::before {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    transform: scaleX(0.8) rotateX(0deg);
    transition: all 0.4s linear;
    border-radius: 0px;
    opacity: 0;
    content: "";
    z-index: 1;
}

.story:hover::before {
    transform: scaleX(1.0) rotateX(0deg);
    transition: all 0.4s linear;
    opacity: 1;
}

.story .shape1 {
    position: absolute;
		display: flex;
		align-items: flex-end;
		height: 255px;
    bottom: 0;
    right: 0;
    opacity: 0;
    -webkit-transition: all 1200ms ease;
    transition: all 1200ms ease;
    -webkit-transform: translateX(80px);
    transform: translateX(80px);
	    filter: grayscale(100%);
    z-index: -1;
}

.story .shape1 img {
	height: 233px;
}

.story:hover .shape1 {
    opacity: 0.2;
    -webkit-transform: translateX(0);
    transform: translateX(0);
    -webkit-transition-delay: 300ms;
    transition-delay: 300ms;
}

.story-inner {
    position: relative;
    display: block;
    z-index: 5;
}

.story-row {
  display: flex;
  align-items: stretch;
}

.story-row > [class*="col-"] {
  float: none;
}

.count-text {
  color: #fff!important;
  font-size: 89px;
  font-weight: 700;
  display: flex;
	align-items: center;
	justify-content: center;
	height: calc(100% - 34px);
	font-family: saira,sans-serif;
}

.story-inner .content-box {
    position: relative;
    display: block;
}

.story-inner .content-box h2 {
    font-size: 34px;
    font-weight: 700;
    letter-spacing: -0.02em;
    margin-bottom: 18px;
	  color: #fff!important;
}

.story-inner .content-box p {
    color: #abafb5;
}

.story-inner .content-box .btn-box {
    position: relative;
    display: block;
    margin-top: 20px;
}

.story-inner .content-box .btn-box span {
    color: #fff !important;
    font-size: 18px;
    line-height: 24px;
    font-weight: 500;
    letter-spacing: 0.018em;
    transition: all 400ms linear;
    transition-delay: 0.1s;
		text-decoration: underline;
}

.story:hover .story-inner .content-box .btn-box span {
    color: var(--dcaf-navy);
}











/*=============================
PHOTO SECTION
===============================*/


.project-slider {
    overflow: visible!important;
}

.project-slider-prev {
    left: -60px;
}

.project-slider-next {
    right: -60px;
}

.photo {
    position: relative;
    display: block;
    background: #fff;
    padding: 120px 0px 90px;
    z-index: 1;
}

.photo .auto-container {
    max-width: 1940px;
    width: 100%;
    padding: 0px 5px;
}


/*=============================
PHOTO CARD
===============================*/

.photo__single {
    position: relative;
    display: block;
}


/*=============================
IMAGE WRAPPER
===============================*/

.photo__single-img {
    position: relative;
    display: block;
    overflow: hidden;
}

.photo__single-img img {
    width: 100%;
    display: block;
    transition: .7s ease;
    transform: scale(1);
}

.photo__single:hover .photo__single-img img {
    transform: scale(1.05);
}



/*=============================
IMAGE OVERLAY
===============================*/

.photo__single-img::before {
    position: absolute;
    top: 20px;
    left: 15px;
    right: 15px;
    bottom: 20px;

    background: rgba(0,0,0,0.65);

    content: "";

    opacity: 0;
    transition: 0.4s ease;

    z-index: 1;
}

.photo__single:hover .photo__single-img::before {
    opacity: 1;
}





/*=============================
MAGNIFY BUTTON
===============================*/

.overlay-btn {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;

    display: flex;
    align-items: center;
    justify-content: center;

    opacity: 0;

    transition: 0.4s ease;

    z-index: 5;
}

.photo__single:hover .overlay-btn {
    opacity: 1;
}

.overlay-btn a {
    width: 56px;
    height: 56px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--dcaf-dark-green);
    color: #fff!important;
	text-decoration: none;
    font-size: 20px;
    transition: 0.3s ease;
}

.overlay-btn a:hover {
    background: var(--dcaf-green);
    color: #fff!important;
}


/*=============================
CAPTION BELOW IMAGE
===============================*/

.photo__caption {
    padding: 18px 10px 0;
    text-align: center;
}

.photo__caption p {
    margin-bottom: 10px;
    font-size: 18px!important;
    font-weight: 700!important;
    color: #000!important;
		font-family: 'Normal', sans-serif;
}

.photo__caption h2 {
    margin: 0;
    font-size: 20px;
    line-height: 1.4;
    font-weight: 600;
    color: var(--dcaf-navy);
}


.swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction {
	bottom: -55px!important;
}

.swiper-pagination-bullet {
    width: 21px!important;
    height: 21px!important;
    background: var(--dcaf-navy)!important;
		opacity: 1!important;
}

.swiper-pagination-bullet:hover,
.swiper-pagination-bullet.swiper-pagination-bullet-active {
    background: var(--dcaf-green)!important;
}


/***
=============================================
Call To Action One
=============================================
***/
.call-to-action-one {
    position: relative;
    display: block;
    padding: 161px 0px 180px;
    z-index: 1;
}

.call-to-action-one__bg {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-attachment: scroll;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    z-index: -1;
}

.call-to-action-one__bg::before {
    position: absolute;
    top: 30px;
    left: 30px;
    bottom: 30px;
    right: 30px;
    background: rgba(255,255,255, 0.1);
    content: "";
}

.call-to-action-one__inner {
    position: relative;
    display: block;
}

.call-to-action-one__content {
    position: relative;
    display: block;
}

.call-to-action-one__content h2 {
    color: #fff!important;
    font-size: 80px;
}

.call-to-action-one__content h3 {
    color: #fff!important;
    font-size: 36px;
    line-height: 46px;
    font-weight: 500;
}

.call-to-action-one__content .btn-box {
    position: relative;
    display: block;
    margin-top: 39px;
}

.call-to-action-one__content .btn-box .thm-btn:before {
    background: var(--dcaf-navy);
}

.call-to-action-one__content .btn-box .thm-btn:after {
    background-color: var(--dcaf-navy);
}









/***
=============================================
DONORS AND FUNDERS
=============================================
***/


section.thank-you {
    position: relative;
    display: block;
    padding: 144px 0;
    background: var(--dcaf-navy);
    z-index: 1;
}

section.thank-you::before,
section.video-one::before {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    content: "";
    background-image: url("https://dev.dcaf.ch/sites/default/files/annual-report-2025/graphics/tessellation.png");
    background-repeat: repeat;
    background-position: center center;
	background-size: contain;
    opacity: 0.12;
    z-index: -1;
}

.thank-you__bg {
    position: absolute;
    top: 120px;
    left: 0;
    bottom: 120px;
    right: 0;
    width: calc((100% - 74px) / 2);
    background-position: top left;
    background-repeat: no-repeat;
    background-size: cover;
    z-index: 1;
}

@media (min-width: 992px) {
.thank-you .row {
    display: table;
    width: 100%;
}

.thank-you .row > [class*="col-"] {
    float: none;
    display: table-cell;
    vertical-align: top;
}
}

.thank-you__counter {
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: 2;
}

.thank-you__counter ul {
    position: relative;
    display: flex;
    align-items: center;
	padding-left: 0;
}

.thank-you__counter ul li {
    position: relative;
    width: 233px;
		height: 144px;
    background: var(--dcaf-navy);
		display: flex;
    align-items: top;
    justify-content: center;
		padding: 21px;
}

.thank-you__counter ul li:last-child {
    background: var(--dcaf-dark-green);
}

.thank-you__counter ul li .content-box {
    position: relative;
    display: block;
}

.thank-you__counter ul li .content-box h2 {
    color: #fff!important;
    font-weight: 700;
		font-size: 34px;
		margin-bottom: 0;
}

.thank-you__counter ul li .content-box h2 .plus {
    position: relative;
    display: inline-block;
    right: 5px;
		font-size: 21px;
}

.thank-you__counter ul li .content-box p {
    color: #fff!important;
    font-size: 18px;
    line-height: 26px;
    font-weight: 700;
}

.thank-you__img {
    position: absolute;
    right: 0;
    bottom: 377px;
    z-index: -1;
}

.thank-you__inner {
    position: relative;
    display: block;
}

.thank-you__box {
    position: relative;
    display: block;
    width: 100%;
    background: #fff;
    box-shadow: 0px 0px 60px 0px rgba(4, 23, 26, 0.06);
    padding: 34px 55px;
    float: right;
    z-index: 1;
}

.thank-you__box .title-box {
    position: relative;
    display: block;
    margin-bottom: 35px;
}

.thank-you__box .title-box h2 {
    font-size: 34px;
    line-height: 1.5;
    font-weight: 700;
    margin-bottom: 21px;
    letter-spacing: -0.04em;
}

.thank-you__box .title-box p {
    color: var(--dcaf-navy);
    font-size: 24px;
    font-weight: 500;
	line-height: 1.5;
}


.donor-flags {
    display: grid;
    grid-template-columns: repeat(3, auto);
    justify-content: center;
    gap: 20px 40px;
}

.donor-flags img {
    width: 54px;
    height: auto;
    display: block;
}


/* Swiss flag */
.donor-flags img:first-child {
    grid-column: 1 / -1;
    justify-self: center;
}




/* =====================================================
   KEY FIGURES
===================================================== */

.key-figures {
    position: relative;
    display: block;
    padding: 120px 0px 120px;
    z-index: 1;
}

.key-figures .row {
    align-items: center;
}

div.key-figures h2 {
    color: var(--dcaf-navy);
    font-size: 64px;
    line-height: 0.9em;
    font-weight: 500;
}

.key-figures__img {
    position: relative;
    display: block;
    z-index: 1;
	margin-top: 89px;
}

.key-figures__img ul {
    position: relative;
    display: flex;
    align-items: center;
	padding: 0;
}

.key-figures__img ul li {
    position: relative;
    display: block;
    padding: 0px 5px 0px;
}

.key-figures__img ul li .img-box {
    position: relative;
    display: block;
    overflow: hidden;
}

.key-figures__img ul li .img-box::before {
    background: rgba(255, 255, 255, 0.3);
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 0;
    opacity: 1;
    z-index: 8;
    pointer-events: none;
}

.key-figures__img ul li .img-box:hover::before {
    height: 100%;
    opacity: 0;
    -webkit-transition: all 400ms linear;
    transition: all 400ms linear;
}

.key-figures__img ul li .img-box img {
    width: 100%;
    transition: .5s ease;
    transform: scale(1.05);
}

.key-figures__img ul li .img-box:hover img {
    transform: scale(1);
}

.key-figures__content ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.key-figures__content .stat {
    margin-bottom: 60px;
}

.key-figures__content .inner {
    display: flex;
    align-items: center;
    gap: 30px;
}

.key-figures__content .icon-box {
    flex: 0 0 140px;
    text-align: center;
}

.key-figures__content .icon-box img {
    width: 140px;
    height: auto;
}

/* =====================================================
   TEXT
===================================================== */

.key-figures__content .intro,
.key-figures__content .label {
    margin: 0 0 10px 0;
    font-size: 24px!important;
	font-weight: 300!important;
    line-height: 1.2;
    color: var(--dcaf-navy)!important;
}

.key-figures__content .label {
 	white-space: normal;
 }

.key-figures__content .metric {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 10px;
}

.key-figures__content .number {
    display: inline-block;
    font-size: 5.5rem;
    line-height: 0.9;
    font-weight: 300;
    color: #082b68;
    flex-shrink: 0;
}


/* =====================================================
   INDIVIDUAL COLOURS
===================================================== */

.stat-laws .number {
    color: #16b7b2;
}

.stat-cso .number {
    color: #f2aa00;
}

.stat-gender .number {
    color: #16b7b2;
}

.stat-offices .number {
    color: #f2aa00;
}

.stat-countries .number {
    color: #082b68;
}

/* =====================================================
   SPECIAL CASES
===================================================== */

/* 51 item */
.stat-laws .metric {
    align-items: flex-start;
}

.stat-laws .number {
    font-size: 7rem;
}

/* 702 item */
.stat-cso .number {
    font-size: 6.5rem;
}

/* 194 / 57% */
.stat-gender .metric {
    margin-bottom: 15px;
}

/* 34% / 15 */
.stat-offices .metric {
    margin-bottom: 15px;
}

/* 60 countries */
.stat-countries .number {
    font-size: 6rem;
}

/* =====================================================
   MOBILE
===================================================== */

@media (max-width: 767px) {

    .key-figures__content .inner {
        flex-direction: column;
        text-align: center;
    }

    .key-figures__content .metric {
        justify-content: center;
    }

    .key-figures__content .number {
        font-size: 4rem;
    }

    .stat-laws .number,
    .stat-cso .number,
    .stat-countries .number {
        font-size: 4.5rem;
    }
}





/*=============================
	About Anniversary
===============================*/
.about-anniversary {
    position: relative;
    display: block;
    padding: 0px 0px 150px;
    z-index: 1;
		overflow: visible;
}

.about-anniversary .shape1 {
    position: absolute;
    right: 21px;
    bottom: 21px;
    z-index: -1;
}

.about-anniversary .shape1 img {
	max-width: 508px;
}

.experience-box {
    position: absolute;
    left: -130px;
    bottom: -233px;
    display: flex;
    align-items: center;
    z-index: 5;
}

.experience-box .counter-box {
    position: relative;
    display: block;
}

.experience-box h2,
.experience-box h3 {
    font-size: 120px;
    line-height: 0.9em;
    font-weight: 700;
	display: inline;
}

.experience-box h3 {
    font-size: 89px;
}

.experience-box .text-box {
    position: relative;
    display: block;
    margin-left: 15px;
}

.experience-box .text-box p {
    color: var(--dcaf-navy);
    line-height: 26px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.016em;
}


.about-anniversary__content {
    position: relative;
    display: block;
    margin-left: 80px;
    margin-top: 19px;
}

.about-anniversary__content .sec-title {
    position: relative;
    display: block;
    margin-top: -7px;
    padding-bottom: 29px;
}

.about-anniversary__content .text-box {
    position: relative;
    display: block;
}

.about-anniversary__content .text-box p {
    margin: 0;
}

.about-anniversary__content-bottom {
    position: relative;
    display: block;
    margin-top: 52px;
}

.about-anniversary__content-bottom-author-box {
    position: relative;
    display: flex;
    align-items: center;
}

.about-anniversary__content-bottom-author-box .btn-box {
    position: relative;
    display: block;
}

.about-anniversary__content-bottom-author-box .author-info {
    position: relative;
    display: flex;
    align-items: center;
    margin-left: 60px;
    flex: 1;
}

.about-anniversary__content-bottom-author-box .author-info .img-box {
    position: relative;
    display: block;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    border: 1px solid var(--dcaf-navy);
    overflow: hidden;
}

.about-anniversary__content-bottom-author-box .author-info .img-box img {
    width: 100%;
}

.about-anniversary__content-bottom-author-box .author-info .signature-box {
    position: relative;
    display: block;
    margin-left: 20px;
    flex: 1;
}

.about-anniversary__content-bottom-author-box .author-info .signature-box img {
    width: auto;
}

.about-anniversary__content-bottom .text {
    position: relative;
    display: block;
    margin-top: 54px;
}

.about-anniversary__content-bottom .text h4 {
    font-size: 18px;
    line-height: 26px;
    font-weight: 700;
}

.about-anniversary__content-bottom .text h4 a {
    color: var(--dcaf-navy);
}



/*=============================
Testimonials Two Testimonials Css
===============================*/
.testimonials-two--testimonials {
    position: relative;
    display: block;
    padding-bottom: 90px;
}

.testimonials-two--testimonials .testimonials-two__single {
    margin-bottom: 30px;
}




/***
=====================================================
NOT THE END
=====================================================
***/

.not-the-end {
    position: relative;
    display: block;
    padding: 120px 0 90px;
    overflow: hidden;
    z-index: 1;
}

.not-the-end .shape1 {
    position: absolute;
    left: 0;
    bottom: -20px;
    opacity: 0.7;
    z-index: -1;
}

/* Equal-height columns */
.not-the-end .row {
    display: flex;
    flex-wrap: wrap;
}

.not-the-end .col-xl-4,
.not-the-end .col-lg-4 {
    display: flex;
    margin-bottom: 30px;
}

.not-the-end__single {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    overflow: hidden;
    background: #fff;
    box-shadow: 0px 4px 60px 0px rgba(21, 24, 32, 0.06);
    padding: 60px 40px;
    z-index: 1;
}

.not-the-end__single::before {
    position: absolute;
    left: 0;
    bottom: 0;
    right: 0;
    height: 1px;
    background: var(--dcaf-navy);
    content: "";
}

.not-the-end__single .shape2 {
    position: absolute;
    top: 0;
    right: -101%;
    transition: all 0.7s ease;
    opacity: 0;
}

.not-the-end__single:hover .shape2 {
        right: -55px;
    opacity: 1;
    top: -21px;
}

.not-the-end__single-bg {
    position: absolute;
    top: 0;
    left: -101%;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    transition: all 0.6s ease;
    opacity: 0;
    z-index: -1;
}

.not-the-end__single:hover .not-the-end__single-bg {
    left: 0;
    opacity: 1;
}

.not-the-end__single-bg::before {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--dcaf-navy);
    opacity: 0.7;
    content: "";
}

.not-the-end__single-icon {
    position: relative;
    display: block;
    margin-bottom: 24px;
	width: 89px;
}

.not-the-end__single-icon i {
    position: relative;
    display: inline-block;
    color: var(--dcaf-navy);
    font-size: 65px;
    line-height: 65px;
}

.not-the-end__single-text {
    position: relative;
    display: block;
}

.not-the-end__single-text h2 {
    font-size: 26px;
    line-height: 36px;
    font-weight: 700;
    margin-bottom: 13px;
}

.not-the-end__single-text h2 a {
    color: var(--dcaf-navy);
    transition: all 200ms linear;
    transition-delay: 0.1s;
	border: none!important;
}

.not-the-end__single:hover .not-the-end__single-text h2 a {
    color: #fff!important;
	text-decoration: underline!important;
}

.not-the-end__single-text p {
    margin: 0;
    transition: all 200ms linear;
    transition-delay: 0.1s;
		color: #000!important;
		font-family: 'Normal', sans-serif;
		line-height: 1.4;
}

.not-the-end__single:hover .not-the-end__single-text p {
    color: #fff!important;
}

.not-the-end__single .btn-box {
    position: relative;
    display: block;
    margin-top: auto;
    padding-top: 40px;
}

.not-the-end__single .btn-box a {
    position: relative;
    display: inline-block;
    color: var(--dcaf-navy);
    font-size: 14px;
    line-height: 50px;
    font-weight: 700;
    letter-spacing: 0.018em;
	text-decoration: none;
    border: 1px solid #dcdcdc;
    padding: 0 20px;
    transition: all 200ms linear;
    transition-delay: 0.1s;
}

.not-the-end__single:hover .btn-box a,
.not-the-end__single .btn-box a:hover {
    background: var(--dcaf-dark-green);
    border-color: var(--dcaf-dark-green);
    color: #fff!important;
}

/* Tablet */
@media only screen and (max-width: 991px) {

    .not-the-end {
        padding: 100px 0 70px;
    }

    .not-the-end__single {
        padding: 50px 35px;
    }
}

/* Mobile */
@media only screen and (max-width: 767px) {

    .not-the-end {
        padding: 80px 0 50px;
    }

    .not-the-end__single {
        padding: 40px 30px;
    }

    .not-the-end__single-text h2 {
        font-size: 22px;
        line-height: 32px;
    }

    .not-the-end__single-icon i {
        font-size: 52px;
        line-height: 52px;
    }
}


@media only screen and (max-width: 1650px) {

.about-anniversary {
	padding: 0;
}

.experience-box {
		position: relative;
    left: 0;
    bottom: 0;
    display: block;
    z-index: 5;
}

.experience-box h2 {
    font-size: 100px;
}

.experience-box h3 {
    font-size: 76px;
}

.not-the-end {
	padding-top: 34px;
}


}


@media only screen and (max-width: 1560px) {

.about-anniversary .shape1 img {
	max-width: 440px;
}

}

@media only screen and (max-width: 1500px) {

.main-slider__content h3 {
	font-size: 55px;
}

}


@media only screen and (max-width: 1359px) {

.main-slider .shape1 {
	left: -89px;
}

.main-slider__content h3 {
	font-size: 48px;
}

.sec-title h2 {
	font-size: 34px;
}

.main-slider__content h5 {
	font-size: 26px;
}

}


@media only screen and (max-width: 1200px) {

.main-slider .swiper-slide-active .shape1 {
	display: none;
}

div.foreword__content .sec-title h2 {
	font-size: 28px;
}

.foreword__content .btn-box {
	margin-top: 34px;
}

.thm-btn {
	padding: 8px 34px;
}

.main-slider__content .btn-box {
	position: relative;
	text-align: right;
	margin: 144px 89px 0 0;
}

.main-slider__icon {
	justify-content: flex-end;
}

.main-slider__icon i,
.main-slider__icon span {
	color: #fff!important;
}

.foreword__img .inner img {
	float: none;
}

.foreword__img {
	margin-bottom: 34px;
}

.foreword__content,
.key-figures {
	margin-left: 0;
	text-align: center;
}

.key-figures__img {
	margin-bottom: 89px;
}

.key-figures__img ul {
	justify-content: center;
	padding-left: 0;
}

.key-figures__content ul {
	padding-left: 0;
}

}


@media only screen and (max-width: 992px) {

.about-anniversary .shape1 {
	display: none;
}

.main-slider .swiper-slide-active .main-slider__content h3, 
.main-slider .swiper-slide-active .main-slider__content h5 {
	text-align: center;
	margin-right: 0;
}

.key-figures {
	padding-top: 0;
}

.video-one__inner .title-box h2,
.call-to-action-one__content h2,
div.key-figures h2 {
	font-size: 55px;
}

.call-to-action-one__content h3 {
	font-size: 26px;
}

.foreword__img .inner img {
	max-width: 100%;
}

.key-figures__content {
	margin-left: 0;
}

.key-figures__content ul li {
	padding-bottom: 0;
}

.key-figures__content ul li .inner .content-box {
	height: auto;
	padding-bottom: 21px;
}

.key-figures__content ul li .inner {
	padding-left: 0;
}

.key-figures__content ul li .inner .icon-box {
	position: relative;
	width: 100%;
}

.key-figures__content ul li .inner .icon-box img {
	width: 144px;
		margin-bottom: 21px;
}

.video-one {
	padding: 0;
}

.story-inner .content-box h2 {
	font-size: 26px;
}

}


@media only screen and (max-width: 767px) {
  .story-row {
    display: block;
  }

  .story-row > [class*="col-"] {
    float: left;
    width: 100%;
  }

  .count-text {
    height: auto;
    margin-bottom: 20px;
  }
  
.thank-you__counter {
    left: 0;
}

.thank-you__counter ul li {
	width: 50%;
	max-width: 50%;
}

.experience-box h3 {
	font-size: 55px;
}

}


@media only screen and (max-width: 500px) {

.ar-header {
	display:  none;
}

.main-slider__single {
	padding-top: 144px;
}

.sec-title h2 {
	font-size: 34px;
}

}