img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;

}

#narwhalContainer {
    display: block;
    padding-top: 50px;
    padding-bottom: 50px;
    margin: auto;
    height: 300px;
    width: 1000px;
    background-position: center top;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url('../assets/narwhals/day.png');
    cursor: pointer;
    /*-webkit-transition:all 0.7s ease-in-out;*/
    /*-moz-transition:all 0.7s ease-in-out;*/
    /*transition:all 0.7s ease-in-out;*/


}

#narwhalContainer:hover {
    background-image: url('../assets/narwhals/dayOver.png');
    background-size: contain;

}

.narwhalContainer.dark-mode {
    background-image: url('../assets/narwhals/night.png');
    background-size: contain;
}

.narwhalContainer.dark-mode:hover {
    background-image: url('../assets/narwhals/nightOver.png');
    background-size: contain;
}