/* CSS for the stylish single page */

body {
    font-family: 'Abel', 'Antic', 'Khand', sans-serif;
    margin: 0;
    padding: 0;
    background-color: #EDE7D4;
    color: #005CB8;
    transition: background-color 0.3s ease;
}

.header {
    text-align: center;
    background-color: #EDE7D4;
}

.logo {
    height: 20em;
    transition: transform 0.3s ease;
}

.logo:hover {
    transform: scale(1.05);
}

main {
    padding: 0;
}

section {
    padding: 20px;
    margin: 20px auto;
    max-width: 800px;
    font-size: 1.25em;
}

section h1 {
    padding-bottom: 10px;
    font-size: 1.5em;
}

section p {
    color: #333;
    line-height: 1.6;
}

section:hover h1 {
    color: #005CB8;
}

section:hover p {
    color: #005CB8;
}

.divider {
    height: 20px;
    border: none;
    background: linear-gradient(90deg, #5EACE8 3%, #005CB8 3%, #005CB8 6%, #83C3AD 6%, #83C3AD 9%, #0A4741 9%);
}

.meitheal {
    padding-left: 9%;
    padding-right: 9%;
}

.mission {
    padding-left: 9%;
    padding-right: 9%;
}

.mission h1 {
    text-align: right;
}

.about {
    padding-left: 9%;
    padding-right: 9%;
}

h1 {
    font-family: 'Khand', sans-serif;
    color: #005CB8;
    margin: 0 0 10px 0;
}

p {
    font-family: 'Abel', sans-serif;
    margin: 0;
}

.footer {
    background: linear-gradient(90deg, #5EACE8 3%, #005CB8 3%, #005CB8 6%, #83C3AD 6%, #83C3AD 9%, #0A4741 9%);
    text-align: center;
    background-color: #0A4741;
    color: #EDE7D4;
    padding: 20px;
    padding-left: 9%;
    padding-right: 9%;
    width: 82%;
    box-shadow: 0 -4px 6px rgba(0, 0, 0, 0.1);
    font-size: 1.25em;
}

.footer h1 {
    color: #EDE7D4;
}