@media screen and (min-width: 700px) {
    .mobile-only {
        display: none !important;
    }

    .contact-panel {
        display: none;
    }

}

/*DEFAULT LAPTOPS*/
@media screen and (min-width: 901px) and (max-width: 1599px) {
    .main_menu nav > ul > li > a {
        font-size: 13px;
        padding: 14px 15px 14px 15px;
    }

    .product-meta h5 {
        font-size: 16px;
    }
}

@media screen and (max-width: 700px) {
    .pc-only {
        display: none !important;
    }

    .pb-sm-80 {
        padding-bottom: 80px !important;
    }

    .pt-sm-80 {
        padding-top: 80px !important;
    }

    .pb-sm-60 {
        padding-bottom: 60px !important;
    }

    .pt-sm-60 {
        padding-top: 60px !important;
    }

    .pb-sm-40 {
        padding-bottom: 40px !important;
    }

    .pt-sm-40 {
        padding-top: 40px !important;
    }

    .pb-sm-20 {
        padding-bottom: 20px !important;
    }

    .pt-sm-20 {
        padding-top: 20px !important;
    }

    .hero-swiper .swiper-pagination {
        bottom: 20px;
        gap: 8px;
    }

    section.hero .swiper-slide {
        height: 80vh;
    }

    section.hero .swiper-slide {
        margin-top: 0;
    }

    .navbar-menu {
        position: fixed;
        width: 65%;
        right: -100%;
        top: 0;
        height: 100vh;
        background-color: #1f1f1f;
        transition: .4s ease-in-out;
        padding: 8rem 2.25rem;
        z-index: 999;
    }

    .navbar-menu.opened {
        right: 0;
    }

    .hero-meta {
        width: 90%;
    }

    .hero-meta h1 {
        font-size: 25px;
    }

    .navbar .logo img {
        width: 140px;
    }

    .navbar-toggler {
        padding: 1rem;
    }

    .navbar-toggler i {
        font-size: 20px;
    }

    .navbar-menu ul:not(.dropdown-menu) {
        flex-direction: column;
        gap: 1rem;
    }

    .education-levels {
        padding-bottom: 0;
    }

    .signature {
        margin-bottom: 20px;
    }

    .footer-bottom, .footer-top {
        padding-inline: 15px;
    }

    .footer-top .logo img {
        width: 140px;
    }

    .footer-social ul {
        justify-content: center;
    }

    .navbar-menu li a {
        font-size: 18px;
        font-weight: 500;
        color: #bebebe;
    }

    .intro-video iframe {
        height: 280px;
    }

    .section-padding {
        padding: 60px 15px;
    }

    .navbar-menu ul:not(.dropdown-menu) li {
        border-bottom: 1px solid #464646;
        padding-bottom: .7rem;
    }

    .contact-box {
        width: 100%;
        margin-bottom: 40px;
        padding-inline: 20px;
    }

    .page-banner-meta {
        padding-left: 15px;
    }

    .page-banner {
        height: 450px;
    }

    .contact-form form {
        width: 90%;
    }

    .about-parallax-wrapper .about-row,
    .about-parallax-wrapper .about-row.reverse {
        flex-direction: column;
    }

    .about-parallax-wrapper .about-text,
    .about-parallax-wrapper .about-image {
        width: 100%;
        padding: 20px 30px;
    }

    .about-parallax-wrapper .about-text p {
        font-size: 18px;
    }

    .about-parallax-wrapper .about-image {
        height: 320px;
    }

    .about-parallax-wrapper .about-parallax {
        inset: 0;
        transform: none !important;
    }

    .about-parallax-wrapper .about-row.reverse {
        flex-direction: column-reverse !important;
    }

    .modal-image img {
        width: 100%;
    }

    .announcement-card {
        flex-direction: column;
    }

    .announcement-img {
        width: 100%;
        height: 180px;
    }

    #modal-image {
        width: 100%;
    }

    .contact-panel {
        position: fixed;
        bottom: 0;
        width: 100%;
        left: 0;
        display: flex;
        z-index: 90;
    }

    a.contact-panel-item {
        width: 50%;
        padding-inline: 20px;
        background-color: var(--bg-main);
        color: #fff;
        font-size: 1.8rem;
        text-align: center;
        display: flex;
        justify-content: center;
        align-items: center;
        gap: .3rem;
        padding-block: .25rem;
    }

    a.contact-panel-item span {
        font-size: 1rem;
    }

    a.wp-btn {
        background-color: #39a91e;
        color: #fff;
    }

    .navbar-close.mobile-only {
        position: absolute;
        top: 3rem;
        left: 1.5rem;
        padding: 1rem;
    }

    .navbar-overlay.mobile-only {
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        background-color: #000;
        opacity: .7;
        z-index: 999;
        height: 100%;
    }

    .kvkk .container {
        padding-inline: 1rem;
    }

    footer {
        padding-bottom: 50px;
    }

    .dropdown-menu a {
        padding: 10px;
        font-size: 14px !important;
    }

    .dropdown-menu {
        background: #2f2f2f;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        border: 1px solid rgba(255, 255, 255, 0.35);
        border-radius: 0;
    }

    .mobile-submenu {
        position: fixed;
        width: 65%;
        right: -100%;
        top: 0;
        height: 100vh;
        background-color: #1f1f1f;
        transition: .4s ease-in-out;
        padding: 6rem 2.25rem 2rem;
        z-index: 1000; /* higher than navbar-menu */
    }

    .mobile-submenu.opened {
        right: 0;
    }

    .mobile-submenu-header {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        padding: 1.5rem 2.25rem;
        display: flex;
        align-items: center;
        gap: 12px;
        border-bottom: 1px solid #464646;
        color: #bebebe;
        font-weight: 500;
    }

    .mobile-submenu-back {
        display: flex;
        align-items: center;
        gap: 6px;
        background: none;
        border: none;
        color: #bebebe;
        font-size: 16px;
        cursor: pointer;
    }

    .mobile-submenu ul {
        margin-top: 1rem;
        display: flex;
        flex-direction: column;
        gap: 1rem;
    }

    .mobile-submenu li {
        border-bottom: 1px solid #464646;
        padding-bottom: 1.2rem;
    }

    .mobile-submenu li a {
        font-size: 16px;
        font-weight: 500;
        color: #bebebe;
    }

    button.mobile-submenu-open.flex.items-center.justify-between.w-full {
        font-size: 18px;
        font-weight: 500;
        color: #bebebe;
    }

    .about-rest-text p {
        text-align: left;
        font-size: 18px;
    }

    .about-rest {
        padding: 60px 30px;
    }

    .about .intro p {
        font-size: 18px;
        padding: 10px 30px;
    }

    .about .intro {
        padding: 80px 0 40px;
    }

    .page-banner-meta h1 {
        font-size: 26px;
    }
}