 body{transition: background 0.3s ease, color 0.3s ease;}
 
    body.dark-mode{background: #333;color: #f1f1f1;fill:#fff;}
   .dark-mode .top-main-header{background: #333;color: #f1f1f1;}
   .dark-mode .shortsDiv{background: #444;color: #f1f1f1;} .dark-mode .short-heading svg, .dark-mode .short-heading h2{fill: #f1f1f1;color: #f1f1f1;}
   .dark-mode .gallery{background: #444;} 
   .dark-mode .sidebar{background: #333;}
 
   .dark-mode .sidebar a.active{background:#f3f3f3;}  
   .dark-mode .sidebar a {fill: #f1f1f1;stroke: #f1f1f1;color: #f1f1f1;}
   .dark-mode .container{background: #333;color: #f1f1f1;}
   .dark-mode .profile-popup{background: #333;color: #f1f1f1;border-color: #444;}
   .dark-mode .footer-menu li a{color: #fff;} 
   .dark-mode .Search_Popup_page, .dark-mode .PopupPreloader{background: #333;fill: #fff;stroke: #fff;color: #f1f1f1;}
   .dark-mode .brand_Popup_page{background: #333;color: #fff;}.dark-mode .brand_Popup_page .pack button{fill: #000;}
   .dark-mode .Noti_Popup_page{background: #333;color: #fff;}
   .dark-mode .tamamvideocontentda{background: #333;color: #fff;}
   
   .dark-mode .yt-vid-bottom-da{background: #333;}.dark-mode .yt-vid-bottom-da button{background: #555;}
   .dark-mode .SEEDA-HAT-GALLERY-DA .title a{background: #eee;}
   .dark-mode  #WATCHICONoverlay .Compopup{background: #333;color: #fff;}
   .dark-mode .dadacopyhoverlaparada{background: #777;}
   .dark-mode .popupContent{background: #333;color: #fff;fill: #fff;}
   .dark-mode .success-popup{background: #333;color: #fff;fill: #fff;}
   .dark-mode .Copy-div-da{background: #333;}
   .dark-mode .profile-popup ul li a{color: #fff;}
   .dark-mode .spoters-gallery{color: #333;fill: #333;} .dark-mode .no-spoters-data-found{color: #333;fill: #333;}
   .dark-mode .slider-wrapper{background: #333;color: #333;} .dark-mode .modal-content{background: #333;color: #fff;}
   .dark-mode .morevidsloader circle{stroke: #fff;}
     
   body.dark555-mode{background: #555;color: #f1f1f1;fill: #fff;}
   .dark555-mode .top-main-header{background: #555;color: #f1f1f1;}
   .dark555-mode .shortsDiv{background: #666;color: #f1f1f1;} .dark555-mode .short-heading svg, .dark555-mode .short-heading h2{fill: #f1f1f1;color: #f1f1f1;}
   .dark555-mode .gallery{background: #666;} 
   .dark555-mode .sidebar{background: #555;}
   
   .dark555-mode .sidebar a.active{background:#f3f3f3;}  
   .dark555-mode .sidebar a {stroke: #f1f1f1;color: #f1f1f1;fill: #f1f1f1;}
   .dark555-mode .container{background: #555;color: #f1f1f1;}
   .dark555-mode .profile-popup{background: #555;color: #f1f1f1;border-color: #888;}
   .dark555-mode .footer-menu li a{color: #fff;}
   .dark555-mode .Search_Popup_page, .dark555-mode .PopupPreloader{background: #555;fill: #fff;stroke: #fff;color: #f1f1f1;}
   .dark555-mode .brand_Popup_page{background: #555;color: #fff;}.dark555-mode .brand_Popup_page .pack button{fill: #555;}
   .dark555-mode .Noti_Popup_page{background: #555;color: #fff;}
   .dark555-mode .tamamvideocontentda{background: #555;color: #fff;} 
   
   .dark555-mode .yt-vid-bottom-da{background: #555;}.dark555-mode .yt-vid-bottom-da button{background: #777;}
   .dark555-mode .SEEDA-HAT-GALLERY-DA .title a{background: #eee;}
   .dark555-mode  #WATCHICONoverlay .Compopup{background: #555;color: #fff;} 
   .dark555-mode .dadacopyhoverlaparada{background: #777;}
   .dark555-mode .popupContent{background: #555;color: #fff;fill: #fff;}
   .dark555-mode .success-popup{background: #555;color: #fff;fill: #fff;}
   .dark555-mode .Copy-div-da{background: #555;}
   .dark555-mode .profile-popup ul li a{color: #fff;}
   .dark555-mode .spoters-gallery{color: #555;fill: #555;}  .dark555-mode .no-spoters-data-found{color: #555;fill: #555;}
   .dark555-mode .slider-wrapper{background: #555;color: #555;}.dark555-mode .modal-content{background: #555;color: #fff;}
   .dark555-mode .morevidsloader circle{stroke: #fff;}

.LINEloader {
  --h:4px; --c:#b10b0b;
  width:100%; height:var(--h);
  background:rgba(0,0,0,.2);
  position:relative;
}
.LINEloader::before {
  content:"";
  position:absolute; top:0; left:0;
  height:100%; width:0;
  background:var(--c);
  animation:moving 1.5s ease-in-out infinite;
}
@keyframes moving {
  50%{width:100%}
  100%{width:0;right:0;left:auto}
}
 

.Bonuspreloader {
  width:100%; height:100%;
  display:grid; place-items:center;
}
.spinner {width:70px}
.spinner div {
  width:18px; height:18px;
  background:#ff2222;
  border-radius:50%;
  display:inline-block;
  animation:bounce 1.4s infinite ease-in-out both;
}
.spinner .bounce1{animation-delay:-.32s}
.spinner .bounce2{animation-delay:-.16s}
@keyframes bounce {
  0%,80%,100%{transform:scale(0)}
  40%{transform:scale(1)}
}


@keyframes svg-rotate {
  0%{transform:rotate(0)}
  100%{transform:rotate(360deg)}
}
@keyframes circle-anim {
  0%,25%{stroke-dashoffset:280; transform:rotate(0)}
  50%,75%{stroke-dashoffset:75; transform:rotate(40deg)}
  100%{stroke-dashoffset:280; transform:rotate(360deg)}
}


.morevidsloader {
  width:100%; height:40px;
  display:flex; align-items:center; justify-content:center;
}
.morevidsloader svg {
  width:25px;
  animation:svg-rotate 1.5s linear infinite;
}
.morevidsloader circle {
  display:block;
  fill:transparent;
  stroke:#b10b0b;
  stroke-linecap:round;
  stroke-dasharray:283;
  stroke-dashoffset:280;
  stroke-width:10px;
  transform-origin:50% 50%;
  animation:circle-anim 1.7s ease-in-out infinite both;
}


.PopupPreloader {
  position:absolute; inset:0;
  display:grid; place-content:center;
  background:#fff; z-index:9999;
  transition:background .3s,color .3s;
}
.PopupPreloader svg {
  width:40px; fill:transparent; stroke:#b10b0b;
  animation:svg-rotate 1.5s linear infinite;
}
.PopupPreloader circle {
  fill:transparent;
  stroke-dasharray:283;
  stroke-dashoffset:280;
  stroke-width:10px;
  transform-origin:50% 50%;
  animation:circle-anim 1.7s ease-in-out infinite both;
}
