body {
    max-width: 95vw; /*so that it does not fill the screen fullt*/
    margin: 0 auto;
    text-align: center;
}


/* Fonts */
h1,
h2,
h3{
    font-family: 'Monserrat-Bold';   /*this font work better with screens*/
    text-align: center;  
}

h1{
    font-size: 2.5vw;
    align-items: center;
    color:black;        /* I changed this font color beacuse it did not work aestatically or visually.*/
    background-color: white; 
    padding-top: 2rem;
}

p{
    line-height: 1.5;
    display: inline-block;
    font-family:'Lato-Regular'; /*this font work better with screens*/
    max-width: 30vw;
    padding-left: 4rem;
    padding-right: 4rem;  
}

#intro{
    font-size: 1.3vw;
   
}
/*New fonts*/
@font-face{
    font-family: 'Lato-Regular';    
    src: url(/fonts/Lato-Regular.ttf);
}
@font-face {
    font-family: 'Monserrat-Bold';
    src: url(/fonts/Montserrat-Bold.ttf);
}

.flex-container{        /*flex container so create two columns*/
    display: flex;
    padding-top: 4rem;
    justify-content: space-around;   /*equally divided space around them*/
    margin: none;
}

.blog-entry{
    padding-bottom: 0.5rem;
    border: lightgrey solid 2px;  /*border to easily divide the two different themes*/
}

img{
    display: flex;
    width: 25vw;
    margin: 0 auto;
    padding-bottom: 1rem;
}

footer{
    display: block;
    text-align: center;
    max-width: 95vw;
    background-color: lightgrey;  /*grey to show that this is something else than the main content*/
    margin-top: 2rem;
    margin-bottom: 5px;

}