*{
    box-sizing: border-box;
}

body{
    background-color: black;
    background-image: url('images/dark-tech.jpg');
    background-size: cover;
    min-height: 100vh;
}

h1, h2, h3, p{
    color: white;
}

h1{
    font-family:Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
}

h3{
    font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
    font-size: x-large;
    font-weight: bold;
}

p{
    font-family: Arial, Helvetica, sans-serif;
    font-size: large;
}

ul{
    display: flex;
    justify-content: center;
}

li{
    list-style: none;
    margin-right: 20%;
}

a{
    text-decoration: none;
    color: white;
}

a:hover{
    color: red;
}

img{
    border-radius: 10%;
}

img, p, h1, h3, h2{
    margin-left: 7.5%;
}

.blog-link{
    color: red;
}

.blog-link:hover{
    color:maroon;
}

@media (min-width:550px) {
    #container{
    display: grid;
    grid-template-areas: 
        "header header"
        "pic intro"
        "foot foot";
    }

    #header{
        grid-area: header;
    }

    #pic{
        grid-area: pic;
    }

    #intro{
        grid-area: intro;
    }

    #foot{
        grid-area: foot;
    }

}

/*@media (min-width:640px) and (max-width:767px) {
    
}

@media (min-width:768px) and (max-width:1023px){
    
}

@media (min-width:1024px) and (max-width:1279px){
    
}

@media (max-width:1280px) {
    
}*/