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

.bgimg {
    background-image: url('coffee-2.jpg');
    height: 100%;
    background-position: center;
    background-size: cover;
    position: relative;
    color: white;
    font-family: "Courier New", Courier, monospace;
    font-size: 25px;
}

.logo {
    width: 450px;
    margin-bottom: 30px;
}

p {
    padding-left: 15px;
    padding-right: 15px;
}

.middle {
    position: absolute;
    top: 39%;
    left: 38%;
    transform: translate(-50%, -50%);
    text-align: center;

    color: #143D8F;
}

hr {
    margin: auto;
    width: 40%;
}

@media screen and (max-width: 1250px) {
    .middle {
        left: 37%;
    }
}

@media screen and (max-width: 1150px) {
    .middle {
        top: 36%;
        left: 36%;
    }
}

@media screen and (max-width: 1015px) {
    .middle {
        left: 34%;
    }
}

@media screen and (max-width: 975px) {
    .middle {
        left: 33%;
    }
}

@media screen and (max-width: 650px) {
    .logo {
      width: 100%;
    }

    .middle {
        width: 70%
    }
}