* {

    margin: 0;

    padding: 0;

    font-family: Manrope, sans-serif;

}



body {

    display: flex;

    flex-direction: column;

    min-height: 100vh;

}



main {

    flex: 1;

}



li {

    list-style: none;

    text-decoration: none;

}



p {

    margin: 0;

    padding: 0;

}



.navbar-nav .nav-link {

    color: #0c0c10;

    text-align: center;

    font-family: Manrope;

    font-size: 16px;

    font-style: normal;

    font-weight: 600;

    line-height: normal;

}

.nav-link.active {

    color: #00008B !important;

}

.main-color {

    color: #00008B;

}

header .top-text-header {

    color: #000;

    text-align: center;

    font-family: Manrope;

    font-size: 12.114px;

    font-style: normal;

    font-weight: 600;

    line-height: normal;

}

.header-logo {

    width:15% !important;

}

.toggler-nav {

    filter: brightness(0);

}

header .sub-text-header {

    color: #00008B;

    text-align: center;

    font-family: Manrope;

    font-size: 22.498px;

    font-style: normal;

    font-weight: 600;

    line-height: normal;

}



header .whatsapp-text {

    color: #38BD6A;

    text-align: center;

    font-family: Manrope;

    font-size: 22.498px;

    font-style: normal;

    font-weight: 600;

    line-height: normal;

}



main .section-1 {

    height: 860px;

    overflow: hidden;

    position: relative;

}



main .section-1:before {

    content: "";

    position: absolute;

    width: 100%;

    height: 100%;

    background: #000;

    opacity: 60%;

}



.btn-eczane {

    border-radius: 0px 0px 15px 15px;

    background: #FFF;

    transition: 500ms;

}



.btn-eczane:hover {

    border-radius: 0px 0px 15px 15px;

    background: #e61417 !important;

    transition: 500ms;

    transform: translate(0) !important;

}



.btn-eczane:hover p {

    color: #FFF;

    transition: 500ms;

}



.btn-eczane:hover img {

    filter: brightness(15);

    transition: 500ms;

}



.btn-eczane p {

    color: #E61417;

    text-align: center;

    font-family: Manrope;

    font-size: 17.858px;

    font-style: normal;

    font-weight: 600;

    line-height: normal;

}



.eczane-modal-close-button {

    position: absolute;

    top: 15px;

    right: 20px;

    filter: invert(1);

}



.form-card {

    border-radius: 16px;

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

    box-shadow: 0px 4px 150px 0px rgba(0, 0, 0, 0.25) inset;

    padding: 1.3rem;

}



.kurye-top-text {

    color: #FFF;

    text-align: center;

    font-family: Manrope;

    font-size: 36px !important;

    font-style: normal;

    font-weight: 800;

    line-height: normal;

}



.kurye-sub-text {

    color: #C5C5C5;

    text-align: center;

    font-family: Manrope;

    font-size: 18px;

    font-style: normal;

    font-weight: 600;

    line-height: normal;

}



.form-gameixa-input {

    padding-left: 4rem;

    height: 54px;

}



.absolute-icon {

    position: absolute;

    top: 50%;

    left: 1rem;

    transform: translateY(-50%);

}



.btn-deliver.active {

    color: #FFF;

    border-radius: 12px;

    background: #00008B;

    border: none;

    padding: 16px 24px;

}



.btn-deliver {

    color: #FFF;

    border-radius: 12px;

    border: #00008B;

    border: none;

    padding: 16px 24px;

}



.btn-deliver.active:hover {

    color: #FFF !important;

    border-radius: 12px;

    background: #00008B !important;

    border: #F35C00;

    border: none;

    padding: 16px 24px;

}



.btn-deliver {

    color: #FFF;

    border-radius: 12px;

    border: 2px solid #00008B !important;

    border: none;

    padding: 16px 24px;

}



.btn-deliver:hover {

    color: #FFF !important;

    border-radius: 12px;

    background-color: #00008B !important;

    border: none;

    padding: 16px 24px;

}



.btn-deliver-sub-button {

    background-color: #00008B !important;

    margin-top: .75rem;

    color: #FFF !important;

    padding: 12px;

    width: 60%;

    font-size: 18px;

}



.btn-deliver-sub-button:hover {

    background-color: #00008B !important;

    margin-top: .75rem;

    color: #FFF !important;

    padding: 12px;

    width: 60%;

    font-size: 18px;

}

.collapse:not(.show) {

    display: none;

}

.hidden {

    display: none;

}

.show {

    display: block;

}

.btn-whatsapp {

    border-radius: 12px;

    background: #38BD6A;

    color: #FFF;

    padding: 16px 24px;

    font-size: 18px;

    font-weight: 600;

    line-height: normal;

    text-align: center;

    text-decoration: none;

    display: inline-block;

    transition: 500ms;

}

.btn-whatsapp:hover {

    border-radius: 12px;

    background: #38BD6A !important;

    color: #FFF !important;

    padding: 16px 24px;

    font-size: 18px;

    font-weight: 600;

    line-height: normal;

    text-align: center;

    text-decoration: none;

    display: inline-block;

    transition: 500ms;

}

.total-distance {

    color: #FFF;

    text-align: center;

    font-family: Manrope;

    font-size: 36px;

    font-style: normal;

    font-weight: 800;

    line-height: normal;

}

.pick-adress {

    color: #D6D6D6;

    text-align: start;

    font-family: Manrope;

    font-size: 16px;

    font-style: normal;

    font-weight: 700;

    line-height: normal;

}



.pick-adress-sub-div:before {

    content: "";

    position: absolute;

    width: 2px;

    height: 38px;

    background: #515151;

    left: 16px;

    top: 5px;

}

.vip {

    animation: Color 4s linear infinite;

    -webkit-animation: Color 4s ease-in-out infinite;

}

.section-2-left {

    height: 500px;

    background-size: contain;

    background-repeat: no-repeat;

    width: 500px;

    border-radius: 32px;

    position: relative;

}

.col-lg-6.section-2-left:before {

    content: "";

    background-image: url(/app/main/theme/assets/img/extras/car.png);

    position: absolute;

    width: 75%;

    height: 50%;

    z-index: 111;

    background-size: 100% 100%;

    object-fit: cover;

    right: -3rem;

    bottom: -3rem;

}

.c5-color {

    color: #C5C5C5;

}

.absolute-right-icon {

    position: absolute;

    top: 50%;

    right: 1rem;

    transform: translateY(-50%);

}

.wrapper {

    display: flex;

    margin-top:1.5rem;

}



.cta {

    display: flex;

    padding: 10px 25px;

    text-decoration: none;

    font-family: 'Poppins', sans-serif;

    font-size: 40px;

    color: white;

    background: #00008B;

    transition: 1s;

    box-shadow: 6px 6px 0 #ad4607;

    transform: skewX(-15deg);

}

span.read-more-text {

    font-size: 20px;

    display: flex;

    align-items: center;

}

.cta:focus {

    outline: none;

}



.cta:hover {

    transition: 0.5s;

    box-shadow: 10px 10px 0 #FBC638;

}



.cta span:nth-child(2) {

    transition: 0.5s;

    margin-right: 0px;

}



.cta:hover  span:nth-child(2) {

    transition: 0.5s;

    margin-right: 45px;

}



.cta span {

    transform: skewX(15deg)

}



.cta  span:nth-child(2) {

    width: 20px;

    margin-left: 30px;

    position: relative;

    top: 12%;

}



/**************SVG****************/



path.one {

    transition: 0.4s;

    transform: translateX(-60%);

}



path.two {

    transition: 0.5s;

    transform: translateX(-30%);

}



.cta:hover path.three {

    animation: color_anim 1s infinite 0.2s;

}



.cta:hover path.one {

    transform: translateX(0%);

    animation: color_anim 1s infinite 0.6s;

}



.cta:hover path.two {

    transform: translateX(0%);

    animation: color_anim 1s infinite 0.4s;

}

.icon-header {

    width: 50px;

    height: 50px;

    display: flex;

    align-items: center;

    background: #9c9c9c;

    border-radius: 500px;

    justify-content: center;

}

.card {

    border-radius: 8px !important;

    border:none !important;

    box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px !important;

}

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {

    margin-top: 0;

    margin-bottom: 0.5rem;

    font-weight: 700;

    color: #4b4b4b;

    word-spacing: 0.1rem;

    letter-spacing: -0.01rem;

}

.why-company-text {

    color: #4b4b4b;

    font-family: Manrope;

    font-size: 48px !important;

    font-style: normal;

    font-weight: 600;

    line-height: normal;

}

.why-company-text strong {

    color: #00008B;

    font-family: Manrope;

    font-size: 48px !important;

    font-style: normal;

    font-weight: 600;

    line-height: normal;

}

.why-company-div:before {

    content: "NEDEN";

    position: absolute;

    top: -5rem;

    bottom: 0;

    font-size: 120px;

    opacity: 7%;

    font-weight: 800;

}

.text-gray-2 {

    color: #b5b5b5;

}

.why-company-card {

    max-height: 600px;

    min-height: 400px;

}

.maxh-200 {

    min-height: 200px;

}





.service-text {

    color: #4b4b4b;

    font-family: Manrope;

    font-size: 48px !important;

    font-style: normal;

    font-weight: 600;

    line-height: normal;

}

.service-text strong {

    color: #00008B;

    font-family: Manrope;

    font-size: 48px !important;

    font-style: normal;

    font-weight: 600;

    line-height: normal;

}

.service-div:before {

    content: "HİZMETLERİMİZ";

    position: absolute;

    top: -5rem;

    bottom: 0;

    font-size: 120px;

    opacity: 7%;

    font-weight: 800;

}

.services-button.whatsapp {

    background-color: #1b9f7f !important;

    font-weight: bold;

}

.services-button.phone {

    background-color: #00008B !important;

    font-weight: bold;

}

footer .nav-item a {

    font-size: 18px;

}

p.footer-title-text {

    font-size: 24px;

    color: #FFF;

    margin-bottom: 1rem;

    margin-top: 1rem;

}

.blog-div:before {

    content: "HABERLER";

    position: absolute;

    top: -5rem;

    bottom: 0;

    font-size: 120px;

    opacity: 7%;

    font-weight: 800;

}

.blog-card {

    max-height: 600px;

    min-height: 400px;

}

.total-div:before {

    content: "TOPLAM";

    position: absolute;

    top: -5rem;

    bottom: 0;

    font-size: 120px;

    opacity: 7%;

    font-weight: 800;

}

.background-cover {

    background-size: cover;

    background-repeat: no-repeat;

    background-position: center;

}

.service-card {

    max-height: 600px;

    min-height: 400px;

}



footer {

    background-color: #1e1f20;

}

.footer-last .main {

    display: flex;

    flex-direction: column;

    gap: 0.5em;

}



.footer-last .up {

    display: flex;

    flex-direction: row;

    gap: 0.5em;

}



.footer-last .down {

    display: flex;

    flex-direction: row;

    gap: 0.5em;

}



.footer-last .card1 {

    width: 90px;

    height: 90px;

    outline: none;

    border: none;

    background: white;

    border-radius: 90px 5px 5px 5px;

    box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;

    transition: .2s ease-in-out;

    display: flex;

    align-items: center;

    justify-content: center;

}



.footer-last .instagram {

    margin-top: 1.5em;

    margin-left: 1.2em;

    fill: #cc39a4;

}



.footer-last .card2 {

    width: 90px;

    height: 90px;

    outline: none;

    border: none;

    background: white;

    border-radius: 5px 90px 5px 5px;

    box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;

    transition: .2s ease-in-out;

    display: flex;

    align-items: center;

    justify-content: center;

}



.footer-last .twitter {

    margin-top: 1.5em;

    margin-left: -.9em;

    fill: #03A9F4;

}



.footer-last .card3 {

    width: 90px;

    height: 90px;

    outline: none;

    border: none;

    background: white;

    border-radius: 5px 5px 5px 90px;

    box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;

    transition: .2s ease-in-out;

    display: flex;

    align-items: center;

    justify-content: center;

}



.footer-last .github {

    margin-top: -.6em;

    margin-left: 1.2em;

}



.footer-last .card4 {

    width: 90px;

    height: 90px;

    outline: none;

    border: none;

    background: white;

    border-radius: 5px 5px 90px 5px;

    box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;

    transition: .2s ease-in-out;

    display: flex;

    align-items: center;

    justify-content: center;

}



.footer-last .discord {

    margin-top: -.9em;

    margin-left: -1.2em;

    fill: #c20000;

}



.footer-last .card1:hover {

    cursor: pointer;

    scale: 1.1;

    background-color: #cc39a4;

}



.footer-last .card1:hover .instagram {

    fill: white;

}



.footer-last .card2:hover {

    cursor: pointer;

    scale: 1.1;

    background-color: #03A9F4;

}



.footer-last .card2:hover .twitter {

    fill: white;

}



.footer-last .card3:hover {

    cursor: pointer;

    scale: 1.1;

    background-color: #26c943;

}

.footer-last .card3 .github {

    fill: #26c943;

    stroke:#26c943

}

.footer-last .card3:hover .github {

    fill: #00520f;

    stroke:#00520f;

}





.footer-last .card4:hover {

    cursor: pointer;

    scale: 1.1;

    background-color: #620000;

}



.footer-last .card4:hover .discord {

    fill: #c20000;

}



.services-button {

    position: relative;

    margin: 0;

    padding: 0.8em 1em;

    outline: none;

    text-decoration: none;

    display: flex;

    justify-content: center;

    align-items: center;

    cursor: pointer;

    border: none;

    text-transform: uppercase;

    background-color: #333;

    border-radius: 10px;

    color: #fff;

    font-weight: 300;

    font-size: 18px;

    font-family: inherit;

    z-index: 0;

    overflow: hidden;

    transition: all 0.3s cubic-bezier(0.02, 0.01, 0.47, 1);

}



.services-button:hover {

    animation: sh0 0.5s ease-in-out both;

}



@keyframes sh0 {

    0% {

        transform: rotate(0deg) translate3d(0, 0, 0);

    }



    25% {

        transform: rotate(7deg) translate3d(0, 0, 0);

    }



    50% {

        transform: rotate(-7deg) translate3d(0, 0, 0);

    }



    75% {

        transform: rotate(1deg) translate3d(0, 0, 0);

    }



    100% {

        transform: rotate(0deg) translate3d(0, 0, 0);

    }

}



.services-button:hover span {

    animation: storm 0.7s ease-in-out both;

    animation-delay: 0.06s;

}



.services-button::before,

.services-button::after {

    content: '';

    position: absolute;

    right: 0;

    bottom: 0;

    width: 100px;

    height: 100px;

    border-radius: 50%;

    background: #7a2012;

    opacity: 0;

    transition: transform 0.15s cubic-bezier(0.02, 0.01, 0.47, 1), opacity 0.15s cubic-bezier(0.02, 0.01, 0.47, 1);

    z-index: -1;

    transform: translate(100%, -25%) translate3d(0, 0, 0);

}

.services-button:hover {

    background-color: #00008B !important;

    transition: 500ms;

}

.services-button:hover::before,

.services-button:hover::after {

    opacity: 0.15;

    transition: transform 0.2s cubic-bezier(0.02, 0.01, 0.47, 1), opacity 0.2s cubic-bezier(0.02, 0.01, 0.47, 1);

}



.services-button:hover::before {

    transform: translate3d(50%, 0, 0) scale(0.9);

}



.services-button:hover::after {

    transform: translate(50%, 0) scale(1.1);

}

.maxh-160 {

    min-height: 160px;

}

.blur-card {

    border-radius: 12px;

    background: rgb(0 0 0 / 60%);

    backdrop-filter: blur(7.5px);

    height: 100px;

    padding: 1.3rem;

}

.contact-left-icon {

background-color: #00008B;

color: #fff;

width: 60px;

height: 60px;

font-size: 30px;

border-radius: 50px;

text-align: center;

box-shadow: 2px 2px 3px #999;

display: flex;

align-items: center;

justify-content: center;

transform: translatey(0px);

animation: pulse 2s infinite;

box-shadow: 0 0 0 0 #f6ab36;

-webkit-animation: shadow 2s infinite cubic-bezier(0.66, 0, 0, 1);

-moz-animation: shadow 2s infinite cubic-bezier(0.66, 0, 0, 1);

-ms-animation: shadow 2s infinite cubic-bezier(0.66, 0, 0, 1);

animation: shadow 2s infinite cubic-bezier(0.66, 0, 0, 1);

font-weight: normal;

font-family: sans-serif;

text-decoration: none !important;

transition: all 1000ms ease-in-out;

}

.float-left {

    position: fixed;

    bottom: 20px;

    left: 10px;

    width: 100px;

    height: 100px;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    z-index: 1000;

}



.contact-left-icon {

background-color: #00008B;

color: #fff;

width: 60px;

height: 60px;

font-size: 30px;

border-radius: 50px;

text-align: center;

box-shadow: 2px 2px 3px #999;

display: flex;

align-items: center;

justify-content: center;

transform: translatey(0px);

animation: pulse 2s infinite;

box-shadow: 0 0 0 0 #00008B;

-webkit-animation: shadow 2s infinite cubic-bezier(0.66, 0, 0, 1);

-moz-animation: shadow 2s infinite cubic-bezier(0.66, 0, 0, 1);

-ms-animation: shadow 2s infinite cubic-bezier(0.66, 0, 0, 1);

animation: shadow 2s infinite cubic-bezier(0.66, 0, 0, 1);

font-weight: normal;

font-family: sans-serif;

text-decoration: none !important;

transition: all 1000ms ease-in-out;

}

.float-left {

    position: fixed;

    bottom: 20px;

    left: 10px;

    width: 100px;

    height: 100px;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    z-index: 1000;

}

.contact-right-icon {

background-color: #42db87;

color: #fff;

width: 60px;

height: 60px;

font-size: 30px;

border-radius: 50px;

text-align: center;

box-shadow: 2px 2px 3px #999;

display: flex;

align-items: center;

justify-content: center;

transform: translatey(0px);

animation: pulse 2s infinite;

box-shadow: 0 0 0 0 #42db87;

-webkit-animation: shadow 2s infinite cubic-bezier(0.66, 0, 0, 1);

-moz-animation: shadow 2s infinite cubic-bezier(0.66, 0, 0, 1);

-ms-animation: shadow 2s infinite cubic-bezier(0.66, 0, 0, 1);

animation: shadow 2s infinite cubic-bezier(0.66, 0, 0, 1);

font-weight: normal;

font-family: sans-serif;

text-decoration: none !important;

transition: all 1000ms ease-in-out;

}

.float-right {

    position: fixed;

    bottom: 20px;

    right: 10px;

    width: 100px;

    height: 100px;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    z-index: 1000;

}







/* SVG animations */

@keyframes shadow {

    100% {

    box-shadow: 0 0 0 15px rgba(232, 76, 61, 0);

}

}



@keyframes color_anim {

    0% {

        fill: white;

    }

    50% {

        fill: #FBC638;

    }

    100% {

        fill: white;

    }

}

@keyframes Color{

    0%{

        color:#A0D468;

    }



    20%{

        color:#4FC1E9;

    }



    40%{

        color:#FFCE54;

    }



    60%{

        color:#FC6E51;

    }



    80%{

        color:#ED5565;

    }



    100%{

        color:#AC92EC;

    }

}



@-moz-keyframes Color{

    0%{

        color:#A0D468;

    }



    20%{

        color:#4FC1E9;

    }



    40%{

        color:#FFCE54;

    }



    60%{

        color:#FC6E51;

    }



    80%{

        color:#ED5565;

    }



    100%{

        color:#AC92EC;

    }

}



@-webkit-keyframes Color{

    0%{

        color:#A0D468;

    }



    20%{

        color:#4FC1E9;

    }



    40%{

        color:#FFCE54;

    }



    60%{

        color:#FC6E51;

    }



    80%{

        color:#ED5565;

    }



    100%{

        color:#AC92EC;

    }

}



.iti {

    width: 100%;

}

div#offcanvasWithBothOptions {

    z-index: 111111111;

}