/*
  Theme Name: Sohoj - Charity, Nonprofit HTML5 Template
  Author: theme_group
  Support: robiulislamfree@gmail.com
  Description: Sohoj is a HTML5 template which fits for all kind of Charity, Fund raising, Nonprofit, NGO, Social Working, and other non-profit website for all your needs.
  Tags: business, clean design, clean layout, marketing, minimal design, minimalist, modern, newsletter, app, app landing, App Showcase, digital, digital product, landing page, mobile apps, modern, sales apps, sass, software, startup,
  Version: 1.0
*/

/* CSS Index
-----------------------------------
 /* 
1.	Theme Default
2.	Pre Loader
3.	Header Area Css Style
4.	Search Form Area Css Style
5.	header menu area css
		i. main menu area css
		ii. sub menu
6.	sohoj slider area css
7.	sohoj Children Care area css
8.	sohoj About area css
9.	sohoj cause area css
10.	sohoj counter area css
11.	sohoj events area css
12.	sohoj client donate area css
13.	sohoj team area css
14.	faq area css
15.	sohoj blog area css
		i. Blog Quote Area Css Style
		ii. Blog Post Tags Area Css Style
		iii. Blog Comments Area Css Style
		iv. Blog Comments Form Area Css Style
16.	subscribe area css
17.	footer area css
18.	breadcrumb area css
19.	Contact Form Area Css Style
20.	Google Map Area Css Style
21.	Contact Info  Area Css Style
22.	dark home css
23.	Error Area Css Style
 */

/* Google Fonts */



* {
    margin: 0px;
    padding: 0px;
    border: none;
    outline: none;
    font-size: 100%;
    line-height: inherit;
    -ms-word-wrap: break-word;
    word-wrap: break-word;
    
}

p{
    text-align: justify !important;
}

/* CSS Reset */


body {
    font-family: Helvetica, sans-serif;
    font-weight: normal;
    font-style: Helvetica Neue !important;
    background-color: white;
}

body, html {
    overflow-x: hidden !important;
}

img {
    max-width: 100%;
    height: auto;
    transition: all 0.3s ease-out 0s;
}

a,
.button,
.btn {
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
    font-weight: bold;
}

a:focus,
.button:focus,
.btn:focus {
    text-decoration: none;
    outline: none;
}

a:focus,
a:hover {
    text-decoration: none;
    color: #67b5fb;
}

.btn:focus,
button:focus,
input:focus,
textarea,
textarea:focus,
.form-control:focus {
    outline: 0;
    box-shadow: none;
    -webkit-box-shadow: none;
    border: 1px solid #f1f1f1;
    background: #fff;
}

button {
    cursor: pointer;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-style: Helvetica Neue !important;
    color:  #38648e;
    font-style: normal;
    font-weight: 400;
    margin-bottom: 10px;
}

h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
    color: inherit;
}

ul {}

li {
    margin-bottom: 10px;
}

p {
    font-family: 'Helvetica Neue', sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 20px;
    color: #38648e;
}

hr {
    border-bottom: 1px solid #eceff8;
    border-top: 0 none;
    margin: 30px 0;
    padding: 0;
}

/* Pre Loader */

.preloader {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9999;
    width: 100%;
    height: 100%;
    background-color: #24262d;
    overflow: hidden;
}

.preloader-inner {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.preloader-icon {
    width: 100px;
    height: 100px;
    display: inline-block;
    padding: 0px;
}

.preloader-icon span {
    position: absolute;
    display: inline-block;
    width: 100px;
    height: 100px;
    border-radius: 100%;
    background-color: #67b5fb;
    -webkit-animation: preloader-fx 1.6s linear infinite;
    animation: preloader-fx 1.6s linear infinite;
}

.preloader-icon span:last-child {
    animation-delay: -0.8s;
    -webkit-animation-delay: -0.8s;
}

@keyframes preloader-fx {
    0% {
        -webkit-transform: scale(0, 0);
        transform: scale(0, 0);
        opacity: 0.5;
    }
    100% {
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1);
        opacity: 0;
    }
}

@-webkit-keyframes preloader-fx {
    0% {
        -webkit-transform: scale(0, 0);
        opacity: 0.5;
    }
    100% {
        -webkit-transform: scale(1, 1);
        opacity: 0;
    }
}

#close-btn:hover {
    color: #67b5fb;
    cursor: pointer;
}

/* header menu area css */

.sohoj-main-slider-area {
    position: relative;
}


/*  sohoj slider area css */

ul.sohoj-slider-btn-area {
    padding: 0;
    margin: 0;
}

ul.sohoj-slider-btn-area li {
    list-style: none;
    margin: 0 20px 0 0;
    padding: 0;
    display: inline-block;
    text-transform: uppercase;
    font-weight: 600;
}

ul.sohoj-slider-btn-area li a {
    color: #fff;
    padding: 12px 30px;
    display: block;
    border-radius: 50px;
    border: 1px solid #fff;
    font-size: 18px;
    transition: all .3s;
}

ul.sohoj-slider-btn-area li a:hover {
    background: #67b5fb;
    border-color: #67b5fb;
}

.sohoj-single-slider-content {}

.sohoj-single-slider-content h2 {
    text-transform: capitalize;
    font-size: 56px;
    font-weight: 700;
    line-height: 1.2;
    color: #fff;
    margin-top: 35px;
}

.bg-1 {
    background-position: center center;
    background-size: cover;
    color: #fff;
    height: 500px !important;
}

.sohoj-single-table {
    display: table;
    height: 100%;
    width: 100%;
}

.sohoj-single-tablecell {
    display: table-cell;
    vertical-align: middle;
    height: 80% !important;
}


/* sohoj cause area css */
.sohoj-all-cause {
    display: flex;
    flex-wrap: wrap;
}

.sohoj-single-cause {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 15px;
    flex: 1;
    min-width: 300px; /* Adjust as necessary */
    margin: 10px;
    background: #fff;
    border-radius: 5px;
}

.sohoj-single-cause img {
    width: 100%;
    height: 300px;
    object-fit: cover;
    border-radius: 5px 5px 0 0;
}

.sohoj-single-cause-content {
    padding: 20px;
    display: flex;
    flex-direction: column;
    flex: 1;
}

.sohoj-single-cause-content h4 {
    font-weight: 700;
    text-transform: capitalize;
    font-size: 20px;
    margin-bottom: 15px;
}

.sohoj-single-cause-content p {
    font-size: 18px;
    flex: 1;
    margin-bottom: 15px;
}

.sohoj-single-cause-content a {
    align-self: flex-start;
    margin-top: 20px;
}

.cause-progress-bar {
    margin: 40px 0;
}

.cause-price-raised,
.cause-price-goal {
    display: inline-block;
}

.cause-price-raised {
    float: left;
}

.cause-price-goal {
    float: right;
}

.single-cause-price {
    display: block;
    width: 100%;
    overflow: hidden;
}

.single-cause-price h3 {
    font-size: 18px;
    text-transform: capitalize;
    font-weight: 600;
}

.single-cause-price h3 span {
    color: #67b5fb;
}

.sohoj-all-cause .owl-nav div {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    transition: all 0.3s ease 0s;
    text-align: center;
    line-height: 42px;
    font-size: 30px !important;
    background: #fff !important;
    border-radius: 50% !important;
    color: #67b5fb !important;
    width: 50px;
    height: 50px;
    border: 1px solid #67b5fb;
}

.sohoj-all-cause .owl-nav div.owl-next {
    left: auto;
    right: -50px;
}

.sohoj-all-cause .owl-nav div.owl-prev {
    left: -50px;
}

/* sohoj counter area css */

.sohoj-counter-area {
    background-position: center center;
    background-size: cover;
    background-attachment: inherit;
    position: relative;
    height: 100%;
    background-image: url(assets/img/counter/1.jpg);
    background-repeat: no-repeat;
}

.sohoj-counter-area:before {
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    background: rgba(1, 16, 90, .90);
}

.single-counter {
    text-align: center;
    padding: 30px 0;
    border: 3px dotted #fff;
}

.counter-border {
    display: block;
    height: 6px;
    background: #67b5fb;
    width: 70px;
    margin: 20px auto 10px auto;
}

.counter-number {
    color: #fff;
    font-size: 48px;
    font-weight: 700;
}

.count-name {
    font-size: 22px;
    color: #fff;
    font-family: 'Helvetica Neue', sans-serif;
    font-weight: 500;
    text-transform: capitalize;
}

.sohoj-counter-area .col-xl-3:nth-child(odd) .single-counter {
    margin: 30px 0 0 0;
}

/* sohoj events area css */

.single-events {
    padding: 20px;
    background: #f7faff;
    box-shadow: 0px 8px 12px 0px rgba(0, 0, 0, 0.14);
    overflow: hidden;
}

.single-events-img {
    width: 45%;
    height: auto;
    display: inline-block;
    float: left;
}

.single-events-img img {
    width: 100%;
}

.single-events-content {
    display: inline-block;
    width: 50%;
    margin-left: 20px;
}

.single-events-content h4 {
    font-weight: 700;
    text-transform: capitalize;
    padding-bottom: 10px;
    margin-bottom: 5px;
}

.single-events-content p {
    font-size: 15px;
    margin-bottom: 0;
}

.events-date {
    text-transform: capitalize;
    font-weight: 500;
    font-size: 16px;
    margin: 5px 0 10px 0;
}

.events-date span {
    color: #67b5fb;
    text-transform: uppercase;
}

.all-single-events.owl-theme .owl-dots .owl-dot span {
    background: #2c2c2c none repeat scroll 0 0;
    display: inline-block;
    border-radius: 8px !important;
    height: 10px;
    width: 8px;
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    -webkit-transition: all .3s;
    transition: all .3s;
    margin: 0 4px;
    border-radius: 0;
    opacity: .5;
}

.all-single-events.owl-theme .owl-dots .owl-dot.active span {
    background: #67b5fb;
    border: medium none;
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    width: 8px;
    height: 20px;
    border-radius: 8px;
}

.all-single-events.owl-theme .owl-nav.disabled+.owl-dots {
    position: absolute;
    left: 50%;
    bottom: -60px;
}

.all-single-events.owl-theme .owl-dots .owl-dot {
    display: inline-block;
    line-height: 1;
}

.all-single-events.owl-theme .owl-dots .owl-dot:last-child {
    margin-bottom: 0;
}

/* sohoj client donate area css */

.sohoj-client-donate-area {
    background-position: center center;
    background-size: cover;
    background-attachment: inherit;
    position: relative;
    height: 100%;
    background-image: url(assets/img/counter/1.jpg);
    background-color: #1a2b3c;
    background-repeat: no-repeat;
}

.sohoj-client-donate-area:before {
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    background: rgba(1, 16, 90, .90);
}

.client-single-slider {}

.title-desig-quot {
    display: flex;
    align-items: center;
}

.title-desig {
    margin-left: 15px;
    padding-left: 15px;
    border-left: 1px solid #fff;
}

.title-desig h3 {
    font-size: 22px;
    font-weight: 700;
    color: #fff;
    text-transform: capitalize;
    margin-bottom: 5px;
}

.title-desig h4 {
    font-size: 16px;
    color: #fff;
    text-transform: capitalize;
}

.title-desig-quot i {
    font-size: 40px;
    color: #fff;
}

.client-single-slider p {
    color: #fff;
    margin-top: 25px;
}

.sohoj-client-slider-wraper {
    margin: 80px 0;
}

.sohoj-client-slider-wraper.owl-theme .owl-dots .owl-dot span {
    background: #fff none repeat scroll 0 0;
    border-radius: 30%;
    display: inline-block;
    height: 20px;
    width: 20px;
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    -webkit-transition: all .3s;
    transition: all .3s;
    margin: 0 4px;
    border-radius: 50%;
    border: 4px solid #67b5fb;
    opacity: .5;
}

.sohoj-client-slider-wraper.owl-theme .owl-dots .owl-dot.active span {
    background: #fff;
    border: medium none;
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: 4px solid #67b5fb;
}

.sohoj-client-slider-wraper.owl-theme .owl-nav.disabled+.owl-dots {
    position: absolute;
    left: 0;
    bottom: -45px;
    margin-top: 0;
}

.sohoj-donate-area {
    background: rgba(255, 255, 255, .20);
    padding: 30px 15px;
}

.sohoj-donate-area select.form-control,
.sohoj-donate-area input.form-control {
    border-radius: 0;
    box-shadow: none;
    color: #777777;
    height: 50px;
    margin-bottom: 30px;
    background: #f7faff;
    border: none;
    font-size: 15px;
}

/* sohoj team area css */

.single-team-wraper {
    cursor: pointer;
}

.single-team-wraper .team-img-title {
    position: relative;
}

.single-team-wraper .team-img-title img {
    width: 200px !important;
    height:auto !important;
}

.team-img-title h3.team-title {
    position: absolute;
    left: 15px;
    right: 15px;
    bottom: -30px;
    background: #fff;
    font-size: 24px;
    text-transform: capitalize;
    font-weight: 700;
    display: inline-block;
    padding: 20px 30px;
    margin: 0;
    border-radius: 5px;
    box-shadow: 0px 8px 20px 0px rgba(47, 48, 52, 0.14);
    transition: all .3s;
}

.single-team-wraper:hover h3.team-title {
    background: #67b5fb;
    color: #fff;
}

/* faq area css */

.sohoj-faq-area {
    background-position: center center;
    background-size: cover;
    background-attachment: inherit;
    position: relative;
    height: 100%;
    background-image: url(assets/img/faq/1.jpg);
    background-color: #1a2b3c;
    background-repeat: no-repeat;
}

.sohoj-faq-area:before {
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    background: rgba(1, 16, 90, .90);
}

.sohoj-accordion-wrapper p {
    margin: 0;
    font-size: 18px;
}

.sohoj-accordion-wrapper .accordion-item {
    margin-bottom: 20px;
    border-radius: 10px;
    box-shadow: 0px 0px 73px 0px rgba(0, 0, 0, 0.09);
    border: 0;
    border-top-left-radius: 10px;
    border-bottom-right-radius: 10px
}

.sohoj-accordion-wrapper button.accordion-button {
    background: #67b5fb;
    border-radius: 10px 10px 0 0;
    display: block;
    text-align: left;
    padding: 30px 35px;
    font-size: 18px;
    border: none;
    font-family: 'Helvetica Neue', sans-serif;
    font-weight: 700;
}

.sohoj-accordion-wrapper button.accordion-button.collapsed {
    background: #fff;
    border-radius: 15px;
}

.sohoj-accordion-wrapper .accordion-header:first-child {
    border-radius: 15px;
}

.sohoj-accordion-wrapper .accordion-header {
    padding: 0;
    border-bottom: 1px solid transparent;
}

.sohoj-accordion-wrapper .accordion-body {
    padding: 30px 30px 30px 35px;
}

.sohoj-accordion-wrapper .accordion>.accordion-item:first-of-type {
    border-bottom-right-radius: inherit;
    border-bottom-left-radius: inherit;
}

.sohoj-accordion-wrapper .accordion>.accordion-item {
    border-radius: 10px !important;
    -webkit-border-radius: 10px !important;
    -moz-border-radius: 10px !important;
    -ms-border-radius: 10px !important;
    -o-border-radius: 10px !important;
}

.sohoj-accordion-wrapper h2 button.accordion-button {
    color: #fff;
    position: relative;
}

.sohoj-accordion-wrapper h2 button.accordion-button:hover {
    color: #fff;
}

.sohoj-accordion-wrapper h2 button.accordion-button.collapsed {
    color: #30323d;
}

.sohoj-accordion-wrapper h2 button.accordion-button::after {
    content: "-";
    position: absolute;
    right: 25px;
    top: 30px;
    height: 25px;
    width: 25px;
    background: #fff;
    color: #000;
    text-align: center;
    line-height: 25px;
    border-radius: 30px;
}

.sohoj-accordion-wrapper h2 button.accordion-button.collapsed::after {
    content: "+";
    background: #2c2c2c;
    color: #fff;
}

.sohoj-about-contact {
    margin: 180px 0 0 15px;
}

.sohoj-about-contact h2 {
    font-size: 50px;
    text-transform: capitalize;
    font-weight: 700;
    color: #fff;
}

.sohoj-about-contact h4 {
    font-size: 24px;
    text-transform: capitalize;
    font-weight: 500;
    color: #fff;
}

.sohoj-about-contact h4 a {
    text-transform: uppercase;
    color: #67b5fb;
    text-decoration: underline;
    font-weight: 700;
}

/* sohoj blog area css */

.sohoj-blog-area {}

.single-blog-wraper {}

.blog-details-content .blog-img,
.single-blog-wraper .blog-img {
    position: relative;
}

.single-blog-wraper img {
    width: 100%;
}

.blog-img-slider.owl-theme .owl-nav {
    margin-top: 0 !important;
}

.blog-img-slider .owl-nav div {
    left: 0;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    transition: all 0.3s ease 0s;
    text-align: center;
    line-height: 42px;
    font-size: 30px !important;
    background: #fff !important;
    border-radius: 0 !important;
    color: #67b5fb !important;
    width: 50px;
    height: 50px;
    margin: 0 !important;
}

.blog-img-slider .owl-nav div:hover {
    background: #67b5fb !important;
    color: #fff !important;
}

.blog-img-slider .owl-nav div.owl-next {
    left: auto;
    right: 0;
}

.blog-details-content .blog-img h4,
.single-blog-wraper .blog-img h4 {
    position: absolute;
    left: 30px;
    right: 30px;
    bottom: -60px;
    background: #fff;
    display: inline-block;
    box-shadow: 0px 8px 20px 0px rgba(47, 48, 52, 0.14);
    border-radius: 5px;
    padding: 22px 25px;
    font-size: 28px;
    font-weight: 700;
    text-transform: capitalize;
    z-index: 1;
}

.blog-details-content h6,
.blog-details-content h5,
.blog-details-content h5,
.blog-details-content h4,
.blog-details-content h3,
.blog-details-content h2,
.blog-details-content h1 {
    margin-bottom: 15px;
    font-weight: 600;
}

/* Blog Quote Area Css Style */

blockquote,
blockquote.wp-block-quote {
    background: #67b5fb;
    padding: 20px 35px !important;
    box-shadow: 0px 0px 30px 0px rgba(26, 43, 60, 0.15);
    border-radius: 6px;
    position: relative;
    overflow: hidden;
    margin: 40px 0;
    z-index: 1;
}

blockquote:before,
blockquote.wp-block-quote:before {
    content: "\f10d";
    position: absolute;
    bottom: 9%;
    left: 5%;
    color: #fff;
    font-size: 50px;
    line-height: 1;
    opacity: .5;
    z-index: -1;
}

blockquote p,
blockquote.wp-block-quote p {
    color: #fff;
    font-size: 24px;
    font-weight: 500;
    line-height: 32px;
}

blockquote cite,
blockquote.wp-block-quote cite {
    position: relative;
    font-size: 16px;
    font-weight: 600;
    text-transform: capitalize;
    padding-left: 15px;
    margin-top: 30px;
    display: inline-block;
    float: right;
    color: #fff;
}

blockquote cite:before,
blockquote.wp-block-quote cite:before {
    position: absolute;
    content: '';
    bottom: 0;
    width: 10px;
    height: 2px;
    background: #fff;
    margin: 0 auto;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
}

/* Blog Post Tags Area Css Style */

.blog-post-admin-date-comment-tag {
    padding: 30px 35px;
    background: #67b5fb;
}

.blog-post-admin-date-comment-tag .post-info {
    margin: 0 15px 0 0;
    padding: 0;
    display: inline-flex;
}

.blog-post-admin-date-comment-tag .post-info a {
    color: #fff;
    text-transform: capitalize;
    font-size: 14px;
    font-weight: 700;
}

.blog-post-admin-date-comment-tag .post-info span i {
    margin-right: 6px;
    color: #fff;
}

/*  */

.blog-post-tag span {
    font-size: 20px;
    font-weight: 600;
    display: block;
    margin-bottom: 17px;
    color: #1a2b3c;
    text-transform: capitalize;
}

.blog-post-tag {
    background: #fff;
    padding: 0;
    padding-top: 0;
    width: 100%;
    overflow: hidden;
    padding-bottom: 0;
    padding-top: 30px;
}

.blog-post-tag>a {
    color: #1a2b3c;
    display: inline-block;
    font-size: 12px;
    font-weight: 500;
    text-transform: uppercase;
    border: 1px solid #e5e5e5;
    padding: 10px 24px;
    margin-right: 5px;
    transition: .3s;
    border-radius: 0;
    margin-bottom: 10px;
}

.blog-post-tag>a:hover {
    color: #fff;
    background: #67b5fb;
    border-color: #67b5fb;
}

/* Blog Comments Area Css Style */

.post-heading {
    margin-bottom: 30px;
}

.post-heading h3 {
    font-size: 28px;
    font-weight: 600;
    text-transform: capitalize;
    color: #1a2b3c;
    line-height: 1;
}

.latest-comments>ul {
    padding: 0;
    margin: 0;
}

.latest-comments ul {
    list-style: none;
}

.comments-box {
    margin-bottom: 30px;
    border-bottom: 1px solid #e7eaf0;
    padding: 40px 20px;
    background: #67b5fb;
    border-radius: 20px;
}

.comments-avatar {
    float: left;
    width: 100px;
}

.comments-avatar img {
    border: 2px solid #fff;
}

.comments-text {
    overflow: hidden;
    padding-left: 30px;
}

.avatar-name-date {
    display: inline-block;
}

.avatar-name-date>h5 {
    font-size: 18px;
    font-weight: 500;
    text-transform: capitalize;
    color: #fff;
    font-family: 'Helvetica Neue', sans-serif;
    line-height: 1;
}

.avatar-name-date span {
    text-transform: capitalize;
    font-weight: 400;
    font-size: 14px;
    margin: 10px 0 12px;
    display: block;
    color: #fff;
    font-family: 'Helvetica Neue', sans-serif;
    line-height: 1;
}

.comments-text>p {
    margin-bottom: 0;
    color: #fff;
    font-size: 17px;
}

.comments-text>a {
    display: inline-block;
    font-size: 16px;
    font-weight: 600;
    text-transform: capitalize;
    color: #fff;
    font-family: 'Helvetica Neue', sans-serif;
    float: right;
    margin-top: -6px;
}

.comments-reply {
    padding-left: 130px;
}

/* Blog Comments Form Area Css Style */

.post-comments-form-area {
    margin: 40px 0 0 0;
}

.post-comments-form-area .post-comments-form {}

.post-comments-form input.form-control {
    box-shadow: none;
    color: #777777;
    height: 50px;
    margin-bottom: 30px;
    background: #f4f7fc;
    border: 1px solid #e7eaf0;
    padding: 5px 20px;
    transition: all .3s;
    border-radius: 0px;
}

.post-comments-form textarea.form-control {
    height: 133px;
    box-shadow: none;
    color: #777777;
    margin-bottom: 30px;
    background: #f4f7fc;
    border: 1px solid #e7eaf0;
    padding: 15px 20px;
    transition: all .3s;
    border-radius: 0px;
}

.post-comments-form textarea.form-control:focus,
.post-comments-form input.form-control:focus {
    box-shadow: 0px 10px 14px 0px rgba(12, 0, 46, 0.06);
    outline: none;
    border: 1px solid #67b5fb;
}

/*  */

.single-blog-wraper .blog-img h4 a.post-title {}

.single-blog-content {
    padding: 80px 25px 10px 35px;
    background: #fff;
    box-shadow: 0px 8px 20px 0px rgba(47, 48, 52, 0.14);
}

.single-blog-content ul.post-info {
    margin: 0 0 15px 0;
    padding: 0;
}

.single-blog-content ul.post-info li {
    display: inline-block;
    margin-right: 15px;
    color: #67b5fb;
    margin-bottom: 0;
}

.single-blog-content ul.post-info li a {
    font-size: 16px;
    text-transform: capitalize;
    font-weight: 600;
    color:  #38648e;
    margin-left: 5px;
}

.single-blog-content p {}

/* subscribe area css */

.sohoj-subscribe-area {
    position: absolute;
    top: -20%;
    left: 0;
    right: 0;
}

.subscribe-bg {
    background: #67b5fb;
    padding: 100px;
    border-radius: 20px;
}

.subscribe-title {}

.subscribe-title h3 {
    color: #fff;
    font-size: 28px;
    font-weight: 700;
    text-transform: capitalize;
    margin: 0;
}

.subscribe-form {
    position: relative;
}

.subscribe-form input {
    width: 100%;
    height: 60px;
    border: none;
    background: #fff;
    padding: 0 20px;
    border-radius: 0;
    font-size: 18px;
    color: #30323d;
}

.subscribe-form button {
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
}

/* footer area css */

.sohoj-footer-area {
    height: 100%;
    background-color: #38648e;
    background-repeat: no-repeat;
    padding-bottom: 70px;
}

.sohoj-footer-area:before {
    content: "";
    left: 0px;
    width: 100%;
    height: 100%;
    background: #38648e;
}

/* breadcrumb area css */

.sohoj-breadcrumb-area {
    background-position: center center;
    background-size: cover;
    position: relative;
    background-image: url(assets/img/breadcrumb/1.jpg);
    padding: 234px 0 134px 0;
    text-align: center;
}

.sohoj-breadcrumb-area:before {
    content: '';
    background: rgba(1, 16, 90, .70);
    left: 0px;
    top: 0;
    width: 100%;
    height: 100%;
    position: absolute;
}

.breadcrumb-content-box h2 {
    color: #fff;
    font-size: 70px;
    font-weight: 500;
    margin-bottom: 10px;
    text-transform: capitalize;
}

.sohoj-breadcramb-line .breadcrumb {
    background: inherit;
    padding: 30px 0;
    margin: 0;
    border-bottom: 1px solid #eeeeee;
}

.breadcrumb .breadcrumb-item {
    font-family: 'Helvetica Neue', sans-serif;
    font-size: 24px;
}

.sohoj-breadcramb-line .breadcrumb .breadcrumb-item,
.sohoj-breadcramb-line .breadcrumb-item.active a,
.sohoj-breadcramb-line .breadcrumb .breadcrumb-item.active {
    color: #67b5fb;
    text-transform: capitalize;
    margin: 0;
    margin-right: 10px;
}

.sohoj-breadcramb-line .breadcrumb .breadcrumb-item a {
    color: #67b5fb;
    text-transform: capitalize;
    font-weight: 600;
    font-size: 24px;
}

.sohoj-breadcramb-line .breadcrumb-item+.breadcrumb-item::before {
    color: #67b5fb;
    content: "\f178";
    margin-right: 10px;
}

/* Contact Form Area Css Style */

.sohoj-contact-form-area {
    padding: 70px 50px;
    background: #f7faff;
    box-shadow: 0px 15px 30px 0px rgba(0, 0, 0, 0.14);
    border-radius: 10px;
}

.sohoj-contact-form input.form-control {
    box-shadow: none;
    color: #777777;
    height: 50px;
    margin-bottom: 30px;
    background: #ffffff;
    border: 1px solid #e7eaf0;
    padding: 5px 20px;
    transition: all .3s;
}

.sohoj-contact-form textarea.form-control:focus,
.sohoj-contact-form input.form-control:focus {
    box-shadow: 0px 10px 14px 0px rgba(12, 0, 46, 0.06);
    outline: none;
    border: 1px solid #67b5fb;
}

.sohoj-contact-form textarea.form-control {
    height: 133px;
    box-shadow: none;
    color: #777777;
    margin-bottom: 30px;
    background: #ffffff;
    border: 1px solid #e7eaf0;
    padding: 15px 20px;
    transition: all .3s;
}

p.form-message {
    font-size: 15px;
}

/* Google Map Area Css Style */

#sohoj-map {
    height: 525px;
}

/* Contact Info  Area Css Style */

.contact-info-box {
    text-align: center;
    border: 1px solid #e7eaf0;
    background: #f7faff;
    padding: 30px 0;
    cursor: pointer;
    transition: all .3s;
}

.contact-info-box:hover {
    box-shadow: 0px 15px 30px 0px rgba(0, 0, 0, 0.14);
}

.contact-info-icon {
    background: #01105a;
    border-radius: 50%;
    width: 80px;
    height: 80px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0px 15px 30px 0px rgba(0, 0, 0, 0.14);
    margin-bottom: 20px;
}

ul.contact-info {
    padding: 10px 0;
    margin: 0;
    list-style: none;
}

ul.contact-info li,
ul.contact-info li a {
    font-size: 20px;
    line-height: 30px;
    color: #656970;
    font-weight: 500;
    margin-bottom: 0px;
    font-family: 'Helvetica Neue', sans-serif;
}

/*  Error Area Css Style */

.sohoj-content-box {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.sohoj-content {
    text-align: right;
    border-right: 10px solid #67b5fb;
    margin-right: 50px;
    padding-right: 50px;
}

.sohoj-content h2 {
    font-size: 200px;
    font-weight: 700;
    line-height: 1;
}

.sohoj-content h2 span {
    color: #67b5fb;
}

.sohoj-content h3 {
    font-weight: 700;
    font-size: 48px;
    text-transform: capitalize;
}

/* dark home css */

.dark ul.header-top-right li select#lang-typ,
.dark ul.header-top-right li a,
.dark .header-top-phone h2,
.dark .section-title h4,
.dark .section-title h3,
.dark ul.header-top-social li a {
    color: #fff;
}

.dark .all-single-events.owl-theme .owl-dots .owl-dot.active span {
    background: #67b5fb;
}

.dark .all-single-events.owl-theme .owl-dots .owl-dot span {
    background: #fff;
}

.dark ul.header-top-right li select#lang-typ option {
    background: #000;
}



body {
    margin: 0;
    font-style: Helvetica Neue !important;
}




.sohos-children-care-area .single-children-care {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
    color: #67b5fb;
}

.single-children-content {
    border-radius: 20px;
    padding: 20px;
    flex: 1;
    background-color: #38648e;
    color: white;
}

.children-content-img {
    background-size: cover;
    background-position: center;
    height: 200px; /* Adjust as necessary */
}

.btn-typ2 {
    background-color: white;
    color: #38648e;
    border: 2px solid #67b5fb;
    padding: 10px 20px;
    text-transform: uppercase;
    font-weight: bold;
    text-decoration: none;
    display: inline-block;
    transition: background-color 0.3s, color 0.3s;
}

.btn-typ2:hover {
    background-color: #67b5fb;
    color: white;
}



/*
  Theme Name: Sohoj - Charity, Nonprofit HTML5 Template
  Author: theme_group
  Support: robiulislamfree@gmail.com
  Description: Sohoj is a HTML5 template which fits for all kind of Charity, Fund raising, Nonprofit, NGO, Social Working, and other non-profit website for all your needs.
  Tags: business, clean design, clean layout, marketing, minimal design, minimalist, modern, newsletter, app, app landing, App Showcase, digital, digital product, landing page, mobile apps, modern, sales apps, sass, software, startup,
  Version: 1.0
*/

/* CSS Index
-----------------------------------
 /* 
1.	Theme Default
2.	Pre Loader
3.	Header Area Css Style
4.	Search Form Area Css Style
5.	header menu area css
		i. main menu area css
		ii. sub menu
6.	sohoj slider area css
7.	sohoj Children Care area css
8.	sohoj About area css
9.	sohoj cause area css
10.	sohoj counter area css
11.	sohoj events area css
12.	sohoj client donate area css
13.	sohoj team area css
14.	faq area css
15.	sohoj blog area css
		i. Blog Quote Area Css Style
		ii. Blog Post Tags Area Css Style
		iii. Blog Comments Area Css Style
		iv. Blog Comments Form Area Css Style
16.	subscribe area css
17.	footer area css
18.	breadcrumb area css
19.	Contact Form Area Css Style
20.	Google Map Area Css Style
21.	Contact Info  Area Css Style
22.	dark home css
23.	Error Area Css Style
 */

/* Google Fonts */



* {
    margin: 0px;
    padding: 0px;
    border: none;
    outline: none;
    font-size: 100%;
    line-height: inherit;
    -ms-word-wrap: break-word;
    word-wrap: break-word;
}

body {
    font-family: 'Helvetica Neue', sans-serif;
    font-weight: normal;
    font-style: normal;
}

img {
    max-width: 100%;
    height: auto;
    transition: all 0.3s ease-out 0s;
}

a,
.button,
.btn {
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
}

a:focus,
.button:focus,
.btn:focus {
    text-decoration: none;
    outline: none;
}

a:focus,
a:hover {
    text-decoration: none;
    color: #67b5fb;
}

.btn:focus,
button:focus,
input:focus,
textarea,
textarea:focus,
.form-control:focus {
    outline: 0;
    box-shadow: none;
    -webkit-box-shadow: none;
    border: 1px solid #f1f1f1;
    background: #fff;
}

button {
    cursor: pointer;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-style: Helvetica Neue !important;
    color:  #38648e;
    font-style: normal;
    font-weight: 400;
    margin-bottom: 10px;
}

h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
    color: inherit;
}

ul {}

li {
    margin-bottom: 10px;
}

p {
    font-family: 'Helvetica Neue', sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 30px;
    color: #38648e;
}

hr {
    border-bottom: 1px solid #eceff8;
    border-top: 0 none;
    margin: 30px 0;
    padding: 0;
}

label {
    color: #7e7e7e;
    cursor: pointer;
    font-size: 14px;
    font-weight: 400;
}

*::-moz-selection {
    background: #d6b161;
    color: #fff;
    text-shadow: none;
}

::-moz-selection {
    background: #444;
    color: #fff;
    text-shadow: none;
}

::selection {
    background: #106ad2;
    color: #fff;
    text-shadow: none;
}

*::-moz-placeholder {
    color: #555555;
    font-size: 14px;
    opacity: 1;
}

*::placeholder {
    color: #555555;
    font-size: 14px;
    opacity: 1;
}

/* Pre Loader */

.preloader {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9999;
    width: 100%;
    height: 100%;
    background-color: #24262d;
    overflow: hidden;
}

.preloader-inner {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.preloader-icon {
    width: 100px;
    height: 100px;
    display: inline-block;
    padding: 0px;
}

.preloader-icon span {
    position: absolute;
    display: inline-block;
    width: 100px;
    height: 100px;
    border-radius: 100%;
    background-color: #67b5fb;
    -webkit-animation: preloader-fx 1.6s linear infinite;
    animation: preloader-fx 1.6s linear infinite;
}

.preloader-icon span:last-child {
    animation-delay: -0.8s;
    -webkit-animation-delay: -0.8s;
}

@keyframes preloader-fx {
    0% {
        -webkit-transform: scale(0, 0);
        transform: scale(0, 0);
        opacity: 0.5;
    }
    100% {
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1);
        opacity: 0;
    }
}

@-webkit-keyframes preloader-fx {
    0% {
        -webkit-transform: scale(0, 0);
        opacity: 0.5;
    }
    100% {
        -webkit-transform: scale(1, 1);
        opacity: 0;
    }
}



/* Header Area Css Style */

.sohoj-header-top {
    padding: 20px 0 25px;
}

ul.header-top-social {
    margin: 5px 0;
    padding: 0;
}

ul.header-top-social li {
    list-style: none;
    display: inline-block;
    margin: 0 15px 0 0;
}

ul.header-top-social li a {
    color: #67b5fb;
}

.header-top-phone {}

.header-top-phone h2 {
    font-size: 28px;
    font-weight: 500;
    margin: 0;
}

.header-top-phone h2 strong {
    font-weight: 700;
    color: #67b5fb;
}

ul.header-top-right {
    margin: 5px 0;
    padding: 0;
}

ul.header-top-right li {
    list-style: none;
    display: inline-block;
    margin: 0 0 0 15px;
}

ul.header-top-right li select#lang-typ {
    font-size: 16px;
    font-weight: 600;
    margin-right: -8px;
    cursor: pointer;
    position: relative;
    background: transparent;
}

ul.header-top-right li select#lang-typ:after {
    content: none;
    position: absolute;
}

ul.header-top-right li a {
    color: #67b5fb;
}

/* Search Form Area Css Style */

ul.header-search {
    display: inline-block;
    list-style: none;
    padding: 0;
    margin: 0;
}

ul.header-search li {
    margin: 0;
    padding: 0;
    list-style: none;
}

ul.header-search li a {
    color: #fff;
    text-align: center;
    display: block;
    padding: 36px;
    background: rgba(0, 0, 0, .30);
}

ul.header-search li a i {
    width: 30px;
    height: 30px;
    font-size: 30px;
}

ul.header-search li a:hover {
    color: #67b5fb;
}

#search-overlay {
    display: none;
}

.search-form-area {
    background: #24262df0;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow: auto;
    text-align: center;
    border: #a0a0a0 solid 1px;
    margin: 0;
    z-index: 99999;
}

.search-form-area:before {
    content: '';
    display: inline-block;
    height: 100%;
    vertical-align: middle;
    margin-right: 0;
}

.search-form-centered {
    display: inline-block;
    vertical-align: middle;
    width: 50%;
    padding: 10px 15px;
    color: #FFF;
    border: none;
    background: transparent;
}

#search-box {
    position: relative;
    width: 100%;
    margin: 0;
}

.search-form input.form-control {
    box-shadow: none;
    color: #777777;
    height: 80px;
    background: #f8f8f8;
    border: none;
    border-radius: 0;
    padding: 20px 30px;
}

.search-form button {
    background: #67b5fb;
    position: absolute;
    top: 10px;
    right: 10px;
    text-align: center;
    line-height: 42px;
    border-width: 0;
    border-radius: 0;
    cursor: pointer;
    padding: 9px 50px;
    color: #ffffff;
    font-size: 18px;
    font-weight: 500;
    text-transform: uppercase;
    font-weight: 700;
    transition: all .3s;
}

.search-form button:hover {
    background: #24262d;
}

#close-btn {
    position: fixed;
    top: 1em;
    right: 1em;
}

#close-btn:hover {
    color: #67b5fb;
    cursor: pointer;
}

/* header menu area css */

.sohoj-main-slider-area {
    position: relative;
}

.sohoj-hero-area {
    background: rgba(47, 48, 52, 0.40);
    left: 0;
    right: 0;
    position: absolute;
    width: 100%;
    z-index: 2;
    top: 0;
}

.sticky {
    left: 0;
    margin: auto;
    position: fixed;
    top: 0;
    width: 100%;
    box-shadow: 0 0 60px 0 rgb(0 0 0 / 7%);
    z-index: 9999;
    -webkit-animation: 300ms ease-in-out 0s normal none 1 running fadeInDown;
    animation: 300ms ease-in-out 0s normal none 1 running fadeInDown;
    -webkit-box-shadow: 0 10px 15px rgb(25 25 25 / 10%);
    background:  #38648e;
    transition: .3s;
}

.header-logo {
    margin: 32px 0;
}

.header-logo a {
    width: 10px;
    display: block;
}

.header-hero-btn {
    margin: 25px 0;
}

.header-top-area {
    background-color: #222;
    font-size: 15px;
    padding: 10px 0;
}

.header-top-area a,
.header-top-area {
    color: #fff;
}

.header-top-area i {
    color: #f7be49;
}

/* main menu area css */

.main-menu ul {
    display: inline-block;
    margin: 0;
    padding: 0;
}

.main-menu nav>ul>li {
    display: inline-block;
    position: relative;
    margin: 0;
}

.main-menu nav>ul>li:last-child a {
    padding-right: 0
}

.main-menu nav>ul>li:first-child a {
    padding-left: 0
}

.main-menu nav>ul>li>a {
    color: #fff;
    display: block;
    font-size: 16px;
    font-weight: 600;
    padding: 40px 13px;
    transition: all 0.3s ease 0s;
    line-height: 1.25;
    font-family: 'Helvetica Neue', sans-serif;
    text-transform: capitalize;
}

.main-menu nav>ul>li:hover>a,
.main-menu nav>ul>li.active>a {
    color: #67b5fb;
}

/* sub menu */

.main-menu nav>ul>li .sub-menu {
    background: #ffffff none repeat scroll 0 0;
    border-top: 3px solid #67b5fb;
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.176);
    left: 0;
    opacity: 0;
    position: absolute;
    top: 100%;
    transition: all 0.4s ease-out;
    visibility: hidden;
    width: 220px;
    z-index: 9;
    transform-origin: top;
    transform: scaleY(0);
}

.main-menu nav>ul>li:hover .sub-menu {
    opacity: 1;
    visibility: visible;
    transform: scaleY(1);
}

.main-menu nav>ul>li .sub-menu li {
    display: block;
    position: relative;
    margin: 0;
}

.main-menu nav>ul>li .sub-menu li a {
    color: #666666;
    font-size: 15px;
    font-weight: 600;
    margin: 0;
    padding: 13px 20px;
    text-transform: capitalize;
    display: block;
    font-family: 'Helvetica Neue', sans-serif;
}

.main-menu nav>ul>li:hover>.sub-menu li>a:hover {
    color: #fff;
    background: #67b5fb;
}

/* sub menu */

.main-menu nav>ul>li>.sub-menu>li>.sub-menu {
    background: #ffffff none repeat scroll 0 0;
    border-top: 3px solid #67b5fb;
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.176);
    left: 100%;
    opacity: 0;
    position: absolute;
    top: 120%;
    transition: all 0.3s ease 0s;
    visibility: hidden;
    width: 220px;
    z-index: 9;
}

.main-menu nav>ul>li>.sub-menu>li:hover .sub-menu {
    top: 0 !important;
    opacity: 1;
    top: 100%;
    visibility: visible
}

.header-top-btn {
    margin: 24px 0 0 35px;
    display: inline-block;
}

/*  sohoj slider area css */

ul.sohoj-slider-btn-area {
    padding: 0;
    margin: 0;
}

ul.sohoj-slider-btn-area li {
    list-style: none;
    margin: 0 20px 0 0;
    padding: 0;
    display: inline-block;
    text-transform: uppercase;
    font-weight: 600;
}

ul.sohoj-slider-btn-area li a {
    color: #fff;
    padding: 12px 30px;
    display: block;
    border-radius: 50px;
    border: 1px solid #fff;
    font-size: 18px;
    transition: all .3s;
}

ul.sohoj-slider-btn-area li a:hover {
    background: #67b5fb;
    border-color: #67b5fb;
}

.sohoj-single-slider-content {}

.sohoj-single-slider-content h2 {
    text-transform: capitalize;
    font-size: 56px;
    font-weight: 700;
    line-height: 1.2;
    color: #fff;
    margin-top: 35px;
}


.sohoj-single-table {
    display: table;
    height: 100%;
    width: 100%;
}

.sohoj-single-tablecell {
    display: table-cell;
    vertical-align: middle;
    height: 80%;
}

.sohoj-single-slider {
    position: relative;
}

.sohoj-single-slider:before {
    content: '';
    background: rgba(1, 16, 90, .60);
    left: 0px;
    top: 0;
    width: 100%;
    height: 100%;
    position: absolute;
}

.slider-video-btn {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.slider-video-btn a {
    display: inline-block;
    position: relative;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    height: 56px;
    width: 56px;
    color: #67b5fb;
    background: #fff;
    font-size: 20px;
    line-height: 42px;
    transition: .3s;
    -webkit-transition: .3s;
    -moz-transition: .3s;
    -ms-transition: .3s;
    -o-transition: .3s;
    animation: heartbeat 1s infinite alternate;
}

.slider-video-btn a:hover {
    color: #67b5fb;
    background: #fff;
}

.slider-video-btn a::before {
    content: '';
    display: inline-block;
    position: absolute;
    top: -15px;
    left: -15px;
    bottom: -15px;
    right: -15px;
    border-radius: inherit;
    border: 1px solid #fff;
    -webkit-animation: btnIconRipple 3s cubic-bezier(0.23, 1, 0.32, 1) both infinite;
    animation: btnIconRipple 3s cubic-bezier(0.23, 1, 0.32, 1) both infinite;
}

.slider-video-btn a::after {
    content: '';
    display: inline-block;
    position: absolute;
    top: -30px;
    left: -30px;
    bottom: -30px;
    right: -30px;
    border-radius: inherit;
    border: 1px solid #fff;
    -webkit-animation: btnIconRipple 2s cubic-bezier(0.23, 1, 0.32, 1) both infinite;
    animation: btnIconRipple 2s cubic-bezier(0.23, 1, 0.32, 1) both infinite;
}

/* sohoj Children Care area css */

.sohoj-children-care-area {
    margin: -88px 0 0 0;
    z-index: 9;
}

.single-children-care {
    position: relative;
    z-index: 1;
    cursor: pointer;
}

.children-content-img {
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: -1;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
    background-size: cover;
    background-position: center center;
}

.single-children-content {
    padding: 22px;
}

.single-children-content h3 {
    color: #fff;
    text-transform: capitalize;
    font-weight: 500;
    font-size: 30px;
}

.single-children-content p {
    color: #fff;
}

/* sohoj About area css */

.sohoj-about-area {
    position: relative;
    overflow: hidden;
}

.sohoj-about-bg-img {
    position: absolute;
    left: 0;
    top: 100px;
    bottom: 0;
    height: 100%;
    width: 46.5%;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.sohoj-about-bg-img img {
    width: 100%;
    height: calc(100% - 100px);
}

.sohoj-about-content {
    padding: 80px 0;
}

.sohoj-about-content h2 {
    font-size: 40px;
    text-transform: capitalize;
    font-weight: 700;
    position: relative;
}

.about-chariti-list-area {}

.sohoj-about-content h2 span {
    color: #67b5fb;
}

.sohoj-about-content h2:before {
    content: '';
    position: absolute;
    left: -20px;
    top: 0;
    bottom: 0;
    border-left: 6px solid #67b5fb;
}

ul.about-chariti-list {
    padding: 0;
    margin: 0;
    display: inline-block;
}

ul.about-chariti-list:first-child {
    margin-right: 50px;
}

ul.about-chariti-list li {
    list-style: none;
}

ul.about-chariti-list li a {
    font-size: 18px;
    color: #01105a;
    font-weight: 700;
    text-transform: capitalize;
}

ul.about-chariti-list li a i {
    color: #67b5fb;
    margin-right: 10px;
}

/* sohoj cause area css */

.sohoj-all-cause .sohoj-single-cause {
    padding: 15px;
}

.sohoj-single-cause img {
    width: 100%;
    height: 300px;
}

.sohoj-single-cause-content {
    padding: 35px 20px;
    box-shadow: 0px 5px 20px 0px rgba(0, 0, 0, 0.14);
    background: #fff;
}

.sohoj-single-cause-content h4 {
    font-weight: 700;
    text-transform: capitalize;
    font-size: 20px;
}

.sohoj-single-cause-content p {
    font-size: 18px;
}

.cause-progress-bar {
    margin: 40px 0;
}

.cause-price-raised {
    display: inline-block;
    float: left;
}

.cause-price-goal {
    display: inline-block;
    float: right;
}

.single-cause-price {
    display: block;
    width: 100%;
    overflow: hidden;
}

.single-cause-price h3 {
    font-size: 18px;
    text-transform: capitalize;
    font-weight: 600;
}

.single-cause-price h3 span {
    color: #67b5fb;
}

.sohoj-all-cause .owl-nav div {
    left: -50px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    transition: all 0.3s ease 0s;
    text-align: center;
    line-height: 42px;
    font-size: 30px !important;
    background: #fff !important;
    border-radius: 50% !important;
    color: #67b5fb !important;
    width: 50px;
    height: 50px;
    border: 1px solid #67b5fb;
}

.sohoj-all-cause .owl-nav div.owl-next {
    left: auto;
    right: -50px;
}

/* sohoj counter area css */

.sohoj-counter-area {
    background-position: center center;
    background-size: cover;
    background-attachment: inherit;
    position: relative;
    height: 100%;
    background-image: url(assets/img/counter/1.jpg);
    background-color: #1a2b3c;
    background-repeat: no-repeat;
}

.sohoj-counter-area:before {
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    background: rgba(1, 16, 90, .90);
}

.single-counter {
    text-align: center;
    padding: 30px 0;
    border: 3px dotted #fff;
    background: rgba(255, 255, 255, .1);
}

.counter-border {
    display: block;
    height: 6px;
    background: #67b5fb;
    width: 70px;
    margin: 20px auto 10px auto;
}

.counter-number {
    color: #fff;
    font-size: 48px;
    font-weight: 700;
}

.count-name {
    font-size: 22px;
    color: #fff;
    font-family: 'Helvetica Neue', sans-serif;
    font-weight: 500;
    text-transform: capitalize;
}

.sohoj-counter-area .col-xl-3:nth-child(odd) .single-counter {
    margin: 30px 0 0 0;
}

/* sohoj events area css */

.single-events {
    padding: 20px;
    background: #f7faff;
    box-shadow: 0px 8px 12px 0px rgba(0, 0, 0, 0.14);
    overflow: hidden;
}

.single-events-img {
    width: 45%;
    height: auto;
    display: inline-block;
    float: left;
}

.single-events-img img {
    width: 100%;
}

.single-events-content {
    display: inline-block;
    width: 50%;
    margin-left: 20px;
}

.single-events-content h4 {
    font-weight: 700;
    text-transform: capitalize;
    border-bottom: 1px solid #949494;
    padding-bottom: 10px;
    margin-bottom: 5px;
}

.single-events-content p {
    font-size: 15px;
    margin-bottom: 0;
}

.events-date {
    text-transform: capitalize;
    font-weight: 500;
    font-size: 16px;
    margin: 5px 0 10px 0;
}

.events-date span {
    color: #67b5fb;
    text-transform: uppercase;
}

.all-single-events.owl-theme .owl-dots .owl-dot span {
    background: #2c2c2c none repeat scroll 0 0;
    display: inline-block;
    border-radius: 8px !important;
    height: 10px;
    width: 8px;
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    -webkit-transition: all .3s;
    transition: all .3s;
    margin: 0 4px;
    border-radius: 0;
    opacity: .5;
}

.all-single-events.owl-theme .owl-dots .owl-dot.active span {
    background: #67b5fb;
    border: medium none;
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    width: 8px;
    height: 20px;
    border-radius: 8px;
}

.all-single-events.owl-theme .owl-nav.disabled+.owl-dots {
    position: absolute;
    left: 50%;
    bottom: -60px;
}

.all-single-events.owl-theme .owl-dots .owl-dot {
    display: inline-block;
    line-height: 1;
}

.all-single-events.owl-theme .owl-dots .owl-dot:last-child {
    margin-bottom: 0;
}

/* sohoj client donate area css */

.sohoj-client-donate-area {
    background-position: center center;
    background-size: cover;
    background-attachment: inherit;
    position: relative;
    height: 100%;
    background-image: url(assets/img/counter/1.jpg);
    background-color: #1a2b3c;
    background-repeat: no-repeat;
}

.sohoj-client-donate-area:before {
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    background: rgba(1, 16, 90, .90);
}

.client-single-slider {}

.title-desig-quot {
    display: flex;
    align-items: center;
}

.title-desig {
    margin-left: 15px;
    padding-left: 15px;
    border-left: 1px solid #fff;
}

.title-desig h3 {
    font-size: 22px;
    font-weight: 700;
    color: #fff;
    text-transform: capitalize;
    margin-bottom: 5px;
}

.title-desig h4 {
    font-size: 16px;
    color: #fff;
    text-transform: capitalize;
}

.title-desig-quot i {
    font-size: 40px;
    color: #fff;
}

.client-single-slider p {
    color: #fff;
    margin-top: 25px;
}

.sohoj-client-slider-wraper {
    margin: 80px 0;
}

.sohoj-client-slider-wraper.owl-theme .owl-dots .owl-dot span {
    background: #fff none repeat scroll 0 0;
    border-radius: 30%;
    display: inline-block;
    height: 20px;
    width: 20px;
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    -webkit-transition: all .3s;
    transition: all .3s;
    margin: 0 4px;
    border-radius: 50%;
    border: 4px solid #67b5fb;
    opacity: .5;
}

.sohoj-client-slider-wraper.owl-theme .owl-dots .owl-dot.active span {
    background: #fff;
    border: medium none;
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: 4px solid #67b5fb;
}

.sohoj-client-slider-wraper.owl-theme .owl-nav.disabled+.owl-dots {
    position: absolute;
    left: 0;
    bottom: -45px;
    margin-top: 0;
}

.sohoj-donate-area {
    background: rgba(255, 255, 255, .20);
    padding: 30px 15px;
}

.sohoj-donate-area select.form-control,
.sohoj-donate-area input.form-control {
    border-radius: 0;
    box-shadow: none;
    color: #777777;
    height: 50px;
    margin-bottom: 30px;
    background: #f7faff;
    border: none;
    font-size: 15px;
}

/* sohoj team area css */

.single-team-wraper {
    cursor: pointer;
}

.single-team-wraper .team-img-title {
    position: relative;
}

.single-team-wraper .team-img-title img {
    width: 100%;
}

.team-img-title h3.team-title {
    position: absolute;
    left: 15px;
    right: 15px;
    bottom: -30px;
    background: #fff;
    font-size: 24px;
    text-transform: capitalize;
    font-weight: 700;
    display: inline-block;
    padding: 20px 30px;
    margin: 0;
    border-radius: 5px;
    box-shadow: 0px 8px 20px 0px rgba(47, 48, 52, 0.14);
    transition: all .3s;
}

.single-team-wraper:hover h3.team-title {
    background: #67b5fb;
    color: #fff;
}


.blog-img-slider .owl-nav div {
    left: 0;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    transition: all 0.3s ease 0s;
    text-align: center;
    line-height: 42px;
    font-size: 30px !important;
    background: #fff !important;
    border-radius: 0 !important;
    color: #67b5fb !important;
    width: 50px;
    height: 50px;
    margin: 0 !important;
}

.blog-img-slider .owl-nav div:hover {
    background: #67b5fb !important;
    color: #fff !important;
}

.blog-img-slider .owl-nav div.owl-next {
    left: auto;
    right: 0;
}

.blog-details-content .blog-img h4,
.single-blog-wraper .blog-img h4 {
    position: absolute;
    left: 30px;
    right: 30px;
    bottom: -60px;
    background: #fff;
    display: inline-block;
    box-shadow: 0px 8px 20px 0px rgba(47, 48, 52, 0.14);
    border-radius: 5px;
    padding: 22px 25px;
    font-size: 28px;
    font-weight: 700;
    text-transform: capitalize;
    z-index: 1;
}

.blog-details-content h6,
.blog-details-content h5,
.blog-details-content h5,
.blog-details-content h4,
.blog-details-content h3,
.blog-details-content h2,
.blog-details-content h1 {
    margin-bottom: 15px;
    font-weight: 600;
}

/* Blog Quote Area Css Style */

blockquote,
blockquote.wp-block-quote {
    background: #67b5fb;
    padding: 20px 35px !important;
    box-shadow: 0px 0px 30px 0px rgba(26, 43, 60, 0.15);
    border-radius: 6px;
    position: relative;
    overflow: hidden;
    margin: 40px 0;
    z-index: 1;
}

blockquote:before,
blockquote.wp-block-quote:before {
    content: "\f10d";
    position: absolute;
    bottom: 9%;
    left: 5%;
    color: #fff;
    font-size: 50px;
    line-height: 1;
    opacity: .5;
    z-index: -1;
}

blockquote p,
blockquote.wp-block-quote p {
    color: #fff;
    font-size: 24px;
    font-weight: 500;
    line-height: 32px;
}

blockquote cite,
blockquote.wp-block-quote cite {
    position: relative;
    font-size: 16px;
    font-weight: 600;
    text-transform: capitalize;
    padding-left: 15px;
    margin-top: 30px;
    display: inline-block;
    float: right;
    color: #fff;
}

blockquote cite:before,
blockquote.wp-block-quote cite:before {
    position: absolute;
    content: '';
    bottom: 0;
    width: 10px;
    height: 2px;
    background: #fff;
    margin: 0 auto;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
}

/* Blog Post Tags Area Css Style */

.blog-post-admin-date-comment-tag {
    padding: 30px 35px;
    background: #67b5fb;
}

.blog-post-admin-date-comment-tag .post-info {
    margin: 0 15px 0 0;
    padding: 0;
    display: inline-flex;
}

.blog-post-admin-date-comment-tag .post-info a {
    color: #fff;
    text-transform: capitalize;
    font-size: 14px;
    font-weight: 700;
}

.blog-post-admin-date-comment-tag .post-info span i {
    margin-right: 6px;
    color: #fff;
}

/*  */

.blog-post-tag span {
    font-size: 20px;
    font-weight: 600;
    display: block;
    margin-bottom: 17px;
    color: #1a2b3c;
    text-transform: capitalize;
}

.blog-post-tag {
    background: #fff;
    padding: 0;
    padding-top: 0;
    width: 100%;
    overflow: hidden;
    padding-bottom: 0;
    padding-top: 30px;
}

.blog-post-tag>a {
    color: #1a2b3c;
    display: inline-block;
    font-size: 12px;
    font-weight: 500;
    text-transform: uppercase;
    border: 1px solid #e5e5e5;
    padding: 10px 24px;
    margin-right: 5px;
    transition: .3s;
    border-radius: 0;
    margin-bottom: 10px;
}

.blog-post-tag>a:hover {
    color: #fff;
    background: #67b5fb;
    border-color: #67b5fb;
}

/* Blog Comments Area Css Style */

.post-heading {
    margin-bottom: 30px;
}

.post-heading h3 {
    font-size: 28px;
    font-weight: 600;
    text-transform: capitalize;
    color: #1a2b3c;
    line-height: 1;
}

.latest-comments>ul {
    padding: 0;
    margin: 0;
}

.latest-comments ul {
    list-style: none;
}

.comments-box {
    margin-bottom: 30px;
    border-bottom: 1px solid #e7eaf0;
    padding: 40px 20px;
    background: #67b5fb;
    border-radius: 20px;
}

.comments-avatar {
    float: left;
    width: 100px;
}

.comments-avatar img {
    border: 2px solid #fff;
}

.comments-text {
    overflow: hidden;
    padding-left: 30px;
}

.avatar-name-date {
    display: inline-block;
}

.avatar-name-date>h5 {
    font-size: 18px;
    font-weight: 500;
    text-transform: capitalize;
    color: #fff;
    font-family: 'Helvetica Neue', sans-serif;
    line-height: 1;
}

.avatar-name-date span {
    text-transform: capitalize;
    font-weight: 400;
    font-size: 14px;
    margin: 10px 0 12px;
    display: block;
    color: #fff;
    font-family: 'Helvetica Neue', sans-serif;
    line-height: 1;
}

.comments-text>p {
    margin-bottom: 0;
    color: #fff;
    font-size: 17px;
}

.comments-text>a {
    display: inline-block;
    font-size: 16px;
    font-weight: 600;
    text-transform: capitalize;
    color: #fff;
    font-family: 'Helvetica Neue', sans-serif;
    float: right;
    margin-top: -6px;
}

.comments-reply {
    padding-left: 130px;
}

/* Blog Comments Form Area Css Style */

.post-comments-form-area {
    margin: 40px 0 0 0;
}

.post-comments-form-area .post-comments-form {}

.post-comments-form input.form-control {
    box-shadow: none;
    color: #777777;
    height: 50px;
    margin-bottom: 30px;
    background: #f4f7fc;
    border: 1px solid #e7eaf0;
    padding: 5px 20px;
    transition: all .3s;
    border-radius: 0px;
}

.post-comments-form textarea.form-control {
    height: 133px;
    box-shadow: none;
    color: #777777;
    margin-bottom: 30px;
    background: #f4f7fc;
    border: 1px solid #e7eaf0;
    padding: 15px 20px;
    transition: all .3s;
    border-radius: 0px;
}

.post-comments-form textarea.form-control:focus,
.post-comments-form input.form-control:focus {
    box-shadow: 0px 10px 14px 0px rgba(12, 0, 46, 0.06);
    outline: none;
    border: 1px solid #67b5fb;
}

/*  */

.single-blog-wraper .blog-img h4 a.post-title {}

.single-blog-content {
    padding: 80px 25px 10px 35px;
    background: #fff;
    box-shadow: 0px 8px 20px 0px rgba(47, 48, 52, 0.14);
}

.single-blog-content ul.post-info {
    margin: 0 0 15px 0;
    padding: 0;
}

.single-blog-content ul.post-info li {
    display: inline-block;
    margin-right: 15px;
    color: #67b5fb;
    margin-bottom: 0;
}

.single-blog-content ul.post-info li a {
    font-size: 16px;
    text-transform: capitalize;
    font-weight: 600;
    color:  #38648e;
    margin-left: 5px;
}

.single-blog-content p {}

/* subscribe area css */

.sohoj-subscribe-area {
    position: absolute;
    top: -20%;
    left: 0;
    right: 0;
}

.subscribe-bg {
    background: #67b5fb;
    padding: 100px;
    border-radius: 20px;
}

.subscribe-title {}

.subscribe-title h3 {
    color: #fff;
    font-size: 28px;
    font-weight: 700;
    text-transform: capitalize;
    margin: 0;
}

.subscribe-form {
    position: relative;
}

.subscribe-form input {
    width: 100%;
    height: 60px;
    border: none;
    background: #fff;
    padding: 0 20px;
    border-radius: 0;
    font-size: 18px;
    color: #30323d;
}

.subscribe-form button {
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
}

/* footer area css */



.sohoj-footer-area:before {
    content: "";
    position: absolute;
    left: 0px;
    top: 20px;
    width: 100%;
    height: 100%;
    background: #38648e;
}

/* breadcrumb area css */

.sohoj-breadcrumb-area {
    background-position: center center;
    background-size: cover;
    position: relative;
    background-image: url(assets/img/breadcrumb/1.jpg);
    padding: 234px 0 134px 0;
    text-align: center;
}

.sohoj-breadcrumb-area:before {
    content: '';
    background: rgba(1, 16, 90, .70);
    left: 0px;
    top: 0;
    width: 100%;
    height: 100%;
    position: absolute;
}

.breadcrumb-content-box h2 {
    color: #fff;
    font-size: 70px;
    font-weight: 500;
    margin-bottom: 10px;
    text-transform: capitalize;
}

.sohoj-breadcramb-line .breadcrumb {
    background: inherit;
    padding: 30px 0;
    margin: 0;
    border-bottom: 1px solid #eeeeee;
}

.breadcrumb .breadcrumb-item {
    font-family: 'Helvetica Neue', sans-serif;
    font-size: 24px;
}

.sohoj-breadcramb-line .breadcrumb .breadcrumb-item,
.sohoj-breadcramb-line .breadcrumb-item.active a,
.sohoj-breadcramb-line .breadcrumb .breadcrumb-item.active {
    color: #67b5fb;
    text-transform: capitalize;
    margin: 0;
    margin-right: 10px;
}

.sohoj-breadcramb-line .breadcrumb .breadcrumb-item a {
    color: #67b5fb;
    text-transform: capitalize;
    font-weight: 600;
    font-size: 24px;
}

.sohoj-breadcramb-line .breadcrumb-item+.breadcrumb-item::before {
    color: #67b5fb;
    content: "\f178";
    margin-right: 10px;
}

/* Contact Form Area Css Style */

.sohoj-contact-form-area {
    padding: 70px 50px;
    background: #f7faff;
    box-shadow: 0px 15px 30px 0px rgba(0, 0, 0, 0.14);
    border-radius: 10px;
}

.sohoj-contact-form input.form-control {
    box-shadow: none;
    color: #777777;
    height: 50px;
    margin-bottom: 30px;
    background: #ffffff;
    border: 1px solid #e7eaf0;
    padding: 5px 20px;
    transition: all .3s;
}

.sohoj-contact-form textarea.form-control:focus,
.sohoj-contact-form input.form-control:focus {
    box-shadow: 0px 10px 14px 0px rgba(12, 0, 46, 0.06);
    outline: none;
    border: 1px solid #67b5fb;
}

.sohoj-contact-form textarea.form-control {
    height: 133px;
    box-shadow: none;
    color: #777777;
    margin-bottom: 30px;
    background: #ffffff;
    border: 1px solid #e7eaf0;
    padding: 15px 20px;
    transition: all .3s;
}

p.form-message {
    font-size: 15px;
}

/* Google Map Area Css Style */

#sohoj-map {
    height: 525px;
}

/* Contact Info  Area Css Style */

.contact-info-box {
    text-align: center;
    border: 1px solid #e7eaf0;
    background: #f7faff;
    padding: 30px 0;
    cursor: pointer;
    transition: all .3s;
}

.contact-info-box:hover {
    box-shadow: 0px 15px 30px 0px rgba(0, 0, 0, 0.14);
}

.contact-info-icon {
    background: #01105a;
    border-radius: 50%;
    width: 80px;
    height: 80px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0px 15px 30px 0px rgba(0, 0, 0, 0.14);
    margin-bottom: 20px;
}

ul.contact-info {
    padding: 10px 0;
    margin: 0;
    list-style: none;
}

ul.contact-info li,
ul.contact-info li a {
    font-size: 20px;
    line-height: 30px;
    color: #656970;
    font-weight: 500;
    margin-bottom: 0px;
    font-family: 'Helvetica Neue', sans-serif;
}

/*  Error Area Css Style */

.sohoj-content-box {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.sohoj-content {
    text-align: right;
    border-right: 10px solid #67b5fb;
    margin-right: 50px;
    padding-right: 50px;
}

.sohoj-content h2 {
    font-size: 200px;
    font-weight: 700;
    line-height: 1;
}

.sohoj-content h2 span {
    color: #67b5fb;
}

.sohoj-content h3 {
    font-weight: 700;
    font-size: 48px;
    text-transform: capitalize;
}

/* dark home css */

.dark ul.header-top-right li select#lang-typ,
.dark ul.header-top-right li a,
.dark .header-top-phone h2,
.dark .section-title h4,
.dark .section-title h3,
.dark ul.header-top-social li a {
    color: #fff;
}

.dark .all-single-events.owl-theme .owl-dots .owl-dot.active span {
    background: #67b5fb;
}

.dark .all-single-events.owl-theme .owl-dots .owl-dot span {
    background: #fff;
}

.dark ul.header-top-right li select#lang-typ option {
    background: #000;
}



body {
    margin: 0;
    font-style: Helvetica Neue !important;
}


.sohos-children-care-area .single-children-care {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
    color: #67b5fb;
}

.single-children-content {
    padding: 20px;
    flex: 1;
    color: white;
}

.children-content-img {
    background-size: cover;
    background-position: center;
    height: 200px; /* Adjust as necessary */
}

.btn-typ2 {
    background-color: white;
    color: #38648e;
    border: 2px solid #67b5fb;
    padding: 10px 20px;
    text-transform: uppercase;
    font-weight: bold;
    text-decoration: none;
    display: inline-block;
    transition: background-color 0.3s, color 0.3s;
}

.btn-typ2:hover {
    background-color: #67b5fb;
    color: white;
}

.single-children-content {
    background-color: #38648e; /* Default color */
    color: white;
    transition: background-color 0.3s;
}


.btn-typ2.scrolled {
    color: #67b5fb;
    background-color: white;
    border: 2px solid #38648e;
}

.btn-typ1 {
    background-color: #38648e; /* Default color */
    color: white;
}

.btn-typ1.scrolled {
    background-color: #67b5fb; /* Scrolled color */
    color: white;
}

.highlight {
    color: #38648e; /* Default text color */
    text-shadow: -1px -1px 0 white, 1px -1px 0 white, -1px 1px 0 white, 1px 1px 0 white; /* For broader support */
    transition: color 0.3s, -webkit-text-stroke-color 0.3s, text-shadow 0.3s;
}

.highlight.scrolled {
    color: #67b5fb; /* Scrolled text color */
}




/* Basic card styling */
.card1 {
    display: block;
    background-color: #67b5fb; /* Primary blue color */
    color: white;
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    text-decoration: none;
    transition: transform 0.3s ease, background-color 0.3s ease;
    position: relative;
}

.card1 h3{
    color: white;
}

.card1 p{
    color: white;
}

/* Hover effect */
.card1:hover {
    background-color: #38648e; /* Lighter blue color */
    transform: translateY(-5px);
}

/* Card title */
.card1 h3 {
    margin: 0;
    font-size: 1.5em;
    font-weight: bold;
}

/* Card paragraph */
.card1 p {
    margin: 10px 0;
    font-size: 1em;
}

/* Go corner styling */
.go-corner {
    position: absolute;
    top: 20px;
    right: 20px;
}

.go-arrow {
    font-size: 1.5em;
}

/* Responsive design */
@media (max-width: 767px) {
    .card1 {
        padding: 15px;
    }

    .card1 h3 {
        font-size: 1.3em;
    }

    .card1 p {
        font-size: 0.9em;
    }

    .go-arrow {
        font-size: 1.2em;
    }
}




/* General styling for the sidebar */
.sidebar {
    margin: 0 auto; /* Center the sidebar */
    padding: 20px;
}

.case-card {
    background-color: #38648e;
    color: white;
    padding: 20px; /* Increased padding for better spacing */
    margin: 10px 5px; /* Added horizontal margin for spacing between cards */
    text-align: center;
    align-items: center;
    width: calc(30% - 10px); /* Adjusted width to account for margin */
    border-radius: 10px; /* Increased border-radius for a softer look */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Added shadow for depth */
    transition: transform 0.3s, background-color 0.3s; /* Smooth transition for hover effect */
}

.case-card:hover {
    background-color: #3b82f6; /* Lighter blue color on hover */
    transform: translateY(-5px); /* Lift effect on hover */
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2); /* Enhanced shadow on hover */
}

/* Additional styling for spacing between cards in different rows */
.case-card-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    margin: -10px 0; /* Adjusted margin for container */
}


.chart-container {
    position: relative;
    height: 500px;
    width: 100%;
    max-width: 500px;
    margin: 0 auto;
    border-radius: 10px;
    padding: 20px;
}

.overlay-circle {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 70px;
    height: 70px;
    background-color: #38648e;
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: bold;
    box-shadow: 0 2px 6px rgba(0,0,0,0.3);
}

.legend-container {
    margin-top: 20px;
    list-style: none;
    padding: 0;
    text-align: left;
}

.legend-container li {
    display: flex;
    align-items: center;
    justify-content: left;
    font-size: 12px;
    margin-bottom: 10px;
}

.legend-container span {
    display: inline-block;
    width: 15px;
    height: 15px;
    margin-right: 10px;
    border-radius: 3px;
    background-color: currentColor;
}

/* Responsive styling */
@media (max-width: 1300px) {
    .sohoj-about-area .row {
        flex-direction: column;
        align-items: center;
    }

    .sidebar, .main-content {
        width: 100%;
    }

    .chart-container {
        height: 400px;
    }

    .legend-container li {
        display: flex;
        align-items: center;
        text-align: left;
        justify-content: center;
        font-size: 12px;
        margin-bottom: 10px;
    }

    .overlay-circle {
        width: 60px;
        height: 60px;
        font-size: 12px;
    }

    .case-card {
        width: 30%;
    }
}

@media (max-width: 768px) {
    .chart-container {
        height: 300px;
    }

    .overlay-circle {
        width: 50px;
        height: 50px;
        font-size: 10px;
    }

    .legend-container li {
        font-size: 14px;
    }

    .case-card {
        width: 30%;
    }
}





.contact-card {
    background-color: #fff;
    border-radius: 10px;
    padding: 20px;
    box-shadow: 0 2px 20px rgba(0, 0, 0, 0.1);
    color: #333;
}
.container .content{
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  .container .content .left-side{
    width: 25%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-top: 15px;
    position: relative;
  }
  .content .left-side::before{
    content: '';
    position: absolute;
    height: 70%;
    width: 2px;
    right: -15px;
    top: 50%;
    transform: translateY(-50%);
    background: #afafb6;
  }
  .content .left-side .details{
    margin: 14px;
    text-align: center;
  }
  .content .left-side .details i{
    font-size: 30px;
    color: #38648e;
    margin-bottom: 10px;
  }
  .content .left-side .details .topic{
    font-size: 18px;
    font-weight: 500;
  }
  .content .left-side .details .text-one,
  .content .left-side .details .text-two{
    font-size: 14px;
    color: #38648e;
  }
  .container .content .right-side{
    width: 75%;
    margin-left: 75px;
  }
  .content .right-side .topic-text{
    font-size: 23px;
    font-weight: 600;
    color: #38648e;
  }
  .right-side .input-box{
    height: 50px;
    width: 100%;
    margin: 12px 0;
  }

  /* Responsive styling */
@media (max-width: 992px) {
    .left-side, .right-side {
        padding: 10px;
    }

    .details {
        justify-content: center;
    }

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

    .contact-card p {
        text-align: center;
    }

    
}

@media (max-width: 768px) {
    .topic-text {
        font-size: 24px;
    }

    .text-one {
        font-size: 14px;
    }

    .contact-card {
        padding: 15px;
    }

    .contact-card p {
        font-size: 14px;
    }
}



/* General Panel Styling */
.panel {
    font-family: 'Raleway', sans-serif;
    padding: 0;
    border: none;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.08);
    margin: 0 auto; /* Center the panel */
    max-width: 1000px; /* Maximum width for the panel */
}

.panel .panel-heading {
    background: #1f328d; /* HEX: 1f328d */
    padding: 15px;
    border-radius: 8px 8px 0 0;
    color: white;
}

.panel .panel-heading .btn {
    color: #fff;
    background-color: #2766DA; /* HEX: 2766DA */
    font-size: 14px;
    font-weight: 600;
    padding: 7px 15px;
    border: none;
    border-radius: 5px;
    transition: all 0.3s ease;
}

.panel .panel-heading .btn:hover {
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
    background-color: #5ca0fb; /* HEX: 5ca0fb */
}

.panel .panel-heading .form-horizontal .form-group {
    margin: 0;
}

.panel .panel-heading .form-horizontal label {
    color: #fff;
    margin-right: 10px;
}

.panel .panel-heading .form-horizontal .form-control {
    display: inline-block;
    width: 80px;
    border: none;
    border-radius: 5px;
    position: relative;
    z-index: 1;
}

.panel .panel-heading .form-horizontal .form-control:focus {
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
    z-index: 2;
}

.panel .panel-body {
    padding: 0;
    border-radius: 0 0 8px 8px;
}

.panel .panel-body .table thead tr th {
    color: #fff;
    background: #38648e; /* HEX: 2d4d8e */
    font-size: 16px;
    font-weight: 700;
    padding: 15px;
    border-bottom: none;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.panel .panel-body .table tbody tr td {
    color: #555;
    background: #fff;
    font-size: 12px;
    font-weight: 500;
    padding: 15px;
    vertical-align: middle;
    border-color: #e7e7e7;
    border-bottom: 1px solid #e7e7e7;
    transition: background-color 0.3s, color 0.3s;
}

.panel .panel-body .table tbody tr:nth-child(odd) td {
    background: #f9f9f9;
}

.panel .panel-body .table tbody tr:hover td {
    background-color: #f1f1f1;
    color: #2766DA;
}

.panel .panel-body .table tbody .action-list {
    padding: 0;
    margin: 0;
    list-style: none;
}

.panel .panel-body .table tbody .action-list li {
    display: inline-block;
}

.panel .panel-body .table tbody .action-list li a {
    color: #fff;
    font-size: 13px;
    line-height: 28px;
    height: 28px;
    width: 33px;
    padding: 0;
    border-radius: 5px;
    transition: all 0.3s ease;
    background-color: #2766DA;
}

.panel .panel-body .table tbody .action-list li a:hover {
    box-shadow: 0 0 5px #ddd;
    background-color: #5ca0fb; /* HEX: 5ca0fb */
}

.panel .panel-footer {
    color: #fff;
    background: #1f328d; /* HEX: 1f328d */
    font-size: 16px;
    line-height: 33px;
    padding: 25px 15px;
    border-radius: 0 0 8px 8px;
}

.pagination {
    margin: 0;
    display: flex;
    justify-content: center;
}

.pagination li a {
    color: #fff;
    background-color: #5ca0fb; /* HEX: 5ca0fb */
    font-size: 15px;
    font-weight: 700;
    margin: 0 2px;
    border: none;
    border-radius: 5px;
    transition: all 0.3s ease;
    padding: 8px 12px;
}

.pagination li a:hover,
.pagination li a:focus,
.pagination li.active a {
    color: #fff;
    background-color: #2766DA; /* HEX: 2766DA */
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.4);
}

.pagination.visible-xs {
    display: flex;
    justify-content: center;
}

.table-responsive {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}


.custom-table {
    border-collapse: separate;
    border-spacing: 0 10px;
}

.custom-table thead th {
    background: #38648e;
    color: #fff;
    padding: 15px;
    font-size: 16px;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.custom-table tbody td {
    background: #fff;
    color: #555;
    padding: 15px;
    font-size: 12px;
    border-top: 1px solid #e7e7e7;
    transition: background-color 0.3s, color 0.3s;
}

.custom-table tbody tr:hover td {
    background-color: #f1f1f1;
    color: #2766DA;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .panel .panel-heading .form-horizontal .form-control {
        width: 100%; /* Full width on smaller screens */
    }
    
    .panel .panel-footer {
        text-align: center;
    }

    .panel .panel-heading .btn,
    .panel .panel-heading .form-horizontal .form-control {
        width: 100%; /* Full width on smaller screens */
        margin-bottom: 10px;
    }

    .panel .panel-heading .form-horizontal label {
        display: block;
        margin-bottom: 5px;
    }

    .custom-table tbody td {
        padding: 8px 10px;
        font-size: 14px;
    }
}

/* Ensuring dropdown stays within visible area */
.panel .panel-heading .form-horizontal .form-group {
    position: relative;
}

.panel .panel-heading .form-horizontal .form-control {
    position: relative;
    z-index: 1;
}

.panel .panel-heading .form-horizontal .form-control:focus {
    z-index: 2;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
}


.subscribe-options {
    display: flex;
    justify-content: center;
    gap: 20px;
    margin-top: 20px;
}

.subscribe-option {
    text-align: center;
    padding: 10px;
}

.subscribe-option a {
    text-decoration: none;
    color: white;
    display: block;
    font-size: 24px;
    cursor: pointer;
}

.subscribe-option a i {
    font-size: 48px;
    color: white;
}

.subscribe-option a p {
    margin-top: 10px;
    font-size: 18px;
}


.legal-context {
    max-width: 1200px;
    margin: 20px auto;
    padding: 20px;
    border-radius: 8px;
}

.our-focus {
    max-width: 1200px;
    margin: 20px auto;
    padding: 20px;
    border-radius: 8px;
}

.our-focus-wrapper {
    background-color: #e9f0fb; /* Adjust the background color as needed */
    width: 100%;
    padding: 20px 0;
}


.legal-context h2, .our-focus h2 {
    color: #38648e;
    font-weight: bold;
}

.legal-context p, .our-focus p {
    margin: 10px 0;
}

.our-focus ul {
    padding-left: 20px;
    margin: 10px 0;
}

.our-focus ul li {
    margin-bottom: 10px;
}

.our-focus ul li b {
    color: #67b5fb;
}

.proactive-disclosure-wrapper {
    width: 100%;
    padding: 40px 0;
}

.proactive-disclosure-text {
    max-width: 1000px; /* Width for the text container */
    margin: 0 auto 20px auto;
    padding: 20px;
}

.proactive-disclosure-container {
    max-width: 800px; /* Increased width for the table */
    margin: 0 auto;
    padding: 20px;
}

.proactive-title {
    color: #38648e;
    font-weight: bolder;
    margin-bottom: 10px;
}

.proactive-title .highlight {
    color: #67b5fb;
    font-weight: bold !important;
}

.proactive-description {
    color: #38648e;
    margin-bottom: 20px;
}
.proactive-table-container {
    align-items: center;
    justify-content: center;
    width: 800px;
    margin: 0 auto 20px; /* Center the container with auto margins */
}

.proactive-table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 20px;
    border-radius: 15px; /* Add border radius to the table */
    overflow: hidden; /* Ensure border radius is applied to all corners */
}

.proactive-table th, .proactive-table td {
    padding: 16px 8px; 
    text-align: center;
    position: relative;
    border: none;
    border-right: 0px solid #38648e; /* Add a line between each td */
}

.proactive-table th {
    text-transform: uppercase; /* Force the header titles to be uppercase */
}

.proactive-table th:last-child, .proactive-table td:last-child {
    border-right: none; /* Remove the right border for the last td in each row */
}

.proactive-table tbody tr {
    border-bottom: 3px solid #38648e; /* Add a line between each row */
}

.proactive-table tbody tr:last-child {
    border-bottom: none; /* Remove the bottom border for the last row */
}

.proactive-table th:nth-child(odd) {
    background-color: #67b5fb; /* True Color 1 */
    color: white;
}

.proactive-table th:nth-child(even) {
    background-color: #67b5fb; /* True Color 2 */
    color: white;
}

.proactive-table tbody tr:nth-child(odd) td {
    background-color: rgba(103, 181, 251, 0.1); /* Color 1 with low opacity */
}

.proactive-table tbody tr:nth-child(even) td {
    background-color: rgba(103, 181, 251, 0.2); /* Color 2 with higher opacity */
}

/* Deeper color for the score column */
.proactive-table tbody tr td:nth-child(4) {
    background-color: rgba(38, 102, 218, 0.3); /* Deeper color for score column */
    color: #38648e;
    font-weight: bolder;
}

/* Ministry column with highest width */
.proactive-table th:nth-child(2),
.proactive-table td:nth-child(2) {
    width: 40%; /* Set a higher width for Ministry column */
}

/* Equal widths for other columns */
.proactive-table th:nth-child(1),
.proactive-table th:nth-child(3),
.proactive-table th:nth-child(4),
.proactive-table td:nth-child(1),
.proactive-table td:nth-child(3),
.proactive-table td:nth-child(4) {
    width: 20%; /* Set equal width for other columns */
}

/* Add border radius to the first and last rows */
.proactive-table thead tr:first-child th:first-child {
    border-top-left-radius: 15px;
}

.proactive-table thead tr:first-child th:last-child {
    border-top-right-radius: 15px;
}

.proactive-table tbody tr:last-child td:first-child {
    border-bottom-left-radius: 15px;
}

.proactive-table tbody tr:last-child td:last-child {
    border-bottom-right-radius: 15px;
}

.proactive-table tbody tr:hover {
    background-color: rgba(103, 181, 251, 0.5); /* Highlight the row with a light blue background */
    transition: background-color 0.3s; /* Smooth transition for the hover effect */
}


.icon-circle {
    display: inline-block;
    width: 24px;
    height: 24px;
    line-height: 24px;
    border-radius: 50%;
    text-align: center;
    color:  white;
}


.score-up .icon-circle {
    background-color: green;
}

.score-down .icon-circle {
    background-color: red;
}

.score-equal .icon-circle {
    background-color: orange;
}


.proactive-button {
    display: block;
    width: 200px;
    margin: 0 auto;
    padding: 10px 20px;
    background-color: #38648e;
    color: #fff;
    border: none;
    border-radius: 30px;
    cursor: pointer;
    text-align: center;
    transition: 0.3s;
}

.proactive-button:hover {
    background-color: #67b5fb;
    color: white;
}

.proactive-button1 {
    font-family: 'Tiffany Heavy', serif;
    display: block;
    width: 150px;
    margin: 0 auto;
    padding: 10px 10px;
    font-size: 30px;
    font-weight: bold;
    background-color: #38648e;
    color: #fff;
    border: none;
    border-radius: 30px;
    cursor: pointer;
    text-align: center;
    transition: 0.3s;
}

.proactive-button1:hover {
    background-color: #67b5fb;
    color: white;
}


.proactive-table td {
    padding-top: 16px; /* Adjust for additional spacing */
    padding-bottom: 16px; /* Adjust for additional spacing */
}


.metric-container {
    display: grid;
    grid-template-columns: repeat(4, 1fr); /* Create 4 equal columns */
    gap: 40px; /* Spacing between metric items */
} 

.metric-item {
    text-align: center;
    color: #38648e;
}

.numberclass {
    font-size: 2.5rem; /* Make the number big */
    font-weight: bold;
    margin-bottom: 10px; /* Space between number and title */
}

.titleclass {
    font-size: 1rem;
    font-weight: 500;
}

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


.custom-card-container {
    display: flex;
    justify-content: center;
    gap: 20px; /* Space between cards */
    margin: 20px;
}

.custom-card {
    background-color: #003399; /* Card background color */
    border-radius: 10px;
    padding: 20px;
    color: white;
    width: 300px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    position: relative;
}

.custom-card p {
    color: white;
    margin: 10px 0;
}

.custom-progress-bar {
    display: inline-block;
    width: 100px;
    height: 10px;
    background-color: #e0e0e0;
    border-radius: 5px;
    overflow: hidden;
    vertical-align: middle;
}

.custom-progress {
    display: block;
    height: 100%;
    background-color: #ffc107;
    border-radius: 5px;
}

.lowercase {
    text-transform: lowercase;
    display: inline !important;
    background: none !important;

    margin: 0;
    padding: 0;
}

.slider-area-btn {
    text-align: right;
}

.slider-area-btn {
    position: absolute;
    right: 0;
}

.uppercase {
    text-transform: uppercase;
}

.languages a {
    display: flex;
    margin-right: 10px;
    text-decoration: none;
    color: #000;
}




/* Footer Styles */
.custom-footer {
    background-color: #38648e;
    padding: 40px 0;
    color: white;
    text-align: center;
}

.footer-logo-section {
    margin-bottom: 20px;
}

.footer-logo {
    width: 200px !important;
    height: auto !important;
    margin: 0 10px;
}

.funded-text {
    font-size: 14px;
    margin-top: 10px;
    margin-bottom: 30px;
    color: #d1e8ff;
}

.footer-content {
    max-width: 1400px; /* Increased max-width to allow more content in a row */
    margin: 0 auto 20px;
    padding: 20px 0;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    flex-wrap: wrap;
}

/* Links Wrapper */
.footer-links-wrapper {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 20px; /* Reduced gap to allow more columns in a row */
    width: 100%;
}

/* Individual Link Columns */
.footer-link-column {
    flex: 1 1 250px; /* Wider base width to accommodate more content */
    min-width: 250px; /* Ensures a minimum width for each column */
    text-align: center;
    margin-bottom: 15px; /* Adjusted margin for spacing between rows */
}

.footer-section-title {
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 10px;
    text-transform: uppercase;
    color: #67b5fb;
}

/* Sub-links styling */
.footer-sub-links {
    list-style: none;
    padding: 0;
    margin: 0;
    text-align: center; /* Align sub-links text to the left */
}

.footer-sub-links li {
    margin-bottom: 5px; /* Slightly reduced margin for a tighter layout */
}

.footer-sub-links a {
    color: white;
    text-decoration: none;
    font-size: 14px;
    line-height: 1.5;
    transition: color 0.3s ease;
}

.footer-sub-links a:hover {
    color: #67b5fb;
}

/* Contact and Social Media */
.footer-contact-social {
    border-top: 1px solid #67b5fb;
    padding-top: 20px;
    margin-top: 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}

.footer-social {
    list-style: none;
    padding: 0;
    display: flex;
    justify-content: center; /* Center social icons */
}

.footer-social li {
    margin: 0 10px;
}

.footer-social a {
    color: white;
    font-size: 18px;
}

.footer-social a:hover {
    color: #67b5fb;
}

.footer-contact {
    font-size: 14px;
    line-height: 1.5;
    text-align: right; /* Align contact info to the right */
    width: auto;
}

.footer-contact a {
    color: #67b5fb;
    text-decoration: none;
    font-weight: bold;
}

.footer-contact a:hover {
    color: #d1e8ff;
}

/* Responsive Styles */
@media (max-width: 992px) {
    .footer-logo {
        width: 120px;
        height: 60px;
    }

    .footer-links-wrapper {
        flex-direction: column;
        align-items: center;
        text-align: center; /* Center-align on smaller screens */
    }

    .footer-link-column {
        width: 100%;
        text-align: center;
        margin-bottom: 20px;
    }

    .footer-contact-social {
        flex-direction: column;
        align-items: center;
    }

    .footer-contact {
        text-align: center;
        margin-top: 15px;
    }
}

@media (max-width: 576px) {
    .footer-logo {
        width: 100px;
        height: 50px;
    }

    .footer-sub-links a, .footer-contact {
        font-size: 13px;
    }

    .footer-link-column {
        flex: 1 1 100%;
        text-align: center;
    }

    .footer-section-title, .footer-sub-links a {
        text-align: center; /* Center text on smaller screens */
    }
}





.customised-width{
    width: 100%;  

}

.custom-subscribe-area {
    margin-top: -150px;
    align-items: center;
    text-align: center;
    justify-content: center;
}
.custom-subscribe-area h3{
    font-size: 22px !important;
}

.custom-subscribe-bg {
 /* background-color: #67b5fb; */ /* Removed solid color */
    background-image: url('/uploads/footer/Rehub_Website-03.png'); /* Update with actual image name */
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 40px 20px;
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.custom-subscribe-title h3 {
    font-size: 24px;
    color: white;
    margin-bottom: 20px;
}

.custom-subscribe-options {
    display: flex;
    justify-content: center;
    gap: 30px;
}

.custom-subscribe-option a {
    font-size: 30px;
    color: white;
    background-color: #67b5fb;
    padding: 15px;
    border-radius: 40%;
    transition: background-color 0.3s ease, transform 0.3s ease;
}

.custom-subscribe-option a:hover {
    background-color: #38648e;
    transform: scale(1.1);
}

/* Responsive Styles */
@media (max-width: 768px) {
    .custom-subscribe-title h3 {
        font-size: 20px;
    }

    .custom-subscribe-options {
        gap: 20px;
    }

    .custom-subscribe-option a {
        font-size: 25px;
        padding: 10px;
    }
}

@media (max-width: 480px) {
    .custom-subscribe-title h3 {
        font-size: 18px;
    }

    .custom-subscribe-options {
        gap: 15px;
    }

    .custom-subscribe-option a {
        font-size: 20px;
        padding: 8px;
    }
}


.aligned-text {
    text-align: justify; /* Or use left, right, or center based on your need */
    margin: 0; /* Ensures no extra margin is added */
    padding: 0; /* Ensures no extra padding is added */
    line-height: 1.5; /* Adjust line height for better readability */
}


.our-focus-wrapper {
    padding: 20px 0;
}



.filter-section {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}

.filter-dropdown {
    position: relative;
    display: inline-block;
}

.filter-list {
    display: none;
    position: absolute;
    background-color: white;
    max-width: 200px;
    font-size: 14px;
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
    z-index: 1;
    list-style-type: none;
    padding: 0;
    margin: 0;
}

.filter-dropdown:hover .filter-list {
    display: block;
}

.filter-list .filter-item {
    color: #38648e;
    padding: 6px 8px;
    cursor: pointer;
    transition: background-color 0.3s;
}

.filter-list .filter-item:hover {
    background-color: #f1f1f1;
}

.selected-filters {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    flex: 2;
}

.selected-filters .filter-item {
    margin-right: 5px;
}

.filter-item .remove-filter {
    margin-left: 5px;
    color: #ff4c4c;
    font-weight: bold;
    cursor: pointer;
}

.search-bar {
    position: relative;
    width: 300px;
    flex: 1;
}

.search-bar input {
    background: transparent;
    width: 100%;
    padding: 10px;
    border: 2px solid #38648e;
    border-radius: 20px;
    outline: none;
}

.search-bar .search-icon {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    color: #38648e;
    cursor: pointer;
    outline: none;
    font-size: 18px;
}




.modern-table-container {
    width: 100%;
    overflow-x: auto;
    margin: 20px 0;
    padding: 20px;
    border-radius: 15px;
}

.modern-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    border-radius: 15px;
    overflow: visible; /* Ensure overflow is visible */
    white-space: nowrap; /* Prevent text wrapping */
}

.modern-table th, .modern-table td {
    padding: 15px;
    font-size: 14px; /* Slightly increased font size for readability */
    color: #333;
    position: relative;
    transition: all 0.3s ease;
}

.modern-table th {
    background: linear-gradient(145deg, #4a7bab, #345a7a);
    color: #fff;
    text-transform: capitalize;
    cursor: pointer;
    text-align: center;
    box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.1);
}

.modern-table th:first-child {
    border-top-left-radius: 15px; /* Apply border-radius to top-left */
}

.modern-table th:last-child {
    border-top-right-radius: 15px; /* Apply border-radius to top-right */
}

.modern-table th:hover::after {
    content: attr(data-hover-text);
    position: absolute;
    top: -25px;
    right: 0;
    font-size: 10px;
    color: #38648e;
    background-color: #fff;
    padding: 3px 5px;
    border-radius: 3px;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
    z-index: 1000;
    white-space: nowrap;
}

.modern-table td {
    border-bottom: 1px solid #ddd;
    background: transparent; /* No background color here */
    transition: transform 0.3s ease;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.05); /* Subtle inner shadow */
}

.modern-table td.column-rank {
    text-align: left;
    font-weight: bold;
    padding-left: 10px;
}

.modern-table td.column-data {
    text-align: center;
}

.modern-table tbody tr {
    transition: background-color 0.3s, transform 0.3s;
    background-color: #e0e7ff; /* Default row background color */
}

/* Hover effect */
.modern-table tbody tr:hover {
    background-color: rgba(103, 182, 251, 0.15);
    transform: translateY(-2px);
}

/* Keep the first th space but make it invisible */
.modern-table th:first-child {
    visibility: hidden;
    width: 0; /* Ensure it doesn't affect layout */
    padding: 0; /* Remove padding */
}

/* Alternating row colors */
.modern-table tbody tr:nth-child(odd) {
    background-color: #d0d9ff23; /* Light blue-grey */
}

.modern-table tbody tr:nth-child(even) {
    background-color: #f0f4ff; /* Slightly different light blue-grey */
}

/* Different color for percentage column */
.modern-table .percentage {
    font-weight: bolder;
    background-color: rgba(255, 152, 0, 0.1);
}

/* Adding subtle 3D effect */
.modern-table th, .modern-table td {
    perspective: 1000px;
}

.modern-table th:hover, .modern-table td:hover {
    transform: translateZ(10px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* 3D hover effect */
}


/* Style the scrollbar for modern-table-container */
.modern-table-container::-webkit-scrollbar {
    width: 12px; /* Width of the scrollbar */
    height: 12px; /* Height of the scrollbar */
}

.modern-table-container::-webkit-scrollbar-track {
    background: #e0e7ff; /* Background color of the scrollbar track */
    border-radius: 10px; /* Rounded corners for the track */
}

.modern-table-container::-webkit-scrollbar-thumb {
    background: #4a7bab; /* Color of the scrollbar thumb */
    border-radius: 10px; /* Rounded corners for the thumb */
    border: 3px solid #e0e7ff; /* Space around the thumb for a more subtle look */
}

.modern-table-container::-webkit-scrollbar-thumb:hover {
    background: #345a7a; /* Darker color when hovering over the scrollbar thumb */
}

/* For Firefox */
.modern-table-container {
    scrollbar-width: thin; /* Thin scrollbar */
    scrollbar-color: #4a7bab #e0e7ff; /* Thumb and track color */
}

/* Scrollbar design for Firefox */
.modern-table-container {
    scrollbar-width: thin;
    scrollbar-color: #4a7bab #e0e7ff;
}

.modern-table-container::-webkit-scrollbar {
    width: 12px;
    height: 12px;
}

.modern-table-container::-webkit-scrollbar-track {
    background: #e0e7ff;
    border-radius: 10px;
}

.modern-table-container::-webkit-scrollbar-thumb {
    background-color: #4a7bab;
    border-radius: 10px;
    border: 3px solid #e0e7ff;
}

.modern-table-container::-webkit-scrollbar-thumb:hover {
    background: #345a7a;
}



@keyframes glow {
    0%, 100% {
        box-shadow: none;
    }
    50% {
        box-shadow: 0 0 10px rgba(0, 47, 255, 0.5); /* Glowing effect */
    }
}

.glow-effect {
    animation: glow 3s ease-in-out infinite;
}







.full-width-image-container {
    width: 100%;
    height: 300px; /* Adjust the height as needed */
    background-image: url('assets/img/1.jpg'); /* Replace with your image path */
    background-size: cover;
    background-position: center;
    position: relative;
}

.image-overlay {
    width: 100%;
    height: 100%;
    background: rgba(23, 55, 79, 0.8);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 40px; /* Increased padding for more space */
}

.overlay-content {
    display: flex;
    justify-content: space-between;
    margin-left: 300px;
    width: 100%;
}

.overlay-text {
    color: #fff;
    font-size: 24px;
}

.overlay-button {
    align-self: flex-end; /* Aligns the button to the bottom */
}

.btn-contact-us {
    display: inline-block;
    background-color: #fff; /* Changed to white */
    color: #38648e;
    margin-bottom: 5px;
    margin-right: 300px;
    padding: 10px 20px;
    border-radius: 30px;
    text-decoration: none;
    transition: background-color 0.3s;
}

.btn-contact-us:hover {
    background-color: #67b5fb;
    color: #fff;
}

@media (max-width: 1300px) {
    .overlay-content {
        margin-left: 20px;
        margin-right: 20px;
    }

    .btn-contact-us {
        margin-right: 20px;
    }
}


@media (max-width: 768px) {
    .image-overlay {
        flex-direction: column;
        justify-content: center;
        align-items: center;
        padding: 0 20px; /* Adjust padding for smaller screens */
    }

    .overlay-content {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    .overlay-text {
        margin-bottom: 10px;
    }

    .overlay-button {
        margin-top: 10px;
    }

    .btn-contact-us {
        width: 100%;
        text-align: center;
    }
}


.centered-btn {
    display: inline-block;
    width: 35%;
    background-color: #fff;
    color: #38648e;
    padding: 10px 20px;
    border-radius: 20px;
    font-weight: bold;
    transition: background-color 0.3s;
    text-align: center;
    margin: 0 auto;
    transition: 0.3s;
}



@media (max-width: 1500px) {
    .centered-btn {
        width: 30%;
    }
}
@media (max-width: 1399px) {
    .centered-btn {
        width: 35%;
    }
}
@media (max-width: 1199px) {
    .centered-btn {
        width: 40%;
    }
}

@media (max-width: 870px) {
    .centered-btn {
        width: 40%;
    }
}

@media (max-width: 760px) {
    .centered-btn {
        width: 60%;
    }
}


.centered-btn:hover {
    background-color: #38648e;
    color: #fff;
}

.centered-btn span {
    display: inline-block;
    text-transform: uppercase;
}

.centered-btn-container {
    text-align: center;
    margin: 20px 0;
}


/* Style for the custom table */
.custom-table-container {
    margin-top: 20px;
    text-align: center;
}

.custom-table {
    width: 100%;
    border-collapse: collapse;
    margin: auto;
}

.custom-table th, .custom-table td {
    border: 1px solid #ddd;
    padding: 8px;
    text-align: center;
}

.custom-table th {
    background-color: #38648e;
    color: white;
}

.custom-table td {
    background-color: #f9f9f9;
}

.status-red, .status-green {
    color: white;
    padding: 5px 10px;
    border-radius: 5px;
}

.status-red {
    background-color: red;
}

.status-green {
    background-color: green;
}

.timeline-red, .timeline-green, .timeline-yellow {
    width: 20px;
    height: 20px;
    display: inline-block;
    border-radius: 50%;
}

.timeline-red {
    background-color: red;
}

.timeline-green {
    background-color: green;
}

.timeline-yellow {
    background-color: yellow;
}

/* Style for the tag section */
.tag-section {
    text-align: left;
    margin-bottom: 20px;
}

.tag-section ul {
    list-style: none;
    padding: 0;
}

.tag-section ul li {
    display: inline-block;
    margin-right: 10px;
}

.tag-section ul li a {
    text-decoration: none;
    background-color: #67b5fb;
    color: white;
    padding: 5px 10px;
    border-radius: 5px;
    transition: background-color 0.3s;
}

.tag-section ul li a:hover {
    background-color: #38648e;
}

/* Style for the year dropdown */
.filter-dropdown {
    position: relative;
    display: inline-block;
    cursor: pointer;
    color: #38648e;
}

.filter-dropdown:hover .dropdown-content {
    display: block;
}

.filter-dropdown .dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 120px;
    margin-left: 200px;
    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
    z-index: 1;
}

.filter-dropdown .dropdown-content a {
    color: black;
    padding: 6px 10px;
    font-size: 14px;
    text-decoration: none;
    display: block;
    text-align: left;
}

.filter-dropdown .dropdown-content a:hover {
    background-color: #ddd;
}


.stay-informed-box {
    margin-top: 15px;
    margin-left: 200px;
    background-color: #38648e;
    width: 900px;
    height: 300px;
    color: white;
    padding: 20px;
    border-radius: 5px;
    text-align: left;
    position: relative;
}

/* Base RTL adjustments */
.rtl {
    direction: rtl;
    text-align: right;
}

.rtl .nav-list {
    text-align: right;
}

.rtl .nav-list li {
    float: right;
}

.rtl .dropdown-menu {
    text-align: right;
}

.rtl .header-right {
    float: left;
}

.rtl .stay-informed-box {
    margin-top: 70px;
    margin-right: 300px;
    background-color: #38648e;
    width: 900px;
    height: 300px;
    color: white;
    padding: 20px;
    border-radius: 5px;
    text-align: left;
    position: relative;
}

.stay-informed-box h2 {
    margin-bottom: 20px;
    text-align: left;
}

.stay-informed-box ul {
    list-style: none;
    padding: 0;
}

.stay-informed-box ul li {
    margin-bottom: 10px;
}

.stay-informed-box ul li a {
    color: white;
    text-decoration: none;
    display: flex;
    align-items: center;
    background-color: white;
    color: #38648e;
    padding: 10px;
    border-radius: 20px;
    margin: 10px 0;
}

.stay-informed-box ul li a i {
    margin-right: 10px;
    color: #38648e;
}

@media (max-width: 768px) {
    .stay-informed-box {
        margin-top: 20px;
        margin-left: 0;
        width: 400px;
    }
}


@media (max-width: 1500px) {
     .stay-informed-box {
        margin-left: 200px;
    }
}

@media (max-width: 1300px) {
    .stay-informed-box {
        margin-left: 150px;
    }
}

@media (max-width: 940px) {
    .stay-informed-box {
        margin-left: 50px;
    }
}

@media (max-width: 768px) {
    .rtl .stay-informed-box {
        margin-top: 20px;
        margin-right: 0;
        margin-left: 10px;
        width: 400px;
    }
}

@media (max-width: 1500px) {
    .rtl .stay-informed-box {
        margin-right: 200px;
    }
}

@media (max-width: 1200px) {
    .rtl .stay-informed-box {
        margin-right: 150px;
    }
}

@media (max-width: 940px) {
    .rtl .stay-informed-box {
        margin-right: 50px;
    }
}



.card-section .card {
    background: transparent;
    border-radius: 5px;
    overflow: hidden;
    margin-bottom: 20px;
}

.card-image {
    height: 200px; /* Adjust height as needed */
    background-size: cover;
    background-position: center;
    position: relative;
}

.card-image1 {
    height: 400px; /* Adjust height as needed */
    background-size: cover;
    background-position: center;
    position: relative;
}

.card-title {
    position: absolute;
    bottom: 10px;
    left: 10px;
    background: rgba(0, 0, 0, 0.5);
    color: #fff;
    padding: 5px 10px;
    border-radius: 3px;
    font-size: 18px;
}

.card-body {
    padding: 15px;
    text-align: center;
}

.card-text {
    font-size: 14px;
    color: #38648e;
    margin-bottom: 15px;
    max-height: 60px; /* Increase max-height to show more words */
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 4; /* Number of lines to show */
    -webkit-box-orient: vertical;
}

.learn-more-btn {
    display: inline-block;
    background-color: #67b5fb;
    color: #fff;
    padding: 10px 20px;
    border-radius: 5px;
    text-decoration: none;
    transition: background-color 0.3s;
}

.learn-more-btn:hover {
    background-color: #38648e;
    color: white;
}

.more-button-section .btn-more {
    background-color: #38648e;
    color: #fff;
    padding: 10px 20px;
    border-radius: 5px;
    text-decoration: none;
    transition: background-color 0.3s;
}

.more-button-section .btn-more:hover {
    background-color: #67b5fb;
    color: white;
}

@media (max-width: 768px) {
    .card-section .card {
        margin-bottom: 20px;
    }
}



.reform-activities-container {
    margin-top: 50px;
}

.reform-activities-title {
    color: #38648e;
    font-weight: bold;
    margin-bottom: 20px;
}

.reform-activities-description {
    color: #38648e;
    margin-bottom: 40px;
    text-align: center;
}

.reform-card-section .reform-card {
    display: flex;
    background-color: #fff;
    border-radius: 5px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    overflow: hidden;
    margin-bottom: 20px;
    transition: transform 0.3s;
    height: auto;
    padding: 15px;
}

.reform-card-section .reform-card:hover {
    transform: translateY(-10px);
}

.reform-card-image {
    width: 800px;
    height: 300px;
    background-size: cover;
    background-position: center;
    border-radius: 5px;
}

.rtl .reform-card-image {
    width: 700px;
    height: 300px;
    margin-left: 20px;
    background-size: cover;
    background-position: center;
    border-radius: 5px;
}


.reform-card-content {
    padding-left: 15px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.reform-card-date {
    font-size: 12px;
    color: #999;
    margin-bottom: 5px;
}

.reform-card-title {
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 10px;
    color: #38648e;
}

.reform-card-text {
    font-size: 14px;
    color: #333;
    margin-bottom: 10px;
}

.reform-read-more-link {
    font-size: 14px;
    color: #67b5fb;
    text-decoration: none;
    transition: color 0.3s;
}

.reform-read-more-link:hover {
    color: #38648e;
}

.reform-more-button-section .reform-btn-more {
    background-color: #38648e;
    color: #fff;
    padding: 10px 20px;
    border-radius: 5px;
    text-decoration: none;
    transition: background-color 0.3s;
}

.reform-more-button-section .reform-btn-more:hover {
    background-color: #67b5fb;
}

@media (max-width: 768px) {
    .reform-card-section .reform-card {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    .reform-card-image {
        width: 100%;
        height: 150px;
        border-radius: 5px 5px 0 0;
    }

    .reform-card-content {
        padding: 10px;
    }
}


.article-container {
    display: flex;
    flex-wrap: wrap;
    margin-top: 20px;
}

.article-image {
    flex: 2;
    position: relative;
    background-size: cover;
    background-position: center;
    height: 500px; /* Adjust height as needed */
    margin-right: 20px;
}

.rtl .article-image {
    flex: 2;
    position: relative;
    background-size: cover;
    background-position: right;
    height: 500px; /* Adjust height as needed */
    width: 300px;
    margin-left: 20px;
}


.article-image .image-title {
    position: absolute;
    bottom: 20px;
    left: 20px;
    font-weight: 500;
    color: white;
    background: rgba(0, 0, 0, 0.5);
    padding: 10px 20px;
    border-radius: 5px;
    font-size: 26px;
}

.article-details {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.article-details .date {
    font-size: 18px;
    color: #38648e;
    margin-bottom: 20px;
}

.article-details .leading-cso,
.article-details .partner-csos {
    margin-bottom: 20px;
}

.article-details .leading-cso-title,
.article-details .partner-csos-title {
    font-size: 20px;
    font-weight: bold;
    color: #38648e;
    margin-bottom: 10px;
}

.article-details .logo-container {
    display: flex;
    flex-direction: column;
}

.article-details .logo {
    margin-bottom: 10px;
    width: 100px; /* Adjust width as needed */
    height: auto;
}

@media (max-width: 768px) {

    .article-image {
        height: 300px;
        margin-bottom: 20px;
    }

    .article-details .leading-cso-title,
    .article-details .partner-csos-title {
        font-size: 16px;
        font-weight: bold;
        color: #38648e;
        margin-bottom: 8px;
    }

    .article-details .date {
        font-size: 14px;
        color: #38648e;
        margin-bottom: 10px;
    }

    .article-details .logo {
        width: 80px; /* Adjust width for smaller screens */
    }
}



.custom-paragraph-container {
    max-width: 900px; /* Adjust this value to change the width */
    margin: 0 auto; /* Center the paragraph */
}
.custom-paragraph {
    color: #67b5fb;
    font-weight: bold;
    font-style: italic;
    position: relative;
    padding-left: 20px;
}

.custom-paragraph::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 3px; /* Adjust the width of the vertical bar */
    background-color: #67b5fb;
}


.partner-logo {
    width: 100px; /* Adjust as needed */
    height: auto;
    margin-bottom: 10px;
}

@media (max-width: 768px) {
    .partner-logo {
        width: 100px; /* Adjust as needed for smaller screens */
    }
}

.partner-logo {
    width: 200px; /* Adjust as needed */
    height: auto;
    margin-bottom: 10px;
}

@media (max-width: 768px) {
    .partner-logo {
        width: 100px; /* Adjust as needed for smaller screens */
    }
}





.cso-logo-section {
    margin-bottom: 20px;
}

.cso-logo {
    width: 200px;
    height: auto;
}

.cso-description-section {
    text-align: center;
}

.cso-title {
    font-size: 24px;
    font-weight: bold;
    color: #38648e;
    margin-bottom: 10px;
}

.cso-description {
    font-size: 16px;
    color: #555;
    margin-bottom: 10px;
}

.cso-sector {
    font-size: 16px;
    color: #38648e;
}




.sohoy-all-cause .sohoj-single-cause {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.sohoy-all-cause .sohoj-single-cause-content-wrapper {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
}

.sohoy-all-cause .sohoj-single-cause-content {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 15px;
    background: #f9f9f9;
    border-radius: 5px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    height: 100%;
}

.sohoy-all-cause .sohoj-single-cause-content h4 {
    font-size: 18px;
    margin-bottom: 10px;
}

.sohoy-all-cause .sohoj-single-cause-content p {
    font-size: 14px;
    color: #38648e;
    margin-bottom: 15px;
    flex-grow: 1;
}

.sohoy-all-cause .sohoj-single-cause-content a {
    align-self: flex-end;
    margin-top: auto;
}

.sohoy-all-cause .sohoj-single-cause img {
    width: 100%;
    height: auto;
    border-radius: 5px 5px 0 0;
}

/* Ensuring all cards have the same height */
.sohoy-all-cause .sohoj-single-cause {
    height: 100%;
}

.sohoy-all-cause .sohoj-single-cause-content-wrapper {
    height: 100%;
}

.sohoy-all-cause .sohoj-single-cause-content {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}



/* arabic rtl */
.rtl .search-bar {
    direction: rtl;
    text-align: left;
}

.rtl .search-bar input {
    padding-right: 30px;
    padding-left: 10px;
}

.rtl .search-bar .search-icon {
    right: auto;
    left: 10px;
}


/* Arabic RTL */
.rtl .search-bar {
    direction: rtl;
    text-align: left;
}

.rtl .search-bar input {
    padding-right: 30px;
    padding-left: 10px;
}

.rtl .search-bar .search-icon {
    right: auto;
    left: 10px;
}

.rtl .slider-area-btn {
    text-align: left !important;
}

.rtl .slider-area-btn .btn-typ1 {
    margin-left: 0 !important;
    margin-right: 800px !important;
}

@media (max-width: 1110px) {
    .slider-area-btn .btn-typ1{
        margin-left: 400px !important
    }
}

@media (max-width: 995px) {
    .slider-area-btn .btn-typ1{
        margin-top: 100px !important;
        margin-left: 300px !important
    }
}

@media(max-width: 770px){

    .slider-area-btn .btn-typ1{
    margin-top: 170px !important;
    margin-left: auto !important
    }
}

@media(max-width: 575px){

    .slider-area-btn .btn-typ1{
    margin-top: auto !important;
    margin-left: auto !important
    }
}

@media (max-width: 1110px) {
    .rtl .slider-area-btn .btn-typ1{
        margin-right: 500px !important
    }
}

@media (max-width: 950px) {
    .rtl .slider-area-btn .btn-typ1{
        margin-top: 100px !important;
        margin-right: 300px !important
    }
}

@media(max-width: 750px){

    .rtl .slider-area-btn .btn-typ1{
    margin-top: 170px !important;
    margin-right: auto !important
    }
}

@media(max-width: 575px){

    .rtl .slider-area-btn .btn-typ1{
    margin-top: auto !important;
    margin-right: auto !important
    }
}

.rtl .slider-area-btn {
    text-align: left !important;
    margin-left: 0 !important;
    margin-right: auto !important;
}

.rtl .sohoj-about-bg-img {
    float: right;
}

.rtl .sohoj-about-content {
    text-align: right;
}


.rtl .sohoj-cause-area {
    direction: rtl;
}

/* Ensure the text is aligned to the right in RTL mode */
.rtl .sohoj-single-cause-content {
    text-align: right !important;
}

.rtl .all-single-events {
    text-align: right !important;
}

.single-events {

    flex-direction: column;
    justify-content: space-between;
}

.single-events-img img {
    width: 100%;
    height: 200px;
}





.chart-container {
    position: relative;
}

.overlay-circle {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    padding: 10px 20px;
    text-align: center;
}

.legend-container {
    list-style: none;
    padding: 0;
}

.legend-container li {
    margin-bottom: 10px;
}

.legend-container span {
    display: inline-block;
    width: 20px;
    height: 20px;
    margin-right: 10px;
}



.carousel-inner .carousel-item {
    display: flex;
}
.custom-cause-item {
    flex: 1 0 33.333%;
    max-width: 33.333%;
    box-sizing: border-box;
    padding: 15px;
}

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




.rehub_table-container {
    width: 100%;
    overflow-x: auto;
}

.rehub_table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 20px 0; /* Add space between columns */
    border-radius: 10px; /* Apply border radius to the whole table */
}

.rehub_table th, .rehub_table td {
    padding: 15px;
    text-align: center;
    color: black;
    border: none;
    position: relative; /* Necessary for hover effect */
    transition: transform 0.3s, box-shadow 0.3s; /* Smooth hover effect */
}

.rehub_table td {
    font-size: 14px;
}

.rehub_table th {
    background: linear-gradient(to bottom, #F0F4FF, #F9FAFF);
}

.rehub_table tbody {
    background: linear-gradient(to bottom, #F0F4FF, #F9FAFF);
}

.rehub_table tbody tr:nth-child(odd) {
    background: rgba(255, 255, 255, 0.9); /* Light background for odd rows */
}

.rehub_table tbody tr:nth-child(even) {
    background: linear-gradient(to bottom, #F0F4FF, #F9FAFF);
}

.rehub_column-data {
    border-right: 1px solid rgba(255, 255, 255, 0.1);
}

.rehub_column-data:last-child {
    border-right: none;
}



/* Apply border radius to the visible corners of the table */
.rehub_table tr:first-child th:nth-child(1) {
    border-top-left-radius: 10px;
}

.rehub_table tr:first-child th:last-child {
    border-top-right-radius: 10px;
}

.rehub_table tr:last-child td:nth-child(1) {
    border-bottom-left-radius: 10px;
}

.rehub_table tr:last-child td:last-child {
    border-bottom-right-radius: 10px;
}

/* First column text alignment and bold */
.rehub_table td:first-child {
    font-weight: bold;
    text-align: left;
}

/* 3D hover effect */
.rehub_table th:hover, .rehub_table td:hover {
    transform: translateZ(10px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* 3D hover effect */
}

/* Header hover effect to show full text */
.rehub_table th:hover::after {
    content: attr(data-hover-text);
    position: absolute;
    top: -25px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 10px;
    color: #38648e;
    background-color: #fff;
    padding: 3px 5px;
    border-radius: 3px;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
    z-index: 1000;
    white-space: nowrap;
}

/* Row hover effect for better visual feedback */
.rehub_table tr:hover .rehub_row-light,
.rehub_table tr:hover .rehub_row-dark {
    background: rgba(173, 216, 230, 0.6); /* Slightly darker on hover */
}




/* Apply border radius to the visible corners of the table */
.modern-table tr:first-child th:nth-child(1) {
    border-top-left-radius: 10px;
}

.modern-table tr:first-child th:nth-child(2) {
    border-top-left-radius: 10px;
}

.modern-table tr:first-child th:last-child {
    border-top-right-radius: 10px;
}

.modern-table tr:first-child td:first-child {
    border-top-left-radius: 10px;
}

.modern-table tr:last-child td:nth-child(1) {
    border-bottom-left-radius: 10px;
}

.modern-table tr:last-child td:last-child {
    border-bottom-right-radius: 10px;
}

/* First column text alignment and bold */
.modern-table td:first-child {
    font-weight: bold;
    text-align: left;
}




.custom-logo-card {
    background-color: white;
    border-radius: 15px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    padding: 20px;
    margin-bottom: 20px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    text-align: left;
    display: flex;
    flex-direction: column;
    align-items: left;
}

.custom-logo-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
}

.custom-partner-logo {
    width: 150px; /* Adjust size as needed */
    margin-bottom: 20px;
    border-radius: 10px;
}

.custom-logo-card p {
    color: #38648e;
    text-align: left;
    font-size: 14px;
    margin: 0;
}

.logo-row {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

@media (max-width: 768px) {
    .custom-logo-card {
        padding: 15px;
    }
    
    .custom-partner-logo {
        width: 100px;
        margin-bottom: 15px;
    }
    
    .custom-logo-card p {
        font-size: 13px;
    }
}

@media (max-width: 576px) {
    .custom-logo-card {
        padding: 10px;
    }
    
    .custom-partner-logo {
        width: 80px;
        margin-bottom: 10px;
    }
    
    .custom-logo-card p {
        font-size: 12px;
    }
}


.logo-row {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.custom-logo-card-new {
    background-color: white;
    border-radius: 15px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    padding: 20px;
    margin-bottom: 20px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    text-align: center;
    width: calc(25% - 20px); /* Adjust width to fit four logos per row with spacing */
    box-sizing: border-box;
}

.custom-logo-card-new:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
}

.custom-partner-logo-new {
    width: 100px; /* Adjust size as needed */
    margin-bottom: 10px;
    border-radius: 10px;
}

@media (max-width: 768px) {
    .custom-logo-card-new {
        width: calc(33.333% - 20px); /* Adjust width to fit three logos per row */
    }
}

@media (max-width: 550px) {
    .custom-logo-card-new {
        width: calc(50% - 20px); /* Adjust width to fit two logos per row */
    }
}

@media (max-width: 450px) {
    .custom-logo-card-new {
        width: calc(100% - 20px); /* Adjust width to fit one logo per row */
    }
}




.timeline-container {
    overflow-x: auto; /* Enable horizontal scrolling */
    padding-bottom: 20px; /* Add padding to show the scrollbar fully */
}

.timeline-container {
    scrollbar-width: thin;
    scrollbar-color: #4a7bab #e0e7ff;
}

.timeline-container::-webkit-scrollbar {
    width: 12px;
    height: 12px;
}

.timeline-container::-webkit-scrollbar-track {
    background: #e0e7ff;
    border-radius: 10px;
}

.timeline-container::-webkit-scrollbar-thumb {
    background-color: #4a7bab;
    border-radius: 10px;
    border: 3px solid #e0e7ff;
}

.timeline-container::-webkit-scrollbar-thumb:hover {
    background: #345a7a;
}

.timeline {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    width: max-content; /* Ensure it grows with items */
    list-style: none;
    padding: 0;
    margin: 0;
    position: relative;
    margin-top: 50px;
}

.timeline::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 0;
    height: 2px;
    width: 100%; /* Extend line to the full width */
    background: #67b5fb;
    transform: translateY(-50%);
    z-index: -1;
}

.timeline-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    flex: 0 0 auto;
    margin-right: 2rem;
}

.timeline-item:last-child {
    margin-right: 0;
}



.timeline-point {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 1;
    height: 1.5rem;
    width: 1.5rem;
    background-color: #7367f0;
    border-radius: 50%;
    border: 4px solid #fff;
    box-shadow: 0 0 0 2px #67b5fb;
}

.timeline-event {
    position: relative;
   
    border-radius: .375rem;
    padding: 1rem;
    min-width: 150px;
    text-align: center;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    font-size: 0.85rem;
}

.timeline p {
    margin-top: 20px;
    font-size: 14px;
}

.timeline .timeline-event-time {
    margin-bottom: 30px;
    color: #67b5fb;
}

.timeline-event-title {
    color: #38648e;
    font-weight: bold;
    margin-bottom: 0.5rem;
}

.timeline-event-time {
    color: #acaab1;
}

.timeline-point-primary {
    background-color: #7367f0;
}

.timeline-point-success {
    background-color: #28c76f;
}

.timeline-point-info {
    background-color: #00bad1;
}

.timeline-point-warning {
    background-color: #ff9f43;
}

.timeline-point-danger {
    background-color: #ff4c51;
}


@media (max-width: 767.98px) {
    .timeline-container {
        padding-bottom: 10px; /* Reduce padding */
    }

    .timeline {
        margin-top: 25px; /* Reduce top margin */
    }

    .timeline-item {
        margin-right: 1rem; /* Reduce space between items */
    }

    .timeline-point {
        height: 1rem; /* Smaller points */
        width: 1rem;
        border: 3px solid #fff; /* Adjust border size */
        box-shadow: 0 0 0 1px #67b5fb; /* Adjust shadow */
    }

    .timeline-event {
        padding: 0.5rem; /* Reduce padding */
        min-width: 100px; /* Reduce minimum width */
        font-size: 0.75rem; /* Reduce font size */
    }

    .timeline p {
        margin-top: 10px; /* Reduce top margin */
        font-size: 12px; /* Reduce font size */
    }

    .timeline .timeline-event-time {
        margin-bottom: 15px; /* Reduce bottom margin */
        font-size: 0.75rem; /* Reduce font size */
    }

    .timeline-event-title {
        font-size: 0.85rem; /* Reduce font size */
    }
}


.contact-info-card {
    background-color: #E8F0FB;
    border: 1px solid #ddd;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    padding: 20px;
    margin: 20px 0;
    width: 100%;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.contact-info-card .contact-title {
    font-size: 26px;
    font-weight: bolder;
    text-align: center;
    margin-bottom: 20px;
}

.contact-info-card .contact-details {
    font-size: 16px;
    text-align: center;
}

.contact-info-card .contact-details a {
    color: #2766DA; /* Use the main color */
    text-decoration: none;
    font-weight: bold;
}

.contact-info-card .contact-details a:hover {
    text-decoration: underline;
}




.custom-contact-card {
    background-color:#E9F0FB;
    color:  #67b5fb;
    border-radius: 8px;
    padding: 20px;
    max-width: 600px;
    width: 100%;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

.custom-contact-card h2 {
    margin-bottom: 15px;
}

.custom-contact-card p {
    margin-bottom: 15px;
}

.custom-contact-card .email-link {
    color: #67b5fb;
    text-decoration: underline;
}

.custom-contact-card .email-link:hover {
    text-decoration: none;
}

.custom-contact-card .icon-link {
    color:  #67b5fb;
    text-decoration: none;
    margin: 0 5px;
    font-size: 1.5em;
}

.custom-contact-card .icon-link:hover {
    color: #2766DA;
}

.floating-button {
    position: fixed;
    bottom: 20px;
    right: 20px;
    background-color: #38648e;
    color: white;
    border-radius: 20%;
    width: 150px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.2);
    font-size: 14px;
    text-align: center;
    cursor: pointer;
    z-index: 1000;
}
.modal-content {
    max-width: 90%;
    margin: auto;
}

.status-badge {
    position: absolute;
    top: 10px;
    left: 10px;
    padding: 5px 10px;
    color: white;
    background-color: #FF5733;
    border-radius: 5px;
    font-size: 0.8rem;
}

.status-in-progress {
    background-color: #FFC300;
}
.status-ended {
    background-color: #28A745;
}


.status-badge1 {
    position: absolute;
    top: 10px;
    left: 10px;
    padding: 5px 10px;
    color: white;
    border-radius: 5px;
    font-size: 0.8rem;
}
.status-active {
    background-color: #28a745;
}
.status-complete {
    background-color: #007bff;
}

.logo-carousel-container {
    width: 100%;
    text-align: center;
}

.logo-carousel-title {
    color: #38648e;
    font-weight: bold;
    margin-bottom: 20px;
}

.logo-carousel-group {
    display: none;
    transition: opacity 0.5s ease-in-out;
}

.logo-carousel-group.active {
    display: block;
    opacity: 1;
}

.logo-carousel-item {
    text-align: center;
    padding: 10px;
}

.logo-carousel-image {
    max-width: 80%;
    height: auto;
    margin: 0 auto;
    transition: transform 0.3s;
}

.logo-carousel-image:hover {
    transform: scale(1.1);
}