.body{
    margin:0;
}

.topnav{
    background-color: purple;
}


.topnav nav{
    max-width:1100px;
    margin:auto;
    display: flex;
    align-items: center;
    height:90px;
}

.topnav nav a {
    color:black;
    text-transform: uppercase;
    text-decoration: none;
    margin:0 10px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 18px;
    transition: all 0.3s;
}

.container1{
    max-width:1500px;
    margin:auto;
    }


.container2{
  max-width:1500px;
  margin:auto;
} 

.container3{
  max-width:1500px;
  margin:auto;
}

.container4{
  max-width:1500px;
  margin:auto;
}

.container5{
  max-width:1500px;
  margin:auto;
}

.container6{
  max-width:1500px;
  margin:auto;
}


.background-container1{
  background-color: rgb(246, 192, 151);
  max-width:100px;
  max-height:300px;
}
.container7{
  max-width:500%;
  
}

.container8{
  max-width:700px;
}

.container9{
  max-width:700px;
}

.container10{
  max-width:700px;
}

.container11{
  max-width:700px;
}

.container12{
  max-width:700px;
}

.flex{
  display:flex;
  gap:40px;
}

.flex2{
  display:flex;
  gap: 10px;
}

.flex3{
  display:flex;
  gap: 10px;
}

.flex4{
  display:flex;
  gap: 10px;
}

.flex5{
  display:flex;
  gap: 10px;
}

.flex6{
  display:flex;
  gap: 10px;
}

.left{
  width:auto;
  background-color:rgb(246, 192, 151);
  height: auto;
  padding: 10px;
}

.left2{
  width:auto;
  background-color:rgb(246, 192, 151);
  height: auto;
  padding: 10px;
}

.left3{
  width:auto;
  background-color:rgb(246, 192, 151);
  height: auto;
  padding: 10px;
}

.left4{
  width:auto;
  background-color:rgb(246, 192, 151);
  height: auto;
  padding: 10px;
}

.left5{
  width:auto;
  background-color:rgb(246, 192, 151);
  height: auto;
  padding: 10px;
}

.left6{
  width:auto;
  background-color:rgb(246, 192, 151);
  height: auto;
  padding: 10px;
}

.right{
  width:100%;
  background-color:rgb(246, 192, 151);
  height:300%;
  padding:10px;
}

.right5{
  .right{
    width:100%;
    background-color:rgb(246, 192, 151);
    height:300%;
    padding:10px;
  }
}
.background-container2{
  background-color: rgb(193, 34, 92);
  max-width:135px;
  max-height:300px;
}

.background-container3{
  background-color: rgb(247, 200, 153);
  max-width:119px;
  max-height:300px;
}

.background-container4{
  background-color: rgb(180, 52, 180);
  max-width:130px;
  max-height:300px;
}

.background-container5{
  background-color: rgb(77, 96, 205);
  max-width:85px;
  max-height:300px;
}

.background-container6{
  background-color: rgb(56, 212, 152);
  max-width:120px;
  max-height:300px;
}

.topnav {
    overflow: hidden;
    background-color: #333;
    position: relative;
  }
  
 
  .topnav #myLinks {
    display: none;
  }
  
  
  .topnav a {
    color: white;
    padding: 14px 16px;
    text-decoration: none;
    font-size: 17px;
    display: block;
  }
  
  
  .topnav a.icon {
    background: black;
    display: block;
    position: absolute;
    right: 0;
    top: 0;
  }
  
  
  .topnav a:hover {
    background-color: #ddd;
    color: black;
  }
  
  
  .active {
    background-color: #a881e7;
    color: white;
  }