/*=========================================================
Template Name:Euildint-Construction Buliding HTML5 Template
Author:  https://themeforest.net/user/website stock
Description: Description
Version: 1.0.0
Text Domain: Euildint
Tags: architect, building company, construction, construction template, construction theme, constructor, contractor, electrician, handyman, industry, painter, plumber, repair, tiler, worker
================================================*/

/*TABLE OF CONTENTS*/
/*=====================
01. Euildint Header Top Menu Area Css
02. Euildint Nav Menu Area Css 
03. Euildint Slider Area Css
04. Euildint Section Title Css
05. Euildint Service Area css
06. Euildint About Area Css
07. Euildint Counter Area Css
08. Euildint Testimonial Area Css
09. Euildint Process Area Css
10. Euildint Team Area Css
11. Euildint Faq Area Css
12. Euildint Call Do Section Css
13. Euildint Form Box Css
14. Euildint Blog Area Css
15. Euildint footer Area Css
16. Euildint Subscribe Area Css
17. Euildint Prossess Ber Css
18. Euildint Scrollup Section
19. Euildint Breadcumb Area Css
20. Euildint abouts_areas Css
21. Euildint Pricing Section Css
22. Euildint Contact  US Css
23. Euildint Blog Sidber Widget CSS
24. Euildint Search Box Css
25. Euildint Loader Css
=======================*/

/* Montserrat fontunu ekleme */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700&display=swap');

body {
    font-family: 'Montserrat', sans-serif;
}



/*==================================================
          Header Area CSS
        ===================================================*/
.pagerm-header-area {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 10;
    padding: 24px 80px;
    width: 100%;
    transition: all 0.3s ease;
    background: white;
}

.pagerm-container {
    width: 100%;
    max-width: 1300px;
    margin: 0px auto;
    padding: 0 15px;
}

.pagerm-header-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
}

.pagerm-logo-col {
    flex: 0 0 119px;
}

.pagerm-menu-col {
    flex: 1;
    min-width: 0;
    padding: 0 15px;
}

.pagerm-contact-col {
    flex: 0 0 250px;
}

.pagerm-header-logo img {
    max-height: 35px;
    width: auto;
}

.pagerm-header-menu ul {
    list-style: none;
    display: flex;
    margin: 0;
    padding: 0;
    justify-content: center;
    flex-wrap: wrap;
}

.pagerm-header-menu ul li {
    margin: 0px 5px;
}

.pagerm-header-menu ul li a {
    text-decoration: none;
    font-size: 11px;
    color: #2b2150;
    font-weight: 500;
    padding: 8px 0;
    position: relative;
    transition: all 0.3s ease;
    font-family: 'Montserrat', sans-serif;
    text-transform: uppercase;
    letter-spacing: 0px;
    white-space: nowrap;
}

.pagerm-header-menu ul li a:hover {
    color: #2b2150;
    font-weight: bolder;
}

.pagerm-header-menu ul li a:hover::after {
    width: 100%;
}

.pagerm-header-contact {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.pagerm-header-phone {
    display: flex;
    align-items: center;
}

.pagerm-phone-icon {
    color: #2b2150;
    font-size: 20px;
    margin-right: 10px;
}

.pagerm-phone-info {
    display: flex;
    flex-direction: column;
}

.pagerm-phone-label {
    font-size: 12px;
    color: #2b2150;
    font-family: 'Montserrat', sans-serif;
    white-space: nowrap;
}

.pagerm-phone-number {
    font-size: 14px;
    color: #2b2150;
    font-weight: 600;
    text-decoration: none;
    font-family: 'Montserrat', sans-serif;
    transition: color 0.3s ease;
    white-space: nowrap;
}

.pagerm-phone-number:hover {
    color: #b6b5bb;
}

/* Mobile Hamburger Menu Styles */
.mobile-hamburger {
    display: none;
    background: none;
    border: none;
    cursor: pointer;
    padding: 5px;
    z-index: 1001;
}

.hamburger-icon {
    width: 27px;
    height: 21px;
    position: relative;
    transform: rotate(0deg);
    transition: .5s ease-in-out;
}

.hamburger-icon span {
    display: block;
    position: absolute;
    height: 3px;
    width: 100%;
    background: #2b2150;
    opacity: 1;
    left: 0;
    transform: rotate(0deg);
    transition: .25s ease-in-out;
}

.hamburger-icon span:nth-child(1) {
    top: 0px;
}

.hamburger-icon span:nth-child(2),
.hamburger-icon span:nth-child(3) {
    top: 8px;
}

.hamburger-icon span:nth-child(4) {
    top: 16px;
}

.hamburger-icon.open span:nth-child(1) {
    top: 8px;
    width: 0%;
    left: 50%;
}

.hamburger-icon.open span:nth-child(2) {
    transform: rotate(45deg);
}

.hamburger-icon.open span:nth-child(3) {
    transform: rotate(-45deg);
}

.hamburger-icon.open span:nth-child(4) {
    top: 8px;
    width: 0%;
    left: 50%;
}

/* Mobile Menu Overlay */
.mobile-menu-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background: rgba(255, 255, 255, 0.95);
    /* Beyaz arkaplan */
    backdrop-filter: blur(10px);
    z-index: 999;
    display: flex;
    flex-direction: column;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
    padding: 20px;
    box-sizing: border-box;
}

.mobile-menu-overlay.active {
    opacity: 1;
    visibility: visible;
}

.mobile-menu-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    margin-bottom: 30px;
}

.mobile-logo img {
    max-height: 30px;
    width: auto;
}

.mobile-close-btn {
    background: none;
    border: none;
    color: #2b2150;
    /* Koyu mor renk */
    font-size: 28px;
    cursor: pointer;
    padding: 5px;
}

.mobile-menu-nav ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.mobile-menu-nav ul li {
    margin: 15px 0;
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.3s ease;
}

.mobile-menu-overlay.active .mobile-menu-nav ul li {
    opacity: 1;
    transform: translateY(0);
}

.mobile-menu-nav ul li:nth-child(1) {
    transition-delay: 0.1s;
}

.mobile-menu-nav ul li:nth-child(2) {
    transition-delay: 0.2s;
}

.mobile-menu-nav ul li:nth-child(3) {
    transition-delay: 0.3s;
}

.mobile-menu-nav ul li:nth-child(4) {
    transition-delay: 0.4s;
}

.mobile-menu-nav ul li:nth-child(5) {
    transition-delay: 0.5s;
}

.mobile-menu-nav ul li:nth-child(6) {
    transition-delay: 0.6s;
}

.mobile-menu-nav ul li a {
    color: #2b2150;
    /* Koyu mor renk */
    text-decoration: none;
    font-size: 18px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 1px;
    padding: 12px 15px;
    display: block;
    transition: all 0.3s ease;
    background: rgba(43, 33, 80, 0.05);
    /* Açık mor arkaplan */
    border: 1px solid rgba(43, 33, 80, 0.1);
    /* Açık mor border */
}

.mobile-menu-nav ul li a:hover {
    background: rgba(43, 33, 80, 0.1);
    /* Daha koyu mor hover */
}

.mobile-contact-info {
    margin-top: 30px;
    text-align: center;
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.3s ease 0.7s;
}

.mobile-menu-overlay.active .mobile-contact-info {
    opacity: 1;
    transform: translateY(0);
}

.mobile-contact-info .pagerm-phone-number {
    color: #2b2150;
    /* Koyu mor renk */
    font-size: 16px;
    text-decoration: none;
    padding: 12px 20px;
    background: rgba(43, 33, 80, 0.05);
    /* Açık mor arkaplan */
    display: inline-block;
    transition: all 0.3s ease;
    border: 1px solid rgba(43, 33, 80, 0.1);
    /* Açık mor border */
}

.mobile-contact-info .pagerm-phone-number:hover {
    background: rgba(43, 33, 80, 0.1);
    /* Daha koyu mor hover */
}

/* Content for demo */
.demo-content {
    margin-top: 100px;
    padding: 40px;
    text-align: center;
    color: white;
}

.demo-content h1 {
    font-size: 3rem;
    margin-bottom: 20px;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
}

.demo-content p {
    font-size: 1.2rem;
    max-width: 600px;
    margin: 0 auto;
    line-height: 1.6;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
}

/*==================================================
         Responsive Design
        ===================================================*/
@media (max-width: 1160px) and (min-width: 961px) {
    .pagerm-header-area {
        padding: 30px 43px;
    }

    .pagerm-header-logo img {
        max-height: 25px;
    }

    .pagerm-header-menu ul li {
        margin: 0px 4px;
    }

    .pagerm-header-menu ul li a {
        font-size: 10px;
        letter-spacing: 0.6px;
    }

    .pagerm-phone-icon {
        font-size: 15px;
        margin-right: 8px;
    }

    .pagerm-phone-label {
        font-size: 9px;
    }

    .pagerm-phone-number {
        font-size: 11px;
    }

    .pagerm-contact-col {
        flex: 0 0 190px;
    }
}

@media (max-width: 960px) and (min-width: 769px) {
    .pagerm-header-area {
        padding: 30px 39px;
    }

    .pagerm-header-logo img {
        max-height: 20px;
    }

    .pagerm-header-menu ul li {
        margin: 0px 5px !important;
    }

    .pagerm-header-menu ul li a {
        font-size: 9px !important;
        letter-spacing: 0.3px !important;
    }

    .pagerm-phone-icon {
        font-size: 14px !important;
        margin-right: 2px !important;
    }

    .pagerm-phone-label {
        font-size: 8px !important;
    }

    .pagerm-phone-number {
        font-size: 9px !important;
    }

    .pagerm-contact-col {
        flex: 0 0 120px !important;
    }
}

/* Mobile Header Styles for 768px and below */
@media (max-width: 768px) {
    .pagerm-header-area {
        padding: 15px 20px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        min-height: 65px;
        /* Minimum yükseklik belirle */
        background: rgb(255, 255, 255);
    }

    .pagerm-header-row {
        width: 100%;
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-wrap: nowrap;
        /* Sarmalamayı engelle */
    }

    .pagerm-menu-col,
    .pagerm-contact-col {
        display: none;
    }

    .pagerm-logo-col {
        flex: 0 0 auto;
        display: flex;
        align-items: center;
    }

    .mobile-hamburger {
        display: flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 auto;
        margin-left: auto;
    }

    .pagerm-header-logo img {
        max-height: 25px;
        width: auto;
        vertical-align: middle;
    }
}

/* 300px - 768px Arası Özel Header Stili */
@media (max-width: 768px) and (min-width: 300px) {
    .pagerm-header-area {
        padding: 15px 20px !important;
        display: flex;
        align-items: center;
        min-height: 65px !important;
    }

    .pagerm-header-row {
        width: 100%;
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
        flex-wrap: nowrap !important;
        height: 100%;
    }

    .pagerm-logo-col {
        flex: 0 0 auto !important;
        display: flex;
        align-items: center;
    }

    .mobile-hamburger {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        flex: 0 0 auto !important;
        margin-left: auto !important;
        position: relative;
        z-index: 1001;
        height: 35px;
        /* Hamburger yüksekliğini logo ile aynı yap */
        width: auto;
    }

    .pagerm-header-logo img {
        max-height: 21px;
        width: auto;
        display: block;
    }

    .pagerm-menu-col,
    .pagerm-contact-col {
        display: none !important;
    }
}

/* Hamburger Butonu Pozisyon Sabitleme */
.mobile-hamburger {
    background: none;
    border: none;
    cursor: pointer;
    padding: 5px;
    display: none;
    box-sizing: border-box;
}

@media (max-width: 768px) {
    .mobile-hamburger {
        display: flex;
        align-items: center;
        justify-content: center;
    }
}




/* Beyaz Çerçeve */
.beyaz-cerceve {
    position: absolute;
    width: 190px;
    height: 204px;
    border: 12px solid #ffffff;
    top: 100%;
    left: -2%;
    transform: translate(-39%, -50%);
    z-index: 2;
}

/* Sarı Çerçeve */
.sari-cerceve {
    position: absolute;
    width: 200px;
    height: 200px;
    top: -6%;
    right: -97px;
    transform: translateY(-19%);
    z-index: -1;
    border-left: 50px solid #ffc107;
    border-bottom: 50px solid #ffc107;
}


#deneme {
    background: linear-gradient(to top, #e4e4e4, #f8f8f8);

}








/*==================================================
 <-- Euildint Section Title Css-->
===================================================*/

.section-shape {
    margin-right: 15px;
    display: inline-block;
}

.section-sub-title {
    display: inline-block;
}

.section-sub-title h4 {
    font-size: 22px;
    color: #2b2150;
    font-weight: 500;
    text-transform: uppercase;
    line-height: 26px;
    margin-bottom: 16px;
}

.section-main-title {
    margin-bottom: 62px;
}

.section-main-title h2 {
    font-size: 45px;
    font-weight: 500;
    line-height: 44px;
}

/* about section title */

.section-main-title.about {
    margin: 0;
}

/* contact section title */

.section-main-title.contact {
    margin: 0;
}

.section-main-title.contact h2 {
    color: #ffff;
}

/* pricing section title */

.section-main-title.pricing {
    margin: 31px 0 77px;
}

.section-main-title.pricing h2 {
    line-height: 0;
}

/* blog section title */

.section-main-title.blog {
    margin-bottom: 53px;
}

/* faq section title */

.section-sub-title.faq h4 {
    font-size: 20px;
    font-weight: 400;
    text-transform: capitalize;
}

.section-main-title.faq {
    margin-bottom: 33px;
}

/* work process section title */

.section-main-title.work {
    margin-bottom: 96px;
}














/*==================================================
 <-- Euildint Blog Area Css-->
===================================================*/

.blog-area {
    padding: 110px 0 123px;
    background: #f7f7f7;
}

.blog-single-box {
    background: #ffffff;
    /* box-shadow: 0px 4px 30px 0px #E3E3E2; */
    padding: 26px 30px 48px;
}

.blog-title h4 a {
    margin-top: 22px;
    color: #010212;
    font-family: Rubik;
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    margin-bottom: 30px;
    display: inline-block;
    text-decoration: none;
    transition: .5s;
}

.blog-single-box:hover .blog-title h4 a {
    color: #ffc107;
}

.blog-meta {
    margin-bottom: 20px;
}

.blog-meta span {
    color: #747474;
    font-size: 15px;
    font-style: normal;
    font-weight: 400;
    margin-right: 15px;
}

.blog-meta span i {
    margin-right: 10px;
    font-size: 17px;
    color: #FF6600;
}

.blog-discription p {
    color: #747474;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 32px;
    border-bottom: 1px solid #DDD;
    padding: 0px 0 30px;
    margin-bottom: 30px;
}

.blog-bottom-shape {
    display: inline-block;
    margin-right: 10px;
}

.blog-bottom-title {
    display: inline-block;
    margin-right: 130px;
}

.blog-bottom-title h4 {
    color: #010212;
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
}

.blog-btn {
    display: inline-block;
}

.blog-btn a {
    color: #010212;
    font-size: 16px;
    font-weight: 500;
    display: inline-block;
    text-decoration: none;
    transition: .5s;
}

.blog-single-box:hover .blog-btn a {
    color: #ffc107;
}

.blog-btn a i {
    color: #000000;
}









/*==================================================
 <-- Euildint Slider Style two  Area Css-->
===================================================*/

/* Banner Slider */
.banner-section {
    position: relative;
}

.banner-carousel .slide-item {
    position: relative;
    overflow: hidden;
    min-height: 850px;
}

.banner-carousel .slide-item .image-layer {
    position: absolute;
    left: 0px;
    top: 0px;
    right: 0px;
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    -webkit-transition: all 6000ms linear;
    -moz-transition: all 6000ms linear;
    -ms-transition: all 6000ms linear;
    -o-transition: all 6000ms linear;
    transition: all 6000ms linear;
}

.banner-carousel .active .slide-item .image-layer {
    -webkit-transform: scale(1.15);
    -ms-transform: scale(1.15);
    transform: scale(1.15);
}









/*==================================================
 <-- Euildint Blog  Area Style Two Css-->
===================================================*/

.blog-single-box.style-two {
    /* background: inherit; */
    padding: 0;
}

.blog-thumb {
    overflow: hidden;
}

.blog-thumb img {
    transition: .5s;
}

.blog-single-box.style-two:hover .blog-thumb img {
    transform: scale(1.1);
}

.blog-content.style-two {
    padding: 0px 31px 24px;
}

/* .blog-meta.style-two bloğu kaldırıldı */

.blog-meta-date {
    width: 60px;
    height: 53px;
    border-radius: 3px 0px 0px 3px;
    background: #2b2150;
    line-height: 0px;
    margin-right: 26px;
    position: relative;
    z-index: 1;
}

.blog-meta-date::before {
    position: absolute;
    content: "";
    height: 100%;
    width: 0;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: #f1c311;
    border-radius: 3px 0px 0px 3px;
    margin: auto;
    z-index: -1;
    transition: .5s;
}

.blog-single-box.style-two:hover .blog-meta-date::before {
    width: 100%;
}

.blog-meta-date h5 {
    color: #FFF;
    text-align: center;
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 8px;
}

.blog-meta-date span {
    color: #FFF;
    font-size: 16px;
    text-align: center;
    margin-left: 16px;
}

.blog-meta-info span i {
    color: #000;
    transition: .5s;
}

.blog-single-box.style-two:hover .blog-meta-info span i {
    color: #f1c311;
}

.blog-title.style-two {
    margin-top: -8px;
}

.blog-title.style-two h4 a {
    font-size: 20px;
    border-bottom: 1px solid rgba(208, 208, 208, 0.50);
    padding: 0px 0 17px;
    margin-bottom: 20px;
}

.blog-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.blog-btn.style-two a {
    font-size: 18px;
}

.blog-icon a i {
    font-size: 17px;
    transition: .5s;
}

.blog-single-box.style-two:hover .blog-icon a i {
    color: #F60;
}







/*==================================================
 <-- Euildint Banner Style Three Css-->
===================================================*/

section.banner-section.style-three {
    margin-top: -98px;
}

.slider-content.style-two.three {
    left: 130px;
    top: 54%;
}








/*===============================================================
    <-- Euildint Breatcome Area Css-->
=================================================================*/

.breatcome-area {
    /* background: url(../images/duyurular/duyurular_bg.webp); */
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    /* This centers the image */
    padding: 154px 0;
    position: relative;
    background-color: #2b2150;


    /* Optional: for better control */

    /* Optional: Add a media query for smaller screens */
    @media (max-width: 768px) {
        padding: 100px 0;
        /* Reduce padding on smaller screens */
    }
}

.breatcome-content {
    position: relative;
    top: 52px;
}

.breatcome-title h1 {
    color: white;
    font-size: 55px;
    font-weight: 600;
    margin-bottom: 17px;
}

.bratcome-text {
    position: absolute;
    right: 0;
    bottom: -119px;
    background: white;
    padding: 15px 19px;
}

.bratcome-text ul {
    list-style: none;
}

.bratcome-text ul li {
    display: inline-block;
    margin-right: 15px;
    color: #2b2150;
    font-size: 18px;
    font-weight: 500;
    line-height: 28px;
}

.bratcome-text ul li a {
    display: inline-block;
    color: #2b2150;
    font-size: 18px;
    line-height: 28px;
    font-weight: 500;
    text-decoration: none;
    position: relative;
    transition: .5s;
}

.bratcome-text ul li a::before {
    position: absolute;
    content: "/";
    left: 64px;
}






button.icons {
    border: 0;
    font-size: 18px;
    color: #fff;
    padding: 1px 15px;
    position: absolute;
    right: 0;
    top: 0;
    height: 60px;
    width: 60px;
    background: #F60;
    border-radius: 0 3px 3px 0;
}

@media (max-width:768px) {

    .bratcome-text {
        display: none;
    }

    .breatcome-title h1 {
        font-size: 42px;
        margin-top: 10%;
    }
}

@media (max-width:480px) {

    .breatcome-title h1 {
        font-size: 32px !important;
    }
}

.blog-standard-area {
    padding: 120px 0 120px;
}

/* blog quote css */

.blog-quote-box {
    border-radius: 4px;
    background: #FFF;
    box-shadow: 0px 0px 45px 0px rgba(0, 0, 0, 0.10);
    padding: 42px 40px 37px;
}

.blog-quote-conent i {
    font-size: 30px;
    color: #F60;
}

.blog-quote-conent p {
    color: #747474;
    font-size: 16px;
    font-weight: 400;
    line-height: 26px;
    margin: 10px 0 15px;
}

.blog-quote-conent h4 {
    color: #F60;
    font-size: 24px;
    font-weight: 500;
    position: relative;
    margin-left: 50px;
}

.blog-quote-conent h4::before {
    position: absolute;
    content: "";
    height: 3px;
    width: 40px;
    background: #F60;
    top: 14px;
    left: -50px;
}


/* blog standard box css */

.blog-standard-thumb {
    position: relative;
}

.blog-single-video {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    text-align: center;
    transform: translateY(-50%);
}

.blog-video-icon a {
    height: 90px;
    width: 90px;
    background: #fff;
    color: #F60;
    text-align: center;
    font-size: 50px;
    display: inline-block;
    line-height: 94px;
    border-radius: 100%;
    -webkit-animation: ripple-white 1s linear infinite;
    animation: ripple-blue 1s linear infinite;
    -webkit-transition: .5s;
}

.blog-standard-meta {
    margin: 30px 0 24px;
}

.blog-standard-meta span {
    color: #747474;
    font-size: 17px;
    font-style: normal;
    font-weight: 400;
    margin-right: 30px;
    position: relative;
    transition: .5s;
}

.blog-standard-meta span:hover {
    color: #F60;
}

.blog-standard-meta span::before {
    position: absolute;
    content: "/";
    right: -20px;
}

.blog-standard-meta span.meta::before {
    display: none;
}

.blog-standard-content h4 a {
    color: #18191D;
    font-size: 35px;
    font-weight: 500;
    display: inline-block;
    text-decoration: none;
    transition: .5s;
}

.blog-standard-content h4 a:hover {
    color: #F60;
}

.blog-standard-content p {
    color: #747474;
    font-size: 16px;
    font-weight: 400;
    line-height: 26px;
    margin: 20px 0 30px;
}


/* blog standard owl carousel */

.blog-standard-area .owl-prev {
    position: absolute;
    top: 50%;
    left: 10px;
    transform: translateY(-50%);
}

.blog-standard-area .owl-next {
    position: absolute;
    right: 30px;
    top: 50%;
    transform: translateY(-50%);
}

.blog-standard-area .owl-prev i {
    background: inherit;
    font-size: 70px;
}

.blog-standard-area .owl-prev i::after {
    display: none;
}

.blog-standard-area .owl-next i {
    background: inherit;
    font-size: 70px;
}

.blog-standard-area .owl-next i::after {
    display: none;
}



/*==================================================
 <-- Euildint Blog Details Inner Page Css-->
===================================================*/

.blog-details-area {
    padding: 122px 0 120px;
}

.blog-details-thumb img {
    width: 100%;
}

.blog-detaile-title h4 {
    margin: 35px 0 33px;
}

.blog-detaile-title h4 a {
    color: #18191D;
    font-size: 35px;
    font-weight: 500;
    text-decoration: none;
}

.blog-details-meta {
    margin-bottom: 26px;
}

.blog-details-meta span {
    color: #747474;
    font-size: 16px;
    font-weight: 400;
    margin-right: 20px;
}

.blog-details-meta span i {
    color: #F60;
    margin-right: 5px;
}

.blog-details-discription p {
    color: #747474;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 26px;
}

/* blog list css */

.blog-details-list ul li {
    list-style: none;
    margin-bottom: 23px;
    color: #18191D;
    font-size: 18px;
    font-style: normal;
    line-height: 26px;
    font-weight: 600;
    transition: .5s;
}

.blog-details-list ul li:hover {
    color: #F60;
}

.blog-details-list ul li.active {
    color: #F60;
}

.blog-details-list ul li i {
    font-size: 22px;
    padding-right: 8px;
}


.row.line {
    border-top: 1px solid rgba(227, 227, 227, 1);
    border-bottom: 1px solid rgba(227, 227, 227, 1);
    padding: 36px 0 37px;
}

.blog-details-tag h6 {
    color: #18191D;
    font-size: 24px;
    font-weight: 500;
    display: inline-block;
    margin-right: 36px;
}

.blog-details-tag a {
    display: inline-block;
    text-decoration: none;
    padding: 7px 14px;
    background: #F8F8F8;
    border-radius: 3px;
    color: #102039;
    font-size: 15px;
    font-style: normal;
    margin-right: 15px;
    font-weight: 500;
    position: relative;
    transition: .5s;
    z-index: 1;
}

.blog-details-tag a:hover {
    color: #FFf;
}

.blog-details-tag a:before {
    position: absolute;
    content: "";
    left: -2px;
    top: 0px;
    height: 102%;
    width: 0%;
    right: 0;
    margin: auto;
    background: #F60;
    z-index: -1;
    border-radius: 3px;
    transition: .5s;
}

.blog-details-tag a:hover::before {
    width: 100%;
}

.ba-blog-details-social-icons {
    text-align: right;
}

.ba-blog-details-social-icons.two {
    text-align: left;
}

.ba-blog-details-social-icons a {
    margin-left: 6px;
    width: 45px;
    height: 45px;
    line-height: 45px;
    border: 1px solid #F60;
    display: inline-block;
    text-align: center;
    border-radius: 50%;
    color: #F60;
    position: relative;
    z-index: 1;
    transition: .5s;
}

.ba-blog-details-social-icons a:hover {
    color: #FFF;
}

.ba-blog-details-social-icons a::before {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #F60;
    border-radius: 50%;
    transform: scale(0);
    z-index: -1;
    transition: .5s;
}

.ba-blog-details-social-icons a:hover::before {
    transform: scale(1.1);
}

/* blog team css */

.blog-details-team-item {
    border-bottom: 1px solid rgba(227, 227, 227, 1);
    padding: 0px 0px 42px;
}

.blog-team-thumb {
    float: left;
    margin-right: 42px;
}

.blog-team-content h4 a {
    color: #18191D;
    font-size: 30px;
    font-style: normal;
    font-weight: 700;
    text-decoration: none;
}

.blog-team-content p {
    margin: 18px 0 16px;
}

/* blog items css */

.blog-details-item {
    background: #F8F8F8;
    padding: 57px 30px 30px;
}

.blog-details-item.two {
    text-align: right;
}

.blog-item-thumb {
    float: left;
    margin-right: 24px;
    margin-top: -21px;
}

.blog-item-thumb.two {
    float: right;
    margin-left: 24px;
}

.blog-item-content h4 a {
    color: #18191D;
    font-size: 18px;
    font-weight: 500;
    line-height: 28px;
    text-decoration: none;
}

.blog-details-area .owl-prev {
    position: absolute;
    top: 21px;
    left: 138px;
}

.blog-details-area .owl-prev i {
    background: none;
    color: #F60;
    margin-right: -10px;
    font-size: 16px;
}

.blog-details-area .owl-prev i::after {
    display: none;
}

.blog-details-area .owl-next {
    position: absolute;
    top: 24px;
    right: 150px;
}

.blog-details-area .owl-next i {
    background: none;
    color: #F60;
    margin-left: -10px;
    font-size: 16px;
}

.blog-details-area .owl-next i::after {
    display: none;
}

/* blog details comment */

.blog-details-comment h5 {
    color: #18191D;
    font-family: Rubik;
    font-size: 30px;
    font-style: normal;
    font-weight: 500;
    position: relative;
    margin-bottom: 36px;
}

.blog-details-comment h5::after {
    position: absolute;
    bottom: -10px;
    width: 70px;
    height: 3px;
    background: #F60;
    content: "";
    left: 0;
}

.blog-comment-list ul li {
    list-style: none;
    margin-bottom: 0;
}

.blog-comment-box {
    position: relative;
}

.blog-comment-box::before {
    position: absolute;
    content: "";
    width: 100%;
    height: 1px;
    background: #E4E4E4;
    bottom: -30px;
}

.blog-comment-box.inner {
    margin-left: 50px;
}

.blog-comment-box.inner::before {
    display: none;
}

.blog-comment-thumb {
    float: left;
    margin-right: 24px;
    margin-top: 12px;
}

.blog-comment-thumb img {
    border-radius: 4px;
}

.blog-comment-list .title {
    margin-bottom: 5px;
    margin-left: -12px;
}

.blog-comment-list h6.title {
    color: #18191D;
    font-size: 20px;
    font-weight: 500;
    line-height: 28px;
}

.blog-comment-list span.date {
    margin-left: -13px;
}

.content-main p {
    color: #747474;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 26px;
    margin: 10px 0 0;
}

.text-sm-end a {
    display: inline-block;
    text-decoration: none;
    padding: 7px 13px;
    background: #EFEFEF;
    border-radius: 3px;
    color: #102039;
    font-size: 15px;
    font-style: normal;
    font-weight: 400;
    position: relative;
    transition: .5s;
    z-index: 1;
}

.text-sm-end a:hover {
    color: #fff;
}

.text-sm-end a::before {
    position: absolute;
    content: "";
    left: -2px;
    top: 0px;
    height: 102%;
    width: 0%;
    right: 0;
    margin: auto;
    background: #F60;
    z-index: -1;
    border-radius: 3px;
    transition: .5s;
}

.text-sm-end a:hover::before {
    width: 100%;
}








/*** 
====================================================================
    Search Popup
====================================================================
***/
.search-popup {
    position: fixed;
    left: 0;
    top: 0;
    height: 100vh;
    width: 100%;
    z-index: 99999;
    margin-top: -540px;
    transform: translateY(-100%);
    background-color: rgba(0, 0, 0, 0.90);
    -webkit-transition: all 500ms cubic-bezier(0.860, 0.000, 0.070, 1.000);
    -moz-transition: all 500ms cubic-bezier(0.860, 0.000, 0.070, 1.000);
    -o-transition: all 500ms cubic-bezier(0.860, 0.000, 0.070, 1.000);
    transition: all 1500ms cubic-bezier(0.860, 0.000, 0.070, 1.000);
    /* easeInOutQuint */
    -webkit-transition-timing-function: cubic-bezier(0.860, 0.000, 0.070, 1.000);
    -moz-transition-timing-function: cubic-bezier(0.860, 0.000, 0.070, 1.000);
    -o-transition-timing-function: cubic-bezier(0.860, 0.000, 0.070, 1.000);
    transition-timing-function: cubic-bezier(0.860, 0.000, 0.070, 1.000);
    /* easeInOutQuint */
}

.search-popup {
    width: 100%;
}

.search-active .search-popup {
    transform: translateY(0%);
    margin-top: 0;
}

.search-popup .close-search {
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    margin-top: -200px;
    border-radius: 50%;
    text-align: center;
    background-color: #e63a27;
    width: 70px;
    cursor: pointer;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
    border-bottom: 3px solid #ffffff;
    -webkit-transition: all 500ms ease;
    height: 70px;
    line-height: 70px;
    text-align: center;
}

.search-active .search-popup .close-search {
    visibility: visible;
    opacity: 1;
    top: 50%;
    -webkit-transition-delay: 1500ms;
    -moz-transition-delay: 1500ms;
    -ms-transition-delay: 1500ms;
    -o-transition-delay: 1500ms;
    transition-delay: 1500ms;
}

.search-popup form {
    position: absolute;
    max-width: 700px;
    top: 50%;
    left: 15px;
    right: 15px;
    margin: -35px auto 0;
    transform: scaleX(0);
    transform-origin: center;
    background-color: #111111;
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}

.search-active .search-popup form {
    transform: scaleX(1);
    -webkit-transition-delay: 1200ms;
    -moz-transition-delay: 1200ms;
    -ms-transition-delay: 1200ms;
    -o-transition-delay: 1200ms;
    transition-delay: 1200ms;
}

.search-popup .form-group {
    position: relative;
    margin: 0px;
    overflow: hidden;
}

.search-popup .form-group input[type="text"],
.search-popup .form-group input[type="search"] {
    position: relative;
    display: block;
    font-size: 18px;
    line-height: 50px;
    color: #000000;
    height: 70px;
    width: 100%;
    padding: 10px 30px;
    background-color: #ffffff;
    -webkit-transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
    transition: all 500ms ease;
    font-weight: 500;
    text-transform: capitalize;
}

.search-popup .form-group input[type="submit"],
.search-popup .form-group button {
    position: absolute;
    right: 30px;
    top: 0px;
    height: 70px;
    line-height: 70px;
    background: transparent;
    text-align: center;
    font-size: 24px;
    color: #e63a27;
    padding: 0;
    cursor: pointer;
    -webkit-transition: all 500ms ease;
    border: none;
}

.search-popup .form-group input[type="submit"]:hover,
.search-popup .form-group button:hover {
    color: #000000;
}

.search-popup input::placeholder,
.search-popup textarea::placeholder {
    color: #000000;
}

.search-popup .close-search.style-two {
    position: absolute;
    right: 25px;
    left: auto;
    color: #ffffff;
    width: auto;
    height: auto;
    top: 25px;
    margin: 0px;
    border: none;
    background: none !important;
    box-shadow: none !important;
    -webkit-transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
    transition: all 500ms ease;
}

.flaticon-multiply:before {
    content: inherit;
}

button.close-search i {
    font-size: 25px;
    color: #fff;
    display: inline-block;
}

span.flaticon-multiply i {
    display: inline-block;
    color: #e63a27;
}




/* pagerm footer */
.pagerm-footer {
    background: #f7f7f7;
    padding: 60px 0px 0px;
    font-family: Arial, sans-serif;
    color: rgb(51, 51, 51);
}

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

.footer-logo-img {
    max-height: 35px;
    width: auto;
}

.pagerm-footer-text {
    display: flex;
}

.pagerm-footer-text p {
    font-size: 14px;
    line-height: 1.6;
    color: rgb(102, 102, 102);
    margin-bottom: 20px;
    text-align: justify;
}

.pagerm-footer-menu {
    display: flex;
    list-style: none;
    padding: 0px;
    margin: 0px;
    flex-flow: column wrap;
    align-items: flex-start;
    place-content: flex-end space-evenly;
}

.pagerm-footer-menu li {
    margin-bottom: 4px;
}

.pagerm-footer-menu a {
    color: rgb(51, 51, 51);
    text-decoration: none;
    font-size: 19px;
    transition: 0.3s;
    display: block;
    padding: 0px;
}

.pagerm-footer-menu a:hover {
    color: rgb(90, 40, 125);
    padding-left: 5px;
}

.pagerm-footer-contact {
    display: flex;
    padding: 20px;
    flex-flow: column wrap;
    align-content: flex-end;
}

.contact-item {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 20px;
}

.contact-item i {
    font-size: 24px;
    color: rgb(90, 40, 125);
}

.phone-number {
    font-size: 18px;
    font-weight: 600;
    margin: 0px;
    color: rgb(90, 40, 125);
}

.info-line {
    font-size: 14px;
    color: rgb(102, 102, 102);
    margin: 5px 0px 0px;
}

.social-icons {
    display: flex;
    gap: 7px;
    margin-top: 24px;
    justify-content: flex-start;
}

.social-icons a {
    display: flex;
    width: 44px;
    height: 44px;
    background-color: rgb(43, 33, 80);
    color: white;
    font-size: 23px;
    transition: 0.3s;
    align-items: center;
    justify-content: center;
}

.social-icons a:hover {
    background-color: rgb(58, 24, 88);
    transform: translateY(-3px);
}

.pagerm-footer-bottom {
    background-color: rgb(43, 33, 80);
    padding: 54px 0px;
    margin-top: 42px;
    color: white;
    width: 100%;
    min-height: 94px;
    display: flex;
    align-items: center;
}

.pagerm-footer-bottom p {
    margin: 0px;
    font-size: 16px;
    font-weight: 500;
}

@media (max-width: 1399px) {
    .pagerm-footer-menu a {
        font-size: 17px;
    }
}

@media (max-width: 1199px) {
    .pagerm-footer {
        padding: 50px 0px 0px;
    }

    .pagerm-footer-menu {
        align-content: center;
    }

    .pagerm-footer-contact {
        align-content: center;
    }
}

@media (max-width: 991px) {
    .pagerm-footer-col {
        margin-bottom: 30px;
    }

    .pagerm-footer-contact {
        margin-top: 20px;
        align-content: flex-start;
    }

    .pagerm-footer-menu {
        align-items: flex-start;
        align-content: flex-start;
    }

    .social-icons {
        justify-content: flex-start;
    }
}

@media (max-width: 767px) {
    .pagerm-footer {
        padding: 40px 0px 0px;
    }

    .pagerm-footer-text {
        flex-direction: column;
    }

    .pagerm-footer-menu {
        flex-flow: wrap;
        gap: 15px;
    }

    .pagerm-footer-menu li {
        width: calc(50% - 8px);
    }

    .contact-item {
        flex-direction: row;
        text-align: left;
        gap: 15px;
    }
}

@media (max-width: 575px) {
    .pagerm-footer-menu {
        flex-direction: column;
        gap: 10px;
    }

    .pagerm-footer-menu li {
        width: 100%;
    }

    .pagerm-footer-contact {
        padding: 10px 0px;
    }

    .pagerm-footer-bottom {
        padding: 30px 0px;
        min-height: auto;
        text-align: center;
    }

    .pagerm-footer-bottom p {
        font-size: 14px;
    }
}

@media (max-width: 400px) {
    .contact-item {
        flex-direction: column;
        text-align: center;
        gap: 5px;
    }

    .social-icons {
        justify-content: center;
    }

    .pagerm-footer-menu a {
        font-size: 16px;
    }
}

.scroll-area {
    position: relative;
    z-index: 999;
}

.scroll-area .go-top {
    position: fixed;
    cursor: pointer;
    top: 0px;
    right: 30px;
    color: rgb(255, 255, 255);
    background-image: -webkit-linear-gradient(0deg, rgb(209, 101, 26) 0%, rgb(193, 40, 42) 100%);
    z-index: 9999;
    width: 45px;
    text-align: center;
    height: 45px;
    line-height: 42px;
    opacity: 0;
    visibility: hidden;
    transition: 0.9s ease-out;
    border-radius: 10px;
}

.scroll-area .go-top i {
    position: absolute;
    top: 50%;
    left: -4px;
    right: 0px;
    margin: 0px auto;
    font-size: 15px;
    transform: translateY(-50%);
    transition: 0.5s ease-out;
}

.scroll-area .go-top i:last-child {
    opacity: 0;
    visibility: hidden;
    top: 60%;
}

.scroll-area .go-top::before {
    content: "";
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    z-index: -1;
    background-image: linear-gradient(to right, rgb(0, 19, 43) 0%, rgb(0, 19, 43) 100%);
    opacity: 0;
    visibility: hidden;
    transition: 0.5s ease-out;
    border-radius: 100%;
}

.scroll-area .go-top:focus,
.scroll-area .go-top:hover {
    color: rgb(255, 255, 255);
}

.scroll-area .go-top:focus::before,
.scroll-area .go-top:hover::before {
    opacity: 1;
    visibility: visible;
}

.scroll-area .go-top:focus i:first-child,
.scroll-area .go-top:hover i:first-child {
    opacity: 0;
    top: 0px;
    visibility: hidden;
}

.scroll-area .go-top:focus i:last-child,
.scroll-area .go-top:hover i:last-child {
    opacity: 1;
    visibility: visible;
    top: 50%;
}

.scroll-area .go-top.active {
    top: 95%;
    transform: translateY(-98%);
    opacity: 1;
    visibility: visible;
    right: 30px;
    border-radius: 100%;
}

.top-wrap {
    position: relative;
}

.top-wrap .go-top-button {
    display: inline-block;
    width: 50px;
    height: 50px;
    line-height: 40px;
    text-align: center;
    color: rgb(255, 255, 255);
    top: 3px;
    z-index: 1;
    background: rgb(156, 156, 156);
}

.top-wrap .go-top-button i {
    font-size: 20px;
    font-weight: 700;
    padding-left: 4px;
    color: rgb(255, 255, 255);
}

.top-wrap .go-top-button::after {
    z-index: -1;
    content: "";
    position: absolute;
    left: 3px;
    top: 3px;
    width: 45px;
    height: 45px;
    animation: 1.6s ease-out 0s infinite normal none running ripple;
    opacity: 0;
    background-image: -webkit-linear-gradient(0deg, rgb(255, 102, 0) 0%, rgb(255, 102, 0) 100%);
    border-radius: 100%;
}

.top-wrap .go-top-button:hover {
    background-color: rgb(34, 34, 34);
    color: rgb(255, 255, 255);
}

@-webkit-keyframes ripple-blue {
    0% {
        box-shadow: rgba(255, 255, 255, 0.3) 0px 0px 0px 0px, rgba(255, 255, 255, 0.3) 0px 0px 0px 10px, rgba(255, 255, 255, 0.3) 0px 0px 0px 20px;
    }

    100% {
        box-shadow: rgba(255, 255, 255, 0.3) 0px 0px 0px 10px, rgba(255, 255, 255, 0.3) 0px 0px 0px 20px, rgba(255, 255, 255, 0) 0px 0px 0px 30px;
    }
}

@keyframes ripple-blue {
    0% {
        box-shadow: rgba(255, 255, 255, 0.3) 0px 0px 0px 0px, rgba(255, 255, 255, 0.3) 0px 0px 0px 10px, rgba(255, 255, 255, 0.3) 0px 0px 0px 20px;
    }

    100% {
        box-shadow: rgba(255, 255, 255, 0.3) 0px 0px 0px 10px, rgba(255, 255, 255, 0.3) 0px 0px 0px 20px, rgba(255, 255, 255, 0) 0px 0px 0px 30px;
    }
}