:root{--card-height:auto;--card-margin:1px;--card-top-offset:0;--numcards:4;--outline-width:0}
#cards{list-style:none;display:grid;grid-template-columns:1fr;grid-template-rows:repeat(var(--numcards),var(--card-height));gap:var(--card-margin);padding-bottom:calc(var(--numcards) * var(--card-top-offset));margin-bottom:var(--card-margin)}
#card-1{--index:1}
#card-2{--index:2}
#card-3{--index:3}
#card-4{--index:4}
.card{position:sticky;top:0;padding-top:calc(var(--index) * var(--card-top-offset))}
.card-content{overflow:hidden}
.card-content>div{grid-area:text;width:95%;max-width:800px;place-self:center;text-align:left;display:grid;gap:1em;place-items:start}
.card{--index0:calc(var(--index) - 1);--reverse-index:calc(var(--numcards) - var(--index0));--reverse-index0:calc(var(--reverse-index) - 1)}
.card__content{transform-origin:50% 0;will-change:transform;--duration:calc(var(--reverse-index0) * 1s);--delay:calc(var(--index0) * 1s);animation:var(--duration) linear scale var(--delay) forwards;animation-timeline:cards-element-scrolls-in-body}
@keyframes scale {
to{transform:scale(calc(1.1 - calc(0.1 * var(--reverse-index))))}
}
.siana,.siana2,.sianta,.sianta2{position:relative;}
.pt-left,.pt-right{display:none;}
@media(min-width:992px){
.siana{padding:25px;}
.siana2{padding:25px;}
.siana::before,.siana::after,.siana2::before,.siana2::after{content:'';position:absolute;background:var(--main-color);border-radius:5px;z-index:-1;}
.siana::before{left:10px;top:10px;width:40%;height:20%;;background:var(--main-color2);}
.siana2::before{right:10px;top:10px;width:40%;height:20%;background:var(--main-color2);}
.siana::after{right:0;bottom:0;width:70%;height:60%;}
.siana2::after{left:0;bottom:0;width:70%;height:60%;}
.pt-left{display:block;position:absolute;width:110px;opacity:.04;left:-80px}
.pt-right{display:block;position:absolute;width:110px;opacity:.04;right:-80px}
}

.bg-center{background-position:center;}
.no-repeat{background-repeat:no-repeat;}

.jloban{padding-left:12px;position:relative;}
.jloban .jlobaninner{display:block;mask-image:url(images/mask-banner-cut.png);-webkit-mask-image:url(images/mask-banner-cut.png);-ms-mask-image:url(images/mask-banner-cut.png);  -o-mask-image: url(images/mask-banner-cut.png);-webkit-mask-repeat:no-repeat;-ms-mask-repeat:no-repeat;-o-mask-repeat:no-repeat;-webkit-mask-position:center top;-ms-mask-position:center top;-o-mask-position: center top;-webkit-mask-size:100% 100%;-ms-mask-size:100% 100%;-o-mask-size:100% 100%;mask-size:100% 100%;}
.jloban .jlobaninner-image img{max-width: 100%;height: auto;width:100%;transform:scale(1.06);}
.jloban::before{position:absolute;height:100%;width:42%;content:"";left:0;top:0;background-color:var(--main-color2);mask-image: url(images/mask-banner.png);-webkit-mask-image: url(images/mask-banner.png);-ms-mask-image: url(images/mask-banner.png);-o-mask-image: url(images/mask-banner.png);-webkit-mask-position: left center;-ms-mask-position: left center;-o-mask-position: left center;-webkit-mask-size: auto 100%;-ms-mask-size:auto 100%;-o-mask-size:auto 100%;mask-size: auto 100%;}

.bird{width:25px;height:5px;display:inline-block;position:absolute;transform:skew(20deg,20deg);animation:wave 2.5s ease-in-out infinite}
.bird:before,.bird:after{content:'';width:100%;height:100%;background-color:#000;position:absolute;border-radius:20%}
.bird:before{right:49%;transform-origin:right;transform:rotate(-40deg);animation:flap-left .75s ease-in-out infinite}
.bird:after{left:49%;transform-origin:left;transform:rotate(40deg);animation:flap-right .75s linear infinite}
@keyframes wave {
40%{transform:translateY(40px) skew(20deg,20deg)}
50%{transform:translateY(50px) skew(20deg,20deg)}
60%{transform:translateY(40px) skew(20deg,20deg)}
100%{transform:translateY(0) skew(20deg,20deg)}
}
@keyframes flap-left {
60%{transform:rotate(10deg)}
75%{transform:rotate(20deg)}
100%{transform:rotate(-40deg)}
}
@keyframes flap-right {
60%{transform:rotate(-10deg)}
75%{transform:rotate(-20deg)}
100%{transform:rotate(40deg)}
}

.kii{display:block;width:75px;height:75px;border-radius:50%;background:rgb(231, 245, 228);margin:0 auto;}
.desibeat{position:absolute;right:10%;top:10px;text-align:right;}
.desibeat svg{opacity: .07;width:10%;min-width:150px;}
@media(max-width:767px){
.desibeat svg{opacity: .07;width:10%;min-width:90px;}  
}
.dilmein p{padding:8px 12px 8px 40px;border-radius:10px;border:2px solid var(--main-color);background:url(images/birdy.svg) no-repeat top 10px left 7px;background-size:20px;}