:root {
	background-color: orange;
}


/* header */
.header {
    background: #808080;
}

/* small line over and under banner image */
.navbar-brand {
  #background-color: red;
}

/* This is the part in the middle of the website which contains menu and content, but also the header */
.grid-child {
  #background-color: white;
}

/* does not change anything */
.site-child {
  #background-color: orange;
}

/* whole website */
body {
  #background-color: #808080;  
}

/* Modules have the class card, so you control them with .card - if you want to control only a specific module, you can give the module its own CSS class in the settings and then control it with that */
.card-body {
	background-color: #C0C0C0; 	
}

/* a-elements */
a:hover {
	#background-color:white;
	background-color:#0080FF;	
}

/* li elements in menu */
li.nav-item:hover {
	#background-color:white;	
	background-color:#0080FF;
}

li.nav-item {
	padding: 3px;
}


/* The page footer of Cassiopeia has the class "footer" so you control it with .footer */
.footer {    

}