html{
    background-color: #000000;
}
html, body{
    max-height: 100%;
    min-height: 100%;
    margin: 0;}
    body{
        animation: bgPulse 800s ease-in-out infinite;
    }
    @keyframes bgPulse {
        0% { background-color: #000000; }
        25% { background-color: rgb(62, 4, 98); }
        50% { background-color: rgb(108, 6, 6); }
        75% { background-color: rgba(45, 4, 141, 0.686); }
        100% { background-color: #000000; }
    }

/* nav */
nav ul{
    color: #96F77C;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 24px;
    justify-content: center;
    display: flex;
    padding: 10px;
    list-style: none;
    margin: 0;
    padding: 0;
    gap: 20px;
    border-bottom: 5px solid #FFD70C;
}

nav a{
    color: #96F77C;
    text-decoration: none;
}
nav ol{
    color: #96F77C;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 24px;
    justify-content: center;
    list-style: none;
    text-align: center;
}
/* header */
header{
    color: #96F77C;
    font-family: Arial, Helvetica, sans-serif;
    text-align: center;
    padding: 20px;
}
h2{
    color: #96F77C;
    font-family: Arial, Helvetica, sans-serif;
    text-align: center;
    padding: 20px;      
    border-bottom:#FFD70C 5px solid;
}
/*p*/
p{
    color: #96F77C;
    font-family: Arial, Helvetica, sans-serif;
    text-align: center;
    padding: 20px; 
    font-size: 18px;
}
.typing {
  width: 0;
  overflow: hidden;
  white-space: nowrap;
  border-right: 2px solid gold;
  animation: typing 4s steps(40, end) forwards,
             blink-caret 0.75s step-end;
}

@keyframes typing {
  from { width: 0; }
  to   { width: 100%; }
}

@keyframes blink-caret {
  50% { border-color: transparent; }
}
/*logo*/
.JRSLogo{
    width: 100px;
    height: auto;
    margin: 0 20px;
transform: translate(-270px,80px); 
}
.JRSLogo1{
    width: 100px;
    height: auto;
    margin: 0 20px;
transform: translate(270px,-80px); 
}
.stars{
    width: 300px;
  transform: translate(900px, -75px);
  position: absolute;
}
.services{
    width: 230px;
  transform: translate(950px, -90px);
  position: absolute;
  margin:auto;
  opacity:0.5;
}
.socials{
    width: auto;
    margin:auto;
    display: block;
}