*{
    margin: 0px;
    padding: 0px;
    box-sizing: border-box;
    font-family: 'inter', sans-serif;
}


html, body{
    height: 100%;
    width: 100%;  
}


main{
    height: 100%;
    width: 100%;
}

#main-overflow{
 position: relative;
}

body{
  cursor: url('singleimgs/beecursor.png'), auto;
  overflow-x: hidden;
}


  #cursor-blob {
        width: 380px;
        height: 380px;
        border-radius: 50%;
        /*
        * Created with https://www.css-gradient.com
        * Gradient link: https://www.css-gradient.com/?c1=f8d900&c2=99ff6e&gt=r&gd=dcc
        */
        background-image: radial-gradient( circle farthest-corner at 10% 20%,  rgba(249,232,51,1) 0%, rgba(250,196,59,1) 100.2% );
        animation: blobanimate 10s infinite linear forwards;
        position: absolute;
        cursor: pointer;
        pointer-events: none;
        z-index: -2;
        transition: 10ms linear;
}

#cursor-overlay {
  width: 100%;
  height: 150%;
  pointer-events: none;
  position: absolute;
  z-index: -1;
  backdrop-filter: blur(100px);
}
@keyframes blobanimate {
  0% {
    transform: rotate(0deg) scaley(100%);
  }
  50% {
    transform: rotate(180deg) scaley(70%);
  }
  100% {
    transform: rotate(360deg) scaley(100%);
  }
}


.shadow-drop-2-center {
	-webkit-animation: shadow-drop-2-center 0.6s cubic-bezier(0.250, 0.460, 0.450, 0.940) infinite both;
	        animation: shadow-drop-2-center 0.6s cubic-bezier(0.250, 0.460, 0.450, 0.940) infinite both;
}


#trick-text-box:hover{
    background-color: #FACB1B;
    color: #0000FF;
    border-color: #0000FF;
}

.service-item.blue:hover {
    background-color: #2ec4b5b7;
    border: 1px solid black;
}

.service-item.red:hover{
    background-color: #e71d35b4;
    border: 1px solid black;
}

  
  @-webkit-keyframes shadow-drop-2-center {
    0% {
      -webkit-transform: translateZ(0);
              transform: translateZ(0);
      -webkit-box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
              box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
    }
    100% {
      -webkit-transform: translateZ(50px);
              transform: translateZ(50px);
      -webkit-box-shadow: 0 0 20px 0px rgba(0, 0, 0, 0.35);
              box-shadow: 0 0 20px 0px rgba(0, 0, 0, 0.35);
    }
  }
  @keyframes shadow-drop-2-center {
    0% {
      -webkit-transform: translateZ(0);
              transform: translateZ(0);
      -webkit-box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
              box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
    }
    100% {
      -webkit-transform: translateZ(50px);
              transform: translateZ(50px);
      -webkit-box-shadow: 0 0 20px 0px rgba(0, 0, 0, 0.35);
              box-shadow: 0 0 20px 0px rgba(0, 0, 0, 0.35);
    }
  }
  
@media (max-width:768px) {
  #cursor-blob,#cursor-overlay {
  display: none;
  }
}