.mySwiper{
   width:100%;
   height:100%;
}
.mySwiper .swiper-wrapper{
   width:100%;
   height:100%;
   background:black;
}
.swiper-scrollbar-drag{
	background:rgba(88, 67, 255,0.8);
	
}
.swiper-scrollbar{
	background:rgba(0,0,0,0.7)
}
.swiper-vertical > .swiper-scrollbar, .swiper-scrollbar.swiper-scrollbar-vertical{
width:10px;	
}
div:where(.swal2-container) div:where(.swal2-popup){
	width:auto !important;
}
.hover{
	-webkit-transition:all 0.7s;
	-o-transition:all 0.7s;
	transition:all 0.7s;
}
.hover:hover{
			background:var(--line_shiny_color), var(--line_shiny_color), var(--glasses_primary);
	   background-position:top center, bottom center;
   background-size:auto 2px, auto 2px;
	opacity:1;
}
/*MENU*/
.menu{
   border-radius:2vw;
   padding:0.5vmin 2vmin;
   position:fixed;
   top:4vmin;
   left:0vmin;
   z-index:999;
      background: rgb(2,0,36);
   background: var(--line_shiny_color), var(--line_shiny_color);
   background-position:top center, bottom center;
   background-size:auto 2px, auto 2px;
}
.menu ol{
   width:100%;
  border-radius:2vw; 
}
.menu h4, .card h4{
   width:100%;
}
.menu li i, .menu button i{
   width:100%;
}
.menu li, .menu button{
 margin:0px;
 width:100%;
    border:none;
}
.li_menu{
   display:none;
   height:100%;
}
.men_men_left{
   border-radius:0px 2vw 2vw 0px;
   border:none;
}
.men_men_right{
   border-radius:0px 0px 2vw 2vw;
   border:none;
}
.menu h4 i{
   border:none !important;
}
/*SECTION HOME*/
#home{
  background: url("../../pictures/work_process.png") no-repeat, url("../../pictures/home.jpg") no-repeat;
  background-position:right 5vmin bottom 3vmin, center, center;
  background-size:40vmin auto, cover;
}
h1 span{
        background: linear-gradient(124deg, #ff2400, #e81d1d, #e8b71d, #e3e81d, #1de840, #1ddde8, #2b1de8, #dd00f3, #dd00f3) no-repeat;
     background-size:1000% 100%;
-webkit-animation: rainbow 13s ease infinite;
  animation: rainbow 13s ease infinite;
  background-clip: text;
-webkit-background-clip: text;
color: transparent;
}
.app_bt button{
      background: var(--glasses_primary);
   width:100%;
  border-radius:2vw; 
     padding:0.5vmin 2vmin;
  margin:0px;
  border:none;
  color:white;
  text-shadow:-1px -1px 1px black, 1px 1px 1px black;
}
.app_bt{
   border-radius:2vw;
   position:fixed;
   top:4vmin;
   right:20%;
   z-index:999;
   background: var(--line_shiny_color), var(--line_shiny_color);
   background-position:top center, bottom center;
   background-size:auto 2px, auto 2px;
   border:none;
   padding:0.5vmin 2vmin;
}
#home h1 i{
   position:absolute;
   margin-left:100%;
   margin-top:-25%;
          background: linear-gradient(124deg, #ff2400, #e81d1d, #e8b71d, #e3e81d, #1de840, #1ddde8, #2b1de8, #dd00f3, #dd00f3) no-repeat;
     background-size:1000% 100%;
-webkit-animation: rainbow 13s ease infinite;
  animation: rainbow 13s ease infinite;
  background-clip: text;
-webkit-background-clip: text;
color: transparent;
width:10vmin;
height:10vmin;
border-radius:0px;
}
/*APP SECTION*/
#app{
   background: url("../../pictures/app.jpg") no-repeat center;
  background-size:cover;
        padding-top:5vmin;
}
.sub_title {
   width:25vmin;
   color:white;
   background: rgb(2,0,36);
   background: var(--line_shiny), var(--line_shiny);
   background-position:top center, bottom center;
   background-size:auto 2px, auto 2px; 
}
.bb{
   border-radius:0px 2vw 0px 2vw;
}
/*OTHER SECTION*/
#about
{
   background: url("../../pictures/techno.jpg") no-repeat center;
  background-size:cover;
}
#about h4{
      background: rgb(2,0,36);
   background: var(--dark-test) repeat,linear-gradient(90deg, rgba(2,0,36,0) 0%, rgba(255,255,255,0.8) 51%, rgba(255,255,255,0) 100%) bottom no-repeat;
   background-size:auto auto, auto 2px; 
}
/*#home, #about, #app{
   display:none;
}*/
/*SECTION CONTACT*/
#contact{
  text-transform: uppercase;
  font-size: 11px;
  background: url("../../pictures/contact.jpg") no-repeat center;
  background-size:cover;
}
#contact div{
   margin:1.2vmin;
}
#contact div i{
   margin:1.2vmin;height:100%;width:15%;margin:0px;
}
#contact input{
   margin:none;padding:1.5vmin;border-radius:0px;
}
#contactForm {
  border: 6px solid 3324be;
  padding:0vmin 5vmin;
  text-align: center;
  border-radius: 16px;
}
input,
textarea {
  outline: 0;
  background: #f2f2f2;
    width:200px;
  border: 0;
  box-sizing: border-box;
  font-size: 14px;
}
textarea {
  max-height: 210px;
  max-width:300px;
  height:120px;
  width:200px;
}
.formBtn {
  outline: 0;
  border: 0;
  border-radius: 2vw;
  padding:3px 14px;
  min-width:20vmin;
  -webkit-transition: all 0.3 ease;
  transition: all 0.3 ease;
  cursor: pointer;
}

/*OTHER ELEMENTS*/
#transit{
   position:absolute;
   z-index:999;
   top:0px;
   left:0px;
   right:0px;
   bottom:0px;
   width:100%;
   height:100%;
   background: var(--dark-test), rgba(19, 16, 53, 1);
   display:none;
}
@keyframes rotate {
	0% {
		background-position: 0 0;
	}

	100% {
		background-position: 530px 0;
	}
}

/*ANIMATION*/

@keyframes slider{
  0% {background: none;}
  100% {background: #110d36;}
}
@-webkit-keyframes rainbow {
    0%{background-position:0% 10%}
    50%{background-position:100% 10%}
    100%{background-position:0% 10%}
}
@keyframes rainbow { 
    0%{background-position:0% 10%}
    50%{background-position:100% 10%}
    100%{background-position:0% 10%}
}