header {
    background-color: dodgerblue;
    color: floralwhite;
    border-bottom: 2px double black;
    margin-top: -0.5em;
}

header h2 {
    color: white;
    text-align: center;
}

nav {
    background-color: coral;
    float: left;
    width: 20%;
    clear: left;
    min-height: 700px;
    border-right: 2px solid black;
    }

nav h3 {
    color: floralwhite;
    margin-left: 0.5em;
    margin-bottom: -0.25em;
}

section {
    float: left;
    width: 78%;
    min-height: 350px;
    padding-left: 1em;
    background-color: burlywood;
}

footer {
    clear: both;
    border-top: 2px double black;
    text-align: center;
    background-color: darksalmon;
}

 .img1 {
        opacity: 0.30;
        position: relative;
        margin-left: 267px;
        }

.grow {
    width: 20%;
}

.grow li {
    list-style-type: none;
    margin-right: 0.5em;
    margin-left: -2.5em;
    background-color: brown
}

.grow a {
    color: floralwhite;
    display: block;
    padding: 10px;
    text-decoration: none;
    transition: all 0.2s ease
}

.grow a:hover {
    background-color: black;
    transform: scale(1.05)
}

.shrink {
    width: 20%;
}

.shrink li {
    list-style-type: none;
    margin-right: 0.5em;
    margin-left: -2.5em;
    background-color: brown
}

.shrink a {
    color: floralwhite;
    display: block;
    padding: 10px;
    text-decoration: none;
    transition: all 0.5s ease
}

.shrink a:hover {
    background-color: black;
    transform: scale(0.90)
}

.skewcircle {
    width: 20%;
}

.skewcircle li {
    list-style-type: none;
    margin-right: 0.5em;
    margin-left: -2.5em;
    background-color: brown
}

.skewcircle a {
    color: floralwhite;
    display: block;
    padding: 10px;
    text-decoration: none;
    transition: all 0.5s ease
}

.skewcircle a:hover {
    background-color: black;
    transform: skewX(-15deg);
    border-radius: 25%;
}


