layout.css

.background
{
    background-color: lightgrey;
    height: 570px;
    width: 1270px;
    margin:0px;
    
    
}
.pages
{
    background-color:lavender;
    position:fixed;
    margin-left: 80px;
    height:500px;
    width:1100px;
    border-radius: 10px;
    margin-top:30px;
    
}
.main
{
  background-color: white;
  position:relative;
  margin-left: 20px;
  margin-top: 20px;
  height: 460px;
  width:1060px;
  border-radius: 10px;
  display: flex;
}











.left
{
    font-family: 'Rampart One', cursive;
    background-color: whitesmoke;
    flex:0.2;
    margin-top:10px;
    margin-left: 10px;
    margin-right: 10px;
    margin-bottom: 10px;
    border-style: dashed dashed;
    border-color: lavender;
    display: flex;
    flex-direction: column;
    

}

.proflie
{
    flex:0.4;
    
    margin-left: 10px;
    margin-right: 10px;
    margin-top:10px;
    

}
.introduction
{
    flex:0.5;
    
    margin-left: 10px;
    margin-right: 10px;
   
    

}
.links
{
    flex:0.1;
    
    margin-left: 10px;
    margin-right: 10px;
    
    
    margin-bottom:10px;

}

a { text-decoration: none;  }



.mid
{
    font-family: 'Rampart One', cursive;
   
    flex:0.7;
    margin-top:10px;
    margin-left: 10px;
    margin-right: 10px;
    margin-bottom: 10px;
    border-radius: 10px;
    display: flex;
    flex-direction: column;
}

.titlee
{
  flex:0.2;
 
  margin-left: 10px;
  margin-right: 10px;
  margin-top:10px;
}
.item1
{
    flex:0.9;
    
    margin-left: 10px;
    margin-right: 10px;
    background-color:paleturquoise;
    border-radius: 20px;
}


.right
{
    font-family: 'Rampart One', cursive;
    background-color: lavender;
    flex:0.1;
    margin-top:10px;
   
    margin-right: 10px;
    margin-bottom: 10px;
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    
    
}

.menubar
{
    display: flex;
    flex-direction: column;
    flex:1;
}
.menu1
{
    flex:0.25;
    background-color: lightsteelblue;
    margin-top:10px;
    margin-left: 10px;
    margin-right: 10px;
    margin-bottom: 10px;
    border-radius: 10px;
}
.menu2
{
    flex:0.25;
    background-color: lightsteelblue;
    margin-top:10px;
    margin-left: 10px;
    margin-right: 10px;
    margin-bottom: 10px;
    border-radius: 10px;
}
.menu3
{
    flex:0.25;
    background-color: lightsteelblue;
    margin-top:10px;
    margin-left: 10px;
    margin-right: 10px;
    margin-bottom: 10px;
    border-radius: 10px;
}
.menu4
{
    flex:0.25;
    background-color: lightsteelblue;
    margin-top:10px;
    margin-left: 10px;
    margin-right: 10px;
    margin-bottom: 10px;
    border-radius: 10px;
    vertical-align: middle;
}

.menu11{
    text-align: center;
    margin-top: 30px;
}

.menu22{
    text-align: center;
    margin-top: 20px;
}

.menu33{
    text-align: center;
    margin-top: 30px;
}

.menu44{
    text-align: center;
    margin-top: 20px;
}