*{
    background-color: #012535
}
#hero{
    position: absolute;
    left: 140px;
    text-align: center;
    top: 15px;
    color:#eaf2f3;
    font-size: xx-large;
    font-style: oblique;
    cursor: pointer;
}
#text1{
    position: absolute;
    left: 50%;
    top: 25px;
    display: flex;
    justify-content: center;  
    color: #b8d8d8;
    cursor: pointer;
}
#text2{
    position: absolute;
    left: 60%;
    top: 25px;
    display: flex;
    justify-content: center;
    color: #b8d8d8;
    cursor: pointer;
}
#text3{
    position: absolute;
    left: 70%;
    top: 25px;
    display: flex;
    justify-content: center;
    color: #b8d8d8;
    cursor: pointer;
}
#text4{
    position: absolute;
    left: 80%;
    top: 25px;
    display: flex;
    justify-content: center;
   color: #b8d8d8;
   cursor: pointer;
}
#text5{
    position: absolute;
    left: 90%;
    top: 25px;
    display: flex;
    justify-content: center;
    color: #b8d8d8;
    cursor: pointer;
    
}
#text6{
    position: absolute;
    left: 15%;
    top: 470px;
    display: flex;
    justify-content: center;
    background-color:#7fbfb6;
    border: none;
    border-radius: 8px;
    padding: 15px 25px;
    cursor: pointer;
    
}
#text7{
    position: absolute;
    left: 25%;
    top: 470px;
    display: flex;
    justify-content: center;
    background-color:#7fbfb6;
    border:none;
    border-radius: 8px;
    padding: 15px 25px;
    cursor: pointer;
}
#hero1{
    position: absolute;
    left: 150px;
    text-align: center;
    top: 250px;
    color:#d3e0e2;
    font-style: oblique;
    font-size: xx-large;
}
#hero2{
    position: absolute;
    left: 120px;
    text-align: center;
    top: 285px;
    color:#70c7bd;
    font-size: xx-large;
    font-style: oblique;
}
#hero3{
    position: absolute;
    left: 2px;
    text-align: center;
    top: 340px;
    color: #a9bec2;
    font-size: x-large;
    font-style: italic;
    
}
#hero4{
    position: absolute;
    left: 18%;
    text-align: center;
    top:190px;
    font-size: x small;
    font-style: italic;
    border: none;
    border-radius: 8px;
    padding: 10px 20px;
    background-color:#7fbfb6;
    cursor: pointer;
}
#text1:hover{
    color: #2c7597
}
#text2:hover{
    color: #2c7597
}
#text3:hover{
    color: #2c7597
}
#text4:hover{
    color: #2c7597
}
#text5:hover{
    color: #2c7597
}
#hero:hover
{
    color: #2c7597
}
#hero4:hover{
    color: #2c7597
}
#text6:hover{
    color: #2c7597
}
#text7:hover{
    color: #2c7597
}
spline-viewer{
    position: absolute;
    left: 780px;
    top: 70px;
    width: 500px;
    height: 500px;
}