.elementor-151 .elementor-element.elementor-element-4ac5215{--display:flex;}.elementor-151 .elementor-element.elementor-element-85b3aec{--display:grid;--e-con-grid-template-columns:repeat(2, 1fr);--e-con-grid-template-rows:repeat(1, 1fr);--grid-auto-flow:row;}.elementor-151 .elementor-element.elementor-element-f2b22ee .elementor-heading-title{font-size:40px;color:#FFFFFF;}.elementor-151 .elementor-element.elementor-element-b357818{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-151 .elementor-element.elementor-element-29e1638{text-align:center;font-size:15px;color:#FFFFFF;}.elementor-151 .elementor-element.elementor-element-f681467{--display:grid;--e-con-grid-template-columns:repeat(3, 1fr);--e-con-grid-template-rows:repeat(2, 1fr);--grid-auto-flow:row;}.elementor-151 .elementor-element.elementor-element-9641046.elementor-element{--align-self:center;--order:99999 /* order end hack */;}@media(max-width:1024px){.elementor-151 .elementor-element.elementor-element-85b3aec{--grid-auto-flow:row;}.elementor-151 .elementor-element.elementor-element-f681467{--grid-auto-flow:row;}}@media(max-width:767px){.elementor-151 .elementor-element.elementor-element-85b3aec{--e-con-grid-template-columns:repeat(1, 1fr);--e-con-grid-template-rows:repeat(1, 1fr);--grid-auto-flow:row;}.elementor-151 .elementor-element.elementor-element-29e1638{font-size:16px;}.elementor-151 .elementor-element.elementor-element-f681467{--e-con-grid-template-columns:repeat(1, 1fr);--grid-auto-flow:row;}.elementor-151 .elementor-element.elementor-element-9db3fa9.elementor-element{--align-self:center;--order:-99999 /* order start hack */;}.elementor-151 .elementor-element.elementor-element-9641046.elementor-element{--align-self:center;}}/* Start custom CSS for html, class: .elementor-element-e888715 */* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}
body {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background: #080808;
  background-image: radial-gradient(1px 1px at 5% 98%,
    #ffffff,
   rgba(255, 255, 255, 0)),
    radial-gradient(1px 1px at 18% 79%, #ffffff, rgba(255, 255, 255, 0)),
    linear-gradient(45deg, #000 5%, #000313 65%, #111 100%);
}
.moon {
  background-color: grey;
  height: 18vmin;
    width: 18vmin;
  border-radius: 50%;
  box-shadow: 0 0 12.6vmin 0.9vmin #fff;
  background-image: url("https://svs.gsfc.nasa.gov/vis/a000000/a004700/a004720/lroc_color_poles_1k.jpg");
  background-size: 77.4vmin;
  background-position: left;
  background-repeat: no-repeat;
  animation: moon-animation 20s linear infinite;
  }
.earth {
  position: absolute;
  left: 0;
  bottom: -15%;
  width: 250vmin;
  aspect-ratio:  1 / 1;
  border-radius: 50%;
  transform: rotate(15deg);
  background: radial-gradient(circle at 30% 30%,
  #1a7cb1 0%,
  #0f1e5e 50%,
  #060b40 70%,
  #000 100%);
  box-shadow: inset 0 0 20px 5px rgba(255, 255, 255, 0.4), 
    0 0 10px rgba(100, 200, 255, 0.8), 0 0 200px 120px rgba(100, 200, 255, 8.25);
  opacity: 0.8;
  z-index: -1;
  will-change: transform;
  animation: earth-pulse 8s ease-in-out infinite, spin 120s linear infinite;
}
.earth::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: radial-gradient(circle at 100% 60%, transparent 60%, #ddd 80%);
}
  @media (max-width: 700px) {
    .moon {
      height: 12vmin;
      width: 12vmin;
      box-shadow: 0 0 8.4vmin 0.6vmin #fff;
      background-size: 51.6vmin;
    }
      .earth {
        bottom: -110%;
        width: 250vmin;
        transform: rotate (87deg);
        left: -170%;
      }
    }
    @keyframes moon-animation {
      to {
      background-position: right;
      }
}
@keyframes earth-pulse {
      0%,
      100% {
        box-shadow: inset 0 0 20px 5px rgba(255, 255, 255, 0.4),
          0 0 10px rgba(100, 200, 255, 0.8),
          0 0 200px 120px rgba(100, 200, 255, 0.25);
      }
  50% {
    box-shadow: inset 0 0 25px 8px rgba(255, 255, 255, 0.6),
      0 0 20px rgba(255, 255, 255, 0.9),
      0 0 240px 160px rgba(100, 200, 255, 0.35);
   }
  }
@keyframes spin {
  from {
    transform: rotate(15deg) rotate(0deg);
  }
  to  {
    transform: rotate(15deg) rotate(360deg);
  }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-9db3fa9 */.glowing-button {
  padding: 12px 24px;
  background: transparent;
  color: #00eeff;
  border: 2px solid #00eeff;
  border-radius: 5px;
  font-weight: bold;
  font-size: 16px;
  cursor: pointer;
  box-shadow: 0 0 5px #00eeff, 0 0 10px #00eeff;
  transition: all 0.3s ease;
}

.glowing-button:hover {
  background: #00eeff;
  color: #000;
  box-shadow: 0 0 10px #00eeff, 0 0 20px #00eeff, 0 0 40px #00eeff;
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-9641046 */.glass-card {
  background: rgba(255, 255, 255, 0.2);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, 0.3);
  padding: 20px;
  color: white;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
  max-width: 300px;
}

.glass-card h3 {
  margin-top: 0;
  font-weight: 600;
  margin-bottom: 10px;
}

.glass-card p {
  margin: 0;
  font-size: 16px;
  opacity: 0.9;
}

/* Note: For best results, place this card on a colorful background *//* End custom CSS */