body {
    background: url(./images/tiles.png);
    background-repeat: repeat;
    font-family: 'Lucida Sans Typewriter', 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;

}

a {
    color: #00ffff;
}

a:hover {
    font-weight: bold;
}

.contentcolumn {
    padding: 2%;
    background-color: rgba(120, 58, 14);
    width: 90%;
    max-width: 960px;
    margin: 10px auto;

}

.banneri {
    /* align-content: normal; */
    width: 100%;
    height: auto;
    display: flex;
    justify-content: center;
box-shadow: 4px 4px rgb(66, 0, 75);
}

.banneri img {
    /* display: block;
    margin: auto; */
    width: 100%;
} 

.kuvaupotus-keskelle {
    /* align-content: normal; */
    margin: auto;
    margin-top: 4em;
    width: 100%;
    height: auto;
    display: flex;
    justify-content: center;
    box-shadow: 4px 4px rgb(66, 0, 75);
}

.kuvaupotus-keskelle img {
    display: block;
    /* margin: auto; */
    width: 100%;
} 

.nav-bar {
    margin-bottom: 1em;
    background-color: #10155d;
    box-shadow: 4px 4px rgb(66, 0, 75);
}

#aktiivinen {
    text-decoration: none;
    font-weight: bold;
    color: #ffb049;
}

.nav-bar ul {
    margin: 0.3em;
    padding: 0.3em;
    /* width: 100%; */
    height: 100%;
    display: flex;
    flex-wrap: wrap;

}

.nav-bar li {
    display: flex;
    font-size: smaller;
    color: #00ff99;
    background-color: #5757ff;
    margin: auto;
}

.nav-bar a:hover {
    background-color: #303094;
    font-weight: normal;
}

.nav-bar a:active {
    border-style: inset;
}


.nav-bar a {
    color: #00ffff;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 1.3em;
    padding-left: 2.3em;
    background-image: url(./images/varjotonkookos.png);
    background-position: left;
    background-repeat: no-repeat;
    border: 0.3em;
    border-style: outset;
    border-color: darkslateblue;
}

.teksticontent {
    margin-top: 1em;
    background-color: #22265a;
    padding: 2%;
    box-shadow: 4px 4px rgb(66, 0, 75);

}

.videoupotus {
    position: relative;
    padding-bottom: 56.25%; /* 16:9 */
    height: 0;
}

.videoupotus video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.teksticontent h1 {
    color: #00ff99;
}

p {
    color: #00ff99;
    display: block;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    unicode-bidi: isolate;
}

.nappulakokoelma {
    display: flex;
    margin: auto;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
}

.nappulakokoelma a {
    text-decoration: none;
    padding: 2%;
    
}

.nappulakokoelma a:hover {

}

.nappulakokoelma img {

}

.nappulakokoelma img:hover {

}