How to add carousel between four images?

Question

In this code you will find 4 divs of images every one takes 50% of the full width so there always will be 2 images appeared (50% 1st one + 50% 2nd one) and the other 2 images should be appeared when the use click the arrows at right and left for example.

I added the html code with nice caption but I want to know how can I make this carousel working and I don't want dots buttons, I want arrows at right and left ??

.section-news {
    padding: 0;
}

.newbox {
    width: 100%;
    display: inline-block;
}

.newsbox .imgbox {
    float: left;
    width: 50%;
    position: relative;
    overflow: hidden;
    background-color: #000;
}

.newsbox .imgbox img {
    max-width: 100%;
    height: auto;
    transform: scale(1.15);
    transition: transform 2s;
}

.newsbox .imgbox:hover img {
    transform: scale(1.03);
}

.newsbox .imgbox .details {
    position: absolute;
    top: 40px;
    bottom: 40px;
    left: 40px;
    right: 40px;
    background: rgba(0,0,0,.8);
    transform: scaleY(0);
    transition: transform 0.5s;
}

.newsbox .imgbox:hover .details {
    position: absolute;
    top: 40px;
    bottom: 40px;
    left: 40px;
    right: 40px;
    background: rgba(0,0,0,.8);
    transform: scaleY(1);
}

.newsbox .imgbox .details .content {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    text-align: center;
    padding: 15px;
    color: #fff;
}

.newsbox .imgbox .details .content h3 {
    color: #fff;
    font-size: 170%;
}

<section class="section-news clearfix">
            <div class="newsbox"> 
                <div class="imgbox">
                    <img src="img/1.jpg">
                    <div class="details">
                            <div class="content">
                                <h3>Hello to the world</h3>
                                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit. consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit. consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
                            </div> 
                    </div>
                </div>
            </div>
            <div class="newsbox">
                <div class="imgbox">
                    <img src="img/2.jpg">
                    <div class="details">
                            <div class="content">
                                <h3>Hello to the world</h3>
                                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit. consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit. consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
                            </div> 
                    </div>
                </div>
            </div>
            <div class="newsbox">
                <div class="imgbox">
                    <img src="img/3.jpg">
                    <div class="details">
                            <div class="content">
                                <h3>Hello to the world</h3>
                                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit. consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit. consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
                            </div> 
                    </div>
                </div>
            </div>
            <div class="newsbox">
                <div class="imgbox">
                    <img src="img/4.jpg">
                    <div class="details">
                            <div class="content">
                                <h3>Hello to the world</h3>
                                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit. consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit. consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
                            </div> 
                    </div>
                </div>
            </div>
        </section>

Answer 1

Are you trying to use jQuery in the process or only css?