.header-container{
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    background-image: linear-gradient(to bottom, #f1efe8, #efeae3);
}
.content-body{
    display: inline-block;
    margin-top: 10px;
    width: 75%;
    text-align: center;

    h2, span{
        display: inline-block;
        width:60%;
        min-width: 300px;
    }
    h2{
        margin-top:40px;
        margin-bottom: -20px;
    }
}

.company-logo{
    padding:10px;
    border-radius: 10px;
    margin: 20px 0;
}

.modern-truck-image-container, .baker-header-content-container{
    padding-bottom: 20px;
}
.modern-truck-image-container{
    display:flex;
    justify-content: center;
    align-items: center;

}

.services-container{
    margin:0;
    padding: 20px 0 0;
    text-align: center;

    .header{

        h2{
            display: inline-block;
            width: 50%;
            border-width: 2px;
            border-top: 0;
            border-style: solid;
        }
    }
}

.service-body{
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    align-items: center;
    padding: 20px 0;
}

.service-body-row{
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: center;
    max-width: 1600px;
    width:90%;
    margin-bottom: 20px;
    /*border-radius: 50px;*/
    background:linear-gradient(to bottom, whitesmoke, lightgrey);
    /*box-shadow: rgb(38, 57, 77) 0px 20px 30px -10px;*/
}

.service-container{
    position: relative;
    max-width: 400px;
    width:90%;
    box-sizing: border-box;
    text-align: center;
    padding: 40px 10px 100px 10px;
    color:#4a4a49;

    .service-container-content{
        display:flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: center;
        position: relative;
        z-index: 2;
        height: 100%;
        border-image: radial-gradient(circle, grey 0%, rgba(130, 130, 130, 0.0) 100%) 1;
        border-width: 1px;
        border-style: solid;
        border-top: 0;
        border-bottom: 0;
    }

    .service-container-background{
        position: absolute;
        top:0;
        left:0;
        width: 100%;
        height: 100%;
        background-image: url("/img/building-silhouette-256.png");
        background-size: cover;
        opacity: 0.6;
        /*border-radius: 50px;*/
    }

    p{
        margin: 0 20px 20px 20px;
    }

    .main-orange-button{
        display: inline-block;
        cursor: pointer;
    }

    .image-container{
        display: flex;
        flex-direction: column;
        justify-content: center;
        width: 100%;
        height:100%;
        max-width: 250px;
        max-height: 250px;
        border-radius: 1000px;
        border: 3px solid #403f3f;
        z-index: 50;
        background-color: #e67243;
    }

    img{
        width: 100%;
        height:auto;
        max-width: 250px;
        max-height: 250px;
        border-radius: 1000px;
    }
    h2{
        text-align: center;
        border-image: radial-gradient(circle, black 50%, rgba(0, 0, 0, 0.0) 100%) 1;
        border-width: 2px;
        border-top: 0;
        border-style: solid;
        font-size: 1.05em;
    }
    p{
        text-align: justify;
    }
}

.business-hours p{
    text-align: center;
}

/* MOBILE SCREEN */
@media screen and (max-width: 800px)  {
    .header-container{
        width: 100%;
    }
    .baker-header-content-container{
        z-index: 10;
        width:100%;
        text-align: center;
    }
    .modern-truck-image-container{
        position:absolute;
        left:0;
        width:100%;
        opacity: 0.25;

        img{
            width: 100%;
        }
    }
}

/* COMPUTER SCREEN */
@media screen and (min-width: 801px)  {
    .modern-truck-image-container, .baker-header-content-container{
        text-align: left;
        width: 50%;
        background-color: transparent;

        .modern-truck-image{
            margin: 100px 0;
            width: auto;
            max-width: 600px;
            max-height: 600px;
            border-radius: 20px;
        }
    }
    .baker-header-content-container{
        text-align: center;
    }
}
