* {
  box-sizing: border-box;
}

html {
    min-height: 100%;
    position:relative;
}

body {
    margin: 0px;
    height:100%;

    background-color: rgb(4, 61, 4);
    background-image: url("birch_bg_02.png");
    
    background: url("images/birch_bg.png"), linear-gradient(rgb(4, 61, 4), rgb(0, 0, 0));
    background-size: 500px, auto;

    font-family: Verdana, Tahoma, sans-serif;
    font-size: 15px;
}

#fake-bg{
    background:  url("images/fenyek.gif") left repeat-y, url("images/fenyek.gif") right repeat-y;
    background-size: 10vw;
    filter: blur(4px);
    min-width: 100%;
    
    position: absolute;
    top: 0px;
    bottom:0px;
    left: 0px;
    right: 0px;
    overflow:hidden;
    z-index: -8;
}


header{
    overflow: hidden;
    width: fit-content;
    margin: 0px auto;
    padding: 20px;
}



#menu{
    width: fit-content;
    height: 100%;
    text-align: center;
}
    
#menu ul{
    padding: 0;
    margin: 0;
    list-style: none;
    text-align: center;
    float: left;
}
    
#menu li{
    display: inline-block;
    padding: 5px 30px;
    border: 3px solid black;
    border-radius: 4px;
    background-color: rgb(2, 37, 2);
}

#menu li:hover{
    background-image: url("images/fenyek.gif");
    background-size: 50px;
    background-position: bottom;
    background-color: rgb(8, 109, 8);
}

#menu a {
    text-decoration: none;
    color: white;
}

#menu a:active {
    color: white;
}

#menu a:visited {
    color: white;
}


.textfield {
    background-color: rgb(195, 214, 151);
    border: 3px solid black;
    border-radius: 20px;
    padding: 20px;
    text-align: left;
}

.textfield a {
    color: rgb(8, 109, 8);
}

.textfield a:visited {
    color: rgb(2, 37, 2);
}


#main-container {
    max-width: 90vw;
    padding: 100px;
    padding-top: 0px;
    margin-left: auto;
    margin-right: auto;
}

#entry-container {
    text-align:center;
}

.entry-image {
    display: block;
    width: auto;
    max-width: 100%;
    min-height: 50px;
    max-height: 250px;
    margin-left: auto;
    margin-right: auto;
    
}


.entry {
    min-width: 250px;
    max-width: 300px;
    
    padding: 15px;
    margin: 5px;
    display: inline-block;

    position: relative;
    vertical-align: middle;
    width: 30%;

}


.date {
    font-style: italic; 
}

#about-container{
    max-width: 90vw;
    margin: auto;
    text-align: center;
    height: fit-content;
}

.aboutfield {
    width:43%; 
    min-width: 200px; 
    display: inline-block; 
    vertical-align: middle;
}

.dev-entry {
    padding-bottom: 20px;
    border-bottom: 2px solid black;
}


@media (max-width: 600px) {
 
 
 .entry{
    max-width: 100%;
    min-width: 0px;
    margin: 5px auto;
    width: 100%;
    
 }
 
 
 .entry-image {
    display: block;
    width: auto;
    max-width: 100%;
    min-height: 0px;
    max-height: 250px;
    margin-left: auto;
    margin-right: auto;
    
}

 
 #main-container {
    width: 60%;
    padding: 0px;
    padding-top: 0px;
}

 
}

