.Art-frame {
    margin: 0 auto;
    padding: 0;
    border-radius: 1px;
    border-color: black;
    border-style: solid;
    background-color: black;
    display: grid;
}

.Art-frame div {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
}

.Fruitiger-holder {
    width: 100px;
    height: 100px;
    margin: 0 auto;
    border-radius: 50%;
}


#Fruitiger-bubble {
    height: 100%;
    width: 100%;
    border-radius: 50%;
    margin: 0 auto;
    background: radial-gradient(circle, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.0));
}

#Fruitiger-bubble #Reflection {
    height: 50%;
    width: 70%;
    margin: 0 auto;
    border-radius: 50%;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0.0));
}

#white {
    background-color: #FFF; /* Red */
}

#black {
    background-color: #000;
}

#red {
    background-color: #F00; /* Red */
}

#blue {
    background-color: #00F; /* Blue */
}

#green {
    background-color: #0F0; /* Green */
}

#yellow {
    background-color: #FF0; /* Yellow */
}

#magenta {
    background-color: #F0F; /* Orange */
}

#cyan {
    background-color: #0FF; /* Purple */
}

#grey {
    background-color: #AAA; /* Purple */
}

#transparent {
    background-color: transparent; /* Transparent */
}

.white {
    color: #FFF;
}

.black {
    color: #000;
}

.red {
    color: #F00;
}

.blue {
    color: #00F;
}

.green {
    color: #0F0;
}

.yellow {
    color: #FF0;
}

.magenta {
    color: #F0F;
}

.cyan {
    color: #0FF;
}

.orange {
   color: #FA0;
}

.purple {
  color: #A0F
}

.grey {
    color: #AAA;
}

.transparent {
    color: transparent;
}
