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

.header {
    background: rgb(0, 135, 49);
    background: linear-gradient(to bottom, rgba(0, 135, 49, 1) 0%, rgba(0, 135, 49, 0) 100%);
}

/* Headings are html elements, the main heading is an h1, then comes h2, h3, h4 and so on. You control an html element by simply writing the name in front of it */

h1 {
    text-shadow: 2px 2px 8px rgba(150, 150, 150, 1);
    color: rgba(0, 135, 49, 1);
	text-align: center;
}

h3 {
    text-shadow: 2px 2px 8px rgba(150, 150, 150, 1);
    text-color: rgba(0, 135, 49, 1);
}
/* In Joomla most buttons have the class btn-primary - in the element inspector you can check if the button you want to color really has this color.
*/

.btn-primary {
    background: rgba(0, 135, 49, 1);
}

/* If you want to color something, only if you move the mouse over it then write :hover after it
*/

.btn-primary:hover {
    background: rgba(12, 80, 81, 1);
}

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

.footer {
    background: rgb(2, 0, 36);
    background: linear-gradient(to bottom, rgba(0, 135, 49, 0) 0%, rgba(0, 135, 49, 1) 100%);
}