@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Lobster&display=swap');

:root {
    --main-color: #004177;
    --ara-color: #f78012;

    --title: "Lobster", sans-serif;
}

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

html,
body {
    overflow-x: hidden;
}


body {
    font-family: "Poppins", sans-serif !important;
    margin: 0;
    padding: 0;
    width: 100%;
    overflow-x: hidden;
    background-color: #fff;
    position: relative;
}

a {
    text-decoration: none !important;
}

ul {
    padding-left: 0 !important;
    margin-bottom: 0rem !important;
}

li {
    list-style: none;
}

.main-menu {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 1rem;
}

.info-area {
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

.social-area a {
    color: var(--main-color);
    font-size: 1.2rem;
    margin-right: .5rem;
}

.info-area a {
    color: var(--main-color);
    font-size: 1rem;
    margin-right: 1rem;
}

.search-btn button {
    background: none;
    box-shadow: none;
    border: none;
    color: var(--main-color);
    font-size: 1.2rem;
    margin: 0;
    padding: 0;
}

.sub-menu {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    margin-top: 1.5rem;
    background-color: var(--main-color);
    border-radius: .675rem;
    padding: .5rem 1rem;
}

.blue-area .navbar-brand {
    width: 11rem;
}

.blue-area .nav-link {
    color: #fff;
}

.blue-area .nav-link:hover {
    color: var(--ara-color);
}

.donation-btn a {
    color: #fff;
    background-color: var(--ara-color);
    padding: .675rem 1.2rem;
    border-radius: .5rem;
}

.slider-area {
    margin-top: 1.5rem;
}

.slider-area .splide__slide {
    position: relative;
}

.slider-area .splide__slide img {
    border-radius: .675rem;
    width: 100%;
    height: 35rem;
    object-fit: cover;
}

.title {
    font-family: var(--title);
}

.df-area {
    background-color: #fff;
    border-radius: .675rem;
    border: 1px solid #0041771a;
    height: 100%;
    padding: 2.5rem 1.2rem;
    padding-top: 1.5rem;
    box-shadow: 0 0 10px 2px #002d520c;
    position: relative;
}

.df-area h2 {
    color: var(--main-color);
}

.df-area h2 i {
    color: var(--ara-color);
}

.df-area p {
    font-size: .85rem;
    border-bottom: 1px solid #004177;
    padding-bottom: 1rem;
}

.don-tur h6 {
    color: var(--main-color);
    font-weight: 600;
    text-transform: uppercase;
}

.don-tur select {
    padding: .5rem .5rem;
    border: 1px solid #0041771a;
    box-shadow: 0 0 7px 1px #002d520c;
    border-radius: .25rem;
    width: 100%;
}

.don-price {
    margin-top: 1.5rem;
}

.don-price h6 {
    color: var(--main-color);
    font-weight: 600;
    text-transform: uppercase;
}

.don-price input {
    padding: .5rem .5rem;
    border: 1px solid #0041771a;
    box-shadow: 0 0 7px 1px #002d520c;
    border-radius: .25rem;
    width: 100%;
}

.don-btn {
    position: absolute;
    bottom: 3rem;
    left: 50%;
    transform: translateX(-50%);
}

.don-btn button {
    background-color: var(--ara-color);
    border-radius: .675rem;
    color: #fff;
    font-weight: 500;
    border: 1px solid var(--ara-color);
    width: 100%;
}

#main-splide .splide__arrow {
    opacity: 0;
    transition: all .3s ease;
}

#main-splide:hover .splide__arrow {
    opacity: 1;
}

#main-splide .splide__arrow--next,
#main-splide .splide__arrow--prev {
    background-color: #fff;
    box-shadow: 0 0 5px 1px #00417711;
}

#main-splide .splide__arrow--next svg,
#main-splide .splide__arrow--prev svg {
    fill: var(--ara-color);
}

#news-splide .splide__arrow {
    opacity: 0;
    transition: all .3s ease;
}

#news-splide:hover .splide__arrow {
    opacity: 1;
}

#news-splide .splide__arrow--next,
#news-splide .splide__arrow--prev {
    background-color: #fff;
    box-shadow: 0 0 5px 1px #00417711;
}

#news-splide .splide__arrow--next svg,
#news-splide .splide__arrow--prev svg {
    fill: var(--ara-color);
}

.cat-card {
    width: 100%;
    height: 100%;
    padding: .5rem 1rem;
    border: 1px solid #00417713;
    background-color: #fff;
    text-align: center;
    border-radius: .675rem;
    transition: all .3s ease;
}

.cat-card:hover {
    color: #fff;
    background: linear-gradient(45deg, #004177, #002544);
    transition: all .3s ease;
}

.cat-card:hover img {
    filter: brightness(.5) invert(1);
    transition: all .3s ease;
}

.cat-card:hover h2 {
    color: #fff;
    transition: all .3s ease;
}

.cat-card img {
    width: 5rem;
    height: 5rem;
    object-fit: contain;
}

.cat-card h2 {
    color: var(--main-color);
    font-size: 1rem;
    margin-top: 1rem;
}

.cate-area {
    margin-top: 2.5rem;
}

#category-splide .splide__slide {
    margin: 0rem .5rem;
}

#category-splide .splide__arrow {
    opacity: 0;
    transition: all .3s ease;
}

#category-splide:hover .splide__arrow {
    opacity: 1;
}

#category-splide .splide__arrow--next,
#category-splide .splide__arrow--prev {
    background-color: #fff;
    box-shadow: 0 0 5px 1px #00417711;
}

#category-splide .splide__arrow--next svg,
#category-splide .splide__arrow--prev svg {
    fill: var(--ara-color);
}

/*ds*/
#project-splide .splide__arrow {
    opacity: 0;
    transition: all .3s ease;
}

#project-splide:hover .splide__arrow {
    opacity: 1;
}

#project-splide .splide__arrow--next,
#project-splide .splide__arrow--prev {
    background-color: #fff;
    box-shadow: 0 0 5px 1px #00417711;
}

#project-splide .splide__arrow--next svg,
#project-splide .splide__arrow--prev svg {
    fill: var(--ara-color);
}

.faaliyet-area {
    margin-top: 2.5rem;
}

.title-areas h2 {
    color: var(--main-color);
    font-size: 3rem;
    text-align: center;
}

.title-areas p {
    color: var(--main-color);
    font-size: 1rem;
    text-align: center;
}

.event-card {
    width: 100%;
    height: 100%;
    border: 1px solid #00254418;
    border-radius: .675rem;
    box-shadow: 0 0 7px 3px #0025440a;
    margin-bottom: 2.5rem;
    position: relative;
}

.event-card img {
    width: 100%;
    object-fit: cover;
    height: 16rem;
    border-radius: .675rem .675rem 0 0;
}

.event-card .content-card {
    padding: 1rem 2rem;
}

.event-card .content-card h2 {
    color: #002544;
    font-size: 1.8rem;
    font-weight: 400;
    margin-bottom: 1rem;
}

.event-card .content-card p {
    color: #002544;
    font-size: .85rem;
    font-weight: 300;
}

.don-btn-event {
    position: absolute;
    bottom: 2rem;
    left: 50%;
    transform: translateX(-50%);
}


.don-btn-event a {
    padding: .675rem 2rem;
    border-radius: .5rem;
    background-color: var(--ara-color);
    color: #fff;
    text-align: center;
    transition: all .3s ease;
}

.don-btn-event a:hover {
    background-color: var(--main-color);
}

.relative-img {
    position: relative;
}

.dropdown-menu {
    border: none !important;
    box-shadow: 0 0 7px 3px #0025440a !important;
    border-bottom: 3px solid var(--ara-color) !important;
}

.project-area {
    margin-top: 5rem;
    background-image: url(../img/back-pro.png);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    background-clip: border-box;
    padding: 2.5rem 0;
}

.project-area .title-areas h2,
.project-area .title-areas p {
    text-align: start !important;
}

#project-splide img {
    width: 100%;
    height: 25rem;
    object-fit: cover;
}

.bg-info.load {
    background-color: var(--main-color) !important;
}

.bg-success.load {
    font-size: .85rem !important;
    background-color: var(--main-color) !important;
    border-radius: 100rem !important;
}

.guncelProjeGidis {
    background-color: var(--ara-color);
    color: #fff;
    padding: .5rem 1.5rem;
    border-radius: .5rem;
}

.project-content h2 {
    color: var(--main-color);
    font-size: 1.2rem;
    font-weight: 600;
}

.btn-outline-primary {
    border-color: var(--main-color) !important;
    color: var(--main-color) !important;
}

.btn-outline-primary:hover {
    background-color: var(--main-color) !important;
    color: #fff !important;
}

.margin-patt {
    margin-top: 1.5rem;
}

.news-area {
    margin-top: 5rem;
}

.news-card {
    background-color: #fff;
    border-radius: .675rem;
    height: 100%;
    width: 100%;
    border: 1px solid #0041771a;
    box-shadow: 0 0 10px 2px #002d520c;
}

.news-card img {
    width: 100%;
    height: 18rem;
    object-fit: cover;
    border-radius: .675rem .675rem 0 0;
}

#news-splide {
    margin-top: 2.5rem;
}

.news-card .content-card {
    padding: 1rem 2rem;
}

.news-card .content-card h2 {
    font-size: 1.3rem;
    font-weight: 600;
    color: var(--main-color);
}

.news-card .content-card p {
    font-size: .85rem;
    font-weight: 300;
    color: var(--main-color);
    margin: 1rem 0;
}

footer {
    background-color: var(--main-color);
    padding: 4rem 0;
    padding-bottom: 1rem;
    background-image: url(../img/back-pro.png);
    background-position: left bottom;
    background-repeat: no-repeat;
    background-size: cover;
    background-clip: border-box;
}

.id-footer img {
    width: 100%;
    margin-bottom: 1rem;
}

.id-footer p {
    font-size: .85rem;
    color: #fff;
    padding-top: 1rem;
    border-top: 2px solid #ffffff94;
}

.id-footer p span {
    font-weight: 600;
    font-size: 1rem;
}

.id-footer h6 {
    color: #fff;
    font-size: 1.2rem;
    font-weight: 600;
}

.id-footer a {
    color: #fff;
    font-weight: 400;
}

.id-footer a:hover {
    color: var(--ara-color);
}

/* footer .col-lg-4 {
    padding: 1rem 2.5rem;
}

footer .col-lg-4:first-child {
    padding-left: 0rem;
}

footer .col-lg-4:last-child {
    padding-right: 0rem;
} */

.sub-footer {
    background-color: var(--ara-color);
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius: .675rem;
    padding: 1rem 2rem !important;
    margin-top: 1.5rem !important;
}

.sub-footer p {
    color: #fff;
    margin: 0;
    font-size: .85rem;
}

.sub-footer a {
    color: #fff;
    margin-right: .5rem;
}

.sub-footer a:hover {
    color: var(--main-color);
}

.designer-tag {
    display: flex;
    justify-content: center;
    margin: 0rem auto;
    margin-top: 1rem;
}

.designer-tag a {
    color: #fff;
    font-size: .85rem;
}

.offcanvas-body img {
    border-radius: 5px;
}

.list-group-item {
    background-color: #1c1f24;
    color: #fff;
    border: none;
}

.list-group-item+.list-group-item {
    border-top: 1px solid #2b2e34;
}

.btn-outline-light:hover {
    background-color: #fff;
    color: #000;
}

.my-bg-dark {
    background: linear-gradient(45deg, #012350, #004177) !important;
}

.my-bg-dark h5 {
    font-family: var(--title);
    font-size: 2rem;
    color: #fff;
}

.my-bg-dark strong {
    color: #fff;
}

.my-bg-dark .btn-success {
    background-color: var(--ara-color) !important;
    border-color: var(--ara-color) !important;
    border-radius: .5rem;
}

.btn-primary {
    background-color: var(--main-color) !important;
    border-color: var(--main-color) !important;
}

.btn-success {
    background-color: var(--ara-color) !important;
    border-color: var(--ara-color) !important;
}

header {
    position: fixed;
    left: 50%;
    width: 100%;
    top: 0;
    z-index: 999;
    transform: translateX(-50%);
    background-color: rgba(255, 255, 255, 0.493);
    /* yarı saydam beyaz */
    backdrop-filter: blur(5px);
    /* blur efekti */
    -webkit-backdrop-filter: blur(5px);
}


.mar-menu {
    display: flex;
    margin-bottom: 12rem;
}


.offcanvas.offcanvas-end {
    z-index: 99999999999;
}