:root {
    --st-color-white: #ffffff;
    --st-color-lightgray: #f2f2f2;
    --st-color-softgray: #dddddd;
    --st-color-gray: #777777;
    --st-color-darkgray: #2f2f2f;
    --st-color-softblack: #252525;
    --st-color-black: #333333;
    --st-color-darkblack: #000000;
    --st-color-softblue: #eff6fa;
    --st-color-blue: #273996;
    --st-color-darkblue: #000060;
    --st-color-green: #4bdb5e;
    --st-color-darkgreen: #356258;
    --st-color-orange: #de7000;
    
    --st-font-11ppl: 11px 'poppins-light';
    --st-font-12ppr: 12px 'poppins-regular';
    --st-font-13ppr: 13px 'poppins-regular';
    --st-font-14ppr: 14px 'poppins-regular';
    --st-font-16ppr: 16px 'poppins-regular';
    --st-font-14ppsb: 14px 'poppins-semibold';
    --st-font-16ppsb: 16px 'poppins-semibold';
    --st-font-24ppsb: 24px 'poppins-semibold';
    --st-font-14ppb: 14px 'poppins-bold';
    --st-font-16ppb: 16px 'poppins-bold';
    --st-font-20ppb: 20px 'poppins-bold';
    --st-font-22ppb: 22px 'poppins-bold';
    --st-font-30ppb: 30px 'poppins-bold';
    --st-font-18tksb: 18px 'teko-semibold';
    --st-font-24tksb: 24px 'teko-semibold';
    --st-font-26tksb: 26px 'teko-semibold';
    --st-font-28tksb: 28px 'teko-semibold';
    --st-font-30tksb: 39px 'teko-semibold';
    --st-font-32tksb: 32px 'teko-semibold';
    --st-font-34tksb: 34px 'teko-semibold';
    --st-font-36tksb: 36px 'teko-semibold';
    --st-font-60tksb: 60px 'teko-semibold';
    --st-radius-10: 10px;
    --st-radius-16: 16px;
    --st-radius-24: 24px;
    --st-telephone-icon: url('../uploads/telefon.webp');
    --st-mail-icon: url('../uploads/mail.webp');
}

/*RESET TAG*/
html { overflow-x:hidden; }
body { margin:0!important; padding:0!important; }
ul { margin:0; padding:0; list-style:none; }
a { text-decoration:none; }
button { margin:0; padding:0; background-color:transparent; border:none; }
/**/

/*GLOBAL TAG*/
.text-orange { color:var(--st-color-orange)!important; }
.headline { max-width:850px; margin:0 auto; text-align:center;
    & .headline-title { margin-bottom:16px; position:relative; display:flex; align-items:center; justify-content:center; font:var(--st-font-36tksb); color:var(--st-color-softblack);
        &::before,
        &::after { content:""; width:200px; height:2px; background-color:var(--st-color-softgray); }
        &::before { margin-right:36px; }
        &::after { margin-left:36px; }
    }
    & .headline-title-emphasis { margin-bottom:16px; font:var(--st-font-36tksb); color:var(--st-color-softblack); }
    & .headline-title-highlight { margin-bottom:16px; font:var(--st-font-36tksb); color:var(--st-color-white); text-shadow:1px 1px 0 var(--st-color-darkblue), -1px -1px 0 var(--st-color-darkblue), -1px 1px 0 var(--st-color-darkblue), 1px -1px 0 var(--st-color-darkblue); opacity:0.5; }
    & .headline-spot { margin-bottom:16px; font:var(--st-font-14ppr); color:var(--st-color-gray); }
    & .headline-content { margin-bottom:48px; font:var(--st-font-14ppr); line-height:24px; color:var(--st-color-gray); }
}

.headline-secondary { max-width:700px; margin:48px 0 36px;
    & .headline-secondary-title { font:var(--st-font-22ppb); color:var(--st-color-black); text-align:left; }
}
/**/

/*RESPONSIVE TAG*/
@media (max-width:1399.98px) {
    #message-form .message-form-consultant {
        & .message-form-consultant-question, .message-form-consultant-telephone, .message-form-consultant-whatsapp1 { margin-bottom:24px!important; }
    }
}

@media (max-width:1199.98px) {
    footer .footer-area .footer-contact { margin:0!important; }
}

@media (max-width:767.98px) {
    body { overflow:hidden!important; }
    .modal-backdrop { display:none!important; }

    #heading .heading-area .heading-title { font:var(--st-font-20ppb)!important; }

    #information .information-company-area a { margin-bottom:16px!important; display:inline-block; }

    #product .product-card .product-card-button { font:var(--st-font-16ppb)!important;
        & .product-card-button-primary { padding:14px 24px!important; }
        & .product-card-button-secondary { font:var(--st-font-16ppb)!important; }
    }

    #product-features ul { grid-template-columns:none!important; }

    #message-form .message-form-consultant {
        & .message-form-consultant-question, .message-form-consultant-telephone, .message-form-consultant-whatsapp1 { margin:16px 0 0!important; display:flex !important; justify-content:center; }
    }

    #faq { margin:0!important;
        & dl dt { padding:24px 34px 24px 80px!important; font:var(--st-font-14ppb)!important; }
    }
}

@media (max-width:575.98px) {
    .modal-header { background-color:var(--st-color-blue); }
    .modal-telephone { width:100%; background-color:var(--st-color-blue); border-radius:var(--st-radius-10);
        & .modal-telephone-tt { margin-bottom:16px; font:var(--st-font-14ppb); color:var(--st-color-white); }
        & .modal-telephone-dt a { font:var(--st-font-22ppb)!important; color:var(--st-color-white)!important; }
    }
    .navbar .navbar-brand img { width:85%!important; }
    #slider .slider-area { transform:translate(-29%,40%)!important; }
    .headline .headline-title { font:var(--st-font-28tksb)!important; }
    .headline .headline-title-emphasis { font:var(--st-font-22ppb)!important; }
    .headline-secondary .heading-secondary-title { font:var(--st-font-24tksb)!important; }
    #blog { margin-bottom:36px!important; }
    
    #sidebar { width:100%!important; top:98%!important; flex-direction:row!important; flex-wrap:wrap!important; justify-content:center!important; }
    #sidebar .sidebar-button { width:100px!important; border-radius:0!important; }
    #sidebar .sidebar-button::after { content:''!important; transform:translateY(0)!important; }
    #sidebar .sidebar-button i { transform:translateX(0)!important; }

    #information { margin-bottom:48px!important; }
    #information .information-featured-area .information-featured-title { margin:0!important; }
    #information .information-featured-area .information-featured-content { margin:0!important; }
    #product .product-card .product-card-features-spot ul li { font:var(--st-font-14ppr)!important; }

    footer {
        & .footer-area { padding:36px 4px 0!important;
            & .footer-title { margin:0!important; }
            & .footer-contact .footer-contact-telephone {
                & span { font:var(--st-font-16ppb)!important; }
                & a { font:var(--st-font-22ppb)!important; }
            }
            & .footer-contact .footer-contact-content img { display:none!important; }
        }

        & .footer-design { margin:24px 0 50px!important; padding:0 8px!important;
            & img { max-width:100%!important; object-fit:contain!important; }
        }
    }
}

@media (max-width:479.98px) {
    header .header-area { margin-bottom:16px!important;
        & .row div:first-child { display:none!important; }
    }

    #slider { margin-bottom:24px!important;
        & .slider-area { transform:translate(-33%,60%)!important;
            & .slider-title { margin:0!important; font:var(--st-font-22ppb)!important; line-height:36px!important; }
            & .slider-content { font:var(--st-font-16ppsb)!important; line-height:30px!important; }
            & .slider-button { margin:0!important; }
        }
    }

    #heading .heading-area .heading-title { font:var(--st-font-20ppb)!important; }

    #counter {
        & picture:first-child { transform:translateX(-50%) scale(4)!important; }
        & p { padding-bottom:24px!important; position:relative!important; top:10%!important; left:0%!important; font:var(--st-font-28tksb)!important; line-height:36px!important; border-bottom:solid 1px var(--st-color-white); }
        & .last-row > div { picture { left:10%!important; } }
    }

    #information .information-form { padding:30px 0 30px 10px!important; }
    #information .information-about img { display:none!important; }
    #message-form .message-form-area { padding:30px 20px!important; }
    #message-form .message-form-consultant .message-form-consultant-title { font:var(--st-font-24tksb)!important; }
    footer { margin-bottom:24px!important; }
    #sidebar { top:97%!important; }
    #sidebar .sidebar-button { width:85px!important; }
}

@media (max-width:374.98px) {
    #slider .slider-area { transform:translate(-16%,33%)!important; }

    #information .information-company-area {
        & a { padding:14px 24px!important; }
        & .information-company-button { padding:13px 24px!important; }
    }
}
/**/

/*TAMAMLANDI*/
header { padding:16px 0; position:relative; top:0; background-color:var(--st-color-blue); z-index:1;
    &.scroll-line { border-bottom:solid 2px var(--st-color-black); }

    & .header-area { min-height:40px; margin-bottom:24px; display:flex; align-items:center; color:var(--st-color-darkgray); background-color:var(--st-color-gray);
        & .header-telephone { font:var(--st-font-16ppb);
            & a { margin:0 8px; color:var(--st-color-aqua); transition:color 0.4s;
                &:hover { color:var(--st-color-black); }
            }
        }
        & .header-content { font:var(--st-font-12ppr); }

        & ul.header-right { display:inline-flex;
            & li { margin-right:4px; transition:background-color 0.4s;
                &.header-language { margin-left:8px; padding:4px 0 0 16px; font:var(--st-font-12ppb); border-left:solid 1px var(--st-color-white);
                    & a { color:var(--st-color-darkgray); transition:color 0.4s;
                        &:hover { color:var(--st-color-black); background-color:none; }
                    }

                    & ul li a { color:var(--st-color-black); }

                    &:hover .dropdown-menu { margin:0; left:-200px; display:grid; grid-template-columns: repeat(3, 1fr); }
                    &:hover { background-color:var(--st-color-gray);
                        & ul li:hover { background-color:var(--st-color-white); }
                    }
                }

                & img { transition:filter 0.25s;
                    &:hover { filter:brightness(0) sepia(1) saturate(100%) contrast(100%) invert(1); }
                }

                &:hover { background-color:var(--st-color-aqua); }
            }
        }
    }

    & nav { font:var(--st-font-16ppsb);
        & ul li { margin-left:40px; position:relative;
            & a { color:var(--st-color-white);
                &::before { content:""; width:calc(100% + 20px); height:calc(100% + 30px); position:absolute; top:-20px; left:-10px; border-bottom:solid 4px var(--st-color-white); opacity:0; transition:opacity 0.4s; z-index:-10; }
                &:hover::before { opacity:1; }
            }
        }

        & .nav-item.dropdown:hover .dropdown-menu { margin-top:8px; padding:20px; display:flex; flex-wrap:wrap; border:solid 1px var(--st-color-darkgray); box-shadow:rgba(100, 100, 111, 0.60) 0px 7px 29px 0px; --bs-dropdown-link-hover-bg:none; --bs-dropdown-link-active-bg:none;
            & li { margin:8px 0 8px 16px; }
        }

        & .nav-item.dropdown:hover .dropdown-menu-750 { width:750px; transform:translateX(-40%); }
        & .nav-item.dropdown:hover .dropdown-menu-250 { width:250px; transform:translateX(-22%); }

        & .nav-item.dropdown:hover a.dropdown-item { width:333px; color:var(--st-color-darkgray);
            &::before { border:none; }
            &:hover { color:var(--st-color-white); }
        }
    }

    & #menuModal a { font:var(--st-font-16ppb); color:var(--st-color-black); }
}

/* TAMAMLANDI */
#slider { margin-bottom:72px; background-color:var(--st-color-blue);
    & .slider-image { width:100%; height:auto; padding:180px 0 80px; display:flex; justify-content:center; overflow:hidden; z-index:-1; }
    & .slider-area { max-width:400px; position:absolute; top:0; left:40%; color:var(--st-color-white); text-align:center; transform:translate(0%,100%); z-index:0;
        & .slider-title { margin:0 16px; font:var(--st-font-24ppsb); line-height:40px; color:var(--st-color-white); }
        & .slider-content { margin:0; padding:8px 24px 24px; font:var(--st-font-24rsr); line-height:28px; color:var(--st-color-white); text-shadow:2px 2px 0px rgba(0, 0, 0, 0.7), -2px -2px 0px rgba(0, 0, 0, 0.7), 2px -2px 0px rgba(0, 0, 0, 0.7), -2px 2px 0px rgba(0, 0, 0, 0.7); }
        & .slider-button { margin-left:24px; padding:12px 36px; font:var(--st-font-16ppsb); color:var(--st-color-white); border:solid 2px var(--st-color-white); border-radius:var(--st-radius-24); transition:color 0.4s ease, background-color 0.4s ease;
            &:hover { color:var(--st-color-white); background-color:var(--st-color-gray); }
        }
    }
}

/* TAMAMLANDI */
#heading { min-height:120px; margin:15px 0 30px; position:relative; display:flex; flex-direction:column; align-items:center; text-align:center;
    & .heading-image { width:100%; height:100%; position:absolute; top:0; bottom:0; left:0; right:0; overflow:hidden; z-index:-1;
        & img { border-radius:var(--st-radius-16); }
    }
    & .heading-area { min-height:130px; margin-bottom:25px; display:flex; flex-direction:column; justify-content:center; align-items:center; color:var(--st-color-white);
        & .heading-title { font:var(--st-font-24ppsb); }
    }
    & .heading-map { display:flex; justify-content:start; font:var(--st-font-12ppr); color:var(--st-color-black);
        & i { margin-right:10px; }
        & span { margin:0 5px; }
        & a { color:var(--st-color-black);
            &:hover { text-decoration:underline; }
        }
    }
}

#information { margin-bottom:90px;
    & .information-image { margin-bottom:70px; display:flex; justify-content:center; }

    & .information-form { width:500px; max-height:600px; margin-left:5%; padding:30px 60px 30px 30px; color:var(--st-color-softblack); background-color:var(--st-color-softblue); border-radius:var(--st-radius-16);
        & .information-form-area { width:80%; margin-left:48px;
            & .information-form-title { margin-bottom:24px; font:var(--st-font-24pps); }
            & .form-group label { margin-bottom:8px; font:var(--st-font-14ppr); }
            & .form-group input, .form-group textarea { margin-bottom:16px; padding:8px; font:var(--st-font-12ppr); color:var(--st-color-softblack); border-radius:var(--st-radius-16);
                &::placeholder { color:var(--st-color-darkgray); }
            }
            & .information-form-button { text-align:center;
                & .information-form-button-primary { padding:10px 16px; font:var(--st-font-14ppsb); color:var(--st-color-white); background-color:var(--st-color-blue); border-radius:var(--st-radius-16); transition:background-color 0.6s ease;
                    &:hover { background-color:var(--st-color-darkblue); }
                }
            }
        }
    }

    & .information-area { background-color:var(--st-color-white);
        & .information-title { margin:44px 0 8px; font:var(--st-font-36tksb); color:var(--st-color-softblack); }
        & .information-spot { width:90%; margin-bottom:8px; font:var(--st-font-14ppr); color:var(--st-color-gray); }
        & .information-content { margin-bottom:49px; font:var(--st-font-14ppr); line-height:24px; color:var(--st-color-gray); }
        & a { margin-right:16px; padding:10px 30px; font:var(--st-font-14ppsb); color:var(--st-color-blue); border:solid 1px var(--st-color-softgray); border-radius:var(--st-radius-16); transition:color 0.15s ease, background-color 0.6s ease;
            &:hover { color:var(--st-color-white); background-color:var(--st-color-gray); }
        }
        & .information-button { padding:13px 36px; font:var(--st-font-14ppsb); color:var(--st-color-white); background-color:var(--st-color-softblack); border-radius:var(--st-radius-16); transition:color 0.15s ease, background-color 0.6s ease;
            &:hover { background-color:var(--st-color-darkblack); }
        }
    }

    & .information-company-area { background-color:var(--st-color-white);
        & .information-company-title { margin:44px 0 8px; font:var(--st-font-36tksb); color:var(--st-color-softblack); }
        & .information-company-spot { width:90%; margin-bottom:8px; font:var(--st-font-14ppr); color:var(--st-color-gray); }
        & .information-company-content { margin-bottom:49px; font:var(--st-font-14ppr); line-height:24px; color:var(--st-color-gray); }
        & a { margin-right:16px; padding:10px 30px; font:var(--st-font-14ppsb); color:var(--st-color-blue); border:solid 1px var(--st-color-softgray); border-radius:var(--st-radius-16); transition:color 0.15s ease, background-color 0.6s ease;
            &:hover { color:var(--st-color-white); background-color:var(--st-color-gray); }
        }
        & .information-company-button { padding:13px 36px; font:var(--st-font-14ppsb); color:var(--st-color-white); background-color:var(--st-color-softblack); border-radius:var(--st-radius-16); transition:color 0.15s ease, background-color 0.6s ease;
            &:hover { background-color:var(--st-color-darkblack); }
        }
    }

    & .information-featured-area { background-color:var(--st-color-white);
        & .information-featured-title { margin:44px 0 8px; font:var(--st-font-24tksb); color:var(--st-color-softblack); }
        & .information-featured-spot { width:90%; margin-bottom:8px; font:var(--st-font-14ppr); color:var(--st-color-gray); }
        & .information-featured-content { margin-bottom:49px; font:var(--st-font-14ppr); line-height:24px; color:var(--st-color-gray); }
        & a { margin-right:16px; padding:10px 30px; font:var(--st-font-14ppsb); color:var(--st-color-blue); border:solid 1px var(--st-color-softgray); border-radius:var(--st-radius-16); transition:color 0.15s ease, background-color 0.6s ease;
            &:hover { color:var(--st-color-white); background-color:var(--st-color-gray); }
        }
        & .information-featured-button { padding:13px 36px; font:var(--st-font-14ppsb); color:var(--st-color-white); background-color:var(--st-color-softblack); border-radius:var(--st-radius-16); transition:color 0.15s ease, background-color 0.6s ease;
            &:hover { background-color:var(--st-color-darkblack); }
        }
    }
}

/* TAMAMLANDI */
#category { margin-bottom:60px;
    & .category-card { margin-bottom:24px; padding:16px 0 12px; text-align:center; background-color:var(--st-color-white); border:solid 1px var(--st-color-gray); transition:background-color 0.25s linear;
        & img { margin:24px 0; }
        & .category-card-name { min-width:200px; margin:16px 0 0; font:var(--st-font-18pps); color:var(--st-color-black); }
        & .category-card-button { width:60%; margin:12px 22% 30px; padding:8px 0; display:flex; align-items:center; justify-content:center; gap:8px; font:var(--st-font-16pps); color:var(--st-color-white); background-color:var(--st-color-orange); border-radius:var(--st-radius-16); transition:background-color 0.6s ease;
            & i { font:var(--st-font-24pps); }
        }
        & .category-card-content { padding:0 16px; font:var(--st-font-14ppr); color:var(--st-color-darkgray); }
        &:hover { background-color:var(--st-color-softaqua);
            & .category-card-name { color:var(--st-color-darkblack); }
            & .category-card-button { color:var(--st-color-black); background-color:var(--st-color-white); }
            & .category-card-spot { color:var(--st-color-darkblack); }
        }
    }

    & .category-featured-card { padding:36px 0 0 26px; margin-bottom:24px; position:relative; overflow:hidden;
        & img { position:absolute; bottom:0; right:0; object-fit:cover; z-index:1; }
        & .category-featured-card-title { margin-bottom:26px; font:var(--st-font-12pps); color:var(--st-color-white);
            & span { color:var(--st-color-yellow); }
        }
        & .category-featured-card-spot { max-width:300px; margin-bottom:40px; font:var(--st-font-26ib); color:var(--st-color-white); }
        & .category-featured-card-button { margin-bottom:36px; font:var(--st-font-14ppr); color:var(--st-color-gray); }
    }

    & .category-featured-card-one { background-color:var(--st-color-softbrown); border-radius:var(--st-radius-16); }
    & .category-featured-card-two { background-color:var(--st-color-softblue); border-radius:var(--st-radius-16); }
    & .category-featured-card-three { height:502px; background-color:var(--st-color-lightblue); border-radius:var(--st-radius-16);
        & span { color:var(--st-color-black)!important; }
    }
    & .category-featured-card-four { background-color:var(--st-color-darkbrown); border-radius:var(--st-radius-16); }
    & .category-featured-card-five { background-color:var(--st-color-blue); border-radius:var(--st-radius-16); }
}

#product { margin-bottom:80px;
    & .product-display { background-color:var(--st-color-white); }
    & .product-card { max-width:100%; max-height:700px; margin-bottom:24px; padding:18px; text-align:center; background-color:var(--st-color-white); border:solid 1px var(--st-color-darkgray); border-radius:var(--st-radius-16);
        & .product-card-name { margin:16px 0 12px; font:var(--st-font-16ppb); color:var(--st-color-softblack); }
        & .product-card-capacity { margin:24px 0 0; padding-bottom:24px; border-bottom:solid 1px var(--st-color-darkgray);
            & span:first-child { margin-right:16px; font:var(--st-font-14ppb); color:var(--st-color-softblack); }
            & span:last-child { padding:8px 16px; font:var(--st-font-14ppb); background-color:var(--st-color-gray); color:var(--st-color-softblack); border-radius:var(--st-radius-16); }
        }
        & .product-card-spot { margin:8px 0 24px; font:var(--st-font-14ppr); color:var(--st-color-gray); }
        & .product-card-stars { display:none; }
        & .product-card-price { font:var(--st-font-14ppb); color:var(--st-color-softblack); }
        & .product-card-campaign { font:var(--st-font-14ppr); color:var(--st-color-green); }
        & .product-card-features-spot {
            & ul { margin-bottom:24px;
                & li { margin-bottom:8px; display:grid; grid-template-columns:1fr 1fr; column-gap:8px; font:var(--st-font-13ppr); color:var(--st-color-softblack);
                    & strong, span { padding:8px 0 8px 10px; display:flex; align-items:center; background-color:var(--st-color-lightgray); }
                }
            }
        }
        & .product-card-button { font:var(--st-font-14ppb);
            & .product-card-button-primary { margin-bottom:8px; padding:11px 34px; display:inline-flex; color:var(--st-color-white); background-color:var(--st-color-blue); border-radius:var(--st-radius-16); transition:background-color 0.4s ease;
                &:hover { background-color:var(--st-color-darkblue); }
            }
            & .product-card-button-secondary { padding:10px 24px; display:inline-flex; font:var(--st-font-14ppb); color:var(--st-color-softblack); text-decoration:none; border:solid 1px var(--st-color-softblack); border-radius:var(--st-radius-16); transition:color 0.15s ease, background-color 0.6s ease;
                &:hover { color:var(--st-color-white); background-color:var(--st-color-gray); }
            }
        }
    }
}

#product-image { margin-bottom:40px;
    & .product-image-big { display:flex; justify-content:center;
        & img { max-width:1440px; height:auto; }
    }

    & .product-image-small { display:flex; justify-content:center;
        & ul li { max-width:180px; max-height:250px; margin:10px 9px; padding:13px; box-sizing:border-box; border:solid 1px var(--st-color-gray); border-radius:var(--st-radius-16);
            &:hover { outline:solid 3px var(--st-color-blue); }
            &:target { outline:solid 3px var(--st-color-darkblue); }
        }
        & img { max-width:100px; }
    }
}

#product-image-big-preview { transition:opacity 0.45s ease; opacity:1; }

#product-features { margin-bottom:40px;
    & .product-features-title { margin-bottom:24px; font:var(--st-font-30ppb); color:var(--st-color-softblack); text-align:center; }
    & ul { width:1200px; margin:0 auto; display:grid; grid-template-columns:repeat(2, 1fr); column-gap:16px;
        & li { padding:24px 36px; font:var(--st-font-16ppr);
            &:nth-child(4n + 1),
            &:nth-child(4n + 2) {
                background-color:var(--st-color-softblue);
            }

            &:nth-child(4n + 3),
            &:nth-child(4n + 4) {
                background-color: var(--row-bg, white);
            }

            strong { padding-right:8px; }
        }
    }
}

/* TAMAMLANDI */
#counter { min-height:200px; max-height:800px; margin-bottom:70px; position:relative; overflow:hidden;
    & picture { position:absolute; top:0; left:50%; transform:translateX(-50%); object-fit:cover; z-index:-1; }

    & p { position:absolute; top:20%; left:20%; font:var(--st-font-26rsb); line-height:46px; color:var(--st-color-white); z-index:1; }

    & .last-row { padding-bottom:36px; }
    & .last-row > div { padding:36px 0 0; position:relative;

        &:first-child { color:var(--st-color-white);
            & div:first-child { padding-left:80px; font:var(--st-font-25ppb); }
            & div:last-child { padding-left:80px; font:var(--st-font-15pps); }
        }

        &:not(:first-child) { color:var(--st-color-white);
            & div:first-child { padding-left:80px; font:var(--st-font-25ppb); }
            & div:last-child { padding-left:80px; font:var(--st-font-15pps); }
        }

        & picture { position:absolute; top:40px; left:20px; }
    }
}

#blog { margin-bottom:66px;
    & .blog-card { max-width:100%; margin-bottom:24px; position:relative; background-color:var(--st-color-white);
        & img { width:100%; margin-bottom:24px; }
        & time { min-width:165px; max-width:265px; padding:3px 0 6px; text-align:center;
            & span { font:var(--st-font-11ppl); color:var(--st-color-softgray); }
        }
        & .blog-card-name { margin-bottom:8px; font:var(--st-font-16ppsb); line-height:28px; color:var(--st-color-softblack); }
        & .blog-card-spot { margin-bottom:16px; font:var(--st-font-12ppr); line-height:22px; color:var(--st-color-gray); }
        & .blog-card-read { font:var(--st-font-18tksb); color:var(--st-color-blue); text-decoration:underline; }
        & a { img { transition:transform 0.4s ease; }
            &:hover { img { transform:scale(1.05); } }
        }
    }

    & .blog-card-advice { max-width:100%; margin-bottom:24px; padding:16px 16px 0; position:relative; background-color:var(--st-color-white); border:solid 1px var(--st-color-gray);
        & img { width:100%; }
        & .blog-card-advice-name { margin-bottom:8px; font:var(--st-font-16ppsb); line-height:24px; color:var(--st-color-softblack); }
        & .blog-card-advice-spot { margin-bottom:16px; font:var(--st-font-12ppr); line-height:22px; color:var(--st-color-gray); }
        & .blog-card-advice-read { font:var(--st-font-18tksb); color:var(--st-color-softgray); text-decoration:underline; }
        & a:hover { text-decoration:underline; text-decoration-color:var(--st-color-black); }
    }

    & .blog-paging { text-align:center;
        & ul li { min-width:35px; min-height:45px; margin-right:10px; display:inline-flex; justify-content:center; align-items:center; font:var(--st-font-14ppr); border:solid 1px var(--st-color-gray); border-radius:var(--st-radius-16); transition:background-color 0.4s ease;
            & a { padding:12px 12px 10px; color:var(--st-color-softblack);
                &:hover { color:var(--st-color-white); }
            }
            &:hover { background-color:var(--st-color-gray); }
        }
    }
}

/* TAMAMLANDI */
#location { margin-bottom:60px;
    & .location-card { margin-bottom:24px; padding:16px 16px 0; border:solid 1px var(--st-color-gray);
        & .location-card-name { font:var(--st-font-16ppsb); color:var(--st-color-brown); }
        & .location-card-spot { font:var(--st-font-14ppr); color:var(--st-color-darkgray); }
        & .location-card-read { font:var(--st-font-12ppr); color:var(--st-color-gray); text-decoration:underline; }
        &:hover { text-decoration:underline; text-decoration-color:var(--st-color-darkgray); border:solid 1px var(--st-color-gray); }
    }

    & .location-card-advice { margin-bottom:24px; padding:0 16px; border:solid 1px var(--st-color-gray);
        & .location-card-advice-name { font:var(--st-font-16ppsb); color:var(--st-color-brown); }
        & .location-card-advice-spot { font:var(--st-font-14ppr); color:var(--st-color-darkgray); }
        & .location-card-advice-read { font:var(--st-font-12ppr); color:var(--st-color-gray); text-decoration:underline; }
        &:hover { text-decoration:underline; text-decoration-color:var(--st-color-darkgray); border:solid 1px var(--st-color-gray); }
    }

    & .location-paging { margin-bottom:24px; text-align:center;
        & ul li { min-width:35px; min-height:45px; margin-right:10px; display:inline-flex; justify-content:center; align-items:center; font:var(--st-font-14ppr); border:solid 1px var(--st-color-softblack); transition:background-color 0.4s ease;
            & a { padding:12px 12px 10px; color:var(--st-color-black);
                &:hover { color:var(--st-color-white); }
            }
            &:hover { background-color:var(--st-color-orange); border-color:var(--st-color-orange); }
        }
    }
}

#reference { margin-bottom:70px;
    & ul { text-align:center;
        & li { margin-bottom:16px; }
    }
}

#content { margin-bottom:80px;
    & .content-line { width:100%; height:2px; margin:10px 0 40px; background-color:var(--st-color-softblue); }

    & h1, h2, h3, h4, h5, h6 { margin-bottom:30px; text-align:center; color:var(--st-color-softblack); }
    & h1 { font:var(--st-font-36tksb); }
    & h2 { font:var(--st-font-34tksb); }
    & h3 { font:var(--st-font-32tksb); }
    & h4 { font:var(--st-font-30tksb); }
    & h5 { font:var(--st-font-28tksb); }
    & h6 { font:var(--st-font-26tksb); }
    & p { margin-bottom:30px; font:var(--st-font-14ppr); line-height:26px; color:var(--st-color-gray); }
    & a { font:var(--st-font-14ppsb); color:var(--st-color-darkblack);
        &:hover { text-decoration:underline; }
    }
    & .content-popup { max-height:320px; margin-bottom:20px; transition:max-height 0.4s ease; overflow:hidden; }
    & .content-button { text-align:center;
        & .content-button-primary { padding:12px 24px; font:var(--st-font-14ppsb); color:var(--st-color-softblack); border:solid 2px var(--st-color-softblack); border-radius:var(--st-radius-24); transition:background-color 0.4s ease; cursor:pointer;
            &:hover { color:var(--st-color-white); background-color:var(--st-color-gray); text-decoration:none; }
        }
    }

    & .content-end { padding:30px 0 5px; display:flex; justify-content:space-between; align-items:center;
        & .content-end-left { margin-right:30px; font:var(--st-font-16ppsb);
            & a { padding:16px 24px; color:var(--st-color-softblack); border:solid 1px var(--st-color-gray); border-radius:var(--st-radius-16); transition:background-color 0.6s ease;
                &:hover { color:var(--st-color-white); background-color:var(--st-color-blue); }
            }
        }

        & .content-end-right { font:var(--st-font-16ppsb); color:var(--st-color-softblack);
            & span a { margin-right:5px; padding:12px 0; text-decoration:none; border:solid 1px var(--st-color-gray); border-radius:var(--st-radius-16); transition:background-color 0.6s ease;
                & img { padding:12px; }
                &:hover { background-color:var(--st-color-blue); }
                & img:hover { filter:brightness(0) sepia(1) saturate(100%) contrast(100%) invert(1); }
            }
        }
    }
}


#faq { margin-bottom:24px; display:flex; flex-direction:column; align-items:center;
    & .row { padding:10px 0;
        & img { border-radius:var(--st-radius-16); }
    }
    & dl { margin-top:8px;
        & dt { margin-bottom:16px; padding:34px 80px; font:var(--st-font-16ppsb); color:var(--st-color-softblack); background:url('../uploads/sss.webp') no-repeat 20px center; background-color:var(--st-color-softgray); transition:color 0.4s ease, background-color 0.4s ease, background 0.4s ease;
            & i { margin-right:8px; }
            &:first-child { border:none; }
            &:hover { color:var(--st-color-white); background:url('../uploads/sss-hover.webp') no-repeat 20px center; background-color:var(--st-color-gray); cursor:pointer; }
        }
        & .active { color:var(--st-color-white); background:url('../uploads/sss-hover.webp') no-repeat 20px center; background-color:var(--st-color-blue); cursor:pointer;
            &:hover { background-color:var(--st-color-gray); }
        }
        & dd { max-height:0; padding:0 20px; font:var(--st-font-14ppr); line-height:26px; transition:max-height 0.4s ease, padding 0.4s ease; overflow:hidden; }
        & .show { max-height:500px; padding:20px; }
    }
}

footer { display:flex; flex-direction:column; align-items:center;
    & .footer-area { width:100%; max-width:1440px; background-color:var(--st-color-blue);
        & .footer-line { margin-right:24px; border-right:solid 2px var(--st-color-white); }

        & .footer-title { margin:36px 0 16px; font:var(--st-font-16ppsb); color:var(--st-color-white); }

        & .line-area { width:85%; margin-bottom:8px; display:inline-flex; align-items:center;
            & .line-rectangle { width:60px; height:7px; margin:8px 0; background-color:var(--st-color-white); }
            & .line { height:1px; flex-grow:1; background-color:var(--st-color-white); }
        }

        & ul { list-style:none;
            & li { margin-bottom:6px;
                & .bi-circle-fill { margin-right:4px; font-size:0.5rem; flex-shrink:0; color:var(--st-color-white); }
                &:last-child { margin-bottom:36px; }
                & a { font:var(--st-font-13ppr); color:var(--st-color-white);
                    &:hover { text-decoration:underline; }
                }
            }
        }

        & .footer-menu-other a { font:var(--st-font-11ps); color:var(--st-color-softgreen); text-decoration:underline; }

        & .footer-contact { margin:60px 0 0; padding:24px; color:var(--st-color-white); background-color:var(--st-color-darkblue);
            & .footer-contact-title { margin-bottom:16px; font:var(--st-font-18pps); color:var(--st-color-softorange); }
            & .footer-contact-spot { margin-bottom:24px; font:var(--st-font-12ppr); }
            & .footer-contact-telephone { margin-bottom:24px; padding-bottom:16px; border-bottom:solid 1px var(--st-color-white);
                & span { font:var(--st-font-18pps); color:var(--st-color-softorange); }
                & i { margin-right:8px; color:var(--st-color-softorange); }
                & a { font:var(--st-font-36ppb); color:var(--st-color-orange);
                    &:hover { text-decoration:underline; }
                }
            }
            & .footer-contact-mail { margin-top:8px; font:var(--st-font-16ppsb);
                & i { margin-right:8px; color:var(--st-color-darkblue); }
                & a { color:var(--st-color-darkblue);
                    &:hover { text-decoration:underline; }
                }
            }
            & .footer-contact-content { font:var(--st-font-14ppr); color:var(--st-color-gray);
                & img { margin-right:36px; }
            }
        }
    }

    & .footer-design { width:100%; margin:16px 0; font:var(--st-font-14ppr); background-color:var(--st-color-white);
        & .col-8 { text-align:left; align-content:center; }
        & .col-4 { text-align:right; }
    }
}

#message-form { max-width:1320px; margin-bottom:48px;
    & .message-form-area { margin-bottom:24px; padding:30px 40px; color:var(--st-color-softblack); background-color:var(--st-color-softblue);
        & .message-form-title { margin-bottom:24px; font:var(--st-font-16ppb); color:var(--st-color-black);}
        & .message-form-content { margin-bottom:24px; font:var(--st-font-13ppr); }
        & .form-group label { margin-bottom:8px; font:var(--st-font-14ppsb); }
        & .form-group input, .form-group textarea { margin-bottom:16px; padding:8px; font:var(--st-font-14ppr); color:var(--st-color-softblack);
            &::placeholder { color:var(--st-color-softblack); }
        }
        & .message-form-button { text-align:center;
            & .message-form-button-primary { padding:10px 16px; font:var(--st-font-14ppsb); color:var(--st-color-softblack); background-color:var(--st-color-white); border:solid 1px var(--st-color-softblack); border-radius:var(--st-radius-16); transition:color 0.15s ease, background-color 0.4s ease;
                &:hover { color:var(--st-color-white); background-color:var(--st-color-gray); }
            }
        }
    }

    & .message-form-consultant { margin-bottom:24px; text-align:center;
        & .message-form-consultant-telephone { margin-right:10px; padding:16px 24px; display:inline-flex; background-color:var(--st-color-gray); transition:color 0.1s ease, background-color 0.4s; cursor:pointer; }
        & .message-form-consultant-whatsapp1 { padding:16px 24px; display:inline-flex; background-color:var(--st-color-gray); transition:color 0.1s ease, background-color 0.4s; cursor:pointer; }
        & .message-form-consultant-question { margin-right:10px; padding:16px 24px; display:inline-flex; background-color:var(--st-color-gray); transition:color 0.1s ease, background-color 0.4s; cursor:pointer; }
        
        & .message-form-consultant-telephone:hover { background-color:var(--st-color-darkblue); border-color:var(--st-color-darkblue); }

        & .message-form-consultant-whatsapp1:hover,
          .message-form-consultant-whatsapp2:hover { background-color:var(--st-color-green); border-color:var(--st-color-green); }
        
        & .message-form-consultant-question:hover { background-color:var(--st-color-orange); border-color:var(--st-color-orange); }

        & .message-form-consultant-telephone a,
          .message-form-consultant-whatsapp1 a,
          .message-form-consultant-question button { margin-top:2px; display:block; font:var(--st-font-16ppsb); color:var(--st-color-white); }

        & .message-form-consultant-telephone:hover a,
          .message-form-consultant-whatsapp1:hover a,
          .message-from-consultant-question:hover button { color:var(--st-color-white); }
    }
}

#contact { margin-bottom:60px;    
    & .contact-information { margin-bottom:25px; padding-bottom:15px; text-align:center;
        & .contact-information-content { margin-bottom:40px; font:var(--font-16ppr); }
        & .contact-information-title { margin-bottom:10px; font:var(--st-font-36tksb); color:var(--st-color-softblack); }
        & .contact-information-telephone { font:var(--st-font-60tksb);
            & a { color:var(--st-color-softblack); }
        }
    }

    & .contact-branch { margin-bottom:48px; display:flex; gap:16px; flex-wrap:wrap; font:var(--font-14ppr);
        & .contact-branch-card { padding:10px; flex:1 1 calc(40% - 16px); border:solid 1px var(--st-color-softgray);
            & picture { width:40%; float:left;
                & img { width:250px; height:250px; }
            }
            & .contact-branch-card-area { width:56%; float:right; color:var(--st-color-softblack);
                & .contact-branch-card-title { margin-bottom:15px; padding:5px 12px; font:var(--st-font-16ppsb); color:var(--st-color-white); background-color:var(--st-color-gray); }
                & p { margin-bottom:3px; }
                & a { color:var(--st-color-softblack); }
                & strong { font-weight:bold; }
            }
        }
    }

    & .contact-form { padding:48px; background-color:var(--st-color-softblue);
        & .contact-form-title { margin-bottom:25px; font:var(--st-font-36tksb); color:var(--st-color-softblack); text-align:center; }
        & .contact-form-content { margin-bottom:24px; font:var(--st-font-14ppr); color:var(--st-color-softblack); }
        & .form-group label { margin-bottom:8px; font:var(--st-font-14ppsb); }
        & .form-group input, .form-group textarea { margin-bottom:24px; padding:12px; font:var(--st-font-14ppr); color:var(--st-color-black);
            &::placeholder { color:var(--st-color-softblack); }
            &.form-control { border-radius:0; }
        }
        & .contact-form-button { font:var(--st-font-16ppsb); text-align:center;
            & .contact-form-button-primary { padding:18px; color:var(--st-color-softblack); background-color:var(--st-color-white); border:solid 1px var(--st-color-softblack); border-radius:var(--st-radius-16); transition:color 0.15s ease, background-color 0.4s ease;
                &.btn { border-radius:0; }
                &:hover { color:var(--st-color-white); background-color:var(--st-color-gray); }
            }
        }
    }
}

/* TAMAMLANDI */
#sidebar { position:fixed; top:55%; right:0; display:flex; flex-direction:column; align-items:flex-end; transform:translateY(-50%); z-index:9998;
    & .sidebar-button { width:50px; height:50px; margin-bottom:4px; padding-left:6px; position:relative; display:flex; justify-content:center; align-items:center; color:var(--st-color-white); border-radius:20px 0 0 20px; transition:width 0.4s ease, background-color 0.4s ease; cursor:pointer;
        &.orange { background-color:var(--st-color-orange); }
        &.green { background-color:var(--st-color-green); }
        &.darkblue { background-color:var(--st-color-darkblue); }
        &.black { background-color:var(--st-color-black); }
        & i { font:var(--st-font-20ppb); transition:transform 0.4s ease; }
    }

    & .sidebar-button:hover{ width:170px;
        & i { transform:translateX(-60px); }
        &::after { content:attr(data-tooltip); padding:5px 10px; position:absolute; top:50%; right:0; color:var(--st-color-white); white-space:nowrap; transform:translateY(-50%); z-index:999; }
    }
}

/* TAMAMLANDI */
#popup-form { width:100%; height:100%; position:fixed; top:0; left:0; display:flex; background-color:rgb(0 0 0 / .85); justify-content:center; align-items:center; z-index:9999;
    & .popup-form-area { min-width:360px; max-width:600px; margin:16px; padding:24px; position:relative; color:var(--st-color-black); background-color:var(--st-color-white); border:solid 3px var(--st-color-aqua); border-radius:var(--st-radius-16); transform:translateX(0);
        & .popup-form-close { padding:0 6px 2px; position:absolute; right:10px; font:var(--st-font-20ib); color:var(--st-color-black); background:none; cursor:pointer; border:solid 1px var(--st-color-black); border-radius:16px; }

        & .popup-form-title { margin-bottom:24px; font:var(--st-font-30tksb); }
        & .popup-form-content { margin-bottom:24px; font:var(--st-font-14ppr); }
        & .form-group label { margin-bottom:8px; font:var(--st-font-14ppsb); }
        & .form-group input, .form-group textarea { margin-bottom:16px; padding:8px; font:var(--st-font-14ppr); color:var(--st-color-black); border-radius:var(--st-radius-10);
            &::placeholder { color:var(--st-color-darkgray); }
        }
        & .popup-form-button { text-align:center;
            & .popup-form-button-primary { padding:10px 16px; font:var(--st-font-14ppsb); color:var(--st-color-white); background-color:var(--st-color-orange); border-radius:var(--st-radius-16); transition:background-color 0.6s ease;
                &:hover { background-color:var(--st-color-aqua); }
            }
        }
    }
}