.glass {
    background-image: radial-gradient(circle closest-side, rgba(38, 38, 38, 0.2), rgba(0, 0, 0, 0.63));
    background-size: 100% 100%;
    border-radius: 50%;
    position: relative;
}

.flower {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    cursor: pointer;
    position: relative;
}

.flower .spinner,
.flower .inner,
.flower .counterspin {
    height: 100%;
}

.flower .spinner {
    -webkit-animation: spin 45s infinite linear;
    animation: spin 45s infinite linear;
}

.flower .counterspin {
    -webkit-animation: counter-spin 45s infinite linear;
    animation: counter-spin 45s infinite linear;
}

.flower .cover {
    width: 120px;
    height: 120px;
    background-image: url("image/4.png");
    background-size: 160%;
    border-radius: 50%;
    box-shadow: 0 0 2px 4px #d1d1d1, 0 0 20px 4px #000;
    position: absolute;
    top: 0;
}

.flower a {
    display: block;
}

.flower .child {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    position: absolute;
    top: 0;
}

.flower .child .leaf {
    height: 100%;
    border-radius: 50%;
    transition: transform 3.2s ease-in-out;
}

.flower .child .leaf img {
    width: 100%;
    height: auto;
    left: 28px;
    top: 28px;
    position: absolute;
    border: none;
}

.flower .child:nth-child(1) {
    transform: rotate(-140deg);
}

.flower .child:nth-child(1) .leaf {
    background-size: 100%;
    transition: transform 3.2s ease-in-out, box-shadow 0.16s ease-in-out, visibility 3.2s linear;
}

.flower .child:nth-child(1) .leaf .glass-holder {
    height: 100%;
    transform: rotate(90deg);
}

.flower .child:nth-child(2) {
    transform: rotate(-18deg);
}

.flower .child:nth-child(2) .leaf {
    background-size: 100%;
    transition: transform 3.2s ease-in-out, box-shadow 0.16s ease-in-out, visibility 3.2s linear;
}

.flower .child:nth-child(2) .leaf .glass-holder {
    height: 100%;
    transform: rotate(18deg);
}

.flower .child:nth-child(3) {
    transform: rotate(105deg);
}

.flower .child:nth-child(3) .leaf {
    background-size: 100%;
    transition: transform 3.2s ease-in-out, box-shadow 0.16s ease-in-out, visibility 3.2s linear;
}

.flower .child:nth-child(3) .leaf .glass-holder {
    transform: rotate(-54deg);
}

.flower .child:nth-child(4) {
    transform: rotate(160deg);
}

.flower .child:nth-child(4) .leaf {
    background-size: 100%;
    transition: transform 3.2s ease-in-out, box-shadow 0.16s ease-in-out, visibility 3.2s linear;
}

.flower .child:nth-child(4) .leaf .glass-holder {
    height: 100%;
    transform: rotate(-126deg);
}


/*.flower .child:nth-child(5) {
  transform: rotate(198deg);
}
.flower .child:nth-child(5) .leaf {
   background-size: 100%;
   transition: transform 3.2s ease-in-out, box-shadow 0.16s ease-in-out, visibility 3.2s linear;
}
.flower .child:nth-child(5) .leaf .glass-holder {
  height: 100%;
  transform: rotate(-198deg);
}*/

.flower .glass {
    transition: transform 3.2s ease-in-out;
}

.flower {
    transform: scale(5.4);
}

.flower .inner {
    transform: scale(0.294117647058824);
}

.flower .leaf {
    transform: rotate(720deg) translateX(144px) rotate(2250deg);
}

.flower:hover .leaf:hover {
    box-shadow: 0 0 34px #d3d9ff, 0 0 0 1px #000, inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

html {
    height: 100%;
    overflow: hidden;
}

body {
    background-image: url('images/bg.png');
    background-size: cover;
    overflow: visible;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
}

a {
    outline: 0;
}

@-webkit-keyframes spin {
    to {
        transform: rotate(1turn);
    }
}

@keyframes spin {
    to {
        transform: rotate(1turn);
    }
}

@-webkit-keyframes counter-spin {
    to {
        transform: rotate(-1turn);
    }
}

@keyframes counter-spin {
    to {
        transform: rotate(-1turn);
    }
}

@media only screen and (max-width: 400px) {
    .flower .inner {
        transform: scale(5, 4);
        width: 100%;
    }
}