body{
	font-family: 'Libre Baskerville';	
}

.d-flex{
	display: flex!important;
}

.justify-items-center{
	justify-content: center!important;
}

.text-red{
	color: red;
}

.swal2-container{
	font-family: Montserrat;
}

.swal2-container button{
	background-color: #0e64cc!important;
	padding-right: 30px;
	padding-left: 30px;
}

.ff-primary{
	font-family: Baskervville!important;
}

.ff-secondary{
	font-family: Montserrat!important;
	text-decoration: none;
}

.ff-inherit{
	font-family: inherit!important;
}

.text-center{
	text-align: center!important;
}

.text-right{
	text-align: right!important;
}

.text-left{
	text-align: left!important;
}

.text-capitalize{
	text-transform: capitalize!important;
}

.text-uppercase{
	text-transform: uppercase!important;
}

.position-absolute{
	position: absolute!important;
}

.position-relative{
	position: relative!important;
}
.position-top{
	top: 0px!important;
}
.mt-none{
	margin-top: 0px!important;
}

.text-decoration-none{
	text-decoration: none!important;
}

.bg-white{
	background-color: white!important;
}

.content-width-and-margin {
	overflow-x: hidden;
	/* display: grid;
    grid-template-rows: 80px 45px 600px 50px 590px 50px 2365px 466px 247px 830px; */
	/**  the templates are named accordingly; 'header' 'shortcuts' 'Latest-Reporting-and-Image-Carousel' 'WHAT-WE-DO-CONTENT-SECTION' 'Our-Projects-Section-and-board-lists' 'Partner-lists' 'twitter-updates' 'footer-section' **/
}

* {
	box-sizing: border-box;
	margin: 0;
}

.header {
	display: flex;
	flex-direction: row;
	background: rgba(255, 255, 255, 0.85);
	backdrop-filter: blur(10px);
	height: 80px;
	width: 100%;
	margin-top: 0px;
	position: sticky;
	top: 0;
	z-index: 1000;
}

.left-section {
	position: relative;
	left: 4%;
	min-width: 30%;
}

.middle-section {
	display: flex;
	flex-direction: row;
	position: relative;
	width: 100%;
	align-items: center;
}

.right-section {
	display: flex;
	flex-direction: row;
	position: relative;
	align-items: center;
	justify-content: end;
	padding: 0px 10px;
}

.full-menu-section {
	margin: auto 30px;
}

.kimpact-logo {
	margin-top: 21px;
	width: 150px;
}

.email-and-phone {
	display: flex;
	flex-direction: row;
	font-size: 11.5px;
	font-family: Montserrat;
	font-weight: 600;
	color: #063B73;
	display: flex;
	flex-direction: row;
	gap: 30px;
}

.email {
	display: flex;
	flex-direction: row;
	gap: 10px;
}

.phone-numbers {
	display: flex;
	flex-direction: row;
	gap: 10px;
}

.search-bar {
	display: flex;
	flex-direction: row;
	width: 232px;
	height: 35px;
	background-color: #0E64CC;
	color: #ffffff;
	border-radius: 50px;
	margin-left: 0px;
	border: none;
	text-indent: 50px;
	font-size: 12px;
	font-family: Montserrat;
	font-weight: 400;
}

.search-link-alt {
	display: none;
    background-color: #0a2458;
    height: 30px;
    width: 30px;
    align-items: center;
    justify-content: center;
    border-radius: 100%;
	transition: all 0.5s;
}

.search-link-alt:hover {
    background-color: #0a2458a9;
    height: 35px;
    width: 35px;
	transition: all 0.5s;
}

.gcse-search,
.gsc-control-cse,
.gsc-control-wrapper-cse,
.gsc-search-box,
.gsc-search-box-tools,
.gsc-search-box .gsc-input,
.gsc-input-box {
    max-width: 100% !important;
    box-sizing: border-box !important;
}

.bar::placeholder {
	border: none;
	border-block: none;
	border-block-color: none;
	border-width: 0;
	color: #8fc5ff;
}

.bar {
	width: 200px;
	margin-left: 0px;
	background-color: #0E64CC;
	color: #ffffff;
	border: none;
	border: none;
	border-block: none;
	border-block-color: none;
	border-width: 0;
	margin-left: 15px;
	border-radius: 50px;
	text-indent: 5px;
}

.bar:active {
	border: none;
	border-color: #0E64CC
}

.shortcuts {
	display: flex;
	flex-direction: row;
	background-color: #0E64CC;
	height: 45px;
	width: 100%;
	align-items: center;
	gap: 50px;
	position: relative;
}

.kdi-links {
	display: flex;
	flex-direction: row;
	gap: 45px;
	margin-left: 30%;
	height: 100%;
}

.kdi-links>div {
	display: flex;
	align-items: center;
}

.who-we-are {
	font-size: 11px;
	font-family: Montserrat;
	font-weight: 400;
	color: #eaebec;
}

.who-we-are-link {
	color: #ffffff;
}

.what-we-do {
	display: flex;
	flex-direction: row;
	font-size: 11px;
	font-family: Montserrat;
	font-weight: 400;
	color: #eaebec;
	/* gap: 5px; */
	justify-self: center;

}

.what-we-do-DropDownArrow {
	margin-left: 5px;
	width: 13px;
}

.work-with-us {
	display: flex;
	flex-direction: row;
	font-size: 11px;
	font-family: Montserrat;
	font-weight: 400;
	color: #eaebec;
	/* gap: 5px; */
	justify-self: center;

}

.kdi-external-links {
	display: flex;
	flex-direction: row;
	gap: 40px;
}

.vTrack {
	align-self: center;
	align-items: center;
	display: flex;
	flex-direction: row;
	font-size: 11px;
	font-family: Montserrat;
	font-weight: 300;
	color: #ffffff;
	gap: 5px;
}

.Vtrack-LinkArrow {
	align-self: center;
}

.Radio-Access {
	align-self: center;
	align-items: center;
	display: flex;
	flex-direction: row;
	font-size: 11px;
	font-family: Montserrat;
	font-weight: 300;
	color: #ffffff;
	gap: 5px;
}

.EPT-Dashboard {
	align-self: center;
	align-items: center;
	display: flex;
	flex-direction: row;
	font-size: 11px;
	font-family: Montserrat;
	font-weight: 300;
	color: #ffffff;
	gap: 5px;
}

.Blog {
	font-size: 11px;
	font-family: Montserrat;
	font-weight: 300;
	color: #ffffff;
}

.Donate-Button {
	background-color: #ffffff;
	color: #0E64CC;
	border-radius: 50px;
	width: 80px;
	height: 25px;
	margin-left: 60px;
	border: none;
	font-size: 13px;
	font-family: Montserrat;
	font-weight: 500;
	color: #0E64CC;
}

.Latest-Reporting-and-Image-Carousel {
	display: grid;
	grid-template-columns: 30% 70%;
	background-color: #0E64CC;
}

.latest-report-container {
	height: 100%;
	display: grid;
	grid-template-rows: auto 200px;
	overflow: hidden;
}

.latest-report-container .see-more-button {
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 1;
	position: relative;
}

.Latest-Report-Header-Text {
	margin-top: 20px;
	/* margin-left: 98px; */
	font-size: 12px;
	font-family: Montserrat;
	font-weight: 400;
	color: #ffffff;
	letter-spacing: 1px;
}

.latest-report-content {
	padding: 0px 15%;
	position: relative;
}

.latest-report-content:after {
    content: '';
    display: block;
    background: linear-gradient(0deg, #0e64cc, transparent);
    height: 100%;
    position: absolute;
    top: 0px;
    width: 70%;
}

.Quest-Text {
	margin-top: 20px;
	/* margin-left: 98px; */
	font-size: 24px;
	font-weight: 400;
	color: #ffffff;
	letter-spacing: 1px;
}

.Picture-Carousel-thematic-areas {
	display: flex;
	flex-direction: column;
}

.horizontal-line {
	width: 100%;
	border: 2px;
	border-top: 1px solid #0A2458;
	border-color: #0A2458;
	margin-top: 40px;
	justify-self: center;
}

.pics {
	height: 83vh;
	object-fit: cover;
	object-position: center;
}

.thematic-areas-rider-section {
	display: flex;
	align-items: center;
	background-color: #fff;
	color: #063B73;
	margin-top: -110px;
	height: 110px;
	padding: 10px 30px;
}

.Picture-Carousel-thematic-areas .thematic-areas-container{
	display: grid;
	grid-template-columns: 10% auto;
}

.thematic-areas-rider {
	font-size: 16pt;
	font-weight: 600;
	color: #0A2458;
	width: 100%;
}

.thematic-areas-rider-section>p:last-child {
	text-align: right;
	min-width: 150px;
}

.learn-more-links {
	color: brown;
	font-size: 12px;
	font-family: Montserrat;
	font-weight: 600;
	letter-spacing: 1px;
}

.About-Latest-Report {
	display: flex;
	flex-direction: column;
	position: relative;
	max-height: 0px;
}

.faded-Text {
	margin-top: 20px;
	box-sizing: border-box;
	/* margin-left: 98px; */
	/* max-width: 265px; */
	font-weight: 400;
	color: #ffffff;
	letter-spacing: 0px;
	line-height: 25px;
	background: linear-gradient(to top, transparent, white);
	background-clip: text;
	-webkit-background-clip: text;
	color: transparent;
}

.button-see-more {
	/* margin-left: 98px; */
	background-color: #063B73;
	width: 200px;
	height: 60px;
	border-radius: 50px;
	border: none;
	font-size: 16px;
	font-family: Montserrat;
	font-weight: 400;
	color: #ffffff;
	letter-spacing: 1px;
}

.button-see-more:hover {
	transform: scale(1.03);
	transition: 0.5s;
	background-color: #8fc5ff;
	color: #0A2458;
	cursor: pointer;
	font-weight: 600;
}

.WHAT-WE-DO-CONTENT-SECTION {
	display: grid;
	grid-template-columns: 45% 50%;
	justify-content: center;
	align-items: center;
	margin-top: 60px;
	gap: 5%;
	padding-right: 7%;
	padding-left: 7%;
}

.carousel-navigation {
	display: grid;
	align-items: center;
	grid-template-columns: 50% 50%;
}

.thematic-carousel-slider {
	/* margin-left: 100px; */
}

.WHAT-WE-DO-CONTENT {
	font-size: 15px;
	font-family: montserrat;
	font-weight: 500;
	color: #063B73;
	letter-spacing: -1px;
	justify-self: flex-start;
	width: 150px;
}

.arrows-left-right {
	justify-self: flex-end;
	display: flex;
	gap: 20px;
}

.backward-arrow {
	width: 50px;
}

.backward-arrow:hover {
	transform: scale(1.1);
	transition: 0.5s;
	cursor: pointer;
}

.forward-arrow, .backward-arrow {
	width: 30px;
	font-size: 20px;
	color:#0e64cc;
}

.forward-arrow:hover {
	transform: scale(1.1);
	transition: 0.5s;
	cursor: pointer;
}

.horizontal-divider-line {
	border: 2px;
	border-top: 1px solid #bdbdbd;
	border-color: #e2e2e2;
	width: 89.6%;
	margin-top: 40px;
	/* height: 1px; */
	justify-self: center;
}

.about-kdi-teaser-for-profile {
	flex-direction: column;
	background-color: #063B73;
	padding: 100px 17%;
	box-sizing: content-box;
}

.profile-header {
	color: #ffffff;
	font-size: 40pt;
	font-style: normal;
	font-weight: 600;
	line-height: 60px;
	/* width: 400px; */
	/* margin-left: 80px;
    margin-top: 100px; */
}

.profile-content {
	/* margin-left: 80px; */
	color: #ffffff;
	font-size: 15px;
	font-style: normal;
	font-weight: 400;
	line-height: 25px;
	/* width: 400px; */
	margin-top: 20px;
	background: linear-gradient(to top, transparent, white);
	background-clip: text;
	-webkit-background-clip: text;
	/*color: transparent;*/
}

.button-Download-Profile {
	/* margin-left: 75px; */
	background-color: #ffffff;
	width: 200px;
	height: 60px;
	border-radius: 50px;
	border: none;
	font-size: 16px;
	font-weight: 500;
	color: #063B73;
	letter-spacing: 1px;
	margin-top: 30px;
	font-family: Montserrat;
}

.button-Download-Profile:hover {
	transform: scale(1.04);
	transition: 0.8s;
	cursor: pointer;
}

.picture-card-slider-section {
	display: flex;
	flex-direction: row;
	height: 497px;
	width: 100%;
	max-width: 1394px;
	margin-top: 186px;
	justify-self: center;
	margin-top: 30px;
	text-decoration: none;
	overflow-x: scroll;
	z-index: -100;
	margin-left: 0;
	align-items: center;
	column-gap: 60px;
}

.picture-containers {
	width: 300px;
	height: 394px;
	display: flex;
	flex-direction: column;
	border-radius: 20px;
	background-color: #ffffff;
	overflow: hidden;
	margin-left: 0px;
	flex-shrink: 0;
	transition: box-shadow 0.5s ease-in-out;
}

.picture-containers:hover {
	box-shadow: 2px 2px 12px rgba(0, 0, 0, 0.2);
	color: white;
	cursor: pointer;
	transition: box-shadow 0.5s ease-in-out;
}

.picture-containers .Picture-details {
	transition: background-color 0.5s ease-in-out;
}

.picture-containers:hover .Picture-details {
	color: white;
	background-color: #0A2458;
	transition: background-color 0.5s ease-in-out;
}

.forward-arrow:active {
	transform: scale(1.1);
}

.backward-arrow:active {
	transform: scale(1.1);
}

.picture {
	text-align: center;
	height: 200px;
}

.picture-card-slider-section .picture img{
	height: 100%;
	width: 100%;
    object-fit: cover;
}

.pic {
	transition: 0.90s;
	max-width: 100%;
	/* Ensure images fit within their containers */
}

.Picture-details {
	display: grid;
	grid-template-rows: 40px 150px;
	padding: 20px;
	color: #063B73;
}

.Picture-header {
	font-size: 17px;
	font-weight: 600;
}

.picture-description {
	font-size: 13px;
	line-height: 22px;
	font-weight: 400;
}

.Our-Projects-Section-and-board-lists {
	/* display: grid; */
	/* grid-template-rows: 1170px auto; */
	margin-top: 50px;
	background-color: #CDD8E1;
}

.our-projects-segment {
	/* display: grid; */
	grid-template-rows: 515px 700px;
	gap: 70px;
}

.our-projects-text-and-lists {
	display: grid;
	grid-template-columns: 1fr auto;
	grid-template-rows: auto;
	gap: 4%;
	text-decoration: none;
	align-items: center;
	padding: 100px 7%;
}

.left-section-texts {
	display: flex;
	flex-direction: column;
}

.Our {
	font-size: 40px;
	font-weight: 400;
	color: #063B73;
	letter-spacing: 1px;
}

.Projects {
	font-size: 80px;
	font-weight: 400;
	color: #063B73;
	letter-spacing: 1px;
}

.details {
	font-size: 14pt;
	font-weight: 400;
	color: #063B73;
	letter-spacing: 0px;
	margin-top: 30px;
	line-height: 30px;
	/* padding: 0px 15px; */
}

.right-section-images-and-texts {
	display: grid;
	grid-template-columns: auto auto;
	text-decoration: none;
	gap: 30px;
}
.right-section-images-and-texts p{
	font-size: 10pt;
}

.project-image {
	justify-self: flex-end;
	align-items: center;
    display: flex;
    padding-right: 20px;
}

.orange-rectangle {
	background-color: #EDBE87;
	color: #EDBE87;
}

.image-and-project-1 {
	display: grid;
	grid-template-columns: 5px 60% 40%;
	background-color: #ffffff;
}

.image-and-project-1 img {
	height: 70%;
	width: 100%;
	/* object-fit: cover; */
}

.image-and-project-1:hover {
	transform: scale(0.98);
	transition: 0.95s;
}

.links-to-projects {
	text-decoration: none;
	color: #0A2458;
	line-height: 20px;
}

.links-to-projects:hover {
	color: brown;
}

.text-project-1 {
	font-size: 16px;
	font-weight: 400;
	color: #063B73;
	letter-spacing: 0px;
	margin: 25px;
	align-self: center;
	text-decoration: none;
}

.image-and-project-2 {
	display: grid;
	margin-left: 50px;
	grid-template-columns: 5px 155px 230px;
	background-color: #ffffff;
	height: 141px;
	margin-top: 30px;
}

.image-and-project-3 {
	display: grid;
	margin-left: 50px;
	grid-template-columns: 5px 155px 230px;
	background-color: #ffffff;
	height: 141px;
	margin-top: 10px;
	text-decoration: none;
}

.image-and-project-4 {
	display: grid;
	margin-left: 50px;
	grid-template-columns: 5px 155px 230px;
	background-color: #ffffff;
	height: 141px;
	margin-top: 10px;
	text-decoration: none;
}

.image-and-project-5 {
	display: grid;
	margin-left: 50px;
	grid-template-columns: 5px 155px 230px;
	background-color: #ffffff;
	height: 141px;
	margin-top: 10px;
	text-decoration: none;
}

.text-project-1:hover {
	color: brown;
	cursor: pointer;

}

.image-and-project-1:hover {
	color: brown;
	cursor: pointer;

}

.orange-rectangle:hover {
	background-color: brown;
	color: brown;
}

.about-KIMPACT {
	display: grid;
	grid-template-columns: auto auto;
	grid-template-rows: auto;
	justify-self: center;
	justify-items: center;
	z-index: 800;
	padding: 0 7%;
}

.short-info-on-KDI {
	display: flex;
	flex-direction: column;
	justify-content: end;
	background-color: #0164BC;
}

.short-info-on-KDI, .contact-us-Directory{
	padding: 0 15%;
	padding-top: 80px;
}

/* add margint to the margin */
.short-info-on-KDI>div:last-child,
.contact-us-Directory>div>div:last-child {
	margin-bottom: 100px;
}

.header-part {
	color: #ffffff;
	font-size: 40pt;
	font-style: normal;
	font-weight: 600;
	line-height: 60px;
}

.main-content {
	color: #ffffff;
	font-size: 15px;
	font-style: normal;
	font-weight: 300;
	line-height: 25px;
	margin-top: 20px;
	background: linear-gradient(to top, transparent, white);
	background-clip: text;
	-webkit-background-clip: text;
	color: transparent;
}

.button-Read-more {
	background-color: #ffffff;
	width: 200px;
	height: 60px;
	border-radius: 50px;
	border: none;
	font-size: 16px;
	font-family: Montserrat;
	font-weight: 500;
	color: #063B73;
	letter-spacing: 1px;
	margin-top: 30px;
}

.contact-us-Directory {
	background-color: #00549F;
	display: flex;
	align-items: end;
	justify-content: center;
	margin-top: 100px;
}

.contact-us-Directory>div {
	display: flex;
	flex-direction: column;
	align-items: center;
	/* grid-template-rows: 170px 55px 70px 90px; */
	justify-items: center;
}

.logo-section {
	margin-top: 50px;
}

.kimpact-logo-white {
	width: 300px;
	justify-self: center;
}

.CTA {
	font-weight: 600;
	color: #ffffff;
	font-size: 23pt;
}

.button-Send-Mail {
	border-style: solid;
	border-width: 2px;
	border-color: #ffffff;
	background-color: #314557;
	width: 200px;
	height: 60px;
	border-radius: 50px;
	border: none;
	font-size: 16px;
	font-family: Montserrat;
	font-weight: 500;
	color: #063B73;
	letter-spacing: 1px;
	margin-top: 60px;
	color: #ffffff;
}

.action {
	font-weight: light;
	color: #ffffff;
	font-size: 11pt;
	justify-self: center;
	text-align: center;
	margin-top: 20px;
	line-height: 25px;
}

.Faces-of-KIMPACT {
	display: grid;
	grid-template-columns: auto;
	grid-template-rows: 300px auto;
	background-image: url('/assets/imgs/KIMPACT Tower.png');
	margin-top: 100px;
	padding-bottom: 100px;
}

.header-texts {
	color: #0A2458;
	justify-self: center;
	flex-direction: column;
	display: flex;
	justify-items: center;
	align-self: center;
}

.faces,.KDI {
	font-size: 12pt;
	text-align: center;
	letter-spacing: 1.5px;

}

.KIMPACT {
	font-size: 60px;
	text-align: center;
	font-weight: 600;
}

.faces-section {
	width: 85%;
	display: grid;
	background-color: #ffffff97;
	grid-template-columns: 50% 1px 50%;
	justify-content: center;
	margin-top: 0px;
	justify-self: center;
	padding-top: 100px;
	padding-bottom: 100px;
}

.dividing-line {
	background-color: #063B73;
	align-self: center;
	height: 350px;
}

.board-header {
	font-family: montserrat;
	font-weight: light;
	color: #063B73;
	text-align: center;
	justify-self: center;
	text-justify: center;
	letter-spacing: 10px;
	height: 50px;
}

.board-members {
	justify-self: center;
	justify-content: center;
	display: grid;
	grid-template-columns: 120px 120px 120px;
	grid-template-rows: 140px 140px;
	margin-top: 30px;
}

.board-member-1 {
	display: grid;
	grid-template-rows: 90px auto 1fr;
	justify-self: center;
}

.board-member-2 {
	display: grid;
	grid-template-rows: 90px 1fr;
	justify-self: center;
}

.board-member-3 {
	display: grid;
	grid-template-rows: 90px 1fr;
	justify-self: center;
}

.board-member-4 {
	display: grid;
	grid-template-rows: 90px 1fr;
	justify-self: center;
}

.board-member-5 {
	display: grid;
	grid-template-rows: 90px 1fr;
	justify-self: center;
}

.board-member-6 {
	display: grid;
	grid-template-rows: 90px 1fr;
	justify-self: center;
}

.prof-olu {
	width: 80px;
	height: 80px;
	object-fit: cover;
	border-radius: 80px;
	justify-self: center;

}

.board-member-name {
	font-family: montserrat;
	font-weight: light;
	color: #000000;
	font-size: 8px;
	margin-top: 5px;
	justify-self: center;
	text-align: center;
}

.team-header {
	font-family: montserrat;
	font-weight: light;
	color: #063B73;
	text-align: center;
	justify-self: center;
	text-justify: center;
	letter-spacing: 10px;
	height: 50px;
}

.team-members, .board-members{
	justify-self: center;
	justify-content: center;
	display: flex;
	flex-wrap: wrap;
	row-gap: 25px;
	position: relative;
	/* grid-template-columns: 120px 120px 120px;
	grid-template-rows: 140px 140px; */
	margin-top: 30px;
	transition: opacity 0.5s;
}

.team-members-secondary{
	position: absolute;
	top: 0px;
	margin-top: 0px;
	opacity: 0%;
}

.board-members, .team-members{
	padding-right: 100px;
    padding-left: 100px;
}

.team-member-bio{
	position: absolute;
	font-size: 12px;
	font-family: 'Montserrat';
	background-color: #063b73e7;
    border-radius: 10px;
    /* box-shadow: 0px 0px 5px lightslategray; */
    padding: 0px;
	width: 300px;
	height: 0px;
	overflow: hidden;
	z-index: 3;
	top: 90px;
	color: white;

	.fa-brands, .fa-solid{
		font-size: 15px;
		margin: 0px 3px;
	}

	.name{
		margin-bottom: 5px;
	}
	.designation{
		font-size: 10px;
		margin-bottom: 5px;	
	}
	.social-handles{
		margin-bottom: 10px;
	}
	.social-handles a{
		color: white;
	}
	.bio{
		font-size: 10px;
		line-height: 16px;
	}
}

.team-member-1 , .board-member-1{
	display: grid;
	position: relative;
	grid-template-rows: 90px auto 1fr;
	justify-self: center;
	flex-basis: 33.333333%;
}

.team-members > div:hover{
	cursor: pointer;
	.board-member-name{
		text-decoration: underline;
	}
	.team-member-bio{
		height: 220px;
		padding: 10px;
		transition-duration: 100ms;
	}
}

.team-member-2 {
	display: grid;
	grid-template-rows: 80px 17px 1fr;
	justify-self: center;
}

.team-member-3 {
	display: grid;
	grid-template-rows: 80px 17px 1fr;
	justify-self: center;
}

.team-member-4 {
	display: grid;
	grid-template-rows: 80px 17px 1fr;
	justify-self: center;
}

.team-member-5 {
	display: grid;
	grid-template-rows: 80px 17px 1fr;
	justify-self: center;
}

.team-member-6 {
	display: grid;
	grid-template-rows: 80px 17px 1fr;
	justify-self: center;
}

.board-member-designation {
	justify-self: center;
	text-align: center;
	font-family: montserrat;
	font-weight: light;
	color: #00549F;
	font-size: 7.5px;
}

.partner-lists {
	display: flex;
	flex-direction: column;
	color: #0A2458;
	justify-content: center;
	align-items: center;
	padding-top: 50px;
}

.header-our {
	font-weight: 400;
	font-size: 25px;
	text-align: center;
}

.header-partners {
	font-weight: 400;
	font-size: 52px;
	text-align: center;
}

.partners-logo {
	margin: 50px 20px;
	display: flex;
	column-gap: 75px;
}
.partners-logo img{
	width: auto!important;
	height: 50px;
}

.twitter-updates {
	display: flex;
	/* grid-template-columns: 170px 440px 505px 80px; */
	justify-content: center;
	justify-self: center;
	align-items: center;
	background-color: #FBFBFB;
	width: 100%;
	height: 100%;
	padding: 50px;
	gap: 10%;
}

.twitter-update-navigation{
	display: none;
	justify-content: end;
	padding: 0 50px;
}

.twitter-update-navigation img{
	width: 50px;
}

.arrow-left {
	width: 80px;
	justify-self: center;
}

.whats-text {
	justify-self: center;
}

.latest-twiiter-update {
	display: flex;
	flex-direction: column;
	width: 100%;
	font-family: montserrat;
	font-size: 12px;
	justify-self: center;
}

.twitter-text-update {
	font-weight: 400;
	color: #484848;
	font-style: italic;

}

.post-info {
	display: flex;
	flex-direction: row;
	margin-top: 7px;
}

.twitter-info {
	font-weight: 500;
	color: #0164BC;
	text-decoration: none;
}

.twitter-info:hover {
	transform: scale(0.98);
	cursor: pointer;
	transition: 0.95s;
}

.x-com {
	text-decoration: none;
}

.date {
	margin-left: 7px;
}

.divider {
	margin-left: 7px;
}

.time {
	margin-left: 7px;
}

.footer-section {
	display: grid;
	grid-template-rows: auto auto;
	background-color: #00549F;
	background-image: url('/assets/icons/tower-carton.svg');
	justify-content: center;
	padding-top: 100px;
}

.footer-part {
	display: grid;
	grid-template-columns: auto auto auto;
	/* margin-top: 100px; */
	margin-bottom: 0px;
	gap: 150px;
}

.project-links {
	display: grid;
	grid-template-rows: 70px 70px 70px 70px 70px 70px 80px;
	/* align-self: center; */
	margin-top: 0px;
}

.links {
	font-family: montserrat;
	font-weight: 500;
	color: #ececec;
	font-size: 17px;
}

.links-for-static-menu {
	font-family: montserrat;
	font-weight: 600;
	color: #0A2458;
	font-size: 17px;
}

.web-links {
	display: grid;
	font-family: montserrat;
	font-weight: 500;
	color: #ececec;
	font-size: 17px;
	grid-template-rows: 70px 70px 70px 70px 70px;
	/* align-self: center; */
	margin-top: 0px;
}

.web-links-for-static-menu {
	display: grid;
	font-family: montserrat;
	font-weight: 600;
	color: #0A2458;
	font-size: 17px;
	grid-template-rows: 70px 70px 70px 70px 45px;
	/* align-self: center; */
	margin-top: 0px;
}

.links-for-web {
	font-family: montserrat;
	font-weight: 500;
	color: #ececec;
	font-size: 17px;
	margin-top: 0px;
	text-decoration: none;

}

.links-for-webs-for-static-menu {
	font-family: montserrat;
	font-weight: 600;
	color: #0A2458;
	font-size: 17px;
	margin-top: 0px;
}

.social-media-icons {
	width: 200px;
}

.contact-details {
	display: grid;
	grid-template-rows: 70px 148px 100px;
	font-family: montserrat;
	font-weight: 400;
	color: #ececec;
	font-size: 11px;
	width: 200px;
	line-height: 18px;
	/* align-self: center; */
	align-items: center;
	/* align-content: center; */
}

.contact-details-for-static-menu {
	display: grid;
	grid-template-rows: 70px 148px 100px 100px;
	font-family: montserrat;
	font-weight: 600;
	color: #0A2458;
	font-size: 11px;
	width: 200px;
	line-height: 18px;
	/* align-self: center; */
	align-items: center;
	/* align-content: center; */
}

.email-txt {
	font-family: montserrat;
	font-weight: 400;
	color: #ececec;
	font-size: 11px;
}

.email-link{
	font-family: Montserrat!important;
	text-decoration: none;
	color: #063B73;
}

.email-txt-header {
	font-weight: 600;
	margin-top: 10px;
}

.copyright-text {
	font-family: montserrat;
	font-weight: 400;
	color: #ececec;
	font-size: 14px;
	text-align: center;
	justify-content: center;
	justify-self: center;
	margin: 50px;
}

.full-meny-section {
	display: block;
	z-index: 2000;
	top: 2000;
	position: sticky;

}

.Full-menu-bar {
	display: none;
	z-index: 2000;
}

.logo-and-menu-close {
	display: grid;
	grid-template-columns: 1fr 1fr;
}

.kdi-logo-colored {
	width: 200px;
	align-self: center;
}

.menu-close-button {
	align-self: center;
	justify-self: right;
	width: 50px;
	text-align: right;
}

.shortcuts-menu {
	color: white;
	font-family: montserrat;
	font-size: small;
}

.arrow-left:hover {
	transform: scale(0.95);
	cursor: pointer;
	transition: 0.8s;
}

.arrow-right:hover {
	transform: scale(0.95);
	cursor: pointer;
	transition: 0.8s;
}

.social-media-icons {
	display: flex;
	flex-direction: row;
	gap: 15px;
}

.sm-icons {
	height: 20px;
}

.sm-icons:hover {
	transform: scale(1.1);
	transition: 0.5s;
	cursor: pointer;
}

.external-links-footer {
	text-decoration: none;
	color: #e2e2e2;
}

.external-links-footer:hover {
	text-decoration: underline;
	color: #c1dfff;
	transform: scale(1.02);
	transition: 0.95s;
}

.title-results{
	font-size: 25pt;
	color: black;
	margin-top: 15px;
	margin-bottom: 5px;
}

.showing-results{
	color: black;
	margin-bottom: 20px;
	font-size: 13pt;
}

.result-container{
	margin-top: 50px;
	margin-bottom: 20px;
	padding: 30px;
	background-color: #ffffff8b;
}

.result-container .title{
	font-size: 15pt;
	margin-bottom: 5px;
	color: #0a2458;
}

.result-container .link{
	font-size: 12pt;
	margin-bottom: 5px;
	color: rgb(73, 73, 73);
}

.result-container .body{
	font-size: 12pt;
	margin-bottom: 5px;
	color: black;
}

.result-item{
	display: block;
	margin-top: 25px;
	padding-bottom: 25px;
}

.result-container-main a{
	border-bottom: 1px solid #787878;
}

.result-container-main a:last-child{
	border-bottom: none;
}

.faces-of-kimpact-carousel-navigation{
	text-align: center;
	margin-top: 30px
}

.faces-of-kimpact-carousel-navigation a{
	font-size: 6pt;
	cursor: pointer;
	margin: 0px 5px;
	color: gray
}

.bold-link a{
	background: white;
    color: #0e64cc;
    padding: 7px 30px;
    border-radius: 17px;
	margin-left: 30px;
	font-weight: 500;
}

.web-links-for-static-menu a.bold-link{
	color: white!important;
    text-decoration: none;
    background-color: #0a2458;
    padding: 10px 34px;
    border-radius: 30px;
    margin-top: 20px;
    margin-bottom: 20px;
    display: inline-block;
}

.election-faqs{
	font-family: "Montserrat";
	position: fixed;
	bottom: 0px;
	left: 0px;
	background-color: white;
	box-shadow: 0px 0px 5px lightslategray;
	z-index: 1000;
	padding: 10px;
	padding-bottom: 0;
	border-radius: 0px 10px 0px 0px;
	cursor: pointer;

	.title{
		font-size: 12px;
		margin-bottom: 5px;
		text-align: center;
		font-weight: 600;
	}

	.countdown{
		display: flex;
		gap: 5px;
		font-size: 15px;
		font-weight: 700;
	}

	.digit{
		width: 20px;
		text-align: center;
	}

	.digit.label{
		font-size: 9px;
	}

	.colon{
		visibility: hidden;
	}
}

.election-faqs-overlay{
	height: 100vh;
	overflow: auto;
	width: 100%;
	position: fixed;
	z-index: 1000;
	display: none;
	top: 0;
	left: 0;
	background-color: rgb(245 245 245);
	background-blend-mode: overlay;
	/* background-image: url("/assets/imgs/beautiful_background.jpg"); */
	background-size: cover;
	font-family: Montserrat;
	padding: 50px;

	.close-button .fa-solid{
		font-size: 17px;
		background-color: white;
		width: 40px;
		height: 40px;
		display: flex;
		justify-content: center;
		align-items: center;
		border-radius: 100%;
		position: absolute;
		right: 25px;
		top: 25px;
		cursor: pointer;
		border: 1px solid #ebe5e5;
	}

	.content{
		color: black;
	}

	.content{
		.timer-label{
			font-size: 13px!important;
			color: rgb(124, 124, 124);
		}
		
		.countdown.label .colon{
			visibility:hidden;
		}
		
		.countdown.label{
			height: 30px;
		}

		.population-des{
			margin-top: 30px;
			display: flex;
			justify-content: center;

			p:last-child{
				margin-top: 10px;
			}

			div{
				padding: 0px 20px;

				.h1{
					font-size: 13px;
					font-weight: 500;
				}
				.h2{
					font-size: 25px;
					font-weight: 800;
				}
			}
		}

		.distro-container{
			text-align: left;
			margin-top: 50px;
			gap: 30px;

			.h1{
				font-size: 25px;
				font-weight: 800;
			}
			.h2{
				font-size: 13px;
				margin: 5px 0px;
			}
			.h3{
				font-size: 13px;
			}

			> p:first-child{
				font-weight: 800;
				margin-bottom: 30px;
			}
			.distro{
				display: grid;
				grid-template-columns: auto auto;				
			}			
		}

		.card{
			background-color: rgba(255, 255, 255, 1);
			border: 1px solid #ebe5e5;
			padding: 30px;
			border-radius: 10px;
			width: 265px;

			p{
				color: black;
			}

			.card-title{
				margin-bottom: 30px;
			}
		}

		.card > p{
			font-weight: 800;
		}

		.stats{
			text-align: start;
			margin-top: 50px;

			.grid{
				gap: 30px;
			}
			.label{
				font-size: 13px;
				margin-top: 10px;
			}
			.value{
				font-weight: 800;
				font-size: 30px;
			}
		}

		.pwd-distro{
			.pwd-percentage{
				font-size: 25px;
			}
			.pwd-population{
				margin-top: 10px;
				font-weight: 400;
				font-size: 13px;
			}
			.card-title{
				text-align: center;
			}
		}

		.gender-distro{
			width: 500px;
			
			.chart-bar{
				width: 100%;
				height: 15px;
				margin-top: 10px;
				background-color: #00c0df;
			}

			.female{
				justify-self: end;
			}

			.chart-bar div{
				height: 100%;
				background-color: #1f217c;
			}
		}	

		text-align: center;
	}

	.content .countdown{
		display: flex;
		font-size: 20px;
		font-weight: 800;
		align-items: center;
		justify-content: center;
		gap: 10px;
	}

	.countdown *{
		font-size: 55px;
	}

	.countdown .digit{
		/* padding: 10px; */
        border-radius: 10px;
        /* margin: 10px; */
		width: 100px;
	}

	.title{
		text-align: center;
		font-size: 23px;
		font-weight: 500;
		margin-bottom: 30px;
	}

	.h-border{
		border: 1px solid black;
	}

	.toggle-container{
		color: black;
		text-align: center;
		display: flex;
		justify-content: center;
		margin-bottom: 30px;
		font-size: 13px;
		font-weight: 600;

		.toggle{
			display: flex;
			justify-content: center;
			background-color: white;
			border: 1px solid #ebe5e5;
			border-radius: 20px;
			width: 200px;
		}

		.state{
			width: 50%;
			padding: 10px;
			border-radius: 20px;
			cursor: pointer;
		}

		.state.selected{
			color: white;
			background-color: rgb(60, 134, 204);
			transition: all 0.5s;
		}
	}

	.occupation-distro-container > p{
		font-weight: 800;
		margin-top: 30px;
		margin-bottom: 30px;
	}

	.occupation-distro{
		/* text-align: start; */
		display: grid;
		grid-template-columns: auto auto auto;
		gap: 10px;

		.name{
			font-size: 12px;
			font-weight: 500!important;
			margin-bottom: 10px;
		}
		.percentage{
			font-size: 25px;
			font-weight: 800;
		}
		.value{
			font-size: 14px;
			font-weight: 700;
		}
	}

	.age-distro-container{
		margin-top: 50px;
		gap: 30px;
	}
	
	.age-distro.card{
		width: 800px;
	}
	.age-distro > p{
		font-weight: 800;
		margin-bottom: 20px;
	}

	.age-distro > div{
		display: flex;
		justify-content: center;
	}

	.age-distro{
		color: black;
	}

}

.past-events-section{
	height: 400px;
	margin-top: 50px;
	width: 100%;
	display: flex;
	color: white;
	position: relative;

	.image-container{
		position: relative;
		height: 100%;
		width: 55%;
		img{
			object-fit: cover;
		}
	}

	.event-details{
		height: 100%;
		background-color: #00549F;
		width: 45%;
		padding: 85px;
		display: flex;
		flex-direction: column;
		justify-content: center;
		gap: 30px;

		.title{
			font-size: 25px;
			line-height: 35px;
		}
		.desc, .link{
			font-family: 'Montserrat';
			font-size: 15px;
			width: 85%;
			line-height: 25px;
		}
		.link{
			text-decoration: none;
			color: white;
			display: flex;
			gap: 10px;
			align-items: center			
		}
		.link li{
			transition-duration: 500ms;
		}
		.link:hover li{
			padding-left: 10px;
			transition-duration: 500ms;
		}
	}

	@media (max-width: 1250px){
		.image-container, .event-details{
			width: 50%;
		}
	}
	@media (max-width: 950px){
		.event-details .title{
			font-size: 25px;
		}
	}
	@media (min-width: 901px){
		.event-details{
		}
		.image-container{
		}
	}
	@media (max-width: 900px){
		.event-details {
			width: 100%;
			background-color: #001325a6;
			background-blend-mode: overlay;
			background-size: cover;
			padding: 80px;
		}
		.image-container{
			display: none;
		}
	}
	@media (max-width: 500px){
		.event-details{
			padding: 45px;
		}
	}
}

.grid{
	display: flex;
}

.justify-center{
	justify-content: center;
}

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

.flex-column{
	flex-direction: column;
}

.w-1{
	width:170px;
}

.text-center{
	text-align: center;
}
.text-end{
	text-align: end;
}

.canvasjs-chart-credit{
	display: none!important;
}

@media (max-width: 900px){
	.occupation-distro{
		/* grid-template-columns: auto auto!important; */
		gap: 20px;
	}
	.occupation-distro .card{
		width: 150px!important;
		height: 150px!important;
		border-radius: 100%!important;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}
}

@media (max-width: 600px){
	.occupation-distro{
		/* grid-template-columns: auto!important; */
	}

	.election-faqs-overlay{
		padding: 20px!important;
	}
}

@media (max-width: 550px){

	.main-card-title{
		font-size: 13px;
	}
	.occupation-distro .card{
		width: 100px!important;
		height: 100px!important;
	}

	.occupation-distro .value, .occupation-distro .name{
		font-size: 10px!important;
	}

	.occupation-distro .percentage{
		font-size: 18px!important;
	}

	.election-faqs-overlay{
		.countdown *{
			font-size: 30px;
		}		
		.title{
			font-size: 18px;
		}
		.countdown .digit{
			width: 50px;
		}
	}

	.stats > div{
		flex-direction: column;
		.card{
			width: 100%!important;
		}
	}

	.stats .grid{
		gap: 15px!important;
	}

	.distro-container{
		flex-direction: column;
		margin-top: 30px!important;
		gap: 15px!important;
		.card{
			width: 100%!important;
		}
	}
	
	.distro #malePercent, .distro #femalePercent{
		font-size: 20px;
	}

	.population-des {
		div{
			.h1{
				font-size: 11px!important;
			}
			.h2{
				font-size: 18px!important;
			}
		}
	}

	.stats {
		.value {
			font-size: 20px!important;
		}
	}
}

#malePercent{
	color: #1f217c;
}

#femalePercent{
	color: #00c0df;
}

.percent-color{
	color: #1f217c!important;
}

.occupation3, .occupation4, .occupation5{
	.percent-color{
		color: #00c0df!important;
	}
}

.occupation6, .occupation7, .occupation8{
	.percent-color{
		color: #101046!important;
	}
}

.product-section{
	padding: 100px 7%;
	display: flex;
	color: white;
	background-color: #063B73;

	.title{
		font-size: 35px;
		line-height: 45px;
	}
	.sub-text{
		line-height: 25px;
		width: 80%;
	}

	div{
		width: 50%;
	}

	.btn-container{
		margin-top: 20px;
	}

	.btn{
		text-decoration: none;
		color: #063B73;
		background-color: white;
		padding: 15px 20px;
		border-radius: 30px;
		width: 150px;
		font-size: 13px;
		text-align: center;
		cursor: pointer;
		display: block;
	}

	div:first-child{
		display: flex;
		flex-direction: column;
		gap: 30px;
		justify-content: center;
	}

	.vid-container img{
		width: 100%;
		height: auto;
	}
}

button.unga-fab {
	div{
		height: 40px;
		width: 40px;
		background-size: cover;
		border-radius: 100px;
	}
    padding: 10px 20px;
	padding-left: 0px;
    border: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-radius: 100px;
    background-color: white;
	font-family: "Montserrat";
    /* Original box-shadow */
    box-shadow: 0px 0px 5px lightslategray;
    position: fixed;
    right: 20px;
    cursor: pointer;
    font-weight: 500;
    font-size: 11px;
    bottom: 10px;
	z-index: 10;

    /* Add fixed width and height */
	gap: 10px;
    height: 40px; /* Example fixed height */

    /* Animation for shadow and outline */
    animation: pulse-shadow 1.5s infinite alternate;
    outline: none; /* Remove default outline */
}

@keyframes pulse-shadow {
    0% {
        box-shadow: 0px 0px 5px 5px #00000000; /* Subtle shadow */
    }
    100% {
        box-shadow: 0px 0px 15px 5px #03214161; /* More pronounced, colored shadow */
    }
}

@keyframes pulse-outline {
    0% {
        outline: 0px solid transparent; /* No visible outline initially */
    }
    100% {
        outline: 5px solid rgba(137, 135, 250, 0.5); /* Semi-transparent blue outline */
    }
}

@media (max-width: 1000px){
	.product-section{
		padding-top: 50px;

		.title{
			font-size: 25px;
			line-height: 35px;
		}
		.sub-text{
			width: 100%;
		}
	}
}

@media (max-width: 800px){
	.product-section{
		gap: 20px;
		padding: 0 10%;
		padding-top: 80px;
		padding-bottom: 50px;

		div:first-child{
			width: 100%;
			gap: 20px;
		}
		
		.btn-container{
			
		}

		flex-direction: column-reverse;
		.vid-container{
			width: 100%;
		}
	}
}

@media (max-width: 500px){
	.product-section{
		padding-top: 50px;
		.title{
			font-size: 18px;
			line-height: 28px;
		}

		.sub-text{
			font-size: 13px;
		}
		
		.btn-container{
			text-align: center;
			width: 100%;
		}
	}
}