body {margin:0}

header>img {height:100%}
header, footer {
    background-color: #3AF;
    height: 10vh;
    width: 100%;
    color: #FFF;
    text-decoration: underline
}

.hero {
    background-image: url(content/hero-uf-jax.webp);
    background-size: 90vh;
    background-position: bottom right;
    background-repeat: no-repeat;
    text-shadow: #000 0 0 50px;
    height: 80vh
}

/*Common Classes*/
.blue {background-color:#072B56;color:#FFF}
.padding {padding: 2vh 0 2vh 0}
.center {
    display: flex;
    flex-flow: column;
    justify-content: center;
    align-items: center;
    text-align: center
}

.testimonial {
    font-family: 'Times New Roman';
    font-style: italic;
    flex-flow: row
}

/*Font*/
h1, h2, li, p {
    font-family: Arimo, Arial;
    font-size: 10vh;
    margin: 1vh 5vw 1vh 5vw
}

li {
    text-align: left;
    font-style: italic;
}
h2 {font-size:4.5vh}
li, p {font-size:4vh}

/*Marquee setup*/
#marquee {
    display: flex;
    flex-flow: row;
    animation: marquee 30s linear infinite
}

#mcontainer {
    width: 100%;
    overflow: hidden;
}

@keyframes marquee {
    0% {transform: translateX(25%)}
    to {transform: translateX(-25%)}
}

/*Meet my educators*/
.teacher>img {height:11vh;width:11vh}
.teacher>div>h2, .teacher>div>p {margin: 1vh}
.teacher {
    border: .5vh #FFF solid;
    border-radius: 3vh;
    text-align: left;
    display: flex;
    margin: 0 1vh 0 1vh;
    white-space: nowrap
}

.timg, .teacher>img {
    border-radius: 100%;
    width: 6vh;
    height: 6vh;
    margin: 1vh
}