.color-block {
    padding: 5px;
    margin-bottom: 5px;
    height: 90px;
    width: 200px;
    text-align: center;
}

.light-text {
    color: var(--white);
}

.dark-text {
    color: var(--black);
}

.dark-bg {
    background-color: var(--dark-grey);
}

.light-bg {
    background-color: var(--off-white);
}


/***  Clickable Divs with Icons/Illustrations ***/
.clickable-div {
    width: 36rem;
    height: auto;
    display: grid;
    place-items: center;
    text-align: center;
    text-decoration: none;
    color: #25495C;
}

    .clickable-div:hover {
        text-decoration: none;
        color: #009FE3;
    }

    .clickable-div img {
        opacity: 1;
        -webkit-animation-duration: .25s;
        animation-duration: .25s;
        -webkit-animation-fill-mode: both;
        animation-fill-mode: both;
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
        width: 10rem;
        height: auto;
        background-color: turquoise;
        margin-bottom: 1.2rem;       
    }

    .clickable-div:hover img {
        opacity: .7;
        cursor: pointer;
        animation-name: bounce;
        -moz-animation-name: bounce;
    }

@keyframes bounce {
    0% {
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0)
    }

    100% {
        -webkit-transform: translateY(.6rem);
        -ms-transform: translateY(.6rem);
        transform: translateY(.6rem)
    }
}

/*** Layout Sections ******************************/
.container-notification {
    border: 1px solid #c3d0d6;
    border-radius: 4px;
    box-shadow: 0px 0px 1px 1px rgba(0,0,0,0.1);
    /*width: 75%;*/
    margin: 0 auto;
    background: #FFFFFF;
    display: grid;
    grid-template-columns: 4fr 1fr;
    grid-gap: 1.6rem;
    padding: 1.6rem 3.6rem;
    align-items: center;
    justify-content: space-between;
}

.quote-banner {
    position: relative;
    background: #45BBE6;
    width: 100%;
    height: 28rem;
    padding: 6rem 0;
}

.quote-text {
    align-self: center;
    justify-self: center;
}

.quote-banner__top {
    position: absolute;
    top: -26px;
    height:6rem;
}

.quote-banner__bottom {
    position: absolute;
    bottom: -26px;
    right: 18rem;
    height:6rem;
}

.text-center {
    text-align: center;
}