:root {
    --backgroundcolor: black;
    --atomcolor: orange;
    --ringcolor: white;
    --electroncolor: yellow;
}

body {
    background: var(--backgroundcolor);
    padding: 0;
    margin: 0;
    overflow: hidden;
}
*{
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    color:white;
}
input:focus{
    outline:none;
}
input {
    position: absolute;
    top:10px;
    left:10px;
    padding:10px 15px;
    border-radius: 50px;
    border: none;
    color:white;
    background-color:rgba(230, 230, 230, 0.4);
}

.element-info{
    position: absolute;
    width: fit-content;
    height: fit-content;
    display: flex;
    flex-direction: column;
    bottom:10px;
    left: 10px;
}
.element-symbol{
    position: absolute;
    top:50%;
    left:50%;
    transform: translate(-50%,-50%);
    font-size:50px;
    /*mix-blend-mode: difference;*/
    color:white;
    -webkit-text-fill-color: white;
    -webkit-text-stroke: 2px black;
}
.not-found{
    position: absolute;
    top:50%;
    left:50%;
    transform: translate(-50%,-50%);
    font-size:50px;
    text-align: center;
    width:80%;
    color:#383838;
}