@import url(./assets/font/Yekan.css);
* {
  box-sizing: border-box;
}
body {
  background-size: 80px 80px;
  font-family: "Yekan";
  
}
.button-rgb {
  position: relative;
}
.button-rgb::after,
.button-rgb::before {
  position: absolute;
  top: 50%;
  left: 50%;
  translate: -50% -50%;
  content: " ";
  border-radius: 9px;
  background: conic-gradient(    from var(--angle), transparent 70%, rgb(255, 255, 255) );
  width: 100%;
  height: 100%;
  z-index: -1;
  padding: 2px;
  box-sizing: content-box;
  -webkit-border-radius: 9px;
  -moz-border-radius: 9px;
  -ms-border-radius: 9px;
  -o-border-radius: 9px;
  animation: 3s spin linear infinite;
  -webkit-animation: 3s spin linear infinite;
}
.button-rgb::before {
  filter: blur(1rem);
  -webkit-filter: blur(1rem);
  opacity: 0.5;
}
@keyframes spin {
    from {
        --angle: 0deg;
    }    
    to {
        --angle: 360deg;
    }
}
@property --angle {
    syntax: "<angle>";
    initial-value: 0deg;
    inherits: false;
}
.typed-cursor {
  display: none !important;
}
#mouseShadow {
  position: fixed;
  width: 1px;
  height: 1px;
  box-shadow: white 0px 0px 200px 20px;
}
.hover-bg {
  transform: translateX(-3px);
  transition: all 1s;
  -webkit-transition: all 1s;
  -moz-transition: all 1s;
  -ms-transition: all 1s;
  -o-transition: all 1s;
  -webkit-transform: translateX(-3px);
  -moz-transform: translateX(-3px);
  -ms-transform: translateX(-3px);
  -o-transform: translateX(-3px);
}
.hover-bg.mid {
  transform: translateX(-133%);
  transition: all 1s;
  -webkit-transition: all 1s;
  -moz-transition: all 1s;
  -ms-transition: all 1s;
  -o-transition: all 1s;
  -webkit-transform: translateX(-133%);
  -moz-transform: translateX(-133%);
  -ms-transform: translateX(-133%);
  -o-transform: translateX(-133%);
}
.gallery img {
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
}
.gallery:hover img {
  opacity: 0.5;
}
.gallery img:hover {
  opacity: 1;
}