body{
    background-image:repeating-linear-gradient(160deg, #eec07b 20%, #6d3200 60%, #422308 20%);
    background-repeat:no-repeat;
    background-attachment:fixed;
    background-size:cover;
    background-position:center;
    font:sans-serif;
    color:white;
    margin: 0; 
    padding-top: 60px;
}

h1{
    text-align:center;
}

.directory{
    font-size:35px;
    color:white;
    text-align:middle;
}

p{
    font-size:30px;
}

#back{
    font-size:28px;
    color:white;
    text-align:center;
    color: white;
    text-decoration: none;
    padding: 0 10px;
}

hr{
  border-top: 2px dashed white;
  border-bottom: 2px dashed white;
  height:0px;
}

.blog{
    text-align:center;
    color:white;
}
    
img{
    width:700px;
}

.source{
    font-size:15px;
    font-style:italic;
}

h2{
    font-size:30px;
}

.date{
    font-size:25px;
}

.blogText{
    font-size:20px;
}

img.blur-filter {
    filter: blur(20px);
}

img.blur-filter:hover {
    filter: blur(0px);
}

iframe{
    text-align:center;
    width:700px;
    height:500px;
}


.top-bar {
    position: fixed;
    top: 0; 
    width: 100%; 
    color: white;
    padding: 10px 20px; 
    z-index: 1000; 
    display: flex; 
    justify-content: space-between;
    align-items: center;
    height: 40px; 
    background-color: #422308; 
}