style.css

html,
body {
    height: 100%;
    margin: 0px;
}

.image1,
.image2,
.image3 {
    position: relative;
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
}

.image1 {
    background-image: url(./images/image1.jpg);
    height: 100%;
}

.image2 {
    background-image: url(./images/image2.jpg);
    height: 400px;
}

.image3 {
    background-image: url(./images/image3.jpg);
    height: 400px;
}

div.ptext {
    text-align: center;
    position: absolute;
    top: 50%;
    width: 100%;
}

.border {
    background-color: black;
    color: white;
    font-size: larger;
    padding: 20px;
}

.mine {
    text-align: center;
    font-family: Arial, Helvetica, sans-serif;
    padding: 3%;
    position: relative;
}

.mine h2 {
    font-size: 35px;
    padding-bottom: 3%;
}

.mono h3 {
    padding: 7%;
    padding-top: 15%;
    font-size: 30px;
}

.top {
    background-color: black;
    font-size: larger;
    color: white;
    text-align: center;
    padding: 2%;
}

.top h4 {
    padding-bottom: 3%;
    font-size: 25px;
}

.three {
    text-align: center;
    background-repeat: no-repeat;
    height: 600px;
    color: white;
    background-attachment: fixed;
}

.three h2 {
    padding-top: 30%;
}

.mom {
    background-color: black;
    color: white;
    padding: 4%;
    text-align: center;
    padding: 5%;
    font-size: 20px;
}

.mom h2 {
    padding: 4%;
}

.mom p {
    padding-top: 3%;
}

.solo {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 0%;
    padding: 5px;
    padding-top: 28%;
    padding-bottom: 30%;
    background-attachment: fixed;
}

.solo h1 {
    padding-top: 0%;
    background-color: black;
    color: white;
    width: 30%;
    margin: auto;
}

@media screen and (max-width:768px) {
    .inner {
        width: auto;
        height: auto;
    }
    .solo {
        background-position: center center;
        background-repeat: no-repeat;
        background-size: cover;
    }
}