*{
    margin: 0;
    padding: 0;
    background-color:rgb(239 246 255);
}




.container{
   position: sticky;
    
    padding:10px;
    background-color: rgb(239 246 255);  
}
.leftNav {
    padding: 32px;
    position: fixed;
    background-color:rgb(239 246 255) ;
    height:85%;
    left: 0px;  
    top: 5%;
    
   
    
}
.bottom{
    padding: 10px;
    background-color:  rgb(239 246 255);
   position:fixed;
   
  bottom: 0px;
    width: 98.5%;
    left:0px;
    
}
.rightNav{
    padding: 10px;
    position: fixed;
    right: 0px;
    height: 97%;
    background-color:rgb(239 246 255);
    top: 0px;
}


.top-padding{
    position: sticky;
  background-color: white;
   border-top-left-radius: 20px;
   border-top-right-radius: 20px;
    width: 87%;
    height: 41px;
    margin-left: 12.5%;
}

.main{
    width: 87%;
    background-color: rgb(255, 255, 255);
    height: 84%;
   position: absolute;
   margin-left: 12.5%;
   overflow-y: scroll;
   border-bottom-left-radius: 20px;
   border-bottom-right-radius: 50px;
  
}


.container img{
    position: sticky;
    margin-left: 5%;
}


.burger{
   position: absolute;
   cursor: pointer;
top: 20px;
margin-left: 1.5%;
background-color: transparent; 
}
.burger:hover{
    background-color: rgb(217, 218, 218);
    border-radius: 50%;
    width: 40px;
    height: 40px;
    
}

.line{
    background-color:black;
   
    width: 20px;
    height: 2px;
    margin: 3px;

   
}

#search{
   position:absolute;
 top: 20%;
 width: 46%;
 height: 50%;
margin-left: 6%;
font-size: 15px;
border-radius: 20px;
border: 1px solid rgb(240, 240, 240);
box-shadow: rgb(241, 241, 241);
   padding: 5px;
   background-color: rgb(235, 234, 253);
 color:rgb(165, 155, 155);

    
}


.info{
    position: absolute;
  left: 89%;
    top: 35%;
    border: 2px solid rgb(51, 51, 51);
    border-radius: 50%;
    width: 1%;
   text-align: center;
   font-weight: 900;
   color: rgb(64, 64, 64);
   cursor: pointer;
  
   
}
.info:hover{
   border: 6px solid white;
}


/* setting icon */

.settings-icon {
    width: 24px;
    height: 24px;
    fill: #333;
    cursor: pointer;
    position: absolute;
   left: 91%;
    top: 31%;
    cursor: pointer;
    border: none;
}
.settings-icon:hover{
   border-radius: 50%;
    border: 1px solid blue;
    background-color: blue;
    transition: 1ms;
}


.mid-icon{
    position: absolute;
    left: 93%;
    top: 30%;
    width: 25px;
    cursor: pointer;
    border: none;
}
.mid-icon:hover{
    border: 1px solid rgb(168, 168, 168);
    background-color: rgb(117, 117, 117);
    border-radius: 50%;
}
.login{
    position:absolute;
   left: 95%;
    top: 25%;
    background-color: rgb(91, 94, 219);
    color: rgb(255, 255, 255);
   border: 1px solid rgb(255, 255, 255);
   width: 35px;
   height: 35px;
   border-radius: 100%;
   text-align: center;
   cursor: pointer;
}
.login:hover{
    background-color: rgb(121, 81, 81);
}

.pen{
    position: absolute;
    left: 12%;
    top: 7%;
    width: 85%;
    height: 9%;
    border: none;
    border-radius: 10px;
    background-color: rgb(192, 219, 255);
    cursor: pointer;
}
.pen:hover{

    background-color: rgb(192, 192, 192);
}
.pen img{
    background-color: transparent;
}


.gallery{
    position: absolute;
    left: 22%;
    top: 19%;
    width: 50%;
    height: 5%;
    border: none;
    border-radius: 50%;
    background-color: rgb(175, 192, 240);
   cursor: pointer;
}
.gallery:hover{
    background-color: rgb(86, 86, 97);
}
.gallery img{
    background-color: transparent;
}

.star{
    position: absolute;
    left: 26%;
    top: 25%;
   
    border: none;
    border-radius: 50%;
    background-color: transparent;
    cursor: pointer;
}
.star:hover{
    border: 3px solid rgb(255, 255, 255);
    
}
.clock{
    position: absolute;
    left: 30%;
    top: 30%;
   
    border: none;
    border-radius: 50%;
    background-color: transparent;
    cursor: pointer;
}
.clock:hover{
    border: 3px solid rgb(255, 255, 255);
}

.share{
    position: absolute;
    left: 33%;
    top: 35%;
   
    border: none;
    border-radius: 50%;
    background-color: transparent;
    cursor: pointer;
}
.share:hover{
    border: 3px solid rgb(255, 255, 255);
}

.draft{
    position: absolute;
    left: 30%;
    top: 40%;
   
    border: none;
    border-radius: 50%;
    background-color: transparent;
    cursor: pointer;
}
.draft:hover{
    border: 3px solid rgb(255, 255, 255);
}
.more{
    position: absolute;
    left: 22%;
    top: 44%;
    width: 50%;
    height: 4%;
    border: none;
    border-radius: 50%;
    background-color: transparent;
    cursor: pointer;
}
.more:hover{
    border: 3px solid rgb(255, 255, 255);
}
.more img{
    background-color: transparent;
}

.plus{
    position: absolute;
    left: 30%;
    top: 55%;
   
    border: none;
    border-radius: 50%;
    background-color: transparent;
    cursor: pointer;
}
.plus:hover{
    border: 3px solid rgb(255, 255, 255);
}
.arrow{
    position: absolute;
    left: 33%;
    top: 60%;
   
    border: none;
    border-radius: 50%;
    background-color: transparent;
    cursor: pointer;
}
.arrow:hover{
    border: 3px solid rgb(255, 255, 255);
}

.square{
    position: absolute;
    left: 2.3%;
    top: 35%;
   
    border: none;
    border-radius: 50%;
    background-color: transparent;
    cursor: pointer;

}
.square input{
    background-color: transparent;
    width: 15px;
    height: 15px;
    cursor: pointer;
}

.arrow-down{
    position: absolute;
    left: 3.5%;
    top: 30%;
   
    border: none;
    border-radius: 50%;
    background-color: transparent;
    cursor: pointer;
}
.arrow-down img{
    background-color: transparent;
}

.loading{
    position: absolute;
    left: 8%;
    top: 35%;
   
    border: none;
    border-radius: 50%;
    background-color: transparent;
    cursor: pointer;
    font-weight: 900;
}
.loading img{
    background-color: transparent;
}
.loading:hover{
    box-shadow: inset 100px 100px 100px rgba(198, 198, 198, 0.5);
  
    
    
   
   
   
}

.three{
    position: absolute;
    left: 12%;
    top: 35%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
   border: none;
    height: 35%;
    cursor: pointer;
    
}

.dot {
    width: 3px;
    height: 3px;
    background-color: #000000;
    border-radius: 100%;
    cursor: pointer;
}

.numbers{
    position: absolute;
    right: 9%;
    top: 35%;
    background-color: white;
    border: none;
    font-weight: 100;
    cursor: pointer;
}

.left{
    position: absolute;
    right: 6%;
    top: 24%;
    background-color: white;
    border: none;
    font-weight: 100;
    opacity: 0.4;
    cursor: pointer;
}

.right{
    position: absolute;
    right: 3%;
    top: 34.5%;
    background-color: white;
    border: none;
    font-weight: 100;
    cursor: pointer;

}

.main-line{
    position: absolute;
    margin-left: 1%;
    width: 15%;
    height:40px;
    border-top: none;
    border-left: none;
    border-right: none;
   border-bottom: 3.5px solid blue;
   background-color: transparent;
   cursor: pointer;
   margin-top: 2%;
}
.main-line:hover{
    background-color: rgb(225, 225, 225);
}
.main-line::after{
    content: "Primary";
    font-size: 13px;
    color: rgb(102, 130, 223);
    position: absolute;
    top: 20%;
    left: 25%;
    font-weight: 550;
}

.main-line img{
    position: absolute;
    left: 6%;
    top: 10%;
    background-color: transparent;
}

.main-second{
    position: absolute;
    margin-left: 20%;
    width: 15%;
    height: 40px;
   border: none;
   background-color: transparent;
   cursor: pointer;
   margin-top: 2%;
}
.main-second:hover{
    background-color: rgb(225, 225, 225);
}
.main-second::after{
    content: "Promotions";
    font-size: 13px;
    color: rgb(4, 4, 4);
    position: absolute;
    top: 0%;
    left: 25%;
    font-weight: 500;
    font-size: 14px;
}

.main-second img{
    position: absolute;
    left: 6.5%;
    top: 15%;
    background-color: transparent;
}

.main-third{
    position: absolute;
    margin-left: 38%;
    width: 15%;
    height: 40px;
 border: none;
   background-color: transparent;
   cursor: pointer;
   margin-top: 2%;
}
.main-third:hover{
    background-color: rgb(225, 225, 225);
}
.main-third::after{
    content: "Social";
    font-size: 15px;
    color: rgb(0, 0, 0);
    position: absolute;
    top: 0%;
    left: 25%;
    font-weight: 500;
}

.main-third img{
    position: absolute;
    left: 6%;
    top: 15%;
    background-color: transparent;
}
.inside1{
    background-color: rgb(10, 138, 76);
    color: white;
    border: none;
    border-radius: 20px;
    width: 50px;
    margin-left: 30%;
    margin-top: 2%;
    position: absolute;
}
.inside2{
    background-color: rgb(65, 106, 255);
    color: white;
    border: none;
    border-radius: 20px;
    width: 50px;
    margin-left: 46%;
    margin-top: 2%;
    position: absolute;
}
.padding1{
   width: 99.5%;
   height: 6%;
    background-color: rgb(255, 255, 255);
    position: absolute;
    top: 11.5%;
    border: 0.1px solid rgb(240, 240, 240);
    border-left: none;
    border-right: none;
    cursor: pointer;
    transition: box-shadow 0.3s ease;
}
.padding1:hover{
    box-shadow: inset 0 0 10px rgba(198, 198, 198, 0.5);
}
.checkbox1{
    position: absolute;
    top: 25%;
    left: 2.2%;
    width: 15px;
    height: 15px;
    cursor: pointer;
    
}

.padding2{
    width: 99.5%;
    height: 6%;
     background-color: rgb(255, 255, 255);
     position: absolute;
     top: 17%;
     border: 0.1px solid rgb(240, 240, 240);
     border-left: none;
     border-right: none;
     cursor: pointer;
 }

 .padding2:hover{
    box-shadow: inset 0 0 10px rgba(198, 198, 198, 0.5);
}

 .padding3{
    width: 99.5%;
    height: 6%;
     background-color: rgb(255, 255, 255);
     position: absolute;
     top: 23%;
     border: 0.1px solid rgb(240, 240, 240);
     border-left: none;
     border-right: none;
     cursor: pointer;
 }

 .padding3:hover{
    box-shadow: inset 0 0 10px rgba(198, 198, 198, 0.5);
}
 .padding4{
    width: 99.5%;
    height: 6%;
     background-color: rgb(255, 255, 255);
     position: absolute;
     top: 29%;
     border: 0.1px solid rgb(240, 240, 240);
     border-left: none;
     border-right: none;
     cursor: pointer;
 }
 .padding4:hover{
    box-shadow: inset 0 0 10px rgba(198, 198, 198, 0.5);
}

 .padding5{
    width: 99.5%;
    height: 6%;
     background-color: rgb(255, 255, 255);
     position: absolute;
     top: 35%;
     border: 0.1px solid rgb(240, 240, 240);
     border-left: none;
     border-right: none;
     cursor: pointer;
 }
 .padding5:hover{
    box-shadow: inset 0 0 10px rgba(198, 198, 198, 0.5);
}
 .padding6{
    width: 99.5%;
    height: 6%;
     background-color: rgb(255, 255, 255);
     position: absolute;
     top: 41%;
     border: 0.1px solid rgb(240, 240, 240);
     border-left: none;
     border-right: none;
     cursor: pointer;
 }
 .padding6:hover{
    box-shadow: inset 0 0 10px rgba(198, 198, 198, 0.5);
}
 .padding7{
    width: 99.5%;
    height: 6%;
     background-color: rgb(255, 255, 255);
     position: absolute;
     top: 47%;
     border: 0.1px solid rgb(240, 240, 240);
     border-left: none;
     border-right: none;
     cursor: pointer;
 }
 .padding7:hover{
    box-shadow: inset 0 0 10px rgba(198, 198, 198, 0.5);
}
 .padding8{
    width: 99.5%;
    height: 6%;
     background-color: rgb(255, 255, 255);
     position: absolute;
     top: 53%;
     border: 0.1px solid rgb(240, 240, 240);
     border-left: none;
     border-right: none;
     cursor: pointer;
 }
 .padding8:hover{
    box-shadow: inset 0 0 10px rgba(198, 198, 198, 0.5);
}
 .padding9{
    width: 99.5%;
    height: 6%;
     background-color: rgb(255, 255, 255);
     position: absolute;
     top: 59%;
     border: 0.1px solid rgb(240, 240, 240);
     border-left: none;
     border-right: none;
     cursor: pointer;
 }
 .padding9:hover{
    box-shadow: inset 0 0 10px rgba(198, 198, 198, 0.5);
}
 .padding10{
    width: 99.5%;
    height: 6%;
     background-color: rgb(255, 255, 255);
     position: absolute;
     top: 65%;
     border: 0.1px solid rgb(240, 240, 240);
     border-left: none;
     border-right: none;
     cursor: pointer;
 }
 .padding10:hover{
    box-shadow: inset 0 0 10px rgba(198, 198, 198, 0.5);
}
 .padding11{
    width: 99.5%;
    height: 6%;
     background-color: rgb(255, 255, 255);
     position: absolute;
     top: 71%;
     border: 0.1px solid rgb(240, 240, 240);
     border-left: none;
     border-right: none;
     cursor: pointer;
 }
 .padding11:hover{
    box-shadow: inset 0 0 10px rgba(198, 198, 198, 0.5);
}
.padding12{
    width: 99.5%;
    height: 6%;
     background-color: rgb(255, 255, 255);
     position: absolute;
     top: 77%;
     border: 0.1px solid rgb(240, 240, 240);
     border-left: none;
     border-right: none;
     cursor: pointer;
}
.padding12:hover{
    box-shadow: inset 0 0 10px rgba(198, 198, 198, 0.5);
}
.padding13{
    width: 99.5%;
    height: 6%;
     background-color: rgb(255, 255, 255);
     position: absolute;
     top: 83%;
     border: 0.1px solid rgb(240, 240, 240);
     border-left: none;
     border-right: none;
     cursor: pointer;
}
.padding13:hover{
    box-shadow: inset 0 0 10px rgba(198, 198, 198, 0.5);
}
.padding14{
    width: 99.5%;
    height: 6%;
     background-color: rgb(255, 255, 255);
     position: absolute;
     top: 89%;
     border: 0.1px solid rgb(240, 240, 240);
     border-left: none;
     border-right: none;
     cursor: pointer;
}
.padding14:hover{
    box-shadow: inset 0 0 10px rgba(198, 198, 198, 0.5);
}
.padding15{
    width: 99.5%;
    height: 6%;
     background-color: rgb(255, 255, 255);
     position: absolute;
     top: 95%;
     border: 0.1px solid rgb(240, 240, 240);
     border-left: none;
     border-right: none;
     cursor: pointer;
}
.padding15:hover{
    box-shadow: inset 0 0 10px rgba(198, 198, 198, 0.5);
}
.padding16{
    width: 99.5%;
    height: 6%;
     background-color: rgb(255, 255, 255);
     position: absolute;
     top: 101%;
     border: 0.1px solid rgb(240, 240, 240);
     border-left: none;
     border-right: none;
     cursor: pointer;
}
.padding16:hover{
    box-shadow: inset 0 0 10px rgba(198, 198, 198, 0.5);
}
.padding17{
    width: 99.5%;
    height: 6%;
     background-color: rgb(255, 255, 255);
     position: absolute;
     top: 107%;
     border: 0.1px solid rgb(240, 240, 240);
     border-left: none;
     border-right: none;
     cursor: pointer;
}
.padding17:hover{
    box-shadow: inset 0 0 10px rgba(198, 198, 198, 0.5);
}
.padding18{
    width: 99.5%;
    height: 6%;
     background-color: rgb(255, 255, 255);
     position: absolute;
     top: 113%;
     border: 0.1px solid rgb(240, 240, 240);
     border-left: none;
     border-right: none;
     cursor: pointer;
}
.padding18:hover{
    box-shadow: inset 0 0 10px rgba(198, 198, 198, 0.5);
}
.padding19{
    width: 99.5%;
    height: 6%;
     background-color: rgb(255, 255, 255);
     position: absolute;
     top: 119%;
     border: 0.1px solid rgb(240, 240, 240);
     border-left: none;
     border-right: none;
     cursor: pointer;
}
.padding19:hover{
    box-shadow: inset 0 0 10px rgba(198, 198, 198, 0.5);
}
.padding20{
    width: 99.5%;
    height: 6%;
     background-color: rgb(255, 255, 255);
     position: absolute;
     top: 125%;
     border: 0.1px solid rgb(240, 240, 240);
     border-left: none;
     border-right: none;
     cursor: pointer;
}
.padding20:hover{
    box-shadow: inset 0 0 10px rgba(198, 198, 198, 0.5);
}
.padding21{
    width: 99.5%;
    height: 6%;
     background-color: rgb(255, 255, 255);
     position: absolute;
     top: 131%;
     border: 0.1px solid rgb(240, 240, 240);
     border-left: none;
     border-right: none;
     cursor: pointer;
}
.padding21:hover{
    box-shadow: inset 0 0 10px rgba(198, 198, 198, 0.5);
}
.padding22{
    width: 99.5%;
    height: 6%;
     background-color: rgb(255, 255, 255);
     position: absolute;
     top: 137%;
     border: 0.1px solid rgb(240, 240, 240);
     border-left: none;
     border-right: none;
     cursor: pointer;
}
.padding22:hover{
    box-shadow: inset 0 0 10px rgba(198, 198, 198, 0.5);
}
.padding23{
    width: 99.5%;
    height: 6%;
     background-color: rgb(255, 255, 255);
     position: absolute;
     top: 143%;
     border: 0.1px solid rgb(240, 240, 240);
     border-left: none;
     border-right: none;
     cursor: pointer;
}
.padding23:hover{
    box-shadow: inset 0 0 10px rgba(198, 198, 198, 0.5);
}
.padding24{
    width: 99.5%;
    height: 6%;
     background-color: rgb(255, 255, 255);
     position: absolute;
     top: 149%;
     border: 0.1px solid rgb(240, 240, 240);
     border-left: none;
     border-right: none;
     cursor: pointer;
}
.padding24:hover{
    box-shadow: inset 0 0 10px rgba(198, 198, 198, 0.5);
}
.padding25{
    width: 99.5%;
    height: 6%;
     background-color: rgb(255, 255, 255);
     position: absolute;
     top: 155%;
     border: 0.1px solid rgb(240, 240, 240);
     border-left: none;
     border-right: none;
     cursor: pointer;
}
.padding25:hover{
    box-shadow: inset 0 0 10px rgba(198, 198, 198, 0.5);
}
.padding26{
    width: 99.5%;
    height: 6%;
     background-color: rgb(255, 255, 255);
     position: absolute;
     top: 161%;
     border: 0.1px solid rgb(240, 240, 240);
     border-left: none;
     border-right: none;
     cursor: pointer;
}
.padding26:hover{
    box-shadow: inset 0 0 10px rgba(198, 198, 198, 0.5);
}
.padding27{
    width: 99.5%;
    height: 6%;
     background-color: rgb(255, 255, 255);
     position: absolute;
     top: 167%;
     border: 0.1px solid rgb(240, 240, 240);
     border-left: none;
     border-right: none;
     cursor: pointer;
}
.padding27:hover{
    box-shadow: inset 0 0 10px rgba(198, 198, 198, 0.5);
}
.padding28{
    width: 99.5%;
    height: 6%;
     background-color: rgb(255, 255, 255);
     position: absolute;
     top: 173%;
     border: 0.1px solid rgb(240, 240, 240);
     border-left: none;
     border-right: none;
     cursor: pointer;
}
.padding28:hover{
    box-shadow: inset 0 0 10px rgba(198, 198, 198, 0.5);
}
.padding29{
    width: 99.5%;
    height: 6%;
     background-color: rgb(255, 255, 255);
     position: absolute;
     top: 179%;
     border: 0.1px solid rgb(240, 240, 240);
     border-left: none;
     border-right: none;
     cursor: pointer;
}
.padding29:hover{
    box-shadow: inset 0 0 10px rgba(198, 198, 198, 0.5);
}
.padding30{
    width: 99.5%;
    height: 6%;
     background-color: rgb(255, 255, 255);
     position: absolute;
     top: 185%;
     border: 0.1px solid rgb(240, 240, 240);
     border-left: none;
     border-right: none;
     cursor: pointer;
}
.padding30:hover{
    box-shadow: inset 0 0 10px rgba(198, 198, 198, 0.5);
}
.padding31{
    width: 99.5%;
    height: 6%;
     background-color: rgb(255, 255, 255);
     position: absolute;
     top: 191%;
     border: 0.1px solid rgb(240, 240, 240);
     border-left: none;
     border-right: none;
     cursor: pointer;
}
.padding31:hover{
    box-shadow: inset 0 0 10px rgba(198, 198, 198, 0.5);
}



/* star shaped checkbox */
.star-input {
    display: none;
}


.star-label {
    position: absolute;
    left: 4.5%;
    top: 15%;
   display: flex;
    width: 20px;
    height: 20px;
    background-color: transparent;
    clip-path: polygon(
        50% 0%, 
        61% 35%, 
        98% 35%, 
        68% 57%, 
        79% 91%, 
        50% 70%, 
        21% 91%, 
        32% 57%, 
        2% 35%, 
        39% 35%
    );
 background-color: rgb(179, 179, 179);
    cursor: pointer;
}

.star-input:checked + .star-label {
    background-color: gold;
}

.time{
    position: absolute;
    right: 1.5%;
    top: 20%;
    background-color: transparent;
    font-size: 13px;
    font-weight: 900;
}

.heading{
    position: absolute;
    left: 7%;
    top: 20%;
    font-size: 14px;
    text-decoration: none;
    color: black;
    background-color: transparent;

}
.mid{
    position: absolute;
    left: 15%;
    top: 15%;
    background-color: transparent;
    font-size: 15px;
    font-weight: 600;
}
.last{
    position: absolute;
    left: 34.5%;
    top: 20%;
    font-size: 14px;
    background-color: transparent;
    font-weight: 100;
    color: #787878;
}

.h-nav{
    position: absolute;
    top: 8%;
    width: 10%;

    .pen{
        position: absolute;
        left: 5%;
        width: 55%;
    }
    .pen img{
        position: absolute;
        left: 5%;
        top: 30%;
    }
    .pen::after{
        content: 'compose';
        font-size: 15px;
       position: absolute;
       top: 30%;
       left: 30%;
       font-weight: 550;

    }
    .gallery{
        position: absolute;
        width: 85%;
        left: 1%;
        border-top-left-radius: 1%;
        border-bottom-left-radius: 1%;
        border-top-right-radius: 20px;
        border-bottom-right-radius: 20px;
    }
    .gallery img{
        position: absolute;
        left: 10%;
        top: 25%;
    }
   .gallery::after{
    content: 'inbox ';
    position: absolute;
    left: 25%;
    top: 20%;
    font-size: 14px;
    font-weight: 550;
   }
   .gallery::before{
    content: '999 +';
    position: absolute;
    left: 70%;
    top: 25%;
    font-size: 14px;
    font-weight: 550;
   }

   .star{
    position: absolute;
    left: 7%;
   }
   .star::after{
    content: 'Starred';
    font-size: 14px;
    position: absolute;
    top: 20%;
    left: 125%;
   }
.clock{
    position: absolute;
    left: 8%;
}
.clock::after{
    content: 'Snoozed';
    font-size: 14px;
    position: absolute;
    top: 10%;
    left: 150%;
}
.share{
    position: absolute;
    left: 8.5%;
}
.share::after{
    content: 'Sent';
    position: absolute;
    top: 10%;
    left: 150%;
    font-size: 14px;
}
.draft{
    position: absolute;
    left: 8%;
}
   .draft::after{
    content: 'Draft';
    font-size: 14px;
    position: absolute;
    left: 150%;
    top: 10%;
   }
   .more{
    position: absolute;
    left: 8%;
    width: 10%;
    background-color: none;
   }
   .more::after{
    content: 'More';
    position: absolute;
    left: 150%;
    top: 10%;
   }
   .plus{
    position: absolute;
    left: 70%;
   }
   .plus::before{
    content: 'Label';
    font-size: 15px;
    font-weight: 900;
    position: absolute;
    right: 500%;
   }
   .arrow{
    position: absolute;
    left: 8%;
   }
   .arrow::after{
    content: 'unpaid';
    font-size: 14px;
    font-weight: 550;
    position: absolute;
    margin-left: 20%;
   }
   .arrow::before{
    content: '64';
    position: absolute;
    font-size: 14px;
    font-weight: 700;
    left: 670%;
   }
}