body {
    font-family: "Arial", serif;

}

#content {
    width: 90%;
    padding-top:1em;
    margin-left: auto;
    margin-right: auto;
    background: black;
    color: white;

}
/* https://www.tjvantoll.com/2012/02/20/css3-color-animations/ */
@-webkit-keyframes color_change {
    0% { background-color: white; }
    12.5% { background-color: red; }
    25% { background-color: orange; }
    37.5% { background-color: yellow; }
    50.0% { background-color: green; }
    62.5% { background-color: blue; }
    75% { background-color: indigo; }
    87.5% { background-color: violet;}
    100% { background-color: white;}
}
@-moz-keyframes color_change {
    0% { background-color: white; }
    12.5% { background-color: red; }
    25% { background-color: orange; }
    37.5% { background-color: yellow; }
    50.0% { background-color: green; }
    62.5% { background-color: blue; }
    75% { background-color: indigo; }
    87.5% { background-color: violet;}
    100% { background-color: white;}
}
@-ms-keyframes color_change {
    0% { background-color: white; }
    12.5% { background-color: red; }
    25% { background-color: orange; }
    37.5% { background-color: yellow; }
    50.0% { background-color: green; }
    62.5% { background-color: blue; }
    75% { background-color: indigo; }
    87.5% { background-color: violet;}
    100% { background-color: white;}
}
@-o-keyframes color_change {
    0% { background-color: white; }
    12.5% { background-color: red; }
    25% { background-color: orange; }
    37.5% { background-color: yellow; }
    50.0% { background-color: green; }
    62.5% { background-color: blue; }
    75% { background-color: indigo; }
    87.5% { background-color: violet;}
    100% { background-color: white;}
}
@keyframes color_change {
    0% { background-color: white; }
    12.5% { background-color: red; }
    25% { background-color: orange; }
    37.5% { background-color: yellow; }
    50.0% { background-color: green; }
    62.5% { background-color: blue; }
    75% { background-color: indigo; }
    87.5% { background-color: fuchsia;}
    100% { background-color: white;}
}


#logo {

    display: block;
    background: aqua;
    -webkit-animation: color_change 10s infinite;
    -moz-animation: color_change 10s infinite;
    -ms-animation: color_change 10s infinite;
    -o-animation: color_change 10s infinite;
    animation: color_change 20s infinite;
}

#content h1 {
    text-align: center;
}

#content h2 {
    margin:0;
    margin-top:0.5em;


}

#event-details {
    width: 80%;
    padding-bottom: 2em;
    max-width: 600px;
}

.center {
    display: block;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

.spaced {
    margin-top: 1em;
}

#navigation {
    overflow: hidden;
    padding-top:10px;
    width:100%;
    float: left;
    border-bottom: 4px white solid;
    border-top: 4px white solid;
    background-color:black;
    display:none;
}

#navigation ul {
    margin:0;
    padding:0;
    padding-left:20px;
}

#navigation li {
    margin:0;
    padding:0;
    float:left;
    display:block;
    list-style: none;
    color: white;
    font-weight: bold;
    padding-top:10px;
    padding-right:20px;
    padding-bottom:10px;


}

#footer {
    border-top: 4px solid white;
    display:block;
    height:20px;
    margin:0;
    padding:0;

}

#title, #location, #people {
    font-family: Futura, "Trebuchet MS";
}

#title {
    padding-top:20px;
    font-weight: bold;
    font-size: 4em;
    color: #DA22E1;
}

#description {
    padding-top:10px;
    font-family: "Gill Sans";
    font-weight: bold;
    font-size: 2em;
    color: #7C95EA;
}

#location, #people {
    font-weight: bold;
    font-size: 1em;
}

#location {
    color: #45E253;
}

#people {
    color: #EC6135;
    font-size:2em;
}

#about {
    font-size:2em;
    margin-left: 2em;
    margin-right: 2em;
    margin-bottom:2em;
    padding-bottom:2em;
    color: #45E253;
}

#about a {
    color:#DA22E1;
}


/* The sticky class is added to the navbar with JS when it reaches its scroll position */
.sticky {
    position: fixed;
    top: 0;
    width: 100%;
}

/* Add some top padding to the page content to prevent sudden quick movement (as the navigation bar gets a new position at the top of the page (position:fixed and top:0) */
.sticky + .content {
    padding-top: 60px;
}





