html,body{
    background-color: #28292F !important;
    color: #f4f4f4 !important;
}
h2{
    font-family: "Lato", sans-serif;
  font-weight: 400;
  font-style: normal;
}
h1{
    font-size: 70px !important;
    color: aliceblue !important;
    font-family: "Lato", sans-serif;
  font-weight: 400;
  font-style: normal;
}

span {
    color: rgb(248, 140, 45);
}

p {
    font-family: 'Raleway', sans-serif;
}
.t1{
    font-size: 50px;
}
a {
    font-family: "Lato", sans-serif;
  font-weight: 400;
  font-style: normal;
}
.col2-main{
    text-align: left;
    padding: 100px 10px;
}


.spacer{
    height: 150px;
}
.s-section{
    text-align: center;
}
.serv{
    font-size: 70px;
   
}
.slid{
    margin: 50px !important;
}
.col1{
    margin: 20px !important;
}
@media (max-width: 320px) {
    .col2-main{
        text-align: left;
        padding: 0px;
    }
    .serv{
        font-size: 40px;
       
    }
  }
  .orbital {
    position: relative;
    text-align: center;
    padding: 50px 0;
  }
  
  .scattered-icons {
    position: relative;
    width: 100%;
    height: 300px;
    margin-top: 20px;
  }
  
  .lang-icon {
    position: absolute;
    font-size: 24px;
    color: #333;
    animation: moveRandom 6s ease-in-out infinite alternate;
  }
  
  /* Initial positions for a scattered look */
  .html { top: 10%; left: 20%; }
  .css { top: 30%; left: 70%; }
  .js { top: 70%; left: 40%; }
  .python { top: 50%; left: 10%; }
  .java { top: 15%; left: 80%; }
  .react { top: 80%; left: 20%; }
  .node { top: 60%; left: 85%; }
  
  /* Keyframes for random movement in any direction */
  @keyframes moveRandom {
    0% { transform: translate(0px, 0px); }
    25% { transform: translate(10px, -10px); }
    50% { transform: translate(-10px, 10px); }
    75% { transform: translate(-15px, -5px); }
    100% { transform: translate(5px, 15px); }
  }
  .testimonials {
    background-color: #ffffff;
    padding: 60px 0;
  }
  
  
  .testimonial-card {
    border: none;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
  }
  
  .testimonial-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 6px 15px rgba(0, 0, 0, 0.15);
  }
  
  .testimonial-text {
    font-style: italic;
    color: #555;
  }
  
  .testimonial-name {
    font-weight: 700;
    color: #333;
    margin-top: 15px;
  }
  
  .testimonial-role {
    color: #888;
    font-size: 0.9rem;
  }  
.test{
    color: #000;
}
/* CSS */
.btn-cta {
  padding: 1em 4em;
  border: none;
  outline: none;
  color: rgb(255, 255, 255);
  background: #111;
  cursor: pointer;
  position: relative;
  z-index: 0;
  border-radius: 10px;
  user-select: none;
  -webkit-user-select: none;
  touch-action: manipulation;
  font-size: 1rem;
}

.btn-cta:before {
  content: "";
  background: linear-gradient(
    45deg,
    #ff0000,
    #ff7300,
    #fffb00,
    #48ff00,
    #00ffd5,
    #002bff,
    #7a00ff,
    #ff00c8,
    #ff0000
  );
  position: absolute;
  top: -2px;
  left: -2px;
  background-size: 400%;
  z-index: -1;
  filter: blur(5px);
  -webkit-filter: blur(5px);
  width: calc(100% + 4px);
  height: calc(100% + 4px);
  animation: glowing-button-85 20s linear infinite;
  transition: opacity 0.3s ease-in-out;
  border-radius: 10px;
}

@keyframes glowing-button-85 {
  0% {
    background-position: 0 0;
  }
  50% {
    background-position: 400% 0;
  }
  100% {
    background-position: 0 0;
  }
}

.btn-cta:after {
  z-index: -1;
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background: #222;
  left: 0;
  top: 0;
  border-radius: 10px;

}