/*=========================
	All css
==========================*/
@import url("../vendors/bootstrap/css/bootstrap.min.css");
@import url("../vendors/fontawesome/css/font-awesome.min.css");
@import url("../vendors/themify/themify-icons.css");
@import url("../vendors/owl-carousel/owl.carousel.css");
@import url("../vendors/bootstrap-select/bootstrap-select.min.css");
@import url("../vendors/magnific-popup/magnific-popup.css");
@import url("../vendors/scroll/scrollbar.css");
@import url("../vendors/switcher/switcher.css");

/*=========================
	All css
==========================*/
@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,800|Raleway:100,200,300,400,500,600,700,800,900|Roboto:100,300,400,500,700,900|Rubik:300,400,500,700,900');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@200..800&display=swap');
/*
font-family: 'Open Sans', sans-serif;
font-family: 'Raleway', sans-serif;
font-family: 'Roboto', sans-serif;
font-family: 'Rubik', sans-serif;
*/

.basjkasd
{
    display: flex;
}
.basjkasd span
{
    height: 50px;
    width: 500px;
   
    
}
.basjkasd span:nth-child(1) {
    background-color: var(--t1);  
}
.basjkasd span:nth-child(2) {
    background-color: var(--t2); 
    border: 1px solid black;
}
.basjkasd span:nth-child(3) {
    background-color: var(--t3); 
}
.basjkasd span:nth-child(4) {
    background-color: var(--t4); 
}
.basjkasd span:nth-child(5) {
    background-color: var(--pear); 
}



.preloader-wrap{
   position: fixed;
   left: 0;
   top: 0;
   right: 0;
   bottom: 0;
   z-index: 1000;
   display: flex;
   align-items: center;
   justify-content: center;
   background-color: gray;
}
.preloader {
   position: relative;
   width: 120px;
   height: 120px;
   border: 2px solid white;
   perspective: 1000px;
    
}
.loading-circle {
   position: absolute;
   width: 100%;
   height: 100%;
   box-sizing: border-box;
   border-radius: 70%;
   
}
.loading-circle-one {
   left: 0%;
   top: 0%;
   animation: loadingCircleOne 1.2s linear infinite;
   border-bottom: 10px solid var(--pear);
}
.loading-circle-two {
   top: 0%;
   right: 0%;
   animation: loadingCircleTwo 1.2s linear infinite;
   border-right: 10px solid var(--mantis);
}
.loading-circle-three {
   right: 0%;
   bottom: 0%;
    animation: loadingCircleThree 1.2s linear infinite; 
   border-top: 10px solid var(--olivine);
}

@keyframes loadingCircleOne {
   0% {
	   transform: rotateX(40deg) rotateY(-40deg) rotateZ(0deg);
   }
   100% {
	   transform: rotateX(40deg) rotateY(-40deg) rotateZ(360deg);
   }
}
@keyframes loadingCircleTwo {
   0% {
	   transform: rotateX(50deg) rotateY(15deg) rotateZ(0deg);
   }
   100% {
	   transform: rotateX(50deg) rotateY(15deg) rotateZ(360deg);
   }
}
@keyframes loadingCircleThree {
   0% {
	   transform: rotateX(15deg) rotateY(50deg) rotateZ(0deg);
   }
   100% {
	   transform: rotateX(15deg) rotateY(50deg) rotateZ(360deg);
   }
}


@keyframes popUpDown {
	0% {
	  opacity: 0;
	  transform: translateY(1px); /* Starts below */
	}
	50% {
	  opacity: 1;
	  transform: translateY(0); /* Moves up to center */
	}
	100% {
	  opacity: 0;
	  transform: translateY(1px); /* Moves back down */
	}
  }
  @keyframes attentionGrabber {
	0% {
	  opacity: 0;
	  transform: scale(0.5);
	}
	50% {
	  opacity: 1;
	  transform: scale(1.1); /* Slightly larger to grab attention */
	}
	70% {
	  transform: scale(0.95); /* Slight bounce back */
	}
	100% {
	  transform: scale(1); /* Return to normal size */
	}
  }

  @keyframes blink-animation {
   to {
     visibility: hidden;
   }
 }
