Background images and colors not showing

I'm having a bunch of issues with my wordpress site: https://thekaleidoscope.org
Below is how it looks for site views, vs how it looks when I'm building it.

Perhaps it's an issue within my theme style? Below I've copied and pasted the code I see on my theme page:

/*
Theme Name: My Divi Child Theme
Theme URI: http://thekaleidoscope.dev
Version: 1.0
Description: A customized version of the Divi theme to add features to the site and allow updates to Divi.
Author: Melissa Lake
Author URI: http://www.fit2wander.com
Template: Divi
*/
/* style the donate cta button */
.donate {border-radius: 0px;}
.donate a {color: #fff!important;}
li.donate {
background-color:#389DF4;
font-weight: 700;
text-transform: uppercase;
text-align: center;
padding: 10px 13px 10px 10px!important;
border-radius: 3px;
-moz-transition: all 0.5s;
-webkit-transition: all 0.5s;
transition: all 0.5s;}
li.donate:hover {background-color:#49A258;}
/* fixed header button text color */
.et-fixed-header #top-menu .donate a {
color: #fff!important;}
.donate li.current-menu-ancestor > a, .donate li.current-menu-item > a {
color: #fff !important;}
@Media only screen and (min-width : 981px) {
li.donate {height: 33px;}}
/* remove woocommerce sidebar formatting */
.single-product #main-content.container:before {display:none;}
.single-product #left-area {width: 100%; padding: 0!important;}
.hover_grow:hover {
max-width: 100%;
-moz-transform: scale(1.1);
-webkit-transform: scale(1.1);
transform: scale(1.1);
}
/*remove on sale icon woocommerce*/
span.onsale {
display: none;
}
/*hide cateogry name on shop page*/
h2.woocommerce-loop-category__title {
display: none;
}
.woocommerce-page ul.products li.product{
margin: 10px !important;
}
.six-columns .et_pb_module {width: 16.66666%; float: left;}
@Media (max-width: 980px){
.ten-columns .et_pb_module {width: 20%;}
.nine-columns .et_pb_module {width: 33.3%;}
.eight-columns .et_pb_module {width: 25%;}
.seven-columns .et_pb_module {width: 25%;}
.six-columns .et_pb_module {width: 33.3%;}
.five-columns .et_pb_module {width: 33.3%;}
}
@Media all and (max-width: 767px) {
.ten-columns .et_pb_module {width: 100%;}
.nine-columns .et_pb_module {width: 100%;}
.eight-columns .et_pb_module {width: 100%;}
.seven-columns .et_pb_module {width: 100%;}
.six-columns .et_pb_module {width: 100%;}
.five-columns .et_pb_module {width: 100%;}
}
/*remove extra padding on list calendar*/
.calendar-list-wrapper div{
margin: 0px !important;
padding: 0px !important;
}
.calendar-list-wrapper ul{
margin: 0px !important;
padding: 0px !important;
}
.calendar-list-wrapper li{
margin: 0px !important;
padding: 0px !important;
}
/*add text shadow, close and dark */
.text-shadow{
text-shadow: 1px 1px black;
}
/*Left Featured Image Thumbnail*/
@Media only screen and ( min-width: 800px ) {
.kale_blog_list a img {
float: left;
width: 33%;
display: block;
background-size: cover;
padding-right: 20px;
background-position: right bottom;
}
}
/*Left Featured Image Thumbnail*/
@Media only screen and ( min-width: 800px ) {
.kale_blog_list .et_pb_post {
margin-bottom: 10px;
}
}
/*Custom Read More Link on Blog Homepage*/
.kale_blog_list a.more-link {
clear: both;
position: relative;
max-width: 100%;
padding: 5px 0px;
text-align: right;
text-transform: capitalize;
}
/*Adjust Hover Style*/
.kale_blog_list a.more-link:hover {
font-weight: bold;
}
.blog #sidebar {
display: none;
}
.post-template-default #sidebar {
display: none;
}
.post-template-default #main-content .container:before {background: none;}
/*** Expand the content area to fullwidth ***/
@Media (min-width: 981px){
.post-template-default #left-area {
width: 100%;
padding: 23px 0px 0px !important;
float: none !important;
}
}