.imgsize {
    width: 150px;
    height: 315px;
}

.sliderx {
    width: 600px;
    max-width: 100vw;
    height: 375px;
    margin: auto;
    position: relative;
    overflow: hidden;
/*    border-style: solid !important;
    border-color: blue;
    border-width: 2px;*/
}

    .sliderx .listx {
        position: absolute;
        width: max-content;
        height: 100%;
        left: 0;
        top: 0;
        display: flex;
        transition: 1s;
    }

        .sliderx .listx img {
            width: 700px;
            max-width: 100vw;
            height: 100%;
            object-fit: contain;
        }

    .sliderx .buttonsx {
        position: absolute;
        top: 45%;
        left: 23.5%;
        width: 70%;
        display: flex;
        font-size: 32px;
        justify-content: space-between;
    }

        .sliderx .buttonsx p {
            width: 50px;
            height: 50px;
            border-radius: 50%;
/*            background-color: #DDDDDD;*/
            color: #000000;
            border: none;
/*            font-family: monospace;*/
            font-weight: bold;
            text-align: center;
            align-content: center;
/*            font-size: 64px !important;*/
        }

    .sliderx .dotsx {
        position: absolute;
        bottom: 10px;
        left: 0;
        color: #fff;
        width: 100%;
        margin: 0;
        padding: 0;
        display: flex;
        justify-content: center;
    }

        .sliderx .dotsx li {
            list-style: none;
            width: 10px;
            height: 10px;
            background-color: #fff;
            margin: 10px;
            border-radius: 20px;
            transition: 0.5s;
        }

            .sliderx .dotsx li.active {
                width: 30px;
            }

@media screen and (max-width: 768px) {
    .sliderx {
        height: 400px;
    }
}