*
{
box-sizing: border-box;
}
main
{
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    column-gap: 10px;
}


header
{
    background-color: blueviolet;
    width: 100%;
    text-align: center;
    color: rgb(0, 0, 0);
    
    
}


footer
{
    background-color: blueviolet;
    height: 60px;
    width: 100%;
    text-align: center;
    position: fixed;
    bottom: 0;
    left: 0;


}


.kurs
{
text-align: center;
background-color: rgb(0, 0, 0);
border-radius: 20px;
margin-top: 20px;
padding: 50px;
margin-bottom: 500px;
box-shadow: 5px 2px 2px ;
border: 5px solid rgb(0, 0, 0);

box-sizing: border-box; 
}

.kurs:hover{
    border-width: 10px;
    padding: 40px;

}

a, a:hover{
    text-decoration: none;
}

nav.webb1
{
    border-color: red;
    box-shadow: 5px 2px 2px rgb(255, 169, 169);
}

.webb1 p, .webb1 i
{
    color: red;
    border: 0px;
}
nav.webb2
{
    border-color: orange;
    box-shadow: 5px 2px 2px rgb(255, 228, 178);
}

.webb2 p, .webb2 i
{
    color: orange;
    border: 0px;
}
nav.webbserver
{
    border-color: yellow;
    box-shadow: 5px 2px 2px rgb(255, 255, 182);
}

.webbserver p,.webbserver i
{
    color: yellow;
    border: 0px;
}
nav.slutproject
{
border-color: green;
box-shadow: 5px 2px 2px rgb(168, 255, 168);
}

.slutproject p,.slutproject i
{
    color: green;
    border: 0px;
}
body i
{
font-size: xx-large;
}