@media screen and (max-width:500px) {

    .deylam-slider .deylam-list .deylam-item .deylam-content h2{
        font-size:   20px;
        line-height: normal;
    }
    .deylam-slider .deylam-list .deylam-item {
        overflow:    visible;
    }
    .deylam-slider .deylam-list .deylam-item .deylam-imgholder{
        width:      90%;
        height:     35%;
        top:        40%;
        left:       20px;
        overflow:   hidden;
    }
    .deylam-content .deylam-btn{
        padding:    6px 40px;
        margin-top: 10px;
    }
    .deylam-slider .deylam-list .deylam-item .deylam-imgholder img{
        width:      100%;
        height:     100%;
        object-fit: cover;
        overflow:   visible;
    }
    .deylam-slider .deylam-list .deylam-item .deylam-content p{
        font-size:  15px;
    }
    .deylam-slider .deylam-list .deylam-item .deylam-content {
        text-align: center;
        width:      90%;
        height:     20%;
        top:        15%;
        left:       40px;
        right:      auto;
    }
    .deylam-slider .deylam-list .deylam-item .deylam-content p:nth-child(1){
        font-size:  10px;
        text-align: center;
    }
    .deylam-arrows{
        top:   70%;
        right: 40px;
    }
    .deylam-arrows button{
        font-size:     large;
        width:         30px;
        height:        30px;
        border-radius: 5px;
    }

    .deylam-thumbnail{
        display:         flex;
        justify-content: center;
        justify-items:   center;
        flex-direction:  row;
        gap:             5px;
        width:           100%;
        height:          200px;
        padding:         0 0 0 0;
        top:             75%;
        right: 0;
    }
    .deylam-thumbnail .deylam-item{
        width:         calc(100% / 4);
        height:        150px;
        justify-self:  center;
        border-radius: 15px;
    }
    .deylam-thumbnail .deylam-item img{
        border-radius: 15px;
    }
    .deylam-thumbnail .deylam-item.deylam-active{
        transform: translateY(-50px);
    }
    .deylam-thumbnail .deylam-item .deylam-content {
        font-size: 14px;
    }
    .deylam-slider{
        height:           100vh;
        position:         relative;
        overflow:         hidden;
        background-image: linear-gradient( 45deg , #001031 50%, #3a3a3a 60% );
        background-size:  4000px 4000px;
        animation:        bg-of-slider 2s 1 alternate forwards ;
    }
}
@media screen and (max-width:400px){
    .deylam-thumbnail .deylam-content span{
        display: none;
    }
    .deylam-thumbnail .deylam-item .deylam-content p{
        display: block;
    }
}