*{
    padding: 0px;
    margin: 0px;
}

header{
    background-color: brown;
}

header>h1, header>h2{
    color:lime;
    text-align: center;
    font-family: Courier, monospace;
    padding: 0px 20px;
}
 
header > h1{
    font-size: 3rem;
}
 
header > h2{
    font-size: 2rem;
}
 
nav>ul{
    list-style-type: none;
    display: flex;
    flex-direction: column;
   
}
 
nav>ul>li{
    width: 100%;
}
 
nav>ul>li>a{
    background-color: lightgray;
    display: block;
    text-align: center;
    padding: 10px 0px;
    border: black solid 1px;
}
 
nav>ul>li>a:active{
    background-color: darkgray;
}
 
 
main{
    padding: 10px;
    min-height: 500px;
    background-color: aquamarine;
}

.öppettider{
    padding: 10px;
    width: 500px;
}

main > table > tbody > tr > td{
    width: 50%;
    text-align: center;
}
main > table > tbody > tr:nth-child(even){
background-color: lightgoldenrodyellow;
}
main > table > tbody > tr:nth-child(odd){
background-color: lightskyblue;
}

main > table,
main > table , main > table > tbody > tr > th, td,
main > table , main > table > tbody > tr > th, td{
    border: black solid 3px;
    border-collapse: collapse;
    

}
.a{
    width: 300px;
    height: 300px;
    background-color: blue;
}
.b{
    width: 100px;
    height: 300px;
    background-color: yellow;
}
.c{
    width: 450px;
    height: 300px;
    background-color: blue;
}
.d{
    width: 850px;
    height: 100px;
    background-color: yellow;
}
.stjärnor{
    height: 300px;
    width: 400px;
    background-color: darkblue;
}
.vit{
    width: 600px;
    height: 40px;
    background-color: white;
}
.röd{
    width: 600px;
    height: 40px;
    background-color: crimson;
}
.ränder:nth-child(odd){
    background-color: red;
}
.ränder:nth-child(even){
    background-color: white;
}


footer{
    background-color: lightcyan;
}
@media screen and (min-width: 600px) {
    header>h1, header>h2{
        background-color: blueviolet;
    }
    main{
     
        margin: auto;
    }
    nav>ul{
        flex-direction: row;           
        }
         
}
@media screen and (min-width: 900px) {
    body{
        
        margin: auto;
    }
    header>h1, header>h2{
        background-color: blue;
    }

    nav>ul{
        flex-direction: row;           
        }
         
    }

img{
    padding-left: 10px;
    height: 200px;
width: 200px;
}