* {
    margin: 0;
    padding: 13px;
    box-sizing: border-box;
}

.container {
    width: 90%;
    max-width: 720px;
    min-height: 80vh;
    background-color: rgb(247, 235, 220);
    margin: auto;
}

header {
    color: beige;
    background-color: rgb(174, 208, 223);
}

h1 {
    color: rgb(51, 55, 102);
    text-align: left;
    font-family: "Lexend", sans-serif;
    font-size: 40px;
    font-weight: 600;
}

/*Navigation styling starts here*/
nav ul {
    list-style: none;
    display: flex;
    justify-content: center;
    align-items: center;
background-color: rgb(174, 208, 223);
border: solid rgb(174, 208, 223);
    
}


nav ul li a {
    text-decoration: none;
    color: rgb(247, 235, 220);
    width: 120px;
    text-align: center;
    background-color: rgb(174, 208, 223);
    border: 3px solid rgb(51, 55, 102); 
}

nav a:hover {
background-color: rgb(247, 235, 220);
color: rgb(51, 55, 102);
}

.currentpage {
   color: rgb(51, 55, 102)
}
/*Navigation styling ends here*/

main {
    color: beige;
    background-color: rgb(51, 55, 102);
    font-family: "Lexend", sans-serif;
}

img {
    width: 100%;
}

a {
    color: rgb(245, 245, 220);
    font-family: "Lexend", sans-serif;
}

h4 {
    font-size:19px ;
}

.colourswatch {
    width: 60%;
    border: 1px solid black;
    margin: auto;
    text-align: center;

}

#maincolour {
    border: solid rgb(245, 245, 220);
    color: rgb(245, 245, 220);
    background-color: rgb(51, 55, 102);
}

#secondcolour {
    border: solid rgb(245, 245, 220);
    color: rgb(51, 55, 102);
    background-color: rgb(174, 208, 223);
}


#thirdcolour {
    border: solid rgb(174, 208, 223);
    color: rgb(51, 55, 102);
    background-color: rgb(247, 235, 220);
}