.contentabout, body.dark .contentabout{
    position: static;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 90vh;
  align-items: center;
  text-align: center;
  background-image: none;
  filter: none;
}

.mainabout{
     position: relative;
    height: 1284px;
 }
  
.text1ab{
     position: relative;
    width: 446px;
    height: 273px;
    top: 113px;
    left: -66px;
    rotate: -6deg;
    align-content: center;
    filter: drop-shadow(-2px 2px 2px rgba(108, 32, 73, 0.17));
}
  
.text2ab{
    position: relative;
    width: 352px;
    height: 438px;
    top: -74px;
    left: 328px;
    rotate: 13deg;
    align-content: left;
    filter: drop-shadow(2px 2px 2px rgba(108, 32, 73, 0.17));
    text-align: left;
}
  
.text3ab{
     position: absolute;
    width: 293px;
    height: fit-content;
    top: 528px;
    left: -99px;
    align-content: center;
    text-align: center;
}

.drawingab {
    float:left;
    transform: translate(-61px, -101px) rotate(-5deg);
        shape-outside: polygon(0px 0px, 85px 0px, 156px 41px, 131px 66px, 121px 89px,
        101px 120px, 80px 140px, 49px 165px, 42px 180px, 0px 180px);
 pointer-events: none;

}

.hiab{
    position: absolute;
    width: 294px;
    height: 225px;
    top: 280px;
    left: 6px;
    rotate: 13deg;
    text-align: center;
    align-content: center;
    pointer-events: none;
}

.postitswrapperab{
     position: relative;
    width: 474px;
    height: 430px;
    top: 105px;
    left: -59px;
    align-content: center;
 filter: drop-shadow(2px 2px 5px #0000005b);
}

.postitab{
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    align-items: flex-start;
    text-align: left;
}

.itemab {
    display: flex;
    align-items: flex-start;
    gap: 0.9rem;
}

.itemab img{
    width: 20px;
    height: 20px;
    align-items: center;
}

.programmesab{
    position: absolute;
    width: 284px;
    height: 101px;
    top: 1144px;
    left: -101px;
    font-size: 15px;
    text-align: left;
    align-content: center;
}
 
.dislikeab{
    position: absolute;
    width: 250px;
    height: 304px;
    top: 929px;
    left: 404px;
    font-size: 15px;
    text-align: left;
    align-content: center;
}

.line1ab{
     position: absolute;
                top: 68%;
                left: 50%;
                scale: 1;
                opacity: 1;
}

.line2ab{
     position: absolute;
                top: 18%;
                left: -3%;
                scale: 1;
                opacity: 1;
}

body.dark .line2ab{
    opacity: 1;
}

.mermaidab{
 position: absolute;
 top: 604px;
 left: 437px;
}

.sleepab{
 position: absolute;
 top: 994px;
 left: -303px;
}

.sparkle1ab{
    position: absolute;
    left: 644px;
    top: 420px;
}

.sparkle2ab{
    position: absolute;
    left: -157px;
    top: 656px;
}

.sparkle3ab{
    position: absolute;
    left: 343px;
    bottom: 393px;
    scale: -0.8;
}

@media (max-width: 900px){

    
    .contentabout{
        align-content: flex-start;
        height: 1210px;
    }
    
    .mainabout{
        top: -59px;
        left: -102px;
        scale: 0.9;
    }
    .text1ab{
        top: 42px;
        left:173px;
    }
    
    .hiab{
        top: 241px;
        left:30px;
    }
    
    .text2ab{
        top:52px;
    }
    
    .text3ab{
        left: -2px;
    }
    
    .postitswrapperab{
        left: 5px;
        top: 136px;
    }
    
    .dislikeab{
        top:992px;
        left: 469px;
        width: 200px;
    }
    
    .programmesab{
        top: 1187px;
        left: -6px;
        width: 235px;
    }
    
    .mermaidab{
        top: 680px;
        scale: 0.8;
    }
    
    .sleepab{
        left: 504px;
        top: 184px;
        scale: 1;
    }
       .sparkle1ab{
    left: 71px;
    top: 169px;
    scale: -1;
}
    
    body.dark .line2ab{
    opacity: 0.5;
}

.sparkle2ab{
    left: -26px;
    top: 683px;
}

.sparkle3ab{
    left: 391px;
    top: 1101px;
}
    
    .line1ab{
                top: 77%;
                left: -22%;
                scale: 0.8;
}

.line2ab{
                top: -0%;
                left: -56%;
                scale: 0.5;
}
    
}

@media (max-width: 580px){
    .contentabout{
        align-content: flex-start;
        height: 1608px;
    }
    
    .mainabout{
        scale:0.8;
        left: -91px;
        top: -262px;
    }
    
    .text1ab{
        top: 210px;
        left:202px;
    }
    
    .hiab{
        top: 23px;
        left:324px;
    }
    
    .text2ab{
        top:215px;
        left: 220px;
    }
    
    .text3ab{
        position: relative;
        top: 232px;
        left: 147px;
        width: 225px;
    }
    
    .postitswrapperab{
        left: 107px;
        top: 336px;
    }
    
    .dislikeab{
        position: relative;
        top:245px;
        left: 354px;
        width: 216px;
    }
    
    .programmesab{
        top: 1653px;
        left: 126px;
        width: 200px;
    }
    
    .mermaidab{
        top: 887px;
        left: 343px;
        scale: 0.8;
    }
    
    .sleepab{
        left: 155px;
        top: 1777px;
        scale: 0.8;
    }
    
   .sparkle1ab{
    left: 486px;
    top: 18px;
       scale: 1;
}

.sparkle2ab{
    left: 159px;
    top: 613px;
}

.sparkle3ab{
    display: block;
    bottom: -291px;
    left: 510px;
    scale: -1;
}
    
    .line1ab{
                top: 66%;
                left: -106%;
                scale: 1;
                opacity: 0.5;
                
}

.line2ab{
                top: -16%;
                left: -94%;
                scale: 0.5;
}
}