@media(max-width:1400px){
    #top-screen #logo{
        top:210px;
    }
    #logo img {
        width: 40%;
        height: auto;
    }
}
@media(max-width:1200px){
    /* #top-screen #logo{
        top:180px;
    }
    #logo img {
        width: 350px;
        height: auto;
    } */
    .services-container{
        padding-left: 3%;
    }
}
@media(max-width:1000px){
    #top-screen #logo{
        top:190px;
    }
    #logo img {
        width: 260px;
        height: auto;
    }
    #top-screen .services-container .services .services-title, #top-screen .services-container .services .services-list a, #top-screen .services-container .services .services-list span{
        font-size: 20px;
    }
}

@media(max-width:768px){
    #top-screen{
        background-size: cover;
        height: auto; 
    }
    .header-container{
        position: absolute;
        top: 10px;
    }
    .swiper-container.header-swiper{
        position: relative;
    }
    .top-menu{
        padding-left: 20px;
    } 
}

@media(max-width:560px){
     .services-container{
        bottom: 3%;
    }
    #top-screen .services-container .services .services-title,
    #top-screen .services-container .services .services-list a,
    #top-screen .services-container .services .services-list span{
        font-size: 16px;
    }
    .screens-title h1{
        font-size: 35px
    }
}

@media(max-width:380px){
     .services-container{
        bottom: 0;
        top:68px;
    }
    #top-screen .services-container .services .services-title{
        margin-bottom: 0px;
    }
    #top-screen .services-container .services .services-title,
    #top-screen .services-container .services .services-list a,
    #top-screen .services-container .services .services-list span{
        font-size: 14px;
    }
    .screens-title h1{
        font-size: 30px
    }
}

@media (max-width: 375px) {
  .swiper-slide {
    height: 225px;
    overflow: hidden;
  }
}