body{ width: 100%; height: 100%; padding: 0; margin: 0; color: #111; background: #fff; font-family: 'Circe Rounded'; font-size: 16px; font-weight: 400; overflow: auto; overflow-x: hidden;}
.loading{ position: fixed; width: 100%; height: 100vh; background: #fff; top: 0; left: 0; z-index: 9999999999999999;}
.container{ max-width: 1550px !important; }
a{ text-decoration: none !important; color: currentColor;}

/* Top Section */
.top-section{ background: url(../images/top-bg.jpg) #9a10a9  no-repeat center bottom; background-size: 100%; color: #fff; font-size: 13px; font-weight: 300; padding: 15px 0;}
.top-section .address{ padding-left: 24px; background: url(../images/pin.svg) no-repeat center left; background-size: 18px;}

.social-media{ display: inline-flex; align-items: center;}
.social-media a{ display: block; width: 24px; height: 24px; margin-left: 10px; transform: scale(0.90);}
.social-media a.facebook{ width: 16px; background: url(../images/social/facebook.png) no-repeat center; background-size: 16px 24px;}
.social-media a.whatsapp{ background: url(../images/social/whatsapp.png) no-repeat center; background-size: 24px;}
.social-media a.instagram{ background: url(../images/social/instagram.png) no-repeat center; background-size: 24px;}
.social-media a.twitter{ background: url(../images/social/twitter.png) no-repeat center; background-size: 24px;}

/* Header Section */
.header-section{ width: 100%; padding: 15px 0;}
.header-section a.mail{ display: flex; align-items: center; font-size: 16px;}
.header-section a.mail::before{ content: ""; position: relative; margin-right: 10px; display: block; width: 40px; height: 40px; border-radius: 100%; background: url(../images/mail.png) #9a10a9 no-repeat center; background-size: 24px;}

.header-section a.phone{ display: flex; align-items: center; font-size: 19px; font-weight: 800; color: #0068fa;}
.header-section a.phone::after{ content: ""; position: relative; margin-left: 10px; display: block; width: 40px; height: 40px; border-radius: 100%; background: url(../images/phone.png) #9a10a9 no-repeat center; background-size: 24px;}

.top-menu{ width: auto;}
.top-menu ul{ list-style: none; padding: 0; margin: 0; display: flex; align-items: center;}
.top-menu ul li{ position: relative; width: auto;}
.top-menu ul li a{ font-size: 13px; display: block; padding: 10px 20px; color: currentColor;}
.top-menu ul li:hover a{ font-weight: 600; color: #0068fa;}
.top-menu > ul{ list-style: none; padding: 0; margin: 0; display: flex;}
.top-menu > ul ul{ list-style: none; padding: 10px 0; margin: 0; position: absolute; width: 180px; background: #9a10a9; display: none; z-index: 2;}
.top-menu > ul ul li a{ font-size: 14px; padding: 5px 25px; color: #fff !important;}
.top-menu > ul ul.opened{ display: block;}
.top-menu > ul ul ul{ left: 100%; top: 0; display: none;}
.top-menu > ul ul ul.opened{ display: block;}

.mobile-menu{ width: 100%; height: 100%; position: fixed; left: -100%; top: 0; z-index: 11; transition: 0.3s; background: #fff; overflow: auto; padding-top: 85px;}
.mobile-menu.opened{ left: 0;}
.mobile-menu ul{ width: 100%; top: 0; z-index: 3; padding: 0; margin: 0; list-style: none;}
.mobile-menu ul li{ position: relative; border-top: 1px solid #eee;}
.mobile-menu ul li a{ text-decoration: none; color: #111; font-size: 14px; font-weight: 500; display: block; padding: 10px 15px; text-align: center;}
.mobile-menu > ul{ display: block; left: 0;}
.mobile-menu > ul ul{ position: fixed; height: 100%; padding-top: 85px; background: #fff; left: -100%; opacity: 0; visibility: hidden; transition: 0.3s;}
.mobile-menu > ul ul.opened{ left: 0; opacity: 1; visibility: visible;}
.mobile-menu > ul ul ul{ position: fixed; left: 0; top: 0; left: -100%; opacity: 0; visibility: hidden; transition: 0.3s;}
.mobile-menu > ul ul ul.opened{ left: 0; opacity: 1; visibility: visible;}
.mobile-menu .back-icon{ width: 40px; height: 40px; position: absolute; left: 15px; top: 25px; display: flex; align-items: center; justify-content: center; z-index: 2; border: 1px solid #ddd;}
.mobile-menu .sub-icon{ width: 40px; height: 40px; position: absolute; right: 0; top: 0; display: flex; align-items: center; justify-content: center; z-index: 2;}

.logo{ width: auto; margin: 0 20px;}
.logo a{ display: inline-block;}
.logo img{ max-width: 100%;}

/* Banner */
.banner{ width: 100%;}
.banner a{ display: block;}
.banner img{ width: 100%;}

/* Slider */
.slider{ width: 100%;}
.slider a{ display: block;}
.slider img{ width: 100%;}

.swiper-button-prev{ left: 20px; width: 40px; height: 40px; border-radius: 10px; background: #eee; display: flex; align-items: center; justify-content: center;}
.swiper-button-prev::after{ font-size: 14px; color: #111; font-weight: bold;}
.swiper-button-next{ right: 20px; width: 40px; height: 40px; border-radius: 10px; background: #eee; display: flex; align-items: center; justify-content: center;}
.swiper-button-next::after{ font-size: 14px; color: #111; font-weight: bold;}

/* Breadcrumb */
.breadcrumb{ background: unset; position: absolute; width: 100%; text-align: center; bottom: 0; left: 0;}
.breadcrumb h2{ font-size: 32px; font-weight: 900; color: #fff; width: 100%;}
.breadcrumb ul{ width: 100%; list-style: none; padding: 0; margin: 0; display: flex; align-items: center; justify-content: center;}
.breadcrumb ul li{ width: auto; display: flex; align-items: center; position: relative;}
.breadcrumb ul li::after{ content: "/"; position: relative; display: block; color: #fff;}
.breadcrumb ul li:last-child::after{ display: none;}
.breadcrumb ul li a{ display: block; color: #fff; font-size: 16px; padding: 0 10px;}

/* Image Item */
.image-item{ width: 100%;}
.image-item a{ display: block;}
.image-item img{ width: 100%; border-radius: 20px;}

/* Pagination */
.pagination{ width: 100%; margin-top: 20px;}
.pagination ul{ list-style: none; width: 100%; padding: 0; margin: 0; display: flex; align-items: center; justify-content: center; flex-wrap: wrap;}
.pagination ul li{ width: auto; margin: 0 3px;}
.pagination ul li.active{}
.pagination ul li a{ display: block; font-size: 16px; width: 40px; height: 40px; border-radius: 10px; background: #eee; display: flex; align-items: center; justify-content: center;}
.pagination ul li.active a{ background: #0068fa; color: #fff; font-weight: 800;}

/* Mid Banner */
.mid-banner{ width: 100%;}
.mid-banner a{ display: block;}
.mid-banner img{ width: 100%;}

/* Staff List */
/*.staff-list .col-lg-4:first-child{ flex: 0 0 100%; max-width: 100%;}
.staff-list .col-lg-4:first-child a{ max-width: 331px; width: 100%;}*/
.staff-list a{ color: currentColor; display: inline-block; background: #f5f5f5; padding: 20px; height: 100%;}
.staff-list img{ width: 181px; height: 181px; object-fit: cover; border-radius: 100%; margin-bottom: 15px;}
.staff-list h2{ font-size: 16px; font-weight: 900;}
.staff-list h3{ font-size: 20px; font-weight: bold; font-family: 'Nickainley', sans-serif;}
.staff-list h4{ font-size: 16px; line-height: 1.4;}
.staff-list p{ font-size: 14px; color: #999; border-top: 1px solid #ddd; padding-top: 15px; margin-top: 15px;}

.sl-btn.swiper-button-prev{ left: -45px;}
.sl-btn.swiper-button-next{ right: -45px;}

/* Staff Detail */
.staff-detail a{ color: currentColor; display: inline-block; background: #f5f5f5; padding: 20px; height: 100%;}
.staff-detail img{ width: 181px; height: 181px; object-fit: cover; border-radius: 100%; margin-bottom: 15px;}
.staff-detail h2{ font-size: 16px; font-weight: 900;}
.staff-detail h3{ font-size: 20px; font-weight: bold; font-family: 'Nickainley', sans-serif;}
.staff-detail h4{ font-size: 16px; line-height: 1.4;}
.staff-detail p{ font-size: 14px; color: #999; border-top: 1px solid #ddd; padding-top: 15px; margin-top: 15px;}

/* width */
.scroll::-webkit-scrollbar{ width: 10px;}
/* Track */
.scroll::-webkit-scrollbar-track{ background: #ddd; border-left: 3px solid #fff; border-right: 3px solid #fff;}
/* Handle */
.scroll::-webkit-scrollbar-thumb{ background: #0068fa; border-radius: 20px;}

/* Service */
.service-list .col-lg-4:nth-child(1) .service-item .content::before{ background-color: #9a10a9;}
.service-list .col-lg-4:nth-child(2) .service-item .content::before{ background-color: #9a10a9;}
.service-list .col-lg-4:nth-child(1) .service-item .content::after{ content: ""; position: absolute; left: 0; bottom: 0; z-index: 2; width: 100%; height: 95%; background: url(../images/serv-bg-1.png) no-repeat center left; background-size: contain;}
.service-list .col-lg-4:nth-child(2) .service-item .content::after{ content: ""; position: absolute; left: 0; bottom: 0; z-index: 2; width: 100%; height: 95%; background: url(../images/serv-bg-2.png) no-repeat center left; background-size: contain;}
.service-list .col-lg-4:nth-child(3) .service-item .content::after{ content: ""; position: absolute; left: 0; bottom: 0; z-index: 2; width: 100%; height: 95%; background: url(../images/serv-bg-3.png) no-repeat center left; background-size: contain;}

.service-item{ width: 100%;}
.service-item a{ display: block; color: #fff; text-align: center;}
.service-item img{ width: 100%;}
.service-item .content{ overflow: hidden; position: relative; width: 100%; margin-top: -75px; padding: 30px;}
.service-item .content::before{ content: ""; width: 1900px; height: 1900px; border-radius: 100%; z-index: 2; background-color: #9a10a9; position: absolute; left: 50%; transform: translate(-50%); top: 0;}
.service-item .content h2{ font-size: 18px; font-weight: 800; position: relative; z-index: 3; padding-bottom: 20px; margin-bottom: 15px;}
.service-item .content h2::after{ content: ""; width: 40px; height: 5px; background: #fff; position: absolute; left: 50%; bottom: 0; transform: translateX(-50%);}
.service-item .content p{ position: relative; z-index: 3; font-size: 13px;}
.service-item .content .detail-btn{ position: relative; z-index: 3; background: #fff; display: inline-block; color: #999; padding: 7px 20px; border-radius: 30px;}
/* Whatshapp*/
.fixed-btns {
    max-width: 240px;
    width: 100%;
    position: fixed;
    right: 0;
    bottom: 20%;
    z-index: 10;
}

    .fixed-btns a {
        width: 100%;
        text-decoration: none;
        color: #fff;
        display: block;
        box-shadow: 0px 5px 10px rgba(0,0,0,0.1);
        font-size: 18px;
        position: relative;
        text-align: center;
        margin: 10px 0;
        border-radius: 30px 0 0 30px;
    }

        .fixed-btns a.whatsapp-btn {
            background-color: #9a10a9;
            line-height: 1.2;
            padding: 10px 0;
            padding-left: 40px;
            background: url(../images/whatsapp.svg) #9a10a9 no-repeat center left 20px;
            background-size: 32px;
        }

            .fixed-btns a.whatsapp-btn span {
                display: block;
            }

            .fixed-btns a.whatsapp-btn b {
                display: block;
            }

        .fixed-btns a.offer-btn {
            background-color: #688eff;
            padding: 18px 0;
            padding-left: 40px;
            background: url(../images/document.svg) #688eff no-repeat center left 20px;
            background-size: 32px;
        }

            .fixed-btns a.offer-btn span {
                display: block;
            }


/* Contact */
.contact-map{ width: 100%; height: 100%; position: relative;}
.contact-map iframe{ position: absolute; width: 100%; height: 100%; left: 0; top: 0;}

.contact-info{ width: 100%; margin-bottom: 30px;}
.contact-info h1{ font-size: 26px; font-weight: 800; margin-bottom: 20px;}
.contact-info ul{ list-style: none; padding: 0; margin: 0;}
.contact-info ul li{ color: #111; margin-bottom: 5px;}
.contact-info ul li:last-child{ margin-bottom: 0;}
.contact-info ul li a{ text-decoration: none; color: currentColor; display: inline; font-size: 14px;}
.contact-info ul li b{ font-weight: 600;}

.contact-form{}
.contact-form h1{ font-size: 26px; font-weight: 800; margin-bottom: 20px;}
.contact-form ul{ list-style: none; padding: 0; margin: 0;}
.contact-form ul li{ margin-bottom: 10px;}
.contact-form ul li label{ font-size: 14px;}
.contact-form ul li input[type=text]{ width: 100%; outline: none; border: 1px solid #ddd; padding: 7px;}
.contact-form ul li textarea{ width: 100%; height: 120px; outline: none; border: 1px solid #ddd; padding: 7px;}
.contact-form input[type=submit]{ min-width: 220px; font-weight: 600; letter-spacing: 1px; height: 76px; background: #3090e7; outline: none; border: 0; color: #fff;}


















/* Footer Section */
.footer-section{ background: url(../images/top-bg.jpg) #9a10a9 no-repeat center top; background-size: 100%; width: 100%;}

.f-logo{ width: 100%; margin-bottom: 20px;}
.f-logo a{ display: inline-block;}
.f-logo img{ max-width: 100%;}

.social-media.fsm a{ background-color: #999; width: 44px; height: 44px; border-radius: 100%;}
.social-media.fsm a.facebook{ background-color: #9a10a9; box-shadow: 0 0 0 6px rgba(0,106,250,0.3);}
.social-media.fsm a.whatsapp{ background-color: #01d95e; box-shadow: 0 0 0 6px rgba(2,216,92,0.3);}
.social-media.fsm a.instagram{ background-color: #d22791; box-shadow: 0 0 0 6px rgba(212,39,147,0.3);}
.social-media.fsm a.twitter{ background-color: #00bdf9; box-shadow: 0 0 0 6px rgba(0,189,249,0.3);}

.f-menu{ width: 100%; color: #777; font-size: 16px;}
.f-menu h2{ font-size: 20px; font-weight: 800; color: #fff; margin-bottom: 20px;}
.f-menu ul{ list-style: none; padding: 0; margin: 0;}
.f-menu ul li{ padding: 4px 0;}
.f-menu ul li a{ display: block; color: #ffffff; font-size: 16px;}

/* Helpers */
.h1-title { width: 100%; font-size: 32px; font-weight: 900; letter-spacing: -2px; padding-top: 90px; padding-bottom: 30px; text-align: center; color: #9a10a9; background: url(../images/title-bg.png) no-repeat center top; background-size: 139px auto; }
.h1-title span{ font-family: 'Nickainley', sans-serif; display: block; letter-spacing: 0; color: #9a10a9; font-weight: 400;}

.image{ width: 100%; text-align: center; margin-bottom: 30px;}
.image img{ max-width: 100%; margin: auto;}

.menu-btn{ position: absolute; right: 15px; z-index: 12; width: 40px; height: 40px; background: #9a10a9; color: #fff; font-size: 24px; margin-left: 15px; display: none; align-items: center; justify-content: center;}

.col-md-9.scroll{ max-height: 220px; overflow: auto;}

.icerik h4{ font-size: 20px; font-weight: 600;}
.icerik p{ max-height: 100px; overflow: hidden;}

.mobile-logo{ display: none; margin-left: 15px;}
.mobile-logo img{ width: 100px;}

@media(max-width: 1150px)
{
    .mobile-logo{ display: block;}
    .top-section{ padding: 20px 0;}
    .top-section .col-lg-4{ display: none !important;}
    .header-section{ display: none;}
    .menu-btn{ display: flex;}
    .top-section .address{ display: none;}
}

@media(max-width: 991px)
{
    .sl-btn.swiper-button-next{ right: 10px;}
    .sl-btn.swiper-button-prev{ left: 10px;}
    .contact-map{ height: 300px; margin-bottom: 30px;}
    .fixed-btns {
        width: 65px;
        bottom: 5%;
    }

        .fixed-btns a {
            font-size: 0;
            padding: 25px 0 !important;
        }
}

@media(max-width: 840px)
{
    .banner img{ height: 200px; object-fit: cover;}
}

@media(max-width: 640px)
{

}

@media(max-width: 576px)
{
    .staff-list .col-lg-4:first-child a{ max-width: 100%;}
}

@media(max-width: 480px)
{

}














