well i spent a couple of days doing  this – pure CSS Fading background colours –  and then the client said that actually they just wanted the colour to change between pages. So, so as not to waste or worse forget the code, here it is:

body {background:#B7E4F7;
animation:bgswish 30s linear 1s infinite alternate;/* IE 10+ */
-webkit-animation:bgswish 30s linear 1s infinite alternate; /* Safari 4+ */
-moz-animation:bgswish 30s linear 1s infinite alternate; /* Fx 5+ */
-o-animation:bgswish 30s linear 1s infinite alternate; /* Opera 12+ */
}
@-webkit-keyframes bgswish {/* Safari 4+ */
0% { opacity: 1;background:#B7E4F7;}
35% { opacity: 1;background:#F8EE2C;-webkit-transition-property:color;-webkit-transition-duration: 1s, 1s;-webkit-transition-timing-function: linear, ease-in;}
70% { opacity: 1;background:#E8FFC6;-webkit-transition-property:color;-webkit-transition-duration: 1s, 1s;
-webkit-transition-timing-function: linear, ease-in;}
100% { opacity: 1;background:#B7E4F7; -webkit-transition-property:color; -webkit-transition-duration: 1s, 1s;
-webkit-transition-timing-function: linear, ease-in;}
}
@-moz-keyframes bgswish {/* Fx 5+ */
0% { opacity: 1;background:#B7E4F7;}
35% { opacity: 1;background:#F8EE2C;-moz-transition-property:color;-moz-transition-duration: 1s, 1s;-webkit-transition-timing-function: linear, ease-in;}
70% { opacity: 1;background:#E8FFC6;-moz-transition-property:color;-moz-transition-duration: 1s, 1s;
-webkit-transition-timing-function: linear, ease-in;}
100% { opacity: 1;background:#B7E4F7;-moz-transition-property:color; -moz-transition-duration: 1s, 1s;
-webkit-transition-timing-function: linear, ease-in;}
}
@-o-keyframes bgswish {/* Opera 12+ */
0% { opacity: 1;background:#B7E4F7;}
35% { opacity: 1;background:#F8EE2C;-o-transition-property:color;-o-transition-duration: 1s, 1s;-webkit-transition-timing-function: linear, ease-in;}
70% { opacity: 1;background:#E8FFC6;-o-transition-property:color;-o-transition-duration: 1s, 1s;
-webkit-transition-timing-function: linear, ease-in;}
100% { opacity: 1;background:#B7E4F7;-o-transition-property:color; -o-transition-duration: 1s, 1s;
-webkit-transition-timing-function: linear, ease-in;}
}
@keyframes bgswish {/* IE 10+ */
0% { opacity: 1;background:#B7E4F7;}
35% { opacity: 1;background:#F8EE2C;transition-property:color;transition-duration: 1s, 1s;-webkit-transition-timing-function: linear, ease-in;}
70% { opacity: 1;background:#E8FFC6;transition-property:color;transition-duration: 1s, 1s;
-webkit-transition-timing-function: linear, ease-in;}
100% { opacity: 1;background:#B7E4F7;transition-property:color;transition-duration: 1s, 1s;
-webkit-transition-timing-function: linear, ease-in;}
}

It worked nicely