/*
Theme Name: Naruto The Gallery Dubai Theme
Template: hello-elementor
Author: Satellite Samurai
Author URI: https://satellitesamurai.com/
Version: 1.1736446429
Updated: 2025-01-09 22:13:49

*/

#ngt-toTop {
   position: fixed;
   right: 10px;
   bottom: 30px;
   z-index: 100;
   opacity: 1;
   -webkit-transition: opacity 1s,bottom 0.5s;
   transition: opacity 1s,bottom 0.5s;
   cursor: pointer;
}

#ngt-toTop.ngt-hide {
   opacity: 0;
   bottom: 0
}

#ngt-toTop img {
   width: 48px;
   -webkit-animation-name: floating;
   animation-name: floating;
   -webkit-animation-duration: 3s;
   animation-duration: 3s;
   -webkit-animation-iteration-count: infinite;
   animation-iteration-count: infinite;
   -webkit-animation-timing-function: ease-in-out;
   animation-timing-function: ease-in-out
}


.ngt-locked {
    overflow: hidden;
}

.ngt-locked .site-main,
.ngt-locked .elementor-location-header {
    opacity: 0;
}

.ntg-preloader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background: #000;
    z-index: 1000;
}

.ntg-preloader__wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.ntg-preloader__wrapper::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url('img/opening_bg.png') center no-repeat;
    background-size: cover;
    opacity: 0;
    transition: opacity 1s;
    transition-delay: 5.8s;
}

.ntg-preloader.reveal .ntg-preloader__wrapper::before {
    opacity: 1;
}

.ntg-preloader__line {
    position: absolute;
    top: 50%;
    width: 0;
    height: 3px;
    transform: translateY(-50%);
    background: transparent;
    transition: width 1s cubic-bezier(0.25, 1, 0.5, 1);
}

.ntg-preloader.reveal .ntg-preloader__line {
    width: 50%;
}

.ntg-preloader.reveal .ntg-preloader__line--left div::before {
    transform: translateX(100%);
}

.ntg-preloader.reveal .ntg-preloader__line--right div::before {
    transform: translateX(-100%);
}

.ntg-preloader__line--left {
    left: 0;
}

.ntg-preloader__line--right {
    right: 0;
}

.ntg-preloader__line > div {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.ntg-preloader__line--left div::before,
.ntg-preloader__line--right div::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transform: translateX(0);
    transition: transform 1s cubic-bezier(0.25, 1, 0.5, 1);
    transition-delay: 1s;
}

.ntg-preloader__line--left div::before {
    background: linear-gradient(90deg, #FA3B3B, #FAA43B);
    box-shadow: 0px 0px 20px #FAA43B;
}

.ntg-preloader__line--right div::before {
    background: linear-gradient(90deg, #2a3d82, #0084ff);
    box-shadow: 0 0 20px #4a69bf, 0 0 40px #2a3d82;
}

.ntg-preloader__logo {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 330px;
    height: 170px;
    opacity: 0;
    background: url('img/NTG_Duba_ Logo.png') center no-repeat;
/* 	background: url('img/naruto_logo.png') center no-repeat; */
    background-size: contain;
    transition: opacity 1.5s;
    transition-delay: 1.8s;
}

.ntg-preloader.reveal .ntg-preloader__logo {
    opacity: 1;
    animation: fadeOut 1.5s 3.5s forwards;
}


.ntg-preloader .ntg-preloader_character {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* display: none; */
    background-size: 110vh;
    background-repeat: no-repeat;
    background-position: bottom center;
}

.ntg-preloader .ntg-preloader_character--right,
.ntg-preloader .ntg-preloader_character--left {
    opacity: 0;
    /* transition: transform .4s ease-in, opacity .3s ease-in;  */
    transition: transform 1.5s cubic-bezier(0.25, 1, 0.5, 1), 
    opacity 1s ease-in-out;
}

.ntg-preloader_character--right {
    transform: translateX(100px);
}

.ntg-preloader_character--left {
    transform: translateX(-100px);
}

.ntg-preloader.reveal .ntg-preloader_character {
    opacity: 1;
    transform: translateX(0);
}

.ntg-preloader .ntg-preloader_character.naruto,
.ntg-preloader .ntg-preloader_character.pain {
    transition-delay: 3.5s;
}


.ntg-preloader .ntg-preloader_character.sasuke,
.ntg-preloader .ntg-preloader_character.itachi {
    transition-delay: 4s;
}

.ntg-preloader .ntg-preloader_character.sakura,
.ntg-preloader .ntg-preloader_character.sasori {
    transition-delay: 4.5s;
}

.ntg-preloader .ntg-preloader_character.team_pain_top,
.ntg-preloader .ntg-preloader_character.team_pain_bot,
.ntg-preloader .ntg-preloader_character.team_naruto_top,
.ntg-preloader .ntg-preloader_character.team_naruto_bot {
    transition-delay: 5s;
}

.ntg-preloader .ntg-preloader_character.naruto {
    background-image: url('img/pl_naruto.png');
    z-index: 9;
}

.ntg-preloader .ntg-preloader_character.pain {
    background-image: url('img/pl_pain.png');
    z-index: 9;
}

.ntg-preloader .ntg-preloader_character.sasuke {
    background-image: url('img/pl_sasuke.png');
    z-index: 8;
}

.ntg-preloader .ntg-preloader_character.itachi {
    background-image: url('img/pl_itachi.png');
    z-index: 8;
}

.ntg-preloader .ntg-preloader_character.sakura {
    background-image: url('img/pl_sakura.png');
    z-index: 7;
}

.ntg-preloader .ntg-preloader_character.sasori {
    background-image: url('img/pl_sasori.png');
    z-index: 7;
}

.ntg-preloader .ntg-preloader_character.team_pain_top {
    background-image: url('img/pl_team_pain_top.png');
    z-index: 5;
}

.ntg-preloader .ntg-preloader_character.team_naruto_top {
    background-image: url('img/pl_team_naruto_top.png');
    z-index: 5;
}

.ntg-preloader .ntg-preloader_character.team_pain_bot {
    background-image: url('img/pl_team_pain_bot.png');
    z-index: 10;
}

.ntg-preloader .ntg-preloader_character.team_naruto_bot {
    background-image: url('img/pl_team_naruto_bot.png');
    z-index: 10;
}

@-webkit-keyframes floating {
   from {
       -webkit-transform: translate(0, 0px);
       transform: translate(0, 0px)
   }

   65% {
       -webkit-transform: translate(0, 15px);
       transform: translate(0, 15px)
   }

   to {
       -webkit-transform: translate(0, 0px);
       transform: translate(0, 0px)
   }
}

@keyframes floating {
   from {
       -webkit-transform: translate(0, 0px);
       transform: translate(0, 0px)
   }

   65% {
       -webkit-transform: translate(0, 15px);
       transform: translate(0, 15px)
   }

   to {
       -webkit-transform: translate(0, 0px);
       transform: translate(0, 0px)
   }
}

@keyframes revealAnimation {
    0% {
        transform: translateY(100%);
        opacity: 0;
    }
    50% {
        opacity: 1;
    }
    100% {
        transform: translateY(0);
        opacity: 1;
    }
}

@keyframes fadeOut {
    0% {
      opacity: 1;
    }
    100% {
      opacity: 0;
    }
  }