/**************************************************************/
/**************              Header                 ***********/
/**************************************************************/
.menu-item-has-children {
    position: relative;
}

.colourbar {
    display: none;
}

.site-1 .colourbar {
    display: block !important;
	padding-top: 5px;
}
.colourbar .header-colourbar {
    box-shadow: 10vw 0 0 0 #e78e00, 20vw 0 0 0 #72ad34, 30vw 0 0 0 #4c9723, 40vw 0 0 0 #4ec4cd, 50vw 0 0 0 #3e94c1, 60vw 0 0 0 #8644b5, 70vw 0 0 0 #cc158b, 80vw 0 0 0 #a73658, 90vw 0 0 0 #f1443e;
}
.colourbar .header-colourbar {
    content: "";
    display: inline-block;
    position: absolute;
    left: 0;
    bottom: 0;
    height: 6px;
    width: 10vw;
    border-radius: 0;
    background-color: #ffc20e;
}

@media(max-width: 1200px){
	.primary-nav-container .navbar-collapse {
		position: absolute;
		top: 100%;
		background: var(--color-blue1);
		z-index: 30;
		padding: 20px 30px;
		width: 70vw
	}
	.primary-nav-container .nav-link{ color: white }
	
	.primary-nav-container .header-main .dropdown-menu {
		background-color: transparent !important;
	}
	.primary-nav-container .header-main .dropdown-menu a {
		padding: 15px !important;
	}	
}	

@media(min-width: 1200px){
	
	.error404 h2 {
		font-size: 240px !important;
	}	
	header .navbar-nav li:hover > ul.dropdown-menu {
    	display: block;
	}
	
	header .primary-nav-container .dropdown-menu:before {
		content: "";
		position: absolute;
		width: 0;
		height: 0;
		border-left: 10px solid transparent;
		border-right: 10px solid transparent;
		border-bottom: 10px solid #3e94c1;
		left: 50%;
		top: -6px;
		transform: translate(-50%, -50%);
	}
	header .primary-nav-container .dropdown-menu {
		left: 50%;
		transform: translate(-50%, 0%);
	}	
}	

.wpml-wrap li a span {
    color: #fff;
    font-size: 14px;
}

@media(max-width: 768px){
	.dot-home-hero p span:first-child {
		display: block;
		padding-bottom: 7px;
	}	
	.wpml-wrap li a span {
		display: none;
	}
}


header .regional-nav-container .navbar-nav li:hover > ul.dropdown-menu {
    left: 0
}


header .primary-nav-container .nav-item:hover > a {
    color: var(--color-link-primary);
}
header .regional-nav-container .nav-link:after {
    color: var(--color-link-primary);
    transform: scale(2.2);
    margin-left: 20px;
}
header .regional-nav-container .navbar-nav .nav-item {
    color: #828282;
    background-color: #e6e6e6;
    padding: 2px 15px;
}
header .header-top:after {
    position: absolute;
    width: 100%;
    height: 6px;
    z-index: -1;
    content: "";
}
header .header-main .dropdown-menu { background-color: #3e94c1 }
header .header-main .dropdown-menu li { margin-right: 10px }

header .header-main .dropdown-menu li .dropdown-item:focus,
header .header-main .dropdown-menu li .dropdown-item:active,
header .header-main .dropdown-menu li .dropdown-item:hover {
    background-color: var(--color-blue2);
}
header .header-main .dropdown-menu a {
    color: #fff;
    padding-bottom: 9px;
    padding-top: 9px;
	padding-left: 25px;
}


/**************************************************************/
/********************     Regional home      ******************/
/**************************************************************/
.underlayer-top-bg {
	position: absolute;
    background-image: var(--site-pattern);
    width: 80%;
    height: 80%;
    bottom: 30px;
    left: -20px;
    z-index: 1;
}

.site-pattern .underlayer-top-bg {
    background-image: none;
}

.regional-hero-inner > div:after {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 35px;
    right: 35px;
    z-index: -1;
    content: "";
}
.regional-hero .regional-hero-inner {
	max-width: 572px;
	position: absolute;
	z-index: 10;
}	
.regional-hero .regional-hero-inner p {
    font-size: 27px;
    line-height: 40px;
	color: white;
}	
.regional-hero .regional-hero-inner h3 {
    margin-left: -30px;
	margin-top: 0;
    padding: 5px 0 5px 30px;
    background-color: var(--color-secondary);
    font-size: 38px;
    margin-bottom: 20px;
    text-align: left;
    color: #fff;
	font-weight: 400;
}
.regional-hero .regional-hero-inner div:first-child {
    position: relative;
    background: var(--color-tertiary);
	padding: 30px;
}
.regional-hero .regional-hero-img { height: 70vh; }

.regional-hero .col {
    min-height: 60vh;
}


/********************     #DOTYouth SPOTLIGHT      ******************/
.blog-bottom { padding: 25px; }

.blog-top {
    aspect-ratio: 1 / 1.01;
    background-position: top center;
    transition: 500ms;
    background-size: cover;
}
.stories-col:hover .blog-top {
    aspect-ratio: 1 / 0.95;
    overflow: auto;
    transition: 200ms ease;
	opacity: 0.7
}


/********************     Story     ******************/
article blockquote:last-child {
    margin-bottom: 0;
}
.entry-content p:last-child {
    margin-bottom: 0;
}

.home-story .post-item:nth-child(1) > div > div,
.home-story .post-item:nth-child(1) > div
{ background-color: var(--color-primary); transition: 200ms ease;}

.home-story .post-item:nth-child(2) > div > div,
.home-story .post-item:nth-child(2) > div
{ background-color: var(--color-tertiary); transition: 200ms ease;}

.home-story .post-item:nth-child(3) > div > div,
.home-story .post-item:nth-child(3) > div
{ background-color: var(--color-secondary); transition: 200ms ease;}


.home-story .post-item:hover > div > div,
.home-story .post-item:hover > div
{ background-color: var(--color-secondary); transition: 200ms ease;}


/********************    Single Story     ******************/
.story-featured-img img {
    aspect-ratio: 16 / 9;
    object-fit: cover;
    object-position: top;
}
.story-share .container:last-child .row > div {
    margin-bottom: -15px;
}
.recent-stories .post-item:nth-child(1) > div > div, .recent-stories .post-item:nth-child(1) > div {
    background-color: var(--color-primary);
    transition: 200ms ease;
}
.recent-stories .post-item:nth-child(2) > div > div, .recent-stories .post-item:nth-child(2) > div {
    background-color: var(--color-tertiary);
    transition: 200ms ease;
}
.recent-stories .post-item:nth-child(3) > div > div, .recent-stories .post-item:nth-child(3) > div {
    background-color: var(--color-primary);
    transition: 200ms ease;
}
.recent-stories .post-item:hover > div > div, .recent-stories .post-item:hover > div {
    background-color: var(--color-secondary);
    transition: 200ms ease;
}


/********************    Dotyouth     ******************/
.dotyouth-stories .post-item:nth-child(odd) > div > div,
.dotyouth-stories .post-item:nth-child(odd) > div
{ background-color: var(--color-primary); transition: 200ms ease;}

.dotyouth-stories .post-item:nth-child(even) > div > div,
.dotyouth-stories .post-item:nth-child(even) > div
{ background-color: var(--color-tertiary); transition: 200ms ease;}


.dotyouth-stories .post-item:hover > div > div,
.dotyouth-stories .post-item:hover > div
{ background-color: var(--color-secondary); transition: 200ms ease;}


.featured-post,
.stories-col { transition: background-color .3s ease; }
.stories-col > div:first-child:hover {
    background-color: var(--color-secondary);
    transition: background-color .3s ease;
}

.stories-col-2 .blog-top { aspect-ratio: 4 / 3; }
.stories-col-2.stories-col:hover .blog-top { aspect-ratio: 4 / 2.8; }

.blog-bottom p { font-size: 20px; }
.blog-bottom h3 { font-size: 27px; }

.blog-single-title-section h1 {
	font-size: var(--font-size-medium);
}

.post-tags a {
    transition: color 0.3ms ease;
}
.post-tags a:hover {
    color: var(--color-link-primary) !important;
    transition: color 0.3ms ease;
}

/********************    Featured post     ******************/
.featured-post .col-md-8{ transition: background-color .3s ease; }
.featured-post:hover .col-md-8 {
    background-color: var(--color-secondary);
    transition: background-color .3s ease;
}
.featured-post img {
    transition: 700ms ease;
	opacity: 1
}
.featured-post:hover img {
    opacity: 0.7;
    transition: 700ms ease;
}
.featured-post > div:first-child p {
    z-index: 999;
    font-size: 14px;
}
.featured-post .blog-bottom { transition: 200ms ease; }

.featured-post:hover .blog-bottom {
    transition: 200ms ease;
    transform: translate(0, -15px);
}

/********************    Post     ******************/
.post-item:hover > div > div {
    transition: 200ms ease;
    transform: translate(0, -20px);
}
.post-item img {
    transition: 200ms ease;
    aspect-ratio: 1 / 0.9;
    object-fit: cover;
	object-position: top;
}
.post-item:hover img {
    scale: 1.2;
    transition: 200ms ease;
	opacity: 0.7
}
.post-item h3 { font-size: 27px; }

/********************    Recent post     ******************/
.recent-posts .post-item:nth-child(odd) > div > div,
.recent-posts .post-item:nth-child(odd) > div {
	background-color: var(--color-primary);
	transition: 200ms ease;
}

.recent-posts .post-item:nth-child(even) > div > div,
.recent-posts .post-item:nth-child(even) > div{
	background-color: var(--color-tertiary);
	transition: 200ms ease;
}


.recent-posts .post-item:hover > div > div,
.recent-posts .post-item:hover > div {
	background-color: var(--color-secondary);
	transition: 200ms ease;
}

.post-item p, .post-item h3 { color: white; }
.post-item > div > p { font-size: 14px; }

.featured-post img {
    aspect-ratio: 1 / 1.05;
    object-fit: cover;
}
/*
.post-item > div > div { min-height: 300px; }
.career-item.post-item > div > div { min-height: 200px; }
*/


/**************************************************************/
/**************         Small hero banner           ***********/
/**************************************************************/
.page-hero .col {
	min-height: 15vh;
}

.single-post .page-hero .page-hero-inner {
    position: relative !important;
}

.single-post .page-hero .col {
    display: none;
}


/**************************************************************/
/********************       About us         ******************/
/**************************************************************/
	
.about-us-third p {
    color: #fff;
    font-size: 24px;
    line-height: 36px;
    letter-spacing: -.02em;
}	

.we-are h2 {
    position: relative;
    margin-top: -16px;
    margin-bottom: 70px;
    padding: 0px 40px;
    width: auto;
    color: #fff;
    line-height: normal;
}
.we-are p, .we-are h3 { color: #fff; }

.we-are h2 span { font-weight: 700; }	

.we-are h3 {
    color: #fff;
    text-transform: uppercase;
    font-size: 18px;
    letter-spacing: -.02em;
    padding: 5px 20px;
    margin-bottom: 15px;
	font-weight: normal;
}	
.we-are .row:nth-child(2) div:nth-child(1) h3 { background-color: #ffc20e; }
.we-are .row:nth-child(2) div:nth-child(2) h3 { background-color: #e78e00; }
.we-are .row:nth-child(2) div:nth-child(3) h3 { background-color: #72ad34; }	
.we-are .row:nth-child(2) div:nth-child(4) h3 { background-color: #4c9723; }
.we-are .row:nth-child(2) div:nth-child(5) h3 { background-color: #cc158b; }
.we-are .row:nth-child(2) div:nth-child(6) h3 { background-color: #f1443e; }
	
.footnote-link {
    font-size: 27px;
    line-height: 40px;
}	
.footnote-link:hover {
    color: var(--color-primary) !important;
}



/**************************************************************/
/********************      pagination        ******************/
/**************************************************************/
.dot-pagination a {
    text-decoration: none;
}

.tabbed-pagination-number,
.dot-pagination .page-numbers {
    background-color: var(--color-secondary);
    text-align: center;
    color: #fff;
    padding: 5px 15px !important;
    line-height: normal;	
}

.tabbed-pagination-number:hover,
.tabbed-pagination-number.active,
.dot-pagination .page-numbers:hover,
.dot-pagination .page-numbers.current {
    background-color: var(--color-tertiary);
}
.dot-pagination .page-numbers.prev,
.dot-pagination .page-numbers.next {
    background: transparent;
}

#tabbed-pagination {
    justify-content: center;
    display: flex;
	flex-wrap: wrap;
    gap: .5rem;
    margin-top: 3rem;	
	
}
.tabbed-pagination-number {
    text-decoration: none;
}
.tabbed-pagination-number:hover {
    cursor: pointer;
	color: #fff;
}
/**************************************************************/
/********************      Single blog       ******************/
/**************************************************************/
.single-post .page-hero {
    background-color: var(--color-primary);
    text-align: center;
}
.single-post .page-hero * {
    background: none;
}

.post-content article a:not([class]) {
    color: var(--color-link-primary);
}
.post-content article a:not([class]):hover {
    color: var(--color-primary);
}

article blockquote {
    color: #fff;
    text-align: center;
    margin: 70px 0;
    padding: 30px 15%;
    position: relative;
	background-color: var(--color-secondary);
	padding: 95px 15%;
}
blockquote, q {
    quotes: none;
}
article blockquote p {
    font-size: 27px;
    line-height: 40px;
    position: relative;
    padding-bottom: 0;
}

article blockquote span.quotes.left {
    position: absolute;
    top: 20px;
    left: -70px;
}
article blockquote span.quotes {
    font-size: 230px;
}

article blockquote span:not(.quotes) {
    font-size: 14px;
    line-height: 20px;
    padding: 10px 30px;
}

article blockquote span.quotes.right {
    position: absolute;
    bottom: -80px;
    right: -40px;
}
article blockquote span.quotes {
    font-size: 230px;
}

blockquote p {
    color: #fff;
}


/**************************************************************/
/********************         What we do     ******************/
/**************************************************************/
.whatwedo-img-container {
    height: 150px;
}

.what-we-do-colors:nth-child(1n) .highlight {
    background-color: var(--color-primary);
}

.what-we-do-colors:nth-child(2n) .highlight {
    background-color: var(--color-secondary);
}

.what-we-do-colors:nth-child(3n) .highlight {
    background-color: var(--color-tertiary);
}
/**************************************************************/
/********************         Team           ******************/
/**************************************************************/


.black-transparent-bg {
    background: #0000004d;
}
.team-model-top p i::before { color: #000; }
.team-modal .btn-close {
    background-image: none;
    display: grid;
    font-size: 24px;
    padding: 10px !important;	
}
.team-model-top p:nth-child(2) span:not(:last-child) {
    padding-right: 20px;
}
.team-model-bottom {
    overflow-y: scroll;
    height: 350px;
}
/*
.our-team {
    background: rgb(255, 255, 255);
    background: linear-gradient(180deg, rgba(255, 255, 255, 1) 20%, var(--background-color-secondary) 20%);
}
*/

.our-team .row div:nth-child(1n) .person-name,
.our-team .row div:nth-child(1n) .team-model-top .person-name{ background-color: #ffc20e; }

.our-team .row div:nth-child(2n) .person-name { background-color: #e78e00; }
.our-team .row div:nth-child(3n) .person-name { background-color: #72ad34; }
.our-team .row div:nth-child(4n) .person-name { background-color: #4c9723; }
.our-team .row div:nth-child(5n) .person-name { background-color: #4ec4cd; }
.our-team .row div:nth-child(6n) .person-name { background-color: #0077af; }
.our-team .row div:nth-child(7n) .person-name { background-color: #cc158b; }

.person-job {
	border-bottom: 1px solid #d9d9d9;
	font-size: 13px
}
.our-team .row div img { transition: 500ms; }

.our-team .row div:hover img {
    opacity: 0.8;
    transition: 500ms;
}
.bio-single-card > img {
    aspect-ratio: 1 / 1;
    object-fit: cover;
}


/**************************************************************/
/*****************         Partnerships      ******************/
/**************************************************************/
.community-partners-list ul {
    padding-left: 0;
    column-count: 3;
    gap: 40px;
}
.community-partners-list li {
    list-style: none;
    padding-bottom: 10px;
    font-size: 18px;
    line-height: 28px;
}


/**************************************************************/
/******************           Footer            ***************/
/**************************************************************/
@media(max-width: 768px){
	footer { text-align: center !important }
	footer .social-icons { justify-content: center }
}
footer { background-color: var(--color-background); }
footer a,
footer p {
    font-size: 14px;
    color: #fff;
}
footer a { text-decoration: none; }



/**************************************************************/
/*****************           Components           *************/
/**************************************************************/
.dot-accordion .accordion-button::after {
    margin-right: 5px !important;
    content: '\f078';
    font-family: 'FontAwesome';
    background: none;
	color: #fff;
}
.dot-accordion .accordion-button {
    background-color: var(--color-tertiary);
}
.dot-accordion .accordion-button:hover,
.dot-accordion .accordion-button:not(.collapsed) {
    background-color: var(--color-primary);
}
.dot-accordion .accordion-button:focus {
    box-shadow: none;
}

.background-image {
    background-repeat: no-repeat;
    background-size: cover;
}

/* Instagram */
.insta-overlay {
    position: absolute;
    width: calc(100% - 10px);
    height: calc(100% - 10px);
    background-color: rgba(108, 155, 59, .8);
    transform: translate(5px, 5px);
	border: 1px solid #fff;
}
.insta-block:hover .invisible {
    visibility: visible !important;
}
/* Instagram */

.division-description h2 {
    position: relative;
    padding: 3px 10px;
    font-weight: normal;
    font-size: 38px;
    color: #fff;
    z-index: 2;
    background-color: var(--color-tertiary);
    margin-bottom: 40px;
	word-wrap: break-word;
}

/* Tabs */

.dot-tabs {
    border-bottom: 1px solid #d9d9d9;
	border-top: 1px solid #d9d9d9;
}

.dot-tabs .tab-division {
    background: transparent;
    border: none;
    padding: 25px 0;
    color: #828282;
    font-size: 17px;
	border-bottom: 8px solid transparent;
	text-transform: uppercase;
}

.dot-tabs .tab-division:hover,
.dot-tabs .tab-division.active {
    border-bottom-color: var(--color-primary);
	font-weight: 600
}

/* Youth stories */
.tabs.tab-division:hover {
    cursor: pointer;
}

#loader img {
    width: 50px !important;
    position: absolute;
    z-index: 9;
    background: #ffffff73;
    bottom: 100%;
    transform: translateY(50%);
}

@media( max-width: 992px){
	.no-bg-mobile{ background: none }
	
	.table-wrapper {
		overflow-x: scroll;
	}
	
	.background-image {
		background: none !important;
	}	
	
	.border-btn {
		padding: 10px 15px !important;
	}	
	
	.regional-hero .col {
		min-height: 40vh;
	}	
	
	.dot-tabs {
		overflow: scroll;
		padding-bottom: 40px;
	}
	
}


/* Tabs */

.xlarge-title {
    font-size: 120px;
	line-height: 120px;	
}

.standard-list ul {
    padding-top: 10px;
    margin-bottom: 20px;
}

.standard-list li:not(:last-child) {
    padding-bottom: 10px;
}
.sub-ul-alpha ul {
    list-style: lower-alpha;
}

.has-arrow {
    position: relative;
}
.has-arrow:before {
    bottom: -15px;
    left: 0;
    right: 0;
    margin: auto;
}
.has-arrow:before {
    content: "";
    width: 30px;
    height: 30px;
    transform: rotate(45deg);
    display: inline-block;
    position: absolute;    
}

@media (min-width: 992px) {
	
	.w-lg-50 {
		width: 50%;
	}	
	
	.division-description h2 {
		display: inline-block;
	}

	.page-hero .col {
		min-height: 25vh;
	}	
    .right-arrow:before {
        top: 0;
        bottom: 0;
        right: 0;
		left: unset;
        margin: auto;
    }
}

.has-arrow.grey:before {
	background-color: var(--background-color-secondary);
}	
.has-arrow.primary:before {
	background-color: var(--color-primary);
}	
.has-arrow.tertiary:before {
	background-color: var(--color-tertiary);
}	

.inherit-fs { font-size: inherit }
ol[type="a"] li:not(:last-child) {
    padding-bottom: 10px;
}
ol[type="a"] li::marker {
    font-weight: bold;
}

/*****************        Divider           *************/
.divider-1 {
	background-color: #FEBF1A;
    width: 100%;
    height: 5px;
}

/*****************        Social sharer           *************/
.social-share-list ul {
    list-style: none;
}
.social-share-list .icon a img {
    transition: opacity 500ms;
}
.social-share-list .icon a img:hover {
    opacity: 0.7;
    transition: opacity 500ms;
}


/*****************     highlighted text w/pattern      *************/
.highlighted-text-wpattern { position: relative }

.highlighted-text-wpattern > span:first-child {
    position: relative;
    padding: 1px 50px;
    font-size: 38px;
    color: #fff;
    width: fit-content;
    z-index: 9999;
	padding-right: 200px;
}

.highlighted-text-wpattern > span:first-child:after {
    position: absolute;
    background-image: var(--site-pattern);
    width: 80%;
    height: 80%;
    bottom: 30px;
    left: -20px;
    z-index: -1;
	content: ''
}

/* half-bg */
.partial-bg-bottom-dark {
    background: rgb(255, 255, 255);
    background: linear-gradient(180deg, rgba(255, 255, 255, 1) 60%, var(--background-color-primary) 0%);
}
.partial-bg-top-dark {
    background: rgb(255, 255, 255);
    background: linear-gradient(360deg, rgba(255, 255, 255, 1) 40%, var(--background-color-primary) 0%);
}
.partial-bg-bottom-light {
    background: rgb(255, 255, 255);
    background: linear-gradient(180deg, rgba(255, 255, 255, 1) 50%, var(--background-color-secondary) 0%);
}
.story-share {
    background: rgb(255, 255, 255);
    background: linear-gradient(180deg, rgba(255, 255, 255, 1) 20%, var(--background-color-secondary) 0%);
}

.partial-bg-bottom-blue {
    background: rgb(255, 255, 255);
    background: linear-gradient(180deg, rgba(255, 255, 255, 1) 50%, var(--color-blue1) 0%);
}
.partial-bg-bottom-green {
    background: rgb(255, 255, 255);
    background: linear-gradient(180deg, rgba(255, 255, 255, 1) 50%, var(--color-green1) 0%);
}
/********  Buttons  *******/
.btn-primary { background: var(--color-primary); }
.btn-secondary { background: var(--color-secondary); }

.btn-outline-primary {
    border: 2px solid var(--color-primary);
    color: #fff;
}
.btn-outline-primary:hover {
    background-color: var(--color-primary);
    border-color: var(--color-primary);
}

/********  Border button  *******/
.fw-border-btn { width: calc(100% - 16px); }

.border-btn {
    padding: 16px 80px;
    /* font-size: 1rem; */
	font-weight: 700;
    transition: background-color .3s ease;
    text-align: center;	
    display: inline-block;
    position: relative;
    text-decoration: none;
    line-height: normal;
    z-index: 1;
    color: #fff;
	transform: translate(9px, 9px);
}
.border-btn:hover { color: #fff; }

.border-btn:before {
    transition: all .2s ease;
    content: "";
    position: absolute;
    border: 3px solid #fff;
    background-color: transparent;
    width: calc(100% - 6px);
    height: calc(100% - 6px);
    top: 0;
    left: 0;
    z-index: 0;
    box-sizing: content-box;	
}
.border-btn:hover:before {
    top: -9px;
    left: -9px;
    width: calc(100% + 12px);
    height: calc(100% + 12px);
}

.border-btn:after {
    content: "";
    display: inline-block;
    position: absolute;
    transition: background-color .2s ease;
    background-color: var(--color-primary);
    top: -9px;
    left: -9px;
    width: calc(100% + 18px);
    height: calc(100% + 18px);
    z-index: -1;
}

/*
.site-1 .blue-border-btn.border-btn:after,
.site-1 .mc-embed-form .border-btn:after,
*/
.tertiary-border-btn.border-btn:after {
	background-color: var(--color-tertiary);
}
.blue-border-btn.border-btn:after { background-color: var(--color-blue1); }
.red-border-btn.border-btn:after { background-color: var(--color-red1); }


.mc-embed-form .border-btn:after {
    background-color: var(--color-secondary);
}

/* Border button INPUT */
.dot-submit-button input {
    z-index: 3;
    position: relative;
    background: transparent;
    border: none;
    padding: 16px 110px;
    width: 100%;
    height: 100%;
    color: #fff;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 21px;
    letter-spacing: .075em;
}

.dot-submit-button.border-btn { padding: 0 !important; }

/********  Border button  *******/


.highlighted-text {
    position: relative;
    padding: 3px 10px;
    font-weight: 700;
    font-size: 28px;
    color: #fff;
	display: inline-block;
    min-width: 30%;
	z-index: 2;
	max-width: 100% !important;
	word-wrap: break-word;
	
}

.page-hero h1 span,
.highlighted-text span { font-weight: normal; }

.highlight {
    padding: 10px;
    color: #fff;
    text-align: center;
    width: fit-content;
    margin: auto;
    margin-top: 30px;
    margin-bottom: 30px;
}

.intro-text p,
.intro-text {
    font-size: 27px;
    line-height: 40px;
}
.highlighted-word {
    position: relative;
    padding: 10px 25px;
    margin: 10px 0;
    font-weight: 700;
    font-size: 38px;
    color: #fff;
    margin-left: -1.5rem;
    display: block;
    width: fit-content;
}
.highlighted-word-medium {
    position: relative;
    padding: 5px 25px;
    margin: 0 0 30px 0;
    font-size: 27px;
    color: #fff;
    margin-left: -1.5rem;
    display: block;
    width: fit-content;
}

/********  Social icons  *******/
header .social-icons i,
footer .social-icons i {
    color: #fff;
}
	


/**************************************************************/
/**************          Helper Classes             ***********/
/**************************************************************/
@media( min-width: 992px ){
	
	.division-description h2,
	.highlighted-text {
		padding: 3px 50px;
		font-size: 38px;
	}	
	.desktop-break{ display: block }
}	
@media( max-width: 992px ){
	.regional-hero .regional-hero-inner {
		width: 90%;
	}	
	.regional-hero-inner > div:after {
		right: 15px;
		top: 15px;
	}
	
	.w-100-sm {
		width: 100%
	}		
	.highlighted-text {
		margin-bottom: 15px;
	}	
}

.bg-contain { background-size: contain; }


.border-bottom-1 {
    border-bottom: 1px solid #e6e6e6;
    padding-bottom: 40px;
}

.mt-n1 { margin-top: -10px; }

.overlap {
    z-index: 5;
    position: relative;
}

.divider-50 {
    color: #fff;
    opacity: 1;
    width: 50%;
    margin: auto;
}

.pull-down {
    transform: translateY(80px);
}

.square {
	aspect-ratio: 1/1
}

.ar-featured-posts {
	aspect-ratio: 4 / 3 !important;
}

.ar-16-9 {
	aspect-ratio: 16 / 9 !important;
}
.huge-article {
    height: 400px;
}

.has-text-white p { color: #fff }


/**************************************************************/
/***************         Contact            *******************/
/**************************************************************/
.contact-details-block p, .contact-details-block h2 {
    color: #fff;
}
.contact-details a,
.contact-details h2 { font-size: 24px; }

.contact-details .social-icons i { color: #fff; }
.contact-details .social-icons { justify-content: center; }

.contact-details a {
    text-decoration: none;
    color: #fff;
}

.map-bg {
    background-image: url(http://kenya.v2.dotrust.org/wp-content/uploads/sites/4/2024/03/kenya-hp-map-1.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}




/**************************************************************/
/***************         wysiwyg            *******************/
/**************************************************************/
.wysiwyg hr {
    width: 50%;
    margin: 40px auto;
    color: #fff;
}
.wysiwyg h2 {
    font-weight: 700;
}
/**************************************************************/
/***************         Bootstrap          *******************/
/**************************************************************/
.container-fluid {
	padding-left: 0 !important;
	padding-right: 0 !important;
}


/**************************************************************/
/**************          Gravity forms              ***********/
/**************************************************************/

.gform_confirmation_message {
    color: #fff;
	padding: 0 40px;
	text-align: center;
}

.ginput_container .datepicker {
    width: 100% !important;
}
.gfield_checkbox input {
    margin-top: 0 !important;
}
.partner-form .gfield_checkbox label {
    color: #fff;
}

.gfield--type-captcha label {
    color: #fff;
}

.gform-body.gform_body {
    margin-bottom: 40px;
}
.gform_title {
    font-size: 27px;
    font-weight: 700;
}
.gform_required_legend {
    display: none;
}
.gform_title {
	text-align: center;
}

.white-labels_wrapper .gform_title,
.white-labels .gfield_description,
.white-labels .gsection_title,
.white-labels .gform-field-label,
.white-labels .gfield_label {
    color: #fff !important;
}

.partner-form .gform_wrapper form {
    width: 75%;
}

.partner-form .gform_wrapper,
.partner-form .gform_confirmation_wrapper,
.partner-form .partner-form-section {
    background-color: var(--color-primary);
	margin-top: 60px;
    padding-top: 40px;
    padding-bottom: 40px;	
}
.partner-form .form-header {
    text-align: center;
	color: white;
	text-transform: uppercase;
	font-weight: 700;
}

.gf-dot-wrapper_wrapper {
    background: var(--color-primary-bg);
    margin-top: 0 !important;
}

.gf-dot-wrapper .form-header {
    text-align: center;
    color: #fff;
    margin-bottom: 40px;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 27px;
    letter-spacing: -.02em;
}
/*
.gf-dot-wrapper.remove-labels label { display: none !important }
*/

.gf-dot-wrapper textarea:focus-visible,
.gf-dot-wrapper select:focus-visible,
.gf-dot-wrapper input:not(.gform_button):focus-visible {
    outline: none !important;
}

.gf-dot-wrapper textarea,
.gf-dot-wrapper select,
.gf-dot-wrapper input:not(.gform_button) {
    border: 4px solid var(--color-link-primary);
    padding: 13px 20px !important;
}

.gf-dot-wrapper .gform_footer { background-color: var(--color-secondary) }
.gfield { padding-right: 0 !important }

.gf-dot-wrapper .gform_footer {
    transition: padding .3s ease;
    height: 75px !important;
    padding: 10px !important;
    margin: 0 !important;
}

.gf-dot-wrapper input.gform_button {
    margin-left: -4px !important;
    background-color: transparent;
    width: 100% !important;
    height: 100% !important;
    border: 3px solid #fff;
    text-transform: uppercase;
    font-size: 21px !important;
    display: inline-block;
    font-weight: 600 !important;
    margin: 0 !important;
	color: #fff;
}
.gf-dot-wrapper .gform_footer:hover { padding: 0 !important }

.gf-dot-wrapper input:not(.gform_button):focus,
.gf-dot-wrapper select:focus,
.gf-dot-wrapper textarea:focus {
    border: 4px solid #ffc20e;
}

.gf-dot-wrapper select { color: #adadad; }

.gf-dot-wrapper .gfield_select {
    padding: 20px !important;
    width: 100% !important;
    font-size: 18px;
    border-radius: 0 !important;
    height: 70px;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    color: #585858;
    border: 4px solid #3e94c1;
}
.gf-dot-wrapper .ginput_container_select { position: relative }
.gf-dot-wrapper .ginput_container_select:after {
    content: "";
    background-image: url(https://kenya.dotrust.org/assets/img/dropdown-arrow.png);
    width: 20px;
    height: 10px;
    display: inline-block;
    background-size: contain;
    background-position: 50%;
    position: absolute;
    right: 20px;
    top: 30px;
}


/**************************************************************/
/**************            MailChimp                ***********/
/**************************************************************/
.mc-embed-form .dot-submit-button {
    width: calc(100% - 18px);
}

.consent-field * {
    color: #fff !important;
}
.consent-field {
    background-color: var(--color-blue1);
    box-shadow: 0 0 1px 0px black;
}

.dot-form-input,
.mc-embed-form .form-group input {
    border: 4px solid var(--color-link-primary);
    padding: 20px 25px !important;
    border-radius: 0;
}


/**************************************************************/
/**************            Careers                  ***********/
/**************************************************************/
.career-item h2 {
    transform: translateX(-3rem);
}

.career-posts .post-item:nth-child(odd) h2 { background-color: var(--color-primary) }
.career-posts .post-item:nth-child(odd) > div > div,
.career-posts .post-item:nth-child(odd) > div { 
    background-color: var(--color-tertiary); transition: 200ms ease;
}


.career-posts .post-item:nth-child(even) h2 { background-color: var(--color-tertiary) }
.career-posts .post-item:nth-child(even) > div > div,
.career-posts .post-item:nth-child(even) > div { 
    background-color: var(--color-primary); transition: 200ms ease;
}


.career-posts .post-item:hover > div > div,
.career-posts .post-item:hover > div {
	background-color: var(--color-secondary); transition: 200ms ease;
}


/**************************************************************/
/**************            Dot home                  ***********/
/**************************************************************/
.vl {
    display: block;
    position: relative;
    margin: 0 auto;
    height: 64px;
    width: 3px;
    background-color: #fff;
}
/*
.dot-home-hero .col {
    height: 70vh;
}
*/
/*
.dot-home-hero {
    background-image: url(https://v2.dotrust.org/wp-content/uploads/2024/04/13924841_1151827981542751_3717593007657640518_n.jpg);
    background-repeat: no-repeat;
    background-position: left;
    background-size: 50%;
}
*/

/**************************************************************/
/**************            404                      ***********/
/**************************************************************/

.error404 h2 {
    font-size: 100px;
}


/**************************************************************/
/**************      Youth Stories                  ***********/
/**************************************************************/
.are-you-title {
    transform: translateY(-50%);
}


/**************************************************************/
/**************      Our Impact                     ***********/
/**************************************************************/
.pie-base {
    width: 300px;
    height: 300px;
    background-color: #ebebeb;
    border-radius: 50%;
    margin: 0 auto;
    position: relative;
    border: 15px solid var(--color-tertiary);
}

/*
.pie-base:before {
    content: "";
    width: 100%;
    height: 100%;
    border: 15px solid #4ec4cd;
    display: inline-block;
    position: absolute;
    border-radius: 50%;
    background-color: #4ec4cd;
    top: -15px;
    right: -15px;
    left: -15px;
    bottom: -15px;
}
*/

.pie-base .pie-1 {
    width: 50%;
    height: 100%;
    background-color: #0077ae;
    border-radius: 150px 0 0 150px;
    position: relative;
    z-index: 2;
}

.pie-base .pie-2 {
    width: 50%;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    background-color: #3d93c1;
    border-radius: 0 150px 150px 0;
    z-index: 3;
}

.pie-base .pie-2 span {
    color: #fff;
    position: absolute;
    top: 42%;
    right: 20px;
    margin: auto 0;
    display: inline-block;
    z-index: 5;
    font-size: 38px;
    line-height: 38px;
    font-weight: 600;
}

.pie-base .pie-2 .pie-2-30 {
    width: 100%;
    height: 100%;
    position: absolute;
    background-color: #3d93c1;
    border-radius: 0 150px 150px 0;
    transform: rotate(29deg);
    top: 12%;
    left: -7%;
    right: 0;
}


/* GLOBAL
.page-hero .highlighted-text.color-secondary-bg {
    background: var(--color-tertiary);
}
*/


.publications-col:not(:first-child) {
    padding-top: 60px;
}
.publications-col {
    border-bottom: 1px solid #ebebeb;
    padding-bottom: 60px;
}




/* DOT Home blog */
.home-blogs .post-item h3 { font-size: 23px }
.home-blogs {
    margin-bottom: 600px;
}

@media( min-width: 1200px ){
	
	.blog-row {
		position: relative;
		height: 1046px;
		margin-left: -1rem;
		margin-right: -1rem;	
	}
	.home-blogs .blog-col {
		overflow: hidden;
		transition: 500ms ease;
	}

	/* home-blogs-1 */
	.home-blogs-1 .blog-col:nth-child(3) .justify-content-center,
	.home-blogs-1 .blog-col:nth-child(4) .justify-content-center {
		justify-content: unset !important;
	}
	
	
	.home-blogs-1 .blog-col:nth-child(1) {
		width: 33.33%;
		position: absolute;
		height: 340px;
		top: 0;
		left: 0;
	}

	.home-blogs-1 .blog-col:nth-child(2) {
		left: 33.33%;
		top: 0;	
		position: absolute;
		width: 33.33%;
		height: 340px;	
	}

	.home-blogs-1 .blog-col:nth-child(3) {
		top: 0;
		left: 66.66%;
		position: absolute;
		width: 33.33%;
		height: 706px;	
	}

	.home-blogs-1 .blog-col:nth-child(4) {
		top: 353px;
		left: 0;
		position: absolute;
		width: 66.66%;
		height: 706px;	
	}
	.home-blogs-1 .blog-col:nth-child(4) img {
		aspect-ratio: unset;
		height: 320px;
	}

	.home-blogs-1 .blog-col:nth-child(5) {
		left: 66.66%;
		top: 719px;	
		position: absolute;
		width: 33.33%;
		height: 340px;	
	}


	.home-blogs-1 .blog-col:nth-child(1) img,
	.home-blogs-1 .blog-col:nth-child(2) img,
	.home-blogs-1 .blog-col:nth-child(5) img {
		display: none;
	}
	/* home-blogs-1 */
	
	/* home-blogs-2 */
	.home-blogs-2 .blog-col:nth-child(2) .justify-content-center,
	.home-blogs-2 .blog-col:nth-child(3) .justify-content-center {
		justify-content: unset !important;
	}
	
	.home-blogs-2 .blog-col:nth-child(1) {
		width: 33.33%;
		position: absolute;
		height: 340px;
		top: 0;
		left: 0;
	}

	.home-blogs-2 .blog-col:nth-child(2) {
		top: 0;
		left: 33.33%;
		position: absolute;
		width: 66.66%;
		height: 706px;		
	}

	.home-blogs-2 .blog-col:nth-child(3) {
		top: 353px;
		left: 0;
		position: absolute;
		width: 33.33%;
		height: 706px;		
	}

	.home-blogs-2 .blog-col:nth-child(4) {
		left: 33.33%;
		top: 719px;
		position: absolute;
		width: 33.33%;
		height: 340px;		
	}
	.home-blogs-2 .blog-col:nth-child(2) img {
		aspect-ratio: unset;
		height: 320px;		
	}

	.home-blogs-2 .blog-col:nth-child(5) {
		left: 66.66%;
		top: 719px;
		position: absolute;
		width: 33.33%;
		height: 340px;		
	}


	.home-blogs-2 .blog-col:nth-child(1) img,
	.home-blogs-2 .blog-col:nth-child(4) img,
	.home-blogs-2 .blog-col:nth-child(5) img {
		display: none;
	}
	/* home-blogs-1 */	
	
} /* // min-width: 1200px */

.blog-col div,
.blog-col:hover {
	transition: 500ms ease;
}

/* */
.home-blogs-1 .blog-col:hover div {
    background: var(--color-primary) !important;
    transition: 500ms ease;
}

.home-blogs-1 .blog-col:nth-child(1) div {
    background: var(--color-orange1);
	transition: 500ms ease;
}
.home-blogs-1  .blog-col:nth-child(2) div {
    background: var(--color-red1);
}
.home-blogs-1  .blog-col:nth-child(3) div {
    background: var(--color-blue1);
}
.home-blogs-1  .blog-col:nth-child(4) div {
    background: var(--color-blue2);
}
.home-blogs-1 .blog-col:nth-child(5) div {
    background: var(--color-red1);
}
/* */

/* */
.home-blogs-2 .blog-col:hover div {
    background: var(--color-highlight) !important;
    transition: 500ms ease;
}

.home-blogs-2 .blog-col:nth-child(1) div {
    background: #a73658;
	transition: 500ms ease;
}
.home-blogs-2  .blog-col:nth-child(2) div {
    background: var(--color-orange2);
}
.home-blogs-2  .blog-col:nth-child(3) div {
    background: #e78e00;
}
.home-blogs-2  .blog-col:nth-child(4) div {
    background: #a73658;
}
.home-blogs-2 .blog-col:nth-child(5) div {
    background: #e78e00;
}
/* */

.recent-posts.dot-home-inspiration .post-item:hover > div > div,
.recent-posts.dot-home-inspiration .post-item:hover > div {
	background-color: var(--color-highlight);
	transition: 200ms ease;
}

/* */
.site-1.home .newsletter-section h2,
.site-1.home .insta-section h2 {
    background-color: var(--color-orange1) !important;
    color: var(--color-highlight);
}

.site-1 .mc-embed-form .border-btn:after {
    background-color: var(--color-red1);
}

.site-1 .page-hero .site-pattern {
    background-color: var(--color-secondary);
}

.company-logo {
    max-width: 30%;
}

.publication-featured img {
    max-height: 500px !important;
	object-position: top;
}

.no-translate { transform: unset; }

.standard-list li:not(:last-child) {
    padding-bottom: 1rem;
}

.ginput_container.ginput_container_text input {
    height: 70px;
}


.site-1 .page-hero h1.highlighted-text {
    background-color: var(--color-tertiary);
}

.slick-arrow:before {
    color: var(--color-primary) !important;
}

.smaller {
    font-size: 0.7em;
}

.division-description {
    margin-bottom: 40px;
}

.has-h3 p {
	font-size: 1.75rem;
}

/* Malawi */
.subgrid .col div {
    display: flex;
    flex-direction: column;
    white-space: break-spaces;
}
.subgrid img,
.subgrid .border-btn{
    align-self: flex-start;
}

.otgs-development-site-front-end {
    display: none;
}


/**************************************************************/
/**************      MAP                            ***********/
/**************************************************************/
.map-title {
    display: flex;
    align-items: center;
    gap: 15px;
}
.list-label {
    width: 15px !important;
    height: 15px !important;
    padding: 10px !important;
    display: flex !important;
    place-content: center;
    align-items: center;
    border-radius: 50px !important;
    font-size: 16px !important;
}

.bh-sl-pagination-container {
    display: none;
}
.partner-title {
    font-weight: 500;
    font-size: 14px;
}

.bh-sl-form-container {
    display: none;
}

.bh-sl-filters-container select {
    border: 4px solid var(--color-secondary);
    width: 100%;
    padding: 13px 20px;
	appearance: none;
}

.bh-sl-filters-container select:focus-visible {
	border: 4px solid #ffc20e;
    outline: 0;	
}

.bh-sl-filters {
    margin: 0 !important;
}

.bh-sl-filters-container {
    display: grid;
    grid-template-columns: 50fr 50fr;
    gap: 40px;
}

.gm-style-iw-c {
    padding-top: 30px !important;
}

.gm-style-iw-chr {
    position: absolute;
    width: 100%;
    top: 0px;
	right: 0;
}

.bh-sl-container .loc-name {
    font-size: 1.25rem;
}

.ewp-infowindow {
    padding: 10px;
	padding-bottom: 15px;
    transform: translateY(-5px);
}

.ewp-infowindow .btn:hover {
    color: #fff !important;
}

/* */
.list-label{
    background: #00192d;
    border-radius: 15px;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    color: #fff;
    font-weight: bold;
    line-height: 1.4;
    padding: 4px 7px;
}

.white-hover:hover {
	color: #fff !important;
}

.bh-sl-filters-container li:last-child::before {
	border-left: 0.3rem solid transparent;
	border-right: 0.3rem solid transparent;
	border-top: 0.3rem solid black;
	top: 50%;
	transform: translateY(-50%);
	--size: 0.3rem;
	content: "";
	position: absolute;
	right: 1rem;
	pointer-events: none;	
}

.bh-sl-filters-container li:last-child {
	position: relative;
}

.single-bh_sl_locations .map-button,
.single-bh_sl_locations .list-label {
    display: none;
}

.map-button:focus-visible {
    box-shadow: none !important;
    background-color: unset !important;
}

.metrics b {
    display: block;
	font-size: 32px;
}

.dot-header-menu a {
    text-transform: uppercase;
}
.dot-header-menu .sub-menu li a {
    padding-left: 25px !important;
}

.dot-header-menu .sub-menu li:hover a {
    color: #fff;
}
.dot-header-menu .sub-menu li:hover {
    background-color: var(--color-blue2);
    color: #fff;
}

.partner_spotlight_logo {
    height: 200px;
    object-fit: contain;
    margin-bottom: 20px;
	max-width: 300px;
}

.site-5 .nav-item.\/current-projects\?lang\= {
    display: block;
}
.nav-item.\/current-projects\?lang\= {
    display: none;
}

.single-bh_sl_locations .ewp-infowindow .list-label {
    display: none !important;
}

@media(max-width: 768px){
	.bh-sl-filters-container {
		grid-template-columns: 100%;
		gap: 15px;
	}
}

.team-model-top span:nth-child(2) i {
    padding-right: 7px;
}