@import url('https://fonts.googleapis.com/css2?family=Lexend:wght@100..900&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');
* {
    padding: 0;
    margin: 0;
} 

body {
background: linear-gradient( indigo, blue, orange, red);
font-family: Lexend;
color: #333333;
}

p
{
    padding:12px;
}
a, a:link, a:visited
 { color: #4c320d;  
text-decoration: none;}
a:hover 
{ text-decoration: none; 
    color : indigo; 
font-weight: 900;}
li
    {
        padding-left:20px;
    }

    h4{
        padding: 12px;
    }
h2
{
    padding:16px;
}
/*******************HEADER*********************/

header {
    top:0;
    height:12%;
    max-height:55px;
    background: linear-gradient(black, indigo);

}
header h1{
    text-align: center;
    color:ivory;
    text-shadow: 3px 3px 6px yellow;
    padding: 14px;
    font-size: 36px;
}

section
{
    
    background: linear-gradient( indigo, blue, orange, red);
    width:100%;
    height:100vh;
}
/****************MENU*********************/
#menu {
    top:0;
    border-top: indigo 3px solid;
    height:30px;
    margin-top: 0;
    margin-bottom:9px;
}
#menu ul{
    
    margin: 0 auto 0 auto;
    width:100%;
	display:block;
 	float:left;
	
}
#menu li{
    padding-left:0;
    float:left;
	display:block;
    box-shadow:3px 3px 3px 3px sandybrown;
	width:24%;
    height:80%;
	list-style-type:none;
    padding-top: 16px;
    margin-top:0px;
    margin-bottom:9px;
	margin-left:5px;
	margin-right:5px;
	background: rgba(217, 210, 240, 0.8);
	text-align:center;
    border-bottom-left-radius:10px;
    border-bottom-right-radius:10px;
}
#menu li:hover
{
    background-color: aqua;
    font-weight: bold;
}



/*****************CONTENT**************************/

#content
{
    width:98%;
    min-height: 100%;
    bottom:12px;
    padding: 6px;
    margin-top:9px;
    margin-left: auto;
    
    margin-right: auto;
    background: rgba(217, 210, 240, 0.7);
}


/******************FOOTER***********************/

footer {
background: rgba(38, 27, 2, 0.8);
margin:0 auto 0 auto;
width:100%;
height: 12%;
max-height:40px;
color: #d4d2d0;
font-size: 16px;
padding: 6px;
bottom:1px;
position: fixed;
}
footer p{
    margin-top: 10px;
font-weight: bold;
text-align: center;
}