[Duda] cambiar color de fondo

en productos pude alinear todo pero me sale el color del footer y no se como cambiarlo body{ font-family: 'Montserrat', sans-serif; /tipologia de letra agregado a todo/ }

header{ background-color: darkgray; padding: 20px 0; } /margen interior/

.caja{ width: 940px; position: relative; margin: 0 auto; }/margen exterior/

nav { position: absolute; top: 110px; right: 0; }

nav li{ /cuanto espacio va a ocupar la pagina/ display: inline; margin: 0 0 0 15px;}

nav a{ text-transform: uppercase; color: black; font-weight: bold; font-size: 22px; text-decoration: none; }

.productos{ width: 940px; margin: 0 auto; padding: 50px; }

.productos li{ display: inline-block; text-align: center; width: 30%; vertical-align: top; margin: 0 1.5%; padding: 30px 20px; box-sizing: border-box; border: 2px solid black; border-radius: 10px; }

.productos li:hover{/capturar evento cuando el mouse se posiciona/ border-color: #c78c19;}

.productos li:active{/capturar evento cuando dan click/ border-color:#088c19; }

.productos h2{ font-size: 30px; font-weight: bold; } /negrita/

.productos li:hover h2{ font-size: 33px; }

.producto-descripcion{ font-size: 18px; }

.producto-precio{ font-size: 20px; font-weight: bold; margin-top: 10px; }

nav a:hover{ color: #c78c19; text-decoration: underline; }

footer{ text-align: center; background: url(imagenes/bg.jpg); padding: 40px; }

.copyright{ color: white; font-size: 10px; margin: 20px; }

form{ margin: 40px 0; }

form label, form legend{ display: block; font-size: 20px; margin: 0 0 10px; }

.input-padrom{ display: block; margin: 0 0 20px; padding: 10px 25px; width: 50%; }

.checkbox{ margin: 20px 0; }

.enviar{ width: 40%; padding: 15px; font-size: 18px; font-weight: bold; color: white; background: orange; border: none; border-radius: 5px; transition: 1s all; /tiempo de captura de mouse con color/ cursor: pointer; /cambiar mouse por manito/ }

.enviar:hover{ background: darkorange; transform: scale(1.2) /aumentar tamaño cuando se posicione el mouse/ /rotate(360deg);girar cuando se posicione el mouse/ }

table{ margin: 40px 40px; }

thead{ background: #555555; color: white; font-weight: bold; }

td, th{ border: 1px solid black; padding: 8px 15px; }

/CSS PARA HOME/

.banner{ width: 100%; }

.principal{ padding: 3em 0; background: #FEFEFE; width: 940px; margin: 0 auto;

}

.titulo-principal{ text-align: center; font-size: 2em; margin: 0 0 1em; clear: left; /eliminar otra configuracion que tenga fuera de este bloque/ }

.principal p{ margin: 0 0 1em; }

.principal strong{ font-weight: bold; }

.principal em{ font-style: italic; }

.utensilios{ width: 120px; float: left; /para hacer que la imagen "flote" y el texto la redondee/ margin: 0 20px 20px 0; /orden: superior-derecha-inferior-izquierda/ }

.mapa{ padding: 3em 0; background: linear-gradient(#FEFEFE,#888888) ; /degradacion de colores/ }

.mapa p{ margin: 0 0 2em; text-align: center;