body{
    margin:0;
    background-color:white;
}

.wrapper1{
    display:flex;
    gap:20px;
    margin:20px;
    flex-direction:row-reverse;
}

.wrapper2{
    gap:40px;
    margin:60px;
    display:flex;
    justify-content:space-between;
}
.wrapper3{
    
    display:flex;
    margin:20px;
    gap:20px;  
    flex-direction: column-reverse;
}

.wrapper4{
    
    display:flex;
    gap:20px;
    margin:20px;
    align-items:center;
    flex-direction: column;
}

.quarter_box{
    flex:45%;
    background-color:blueviolet;
    padding:3%;
}
.third_box{
    flex-basis:10px;
    background-color: rgb(122, 221, 221);
    padding:6%;
}

.half_box{
    flex:60%;
    background-color:rgb(226, 121, 201);
     padding:5%;
}
.onethird_box{
    flex:33%;
    background-color:rgb(94, 102, 164);
     padding:2%;
}

.twothird_box{

    flex:66%;
      background-color:rgb(146, 86, 117);
       padding:2%;
}