/*------------------------------------------------------------------//
//      RESPONSIVE SYSTEM                                                                                 //
//------------------------------------------------------------------*/
@media screen and (min-width: 1601px) {
    /* PC 1400+  */ 
    .mobile-hamburger-menu, .mContact {display: none !important;}
}
@media screen and (max-width: 1600px) and (min-width: 1369px) {
    /* BETWEEN SİZE */
    .mobile-hamburger-menu, .mContact {display: none !important;}
}
@media screen and (max-width: 1368px) and (min-width: 1199px) {
    /* LAPTOP */
    .mobile-hamburger-menu, .mContact {display: none !important;}
    .site-header nav.menu ul li a {padding: 0 10px;}
    main #services .items-list .service a .title {padding: 25px;}
    main #services .items-list .service a .cat {min-width: 560px;left: -70%;font-size: 13px;letter-spacing: 0.4em;}
    main #services .items-list .service a:hover:after {width: 60px; height: 60px; font-size: 25px; line-height: 60px;}
}
@media screen and (max-width: 1198px) and (min-width: 992px) {
    /* IPAD PRO */
    .mobile-hamburger-menu, .mContact {display: block !important;}
    .site-header {padding: 15px 0;}
    .site-header .main .menu {display: none;}

    main #services .items-list .service a .title {padding: 25px;}
    main #services .items-list .service a .cat {min-width: 560px;left: -70%;font-size: 13px;letter-spacing: 0.4em;}
    main #services .items-list .service a:hover:after {width: 60px; height: 60px; font-size: 25px; line-height: 60px;}
}
@media screen and (max-width: 991px) and (min-width: 768px) {
    /* TABLET 768+ ~ 960 */
    .mobile-hamburger-menu, .mContact {display: block !important;}
    .site-header {padding: 15px 0;}
    .site-header .main .menu {display: none;}

    main #services .items-list .service a .title {padding: 25px;}
    main #services .items-list .service a .cat {min-width: 560px;left: -65%;bottom: 43%;font-size: 13px;letter-spacing: 0.4em;}
    main #services .items-list .service a:hover:after {width: 60px; height: 60px; font-size: 25px; line-height: 60px;}

    main #comments .items .item {margin: 0 !important;} 

    footer .copyright {padding-bottom: 75px;}  
}
@media screen and (max-width: 767px) and (min-width: 640px) {
    /* TABLET 640+ ~ 768 */
    .mobile-hamburger-menu, .mContact {display: block !important;}
    .site-header {padding: 15px 0;}
    .site-header .main .menu {display: none;}
    .site-header .top .col-auto {display: none;}
    .site-header .main .logo {margin-top: 0 !important;}
    .site-header .main .logo img {width: 125px;}

    main #slider .items .item .desc {width: 90%;}
    main #slider .items .item .desc .title {font-size: 20px;}
    main #slider .items .item .desc p {font-size: 14px;margin: 15px 0;line-height: 22px;}

    main #services .items-list .service a .title {padding: 25px;}
    main #services .items-list .service a .cat {min-width: 560px;left: -75%;bottom: 53%;font-size: 13px;letter-spacing: 0.4em;}
    main #services .items-list .service a:hover:after {width: 60px; height: 60px; font-size: 25px; line-height: 60px;}

    main #comments .items .item {margin: 0 !important;} 

    footer .copyright {padding-bottom: 75px;}  
}
@media screen and (max-width: 639px) and (min-width: 480px) {
    /* MOBILE 480+ ~ 640 */
    .mobile-hamburger-menu, .mContact {display: block !important;}
    .site-header {padding: 15px 0;}
    .site-header .main .menu {display: none;}
    .site-header .top .col-auto {display: none;}
    .site-header .main .logo {margin-top: 0 !important;}
    .site-header .main .logo img {width: 125px;}

    main .section .head {margin-bottom: 35px;}
    main .section .head .title {font-size: 30px;line-height: 30px;letter-spacing: 0;}

    main #slider .items .item .desc {width: 90%;}
    main #slider .items .item .desc .title {font-size: 20px;}
    main #slider .items .item .desc p {font-size: 14px;margin: 15px 0;line-height: 22px;}

    main #about-us .text .head .title {font-size: 20px; line-height: 20px;}
    main #about-us .text p {font-size: 14px;}

    main #services .items-list .service a .title {padding: 25px;}
    main #services .items-list .service a .cat {min-width: 560px;left: -60%;bottom: 42%;font-size: 13px;letter-spacing: 0.4em;}
    main #services .items-list .service a:hover:after {width: 60px; height: 60px; font-size: 25px; line-height: 60px;}
    main #services .items-list .navs {display: none;}
    main #comments .items .slick-dots {bottom: -35px;}

    main #comments .items .item {margin: 0 !important;}
    main #comments .navs {margin-bottom: 35px;} 
    main #comments .navs .arrow {width: 40px; height: 40px; line-height: 40px;}

    main #instagram .head {display: block !important;line-height: 30px;padding: 25px 15px;}

    main #about-us, main #services {padding: 25px 0;}

    footer .copyright {padding-bottom: 75px;}  
}
@media screen and (max-width: 479px) and (min-width: 320px) {
    /* MOBILE 320+ ~ 480 */
    .mobile-hamburger-menu, .mContact {display: block !important;}
    .site-header {padding: 15px 0;}
    .site-header .main .menu {display: none;}
    .site-header .top .col-auto {display: none;}
    .site-header .main .logo {margin-top: 0 !important;}
    .site-header .main .logo img {width: 125px;}

    main .section .head {margin-bottom: 35px;}
    main .section .head .title {font-size: 30px;line-height: 30px;letter-spacing: 0;}

    main #slider .items .item .desc {width: 90%;}
    main #slider .items .item .desc .title {font-size: 20px;}
    main #slider .items .item .desc p {font-size: 14px;margin: 15px 0;line-height: 22px;}

    main #about-us .text .head .title {font-size: 20px; line-height: 20px;}
    main #about-us .text p {font-size: 14px;}

    main #services .items-list .service a .title {padding: 25px;}
    main #services .items-list .service a .cat {min-width: 560px;left: -60%;bottom: 42%;font-size: 13px;letter-spacing: 0.4em;}
    main #services .items-list .service a:hover:after {width: 60px; height: 60px; font-size: 25px; line-height: 60px;}
    main #services .items-list .navs {display: none;}
    main #comments .items .slick-dots {bottom: -35px;}

    main #comments .items .item {margin: 0 !important;}
    main #comments .navs {margin-bottom: 35px;} 
    main #comments .navs .arrow {width: 40px; height: 40px; line-height: 40px;}

    main #instagram .head {display: block !important;line-height: 30px;padding: 25px 15px;}

    main #about-us, main #services {padding: 25px 0;}

    footer .copyright {padding-bottom: 75px;} 

    .page-detail .breadcrumbs {display: none;}
    main .page-head {padding: 100px 0 50px 0;}
    .page-detail .in {margin-top: -35px;}
}