body {
  font-family: Menlo, Consolas, monospace;
  background-color: #CCFFFF;
}
img.thumb {
    width : 10%;
    height : auto;
}

#tree-browser {
    resize: both;
    margin: auto;
    width : 100%;
    overflow : auto;
    border-style : solid;
    border-color : white grey grey white;
}
.level {
    margin : 8px;
    padding : 8px;
    border-style : solid;
    border-color : grey white white grey;
}
.level .instructions {

}


.option:hover {
    background-color: #EEFFFF;
}
.selected {
    background-color: white;
    font-weight : bold;
    border-style : solid;
}

/* Style for Gallery */

* {
  box-sizing: border-box;
}

.algae-image {
    position: relative;
}
.image-title {
    position: absolute;
    color : white;
    top: 5%;
    left: 5%;
    font-size: large;
    font-weight: bold;
    z-index: 2;
}

img {
    max-height: 100%;
    max-width: 100%;
    height: auto;
}

.carousel {
    width: 100%;
}

.slick-prev {
    z-index: 2;
    left: 20px;
}
.slick-next {
    z-index: 2;
    right: 20px;
}

/* Style for splash page */

.bg {
    height: 600px;
    background-image: url("firstpage1.jpg");
    background-position: center;
    background-repeat: no-repeat;
    background-size : cover;    
    font-family: Menlo, Consolas, monospace;
    font-size : x-large;
    font-weight: bold;
}

.bgtxt {
    position : absolute;
    top : 25%;
    left: 50%;
    transform: translate(-50%,-50%);
    color: white;
    text-align: center;
}

.title {
    text-align: center;
}

.notes {
    text-size : large;
}