body {
    background: #101318;
    text-shadow: 0 0 0.4vw currentColor;
}

.wrapper {
    position: relative;
    overflow: hidden;
    padding: 2%;
}

.wrapper>input {
    -webkit-appearance: none;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
}

.periodic-table {
    display: grid;
    grid-gap: 5px;
    grid-template-columns: repeat(18, 1fr);
}

.element {
    position: relative;
    font-size: 0.5vw;
    padding-bottom: 100%;
    cursor: pointer;
    color: #fff;
    transition: 500ms;
}

.element .overlay {
    position: fixed;
    z-index: 1;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background-color: #101318;
    opacity: 0;
    pointer-events: none;
    transition: 500ms;
}

.element .square {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    border: 2px solid;
    box-sizing: border-box;
    background: #101318;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    transition-property: transform, z-index, left, right, top, bottom;
    transition-duration: 100ms, 0ms, 200ms, 200ms, 200ms, 200ms;
    transition-delay: 0ms, 100ms, 0ms, 0ms, 0ms, 0ms;
}

.element .atomic-number {
    position: absolute;
    left: 0;
    top: 0;
    padding: 2px;
}

.element .label {
    text-align: center;
    transition: 200ms;
}

.element .symbol {
    font-size: 1.7vw;
}

.element .name {
    font-size: 0.7vw;
}

.element .atomic-mass {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 2px;
    text-align: center;
}

.element .atomic-weight {
    position: absolute;
    right: 0;
    top: 0;
    list-style: none;
    margin: 0;
    padding: 2px;
    opacity: 0;
    transition: 200ms;
    text-align: right;
}

.element .model {
    display: none;
    position: absolute;
    left: -500%;
    right: -500%;
    top: -500%;
    bottom: -500%;
    transform: scale(0.1);
}

.element .model .orbital {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    border: 5px solid;
    border-radius: 50%;
    opacity: 0.25;
}

.element .model .orbital:nth-child(1) {
    margin: 10%;
    animation-duration: 40s;
}

.element .model .orbital:nth-child(2) {
    margin: 15.5%;
    animation-duration: 34s;
}

.element .model .orbital:nth-child(3) {
    margin: 21%;
    animation-duration: 28s;
}

.element .model .orbital:nth-child(4) {
    margin: 26.5%;
    animation-duration: 22s;
}

.element .model .orbital:nth-child(5) {
    margin: 32%;
    animation-duration: 16s;
}

.element .model .orbital:nth-child(6) {
    margin: 37.5%;
    animation-duration: 10s;
}

.element .model .orbital:nth-child(7) {
    margin: 43%;
    animation-duration: 4s;
}

.element .model .orbital .electron {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
}

.element .model .orbital .electron::before {
    content: "";
    position: absolute;
    left: calc(50% - 0.7vw);
    top: -0.7vw;
    width: 1.4vw;
    height: 1.4vw;
    background-color: currentColor;
    border-radius: 50%;
    opacity: 0.75;
}

.element .model .orbital .electron:nth-last-child(1):first-child~.electron:nth-child(1) {
    transform: rotate(0deg);
}

.element .model .orbital .electron:nth-last-child(2):first-child~.electron:nth-child(1) {
    transform: rotate(0deg);
}

.element .model .orbital .electron:nth-last-child(2):first-child~.electron:nth-child(2) {
    transform: rotate(180deg);
}

.element .model .orbital .electron:nth-last-child(3):first-child~.electron:nth-child(1) {
    transform: rotate(0deg);
}

.element .model .orbital .electron:nth-last-child(3):first-child~.electron:nth-child(2) {
    transform: rotate(120deg);
}

.element .model .orbital .electron:nth-last-child(3):first-child~.electron:nth-child(3) {
    transform: rotate(240deg);
}

.element .model .orbital .electron:nth-last-child(4):first-child~.electron:nth-child(1) {
    transform: rotate(0deg);
}

.element .model .orbital .electron:nth-last-child(4):first-child~.electron:nth-child(2) {
    transform: rotate(90deg);
}

.element .model .orbital .electron:nth-last-child(4):first-child~.electron:nth-child(3) {
    transform: rotate(180deg);
}

.element .model .orbital .electron:nth-last-child(4):first-child~.electron:nth-child(4) {
    transform: rotate(270deg);
}

.element .model .orbital .electron:nth-last-child(5):first-child~.electron:nth-child(1) {
    transform: rotate(0deg);
}

.element .model .orbital .electron:nth-last-child(5):first-child~.electron:nth-child(2) {
    transform: rotate(72deg);
}

.element .model .orbital .electron:nth-last-child(5):first-child~.electron:nth-child(3) {
    transform: rotate(144deg);
}

.element .model .orbital .electron:nth-last-child(5):first-child~.electron:nth-child(4) {
    transform: rotate(216deg);
}

.element .model .orbital .electron:nth-last-child(5):first-child~.electron:nth-child(5) {
    transform: rotate(288deg);
}

.element .model .orbital .electron:nth-last-child(6):first-child~.electron:nth-child(1) {
    transform: rotate(0deg);
}

.element .model .orbital .electron:nth-last-child(6):first-child~.electron:nth-child(2) {
    transform: rotate(60deg);
}

.element .model .orbital .electron:nth-last-child(6):first-child~.electron:nth-child(3) {
    transform: rotate(120deg);
}

.element .model .orbital .electron:nth-last-child(6):first-child~.electron:nth-child(4) {
    transform: rotate(180deg);
}

.element .model .orbital .electron:nth-last-child(6):first-child~.electron:nth-child(5) {
    transform: rotate(240deg);
}

.element .model .orbital .electron:nth-last-child(6):first-child~.electron:nth-child(6) {
    transform: rotate(300deg);
}

.element .model .orbital .electron:nth-last-child(7):first-child~.electron:nth-child(1) {
    transform: rotate(0deg);
}

.element .model .orbital .electron:nth-last-child(7):first-child~.electron:nth-child(2) {
    transform: rotate(51.4285714286deg);
}

.element .model .orbital .electron:nth-last-child(7):first-child~.electron:nth-child(3) {
    transform: rotate(102.8571428571deg);
}

.element .model .orbital .electron:nth-last-child(7):first-child~.electron:nth-child(4) {
    transform: rotate(154.2857142857deg);
}

.element .model .orbital .electron:nth-last-child(7):first-child~.electron:nth-child(5) {
    transform: rotate(205.7142857143deg);
}

.element .model .orbital .electron:nth-last-child(7):first-child~.electron:nth-child(6) {
    transform: rotate(257.1428571429deg);
}

.element .model .orbital .electron:nth-last-child(7):first-child~.electron:nth-child(7) {
    transform: rotate(308.5714285714deg);
}

.element .model .orbital .electron:nth-last-child(8):first-child~.electron:nth-child(1) {
    transform: rotate(0deg);
}

.element .model .orbital .electron:nth-last-child(8):first-child~.electron:nth-child(2) {
    transform: rotate(45deg);
}

.element .model .orbital .electron:nth-last-child(8):first-child~.electron:nth-child(3) {
    transform: rotate(90deg);
}

.element .model .orbital .electron:nth-last-child(8):first-child~.electron:nth-child(4) {
    transform: rotate(135deg);
}

.element .model .orbital .electron:nth-last-child(8):first-child~.electron:nth-child(5) {
    transform: rotate(180deg);
}

.element .model .orbital .electron:nth-last-child(8):first-child~.electron:nth-child(6) {
    transform: rotate(225deg);
}

.element .model .orbital .electron:nth-last-child(8):first-child~.electron:nth-child(7) {
    transform: rotate(270deg);
}

.element .model .orbital .electron:nth-last-child(8):first-child~.electron:nth-child(8) {
    transform: rotate(315deg);
}

.element .model .orbital .electron:nth-last-child(9):first-child~.electron:nth-child(1) {
    transform: rotate(0deg);
}

.element .model .orbital .electron:nth-last-child(9):first-child~.electron:nth-child(2) {
    transform: rotate(40deg);
}

.element .model .orbital .electron:nth-last-child(9):first-child~.electron:nth-child(3) {
    transform: rotate(80deg);
}

.element .model .orbital .electron:nth-last-child(9):first-child~.electron:nth-child(4) {
    transform: rotate(120deg);
}

.element .model .orbital .electron:nth-last-child(9):first-child~.electron:nth-child(5) {
    transform: rotate(160deg);
}

.element .model .orbital .electron:nth-last-child(9):first-child~.electron:nth-child(6) {
    transform: rotate(200deg);
}

.element .model .orbital .electron:nth-last-child(9):first-child~.electron:nth-child(7) {
    transform: rotate(240deg);
}

.element .model .orbital .electron:nth-last-child(9):first-child~.electron:nth-child(8) {
    transform: rotate(280deg);
}

.element .model .orbital .electron:nth-last-child(9):first-child~.electron:nth-child(9) {
    transform: rotate(320deg);
}

.element .model .orbital .electron:nth-last-child(10):first-child~.electron:nth-child(1) {
    transform: rotate(0deg);
}

.element .model .orbital .electron:nth-last-child(10):first-child~.electron:nth-child(2) {
    transform: rotate(36deg);
}

.element .model .orbital .electron:nth-last-child(10):first-child~.electron:nth-child(3) {
    transform: rotate(72deg);
}

.element .model .orbital .electron:nth-last-child(10):first-child~.electron:nth-child(4) {
    transform: rotate(108deg);
}

.element .model .orbital .electron:nth-last-child(10):first-child~.electron:nth-child(5) {
    transform: rotate(144deg);
}

.element .model .orbital .electron:nth-last-child(10):first-child~.electron:nth-child(6) {
    transform: rotate(180deg);
}

.element .model .orbital .electron:nth-last-child(10):first-child~.electron:nth-child(7) {
    transform: rotate(216deg);
}

.element .model .orbital .electron:nth-last-child(10):first-child~.electron:nth-child(8) {
    transform: rotate(252deg);
}

.element .model .orbital .electron:nth-last-child(10):first-child~.electron:nth-child(9) {
    transform: rotate(288deg);
}

.element .model .orbital .electron:nth-last-child(10):first-child~.electron:nth-child(10) {
    transform: rotate(324deg);
}

.element .model .orbital .electron:nth-last-child(11):first-child~.electron:nth-child(1) {
    transform: rotate(0deg);
}

.element .model .orbital .electron:nth-last-child(11):first-child~.electron:nth-child(2) {
    transform: rotate(32.7272727273deg);
}

.element .model .orbital .electron:nth-last-child(11):first-child~.electron:nth-child(3) {
    transform: rotate(65.4545454545deg);
}

.element .model .orbital .electron:nth-last-child(11):first-child~.electron:nth-child(4) {
    transform: rotate(98.1818181818deg);
}

.element .model .orbital .electron:nth-last-child(11):first-child~.electron:nth-child(5) {
    transform: rotate(130.9090909091deg);
}

.element .model .orbital .electron:nth-last-child(11):first-child~.electron:nth-child(6) {
    transform: rotate(163.6363636364deg);
}

.element .model .orbital .electron:nth-last-child(11):first-child~.electron:nth-child(7) {
    transform: rotate(196.3636363636deg);
}

.element .model .orbital .electron:nth-last-child(11):first-child~.electron:nth-child(8) {
    transform: rotate(229.0909090909deg);
}

.element .model .orbital .electron:nth-last-child(11):first-child~.electron:nth-child(9) {
    transform: rotate(261.8181818182deg);
}

.element .model .orbital .electron:nth-last-child(11):first-child~.electron:nth-child(10) {
    transform: rotate(294.5454545455deg);
}

.element .model .orbital .electron:nth-last-child(11):first-child~.electron:nth-child(11) {
    transform: rotate(327.2727272727deg);
}

.element .model .orbital .electron:nth-last-child(12):first-child~.electron:nth-child(1) {
    transform: rotate(0deg);
}

.element .model .orbital .electron:nth-last-child(12):first-child~.electron:nth-child(2) {
    transform: rotate(30deg);
}

.element .model .orbital .electron:nth-last-child(12):first-child~.electron:nth-child(3) {
    transform: rotate(60deg);
}

.element .model .orbital .electron:nth-last-child(12):first-child~.electron:nth-child(4) {
    transform: rotate(90deg);
}

.element .model .orbital .electron:nth-last-child(12):first-child~.electron:nth-child(5) {
    transform: rotate(120deg);
}

.element .model .orbital .electron:nth-last-child(12):first-child~.electron:nth-child(6) {
    transform: rotate(150deg);
}

.element .model .orbital .electron:nth-last-child(12):first-child~.electron:nth-child(7) {
    transform: rotate(180deg);
}

.element .model .orbital .electron:nth-last-child(12):first-child~.electron:nth-child(8) {
    transform: rotate(210deg);
}

.element .model .orbital .electron:nth-last-child(12):first-child~.electron:nth-child(9) {
    transform: rotate(240deg);
}

.element .model .orbital .electron:nth-last-child(12):first-child~.electron:nth-child(10) {
    transform: rotate(270deg);
}

.element .model .orbital .electron:nth-last-child(12):first-child~.electron:nth-child(11) {
    transform: rotate(300deg);
}

.element .model .orbital .electron:nth-last-child(12):first-child~.electron:nth-child(12) {
    transform: rotate(330deg);
}

.element .model .orbital .electron:nth-last-child(13):first-child~.electron:nth-child(1) {
    transform: rotate(0deg);
}

.element .model .orbital .electron:nth-last-child(13):first-child~.electron:nth-child(2) {
    transform: rotate(27.6923076923deg);
}

.element .model .orbital .electron:nth-last-child(13):first-child~.electron:nth-child(3) {
    transform: rotate(55.3846153846deg);
}

.element .model .orbital .electron:nth-last-child(13):first-child~.electron:nth-child(4) {
    transform: rotate(83.0769230769deg);
}

.element .model .orbital .electron:nth-last-child(13):first-child~.electron:nth-child(5) {
    transform: rotate(110.7692307692deg);
}

.element .model .orbital .electron:nth-last-child(13):first-child~.electron:nth-child(6) {
    transform: rotate(138.4615384615deg);
}

.element .model .orbital .electron:nth-last-child(13):first-child~.electron:nth-child(7) {
    transform: rotate(166.1538461538deg);
}

.element .model .orbital .electron:nth-last-child(13):first-child~.electron:nth-child(8) {
    transform: rotate(193.8461538462deg);
}

.element .model .orbital .electron:nth-last-child(13):first-child~.electron:nth-child(9) {
    transform: rotate(221.5384615385deg);
}

.element .model .orbital .electron:nth-last-child(13):first-child~.electron:nth-child(10) {
    transform: rotate(249.2307692308deg);
}

.element .model .orbital .electron:nth-last-child(13):first-child~.electron:nth-child(11) {
    transform: rotate(276.9230769231deg);
}

.element .model .orbital .electron:nth-last-child(13):first-child~.electron:nth-child(12) {
    transform: rotate(304.6153846154deg);
}

.element .model .orbital .electron:nth-last-child(13):first-child~.electron:nth-child(13) {
    transform: rotate(332.3076923077deg);
}

.element .model .orbital .electron:nth-last-child(14):first-child~.electron:nth-child(1) {
    transform: rotate(0deg);
}

.element .model .orbital .electron:nth-last-child(14):first-child~.electron:nth-child(2) {
    transform: rotate(25.7142857143deg);
}

.element .model .orbital .electron:nth-last-child(14):first-child~.electron:nth-child(3) {
    transform: rotate(51.4285714286deg);
}

.element .model .orbital .electron:nth-last-child(14):first-child~.electron:nth-child(4) {
    transform: rotate(77.1428571429deg);
}

.element .model .orbital .electron:nth-last-child(14):first-child~.electron:nth-child(5) {
    transform: rotate(102.8571428571deg);
}

.element .model .orbital .electron:nth-last-child(14):first-child~.electron:nth-child(6) {
    transform: rotate(128.5714285714deg);
}

.element .model .orbital .electron:nth-last-child(14):first-child~.electron:nth-child(7) {
    transform: rotate(154.2857142857deg);
}

.element .model .orbital .electron:nth-last-child(14):first-child~.electron:nth-child(8) {
    transform: rotate(180deg);
}

.element .model .orbital .electron:nth-last-child(14):first-child~.electron:nth-child(9) {
    transform: rotate(205.7142857143deg);
}

.element .model .orbital .electron:nth-last-child(14):first-child~.electron:nth-child(10) {
    transform: rotate(231.4285714286deg);
}

.element .model .orbital .electron:nth-last-child(14):first-child~.electron:nth-child(11) {
    transform: rotate(257.1428571429deg);
}

.element .model .orbital .electron:nth-last-child(14):first-child~.electron:nth-child(12) {
    transform: rotate(282.8571428571deg);
}

.element .model .orbital .electron:nth-last-child(14):first-child~.electron:nth-child(13) {
    transform: rotate(308.5714285714deg);
}

.element .model .orbital .electron:nth-last-child(14):first-child~.electron:nth-child(14) {
    transform: rotate(334.2857142857deg);
}

.element .model .orbital .electron:nth-last-child(15):first-child~.electron:nth-child(1) {
    transform: rotate(0deg);
}

.element .model .orbital .electron:nth-last-child(15):first-child~.electron:nth-child(2) {
    transform: rotate(24deg);
}

.element .model .orbital .electron:nth-last-child(15):first-child~.electron:nth-child(3) {
    transform: rotate(48deg);
}

.element .model .orbital .electron:nth-last-child(15):first-child~.electron:nth-child(4) {
    transform: rotate(72deg);
}

.element .model .orbital .electron:nth-last-child(15):first-child~.electron:nth-child(5) {
    transform: rotate(96deg);
}

.element .model .orbital .electron:nth-last-child(15):first-child~.electron:nth-child(6) {
    transform: rotate(120deg);
}

.element .model .orbital .electron:nth-last-child(15):first-child~.electron:nth-child(7) {
    transform: rotate(144deg);
}

.element .model .orbital .electron:nth-last-child(15):first-child~.electron:nth-child(8) {
    transform: rotate(168deg);
}

.element .model .orbital .electron:nth-last-child(15):first-child~.electron:nth-child(9) {
    transform: rotate(192deg);
}

.element .model .orbital .electron:nth-last-child(15):first-child~.electron:nth-child(10) {
    transform: rotate(216deg);
}

.element .model .orbital .electron:nth-last-child(15):first-child~.electron:nth-child(11) {
    transform: rotate(240deg);
}

.element .model .orbital .electron:nth-last-child(15):first-child~.electron:nth-child(12) {
    transform: rotate(264deg);
}

.element .model .orbital .electron:nth-last-child(15):first-child~.electron:nth-child(13) {
    transform: rotate(288deg);
}

.element .model .orbital .electron:nth-last-child(15):first-child~.electron:nth-child(14) {
    transform: rotate(312deg);
}

.element .model .orbital .electron:nth-last-child(15):first-child~.electron:nth-child(15) {
    transform: rotate(336deg);
}

.element .model .orbital .electron:nth-last-child(16):first-child~.electron:nth-child(1) {
    transform: rotate(0deg);
}

.element .model .orbital .electron:nth-last-child(16):first-child~.electron:nth-child(2) {
    transform: rotate(22.5deg);
}

.element .model .orbital .electron:nth-last-child(16):first-child~.electron:nth-child(3) {
    transform: rotate(45deg);
}

.element .model .orbital .electron:nth-last-child(16):first-child~.electron:nth-child(4) {
    transform: rotate(67.5deg);
}

.element .model .orbital .electron:nth-last-child(16):first-child~.electron:nth-child(5) {
    transform: rotate(90deg);
}

.element .model .orbital .electron:nth-last-child(16):first-child~.electron:nth-child(6) {
    transform: rotate(112.5deg);
}

.element .model .orbital .electron:nth-last-child(16):first-child~.electron:nth-child(7) {
    transform: rotate(135deg);
}

.element .model .orbital .electron:nth-last-child(16):first-child~.electron:nth-child(8) {
    transform: rotate(157.5deg);
}

.element .model .orbital .electron:nth-last-child(16):first-child~.electron:nth-child(9) {
    transform: rotate(180deg);
}

.element .model .orbital .electron:nth-last-child(16):first-child~.electron:nth-child(10) {
    transform: rotate(202.5deg);
}

.element .model .orbital .electron:nth-last-child(16):first-child~.electron:nth-child(11) {
    transform: rotate(225deg);
}

.element .model .orbital .electron:nth-last-child(16):first-child~.electron:nth-child(12) {
    transform: rotate(247.5deg);
}

.element .model .orbital .electron:nth-last-child(16):first-child~.electron:nth-child(13) {
    transform: rotate(270deg);
}

.element .model .orbital .electron:nth-last-child(16):first-child~.electron:nth-child(14) {
    transform: rotate(292.5deg);
}

.element .model .orbital .electron:nth-last-child(16):first-child~.electron:nth-child(15) {
    transform: rotate(315deg);
}

.element .model .orbital .electron:nth-last-child(16):first-child~.electron:nth-child(16) {
    transform: rotate(337.5deg);
}

.element .model .orbital .electron:nth-last-child(17):first-child~.electron:nth-child(1) {
    transform: rotate(0deg);
}

.element .model .orbital .electron:nth-last-child(17):first-child~.electron:nth-child(2) {
    transform: rotate(21.1764705882deg);
}

.element .model .orbital .electron:nth-last-child(17):first-child~.electron:nth-child(3) {
    transform: rotate(42.3529411765deg);
}

.element .model .orbital .electron:nth-last-child(17):first-child~.electron:nth-child(4) {
    transform: rotate(63.5294117647deg);
}

.element .model .orbital .electron:nth-last-child(17):first-child~.electron:nth-child(5) {
    transform: rotate(84.7058823529deg);
}

.element .model .orbital .electron:nth-last-child(17):first-child~.electron:nth-child(6) {
    transform: rotate(105.8823529412deg);
}

.element .model .orbital .electron:nth-last-child(17):first-child~.electron:nth-child(7) {
    transform: rotate(127.0588235294deg);
}

.element .model .orbital .electron:nth-last-child(17):first-child~.electron:nth-child(8) {
    transform: rotate(148.2352941176deg);
}

.element .model .orbital .electron:nth-last-child(17):first-child~.electron:nth-child(9) {
    transform: rotate(169.4117647059deg);
}

.element .model .orbital .electron:nth-last-child(17):first-child~.electron:nth-child(10) {
    transform: rotate(190.5882352941deg);
}

.element .model .orbital .electron:nth-last-child(17):first-child~.electron:nth-child(11) {
    transform: rotate(211.7647058824deg);
}

.element .model .orbital .electron:nth-last-child(17):first-child~.electron:nth-child(12) {
    transform: rotate(232.9411764706deg);
}

.element .model .orbital .electron:nth-last-child(17):first-child~.electron:nth-child(13) {
    transform: rotate(254.1176470588deg);
}

.element .model .orbital .electron:nth-last-child(17):first-child~.electron:nth-child(14) {
    transform: rotate(275.2941176471deg);
}

.element .model .orbital .electron:nth-last-child(17):first-child~.electron:nth-child(15) {
    transform: rotate(296.4705882353deg);
}

.element .model .orbital .electron:nth-last-child(17):first-child~.electron:nth-child(16) {
    transform: rotate(317.6470588235deg);
}

.element .model .orbital .electron:nth-last-child(17):first-child~.electron:nth-child(17) {
    transform: rotate(338.8235294118deg);
}

.element .model .orbital .electron:nth-last-child(18):first-child~.electron:nth-child(1) {
    transform: rotate(0deg);
}

.element .model .orbital .electron:nth-last-child(18):first-child~.electron:nth-child(2) {
    transform: rotate(20deg);
}

.element .model .orbital .electron:nth-last-child(18):first-child~.electron:nth-child(3) {
    transform: rotate(40deg);
}

.element .model .orbital .electron:nth-last-child(18):first-child~.electron:nth-child(4) {
    transform: rotate(60deg);
}

.element .model .orbital .electron:nth-last-child(18):first-child~.electron:nth-child(5) {
    transform: rotate(80deg);
}

.element .model .orbital .electron:nth-last-child(18):first-child~.electron:nth-child(6) {
    transform: rotate(100deg);
}

.element .model .orbital .electron:nth-last-child(18):first-child~.electron:nth-child(7) {
    transform: rotate(120deg);
}

.element .model .orbital .electron:nth-last-child(18):first-child~.electron:nth-child(8) {
    transform: rotate(140deg);
}

.element .model .orbital .electron:nth-last-child(18):first-child~.electron:nth-child(9) {
    transform: rotate(160deg);
}

.element .model .orbital .electron:nth-last-child(18):first-child~.electron:nth-child(10) {
    transform: rotate(180deg);
}

.element .model .orbital .electron:nth-last-child(18):first-child~.electron:nth-child(11) {
    transform: rotate(200deg);
}

.element .model .orbital .electron:nth-last-child(18):first-child~.electron:nth-child(12) {
    transform: rotate(220deg);
}

.element .model .orbital .electron:nth-last-child(18):first-child~.electron:nth-child(13) {
    transform: rotate(240deg);
}

.element .model .orbital .electron:nth-last-child(18):first-child~.electron:nth-child(14) {
    transform: rotate(260deg);
}

.element .model .orbital .electron:nth-last-child(18):first-child~.electron:nth-child(15) {
    transform: rotate(280deg);
}

.element .model .orbital .electron:nth-last-child(18):first-child~.electron:nth-child(16) {
    transform: rotate(300deg);
}

.element .model .orbital .electron:nth-last-child(18):first-child~.electron:nth-child(17) {
    transform: rotate(320deg);
}

.element .model .orbital .electron:nth-last-child(18):first-child~.electron:nth-child(18) {
    transform: rotate(340deg);
}

.element .model .orbital .electron:nth-last-child(19):first-child~.electron:nth-child(1) {
    transform: rotate(0deg);
}

.element .model .orbital .electron:nth-last-child(19):first-child~.electron:nth-child(2) {
    transform: rotate(18.9473684211deg);
}

.element .model .orbital .electron:nth-last-child(19):first-child~.electron:nth-child(3) {
    transform: rotate(37.8947368421deg);
}

.element .model .orbital .electron:nth-last-child(19):first-child~.electron:nth-child(4) {
    transform: rotate(56.8421052632deg);
}

.element .model .orbital .electron:nth-last-child(19):first-child~.electron:nth-child(5) {
    transform: rotate(75.7894736842deg);
}

.element .model .orbital .electron:nth-last-child(19):first-child~.electron:nth-child(6) {
    transform: rotate(94.7368421053deg);
}

.element .model .orbital .electron:nth-last-child(19):first-child~.electron:nth-child(7) {
    transform: rotate(113.6842105263deg);
}

.element .model .orbital .electron:nth-last-child(19):first-child~.electron:nth-child(8) {
    transform: rotate(132.6315789474deg);
}

.element .model .orbital .electron:nth-last-child(19):first-child~.electron:nth-child(9) {
    transform: rotate(151.5789473684deg);
}

.element .model .orbital .electron:nth-last-child(19):first-child~.electron:nth-child(10) {
    transform: rotate(170.5263157895deg);
}

.element .model .orbital .electron:nth-last-child(19):first-child~.electron:nth-child(11) {
    transform: rotate(189.4736842105deg);
}

.element .model .orbital .electron:nth-last-child(19):first-child~.electron:nth-child(12) {
    transform: rotate(208.4210526316deg);
}

.element .model .orbital .electron:nth-last-child(19):first-child~.electron:nth-child(13) {
    transform: rotate(227.3684210526deg);
}

.element .model .orbital .electron:nth-last-child(19):first-child~.electron:nth-child(14) {
    transform: rotate(246.3157894737deg);
}

.element .model .orbital .electron:nth-last-child(19):first-child~.electron:nth-child(15) {
    transform: rotate(265.2631578947deg);
}

.element .model .orbital .electron:nth-last-child(19):first-child~.electron:nth-child(16) {
    transform: rotate(284.2105263158deg);
}

.element .model .orbital .electron:nth-last-child(19):first-child~.electron:nth-child(17) {
    transform: rotate(303.1578947368deg);
}

.element .model .orbital .electron:nth-last-child(19):first-child~.electron:nth-child(18) {
    transform: rotate(322.1052631579deg);
}

.element .model .orbital .electron:nth-last-child(19):first-child~.electron:nth-child(19) {
    transform: rotate(341.0526315789deg);
}

.element .model .orbital .electron:nth-last-child(20):first-child~.electron:nth-child(1) {
    transform: rotate(0deg);
}

.element .model .orbital .electron:nth-last-child(20):first-child~.electron:nth-child(2) {
    transform: rotate(18deg);
}

.element .model .orbital .electron:nth-last-child(20):first-child~.electron:nth-child(3) {
    transform: rotate(36deg);
}

.element .model .orbital .electron:nth-last-child(20):first-child~.electron:nth-child(4) {
    transform: rotate(54deg);
}

.element .model .orbital .electron:nth-last-child(20):first-child~.electron:nth-child(5) {
    transform: rotate(72deg);
}

.element .model .orbital .electron:nth-last-child(20):first-child~.electron:nth-child(6) {
    transform: rotate(90deg);
}

.element .model .orbital .electron:nth-last-child(20):first-child~.electron:nth-child(7) {
    transform: rotate(108deg);
}

.element .model .orbital .electron:nth-last-child(20):first-child~.electron:nth-child(8) {
    transform: rotate(126deg);
}

.element .model .orbital .electron:nth-last-child(20):first-child~.electron:nth-child(9) {
    transform: rotate(144deg);
}

.element .model .orbital .electron:nth-last-child(20):first-child~.electron:nth-child(10) {
    transform: rotate(162deg);
}

.element .model .orbital .electron:nth-last-child(20):first-child~.electron:nth-child(11) {
    transform: rotate(180deg);
}

.element .model .orbital .electron:nth-last-child(20):first-child~.electron:nth-child(12) {
    transform: rotate(198deg);
}

.element .model .orbital .electron:nth-last-child(20):first-child~.electron:nth-child(13) {
    transform: rotate(216deg);
}

.element .model .orbital .electron:nth-last-child(20):first-child~.electron:nth-child(14) {
    transform: rotate(234deg);
}

.element .model .orbital .electron:nth-last-child(20):first-child~.electron:nth-child(15) {
    transform: rotate(252deg);
}

.element .model .orbital .electron:nth-last-child(20):first-child~.electron:nth-child(16) {
    transform: rotate(270deg);
}

.element .model .orbital .electron:nth-last-child(20):first-child~.electron:nth-child(17) {
    transform: rotate(288deg);
}

.element .model .orbital .electron:nth-last-child(20):first-child~.electron:nth-child(18) {
    transform: rotate(306deg);
}

.element .model .orbital .electron:nth-last-child(20):first-child~.electron:nth-child(19) {
    transform: rotate(324deg);
}

.element .model .orbital .electron:nth-last-child(20):first-child~.electron:nth-child(20) {
    transform: rotate(342deg);
}

.element .model .orbital .electron:nth-last-child(21):first-child~.electron:nth-child(1) {
    transform: rotate(0deg);
}

.element .model .orbital .electron:nth-last-child(21):first-child~.electron:nth-child(2) {
    transform: rotate(17.1428571429deg);
}

.element .model .orbital .electron:nth-last-child(21):first-child~.electron:nth-child(3) {
    transform: rotate(34.2857142857deg);
}

.element .model .orbital .electron:nth-last-child(21):first-child~.electron:nth-child(4) {
    transform: rotate(51.4285714286deg);
}

.element .model .orbital .electron:nth-last-child(21):first-child~.electron:nth-child(5) {
    transform: rotate(68.5714285714deg);
}

.element .model .orbital .electron:nth-last-child(21):first-child~.electron:nth-child(6) {
    transform: rotate(85.7142857143deg);
}

.element .model .orbital .electron:nth-last-child(21):first-child~.electron:nth-child(7) {
    transform: rotate(102.8571428571deg);
}

.element .model .orbital .electron:nth-last-child(21):first-child~.electron:nth-child(8) {
    transform: rotate(120deg);
}

.element .model .orbital .electron:nth-last-child(21):first-child~.electron:nth-child(9) {
    transform: rotate(137.1428571429deg);
}

.element .model .orbital .electron:nth-last-child(21):first-child~.electron:nth-child(10) {
    transform: rotate(154.2857142857deg);
}

.element .model .orbital .electron:nth-last-child(21):first-child~.electron:nth-child(11) {
    transform: rotate(171.4285714286deg);
}

.element .model .orbital .electron:nth-last-child(21):first-child~.electron:nth-child(12) {
    transform: rotate(188.5714285714deg);
}

.element .model .orbital .electron:nth-last-child(21):first-child~.electron:nth-child(13) {
    transform: rotate(205.7142857143deg);
}

.element .model .orbital .electron:nth-last-child(21):first-child~.electron:nth-child(14) {
    transform: rotate(222.8571428571deg);
}

.element .model .orbital .electron:nth-last-child(21):first-child~.electron:nth-child(15) {
    transform: rotate(240deg);
}

.element .model .orbital .electron:nth-last-child(21):first-child~.electron:nth-child(16) {
    transform: rotate(257.1428571429deg);
}

.element .model .orbital .electron:nth-last-child(21):first-child~.electron:nth-child(17) {
    transform: rotate(274.2857142857deg);
}

.element .model .orbital .electron:nth-last-child(21):first-child~.electron:nth-child(18) {
    transform: rotate(291.4285714286deg);
}

.element .model .orbital .electron:nth-last-child(21):first-child~.electron:nth-child(19) {
    transform: rotate(308.5714285714deg);
}

.element .model .orbital .electron:nth-last-child(21):first-child~.electron:nth-child(20) {
    transform: rotate(325.7142857143deg);
}

.element .model .orbital .electron:nth-last-child(21):first-child~.electron:nth-child(21) {
    transform: rotate(342.8571428571deg);
}

.element .model .orbital .electron:nth-last-child(22):first-child~.electron:nth-child(1) {
    transform: rotate(0deg);
}

.element .model .orbital .electron:nth-last-child(22):first-child~.electron:nth-child(2) {
    transform: rotate(16.3636363636deg);
}

.element .model .orbital .electron:nth-last-child(22):first-child~.electron:nth-child(3) {
    transform: rotate(32.7272727273deg);
}

.element .model .orbital .electron:nth-last-child(22):first-child~.electron:nth-child(4) {
    transform: rotate(49.0909090909deg);
}

.element .model .orbital .electron:nth-last-child(22):first-child~.electron:nth-child(5) {
    transform: rotate(65.4545454545deg);
}

.element .model .orbital .electron:nth-last-child(22):first-child~.electron:nth-child(6) {
    transform: rotate(81.8181818182deg);
}

.element .model .orbital .electron:nth-last-child(22):first-child~.electron:nth-child(7) {
    transform: rotate(98.1818181818deg);
}

.element .model .orbital .electron:nth-last-child(22):first-child~.electron:nth-child(8) {
    transform: rotate(114.5454545455deg);
}

.element .model .orbital .electron:nth-last-child(22):first-child~.electron:nth-child(9) {
    transform: rotate(130.9090909091deg);
}

.element .model .orbital .electron:nth-last-child(22):first-child~.electron:nth-child(10) {
    transform: rotate(147.2727272727deg);
}

.element .model .orbital .electron:nth-last-child(22):first-child~.electron:nth-child(11) {
    transform: rotate(163.6363636364deg);
}

.element .model .orbital .electron:nth-last-child(22):first-child~.electron:nth-child(12) {
    transform: rotate(180deg);
}

.element .model .orbital .electron:nth-last-child(22):first-child~.electron:nth-child(13) {
    transform: rotate(196.3636363636deg);
}

.element .model .orbital .electron:nth-last-child(22):first-child~.electron:nth-child(14) {
    transform: rotate(212.7272727273deg);
}

.element .model .orbital .electron:nth-last-child(22):first-child~.electron:nth-child(15) {
    transform: rotate(229.0909090909deg);
}

.element .model .orbital .electron:nth-last-child(22):first-child~.electron:nth-child(16) {
    transform: rotate(245.4545454545deg);
}

.element .model .orbital .electron:nth-last-child(22):first-child~.electron:nth-child(17) {
    transform: rotate(261.8181818182deg);
}

.element .model .orbital .electron:nth-last-child(22):first-child~.electron:nth-child(18) {
    transform: rotate(278.1818181818deg);
}

.element .model .orbital .electron:nth-last-child(22):first-child~.electron:nth-child(19) {
    transform: rotate(294.5454545455deg);
}

.element .model .orbital .electron:nth-last-child(22):first-child~.electron:nth-child(20) {
    transform: rotate(310.9090909091deg);
}

.element .model .orbital .electron:nth-last-child(22):first-child~.electron:nth-child(21) {
    transform: rotate(327.2727272727deg);
}

.element .model .orbital .electron:nth-last-child(22):first-child~.electron:nth-child(22) {
    transform: rotate(343.6363636364deg);
}

.element .model .orbital .electron:nth-last-child(23):first-child~.electron:nth-child(1) {
    transform: rotate(0deg);
}

.element .model .orbital .electron:nth-last-child(23):first-child~.electron:nth-child(2) {
    transform: rotate(15.652173913deg);
}

.element .model .orbital .electron:nth-last-child(23):first-child~.electron:nth-child(3) {
    transform: rotate(31.3043478261deg);
}

.element .model .orbital .electron:nth-last-child(23):first-child~.electron:nth-child(4) {
    transform: rotate(46.9565217391deg);
}

.element .model .orbital .electron:nth-last-child(23):first-child~.electron:nth-child(5) {
    transform: rotate(62.6086956522deg);
}

.element .model .orbital .electron:nth-last-child(23):first-child~.electron:nth-child(6) {
    transform: rotate(78.2608695652deg);
}

.element .model .orbital .electron:nth-last-child(23):first-child~.electron:nth-child(7) {
    transform: rotate(93.9130434783deg);
}

.element .model .orbital .electron:nth-last-child(23):first-child~.electron:nth-child(8) {
    transform: rotate(109.5652173913deg);
}

.element .model .orbital .electron:nth-last-child(23):first-child~.electron:nth-child(9) {
    transform: rotate(125.2173913043deg);
}

.element .model .orbital .electron:nth-last-child(23):first-child~.electron:nth-child(10) {
    transform: rotate(140.8695652174deg);
}

.element .model .orbital .electron:nth-last-child(23):first-child~.electron:nth-child(11) {
    transform: rotate(156.5217391304deg);
}

.element .model .orbital .electron:nth-last-child(23):first-child~.electron:nth-child(12) {
    transform: rotate(172.1739130435deg);
}

.element .model .orbital .electron:nth-last-child(23):first-child~.electron:nth-child(13) {
    transform: rotate(187.8260869565deg);
}

.element .model .orbital .electron:nth-last-child(23):first-child~.electron:nth-child(14) {
    transform: rotate(203.4782608696deg);
}

.element .model .orbital .electron:nth-last-child(23):first-child~.electron:nth-child(15) {
    transform: rotate(219.1304347826deg);
}

.element .model .orbital .electron:nth-last-child(23):first-child~.electron:nth-child(16) {
    transform: rotate(234.7826086957deg);
}

.element .model .orbital .electron:nth-last-child(23):first-child~.electron:nth-child(17) {
    transform: rotate(250.4347826087deg);
}

.element .model .orbital .electron:nth-last-child(23):first-child~.electron:nth-child(18) {
    transform: rotate(266.0869565217deg);
}

.element .model .orbital .electron:nth-last-child(23):first-child~.electron:nth-child(19) {
    transform: rotate(281.7391304348deg);
}

.element .model .orbital .electron:nth-last-child(23):first-child~.electron:nth-child(20) {
    transform: rotate(297.3913043478deg);
}

.element .model .orbital .electron:nth-last-child(23):first-child~.electron:nth-child(21) {
    transform: rotate(313.0434782609deg);
}

.element .model .orbital .electron:nth-last-child(23):first-child~.electron:nth-child(22) {
    transform: rotate(328.6956521739deg);
}

.element .model .orbital .electron:nth-last-child(23):first-child~.electron:nth-child(23) {
    transform: rotate(344.347826087deg);
}

.element .model .orbital .electron:nth-last-child(24):first-child~.electron:nth-child(1) {
    transform: rotate(0deg);
}

.element .model .orbital .electron:nth-last-child(24):first-child~.electron:nth-child(2) {
    transform: rotate(15deg);
}

.element .model .orbital .electron:nth-last-child(24):first-child~.electron:nth-child(3) {
    transform: rotate(30deg);
}

.element .model .orbital .electron:nth-last-child(24):first-child~.electron:nth-child(4) {
    transform: rotate(45deg);
}

.element .model .orbital .electron:nth-last-child(24):first-child~.electron:nth-child(5) {
    transform: rotate(60deg);
}

.element .model .orbital .electron:nth-last-child(24):first-child~.electron:nth-child(6) {
    transform: rotate(75deg);
}

.element .model .orbital .electron:nth-last-child(24):first-child~.electron:nth-child(7) {
    transform: rotate(90deg);
}

.element .model .orbital .electron:nth-last-child(24):first-child~.electron:nth-child(8) {
    transform: rotate(105deg);
}

.element .model .orbital .electron:nth-last-child(24):first-child~.electron:nth-child(9) {
    transform: rotate(120deg);
}

.element .model .orbital .electron:nth-last-child(24):first-child~.electron:nth-child(10) {
    transform: rotate(135deg);
}

.element .model .orbital .electron:nth-last-child(24):first-child~.electron:nth-child(11) {
    transform: rotate(150deg);
}

.element .model .orbital .electron:nth-last-child(24):first-child~.electron:nth-child(12) {
    transform: rotate(165deg);
}

.element .model .orbital .electron:nth-last-child(24):first-child~.electron:nth-child(13) {
    transform: rotate(180deg);
}

.element .model .orbital .electron:nth-last-child(24):first-child~.electron:nth-child(14) {
    transform: rotate(195deg);
}

.element .model .orbital .electron:nth-last-child(24):first-child~.electron:nth-child(15) {
    transform: rotate(210deg);
}

.element .model .orbital .electron:nth-last-child(24):first-child~.electron:nth-child(16) {
    transform: rotate(225deg);
}

.element .model .orbital .electron:nth-last-child(24):first-child~.electron:nth-child(17) {
    transform: rotate(240deg);
}

.element .model .orbital .electron:nth-last-child(24):first-child~.electron:nth-child(18) {
    transform: rotate(255deg);
}

.element .model .orbital .electron:nth-last-child(24):first-child~.electron:nth-child(19) {
    transform: rotate(270deg);
}

.element .model .orbital .electron:nth-last-child(24):first-child~.electron:nth-child(20) {
    transform: rotate(285deg);
}

.element .model .orbital .electron:nth-last-child(24):first-child~.electron:nth-child(21) {
    transform: rotate(300deg);
}

.element .model .orbital .electron:nth-last-child(24):first-child~.electron:nth-child(22) {
    transform: rotate(315deg);
}

.element .model .orbital .electron:nth-last-child(24):first-child~.electron:nth-child(23) {
    transform: rotate(330deg);
}

.element .model .orbital .electron:nth-last-child(24):first-child~.electron:nth-child(24) {
    transform: rotate(345deg);
}

.element .model .orbital .electron:nth-last-child(25):first-child~.electron:nth-child(1) {
    transform: rotate(0deg);
}

.element .model .orbital .electron:nth-last-child(25):first-child~.electron:nth-child(2) {
    transform: rotate(14.4deg);
}

.element .model .orbital .electron:nth-last-child(25):first-child~.electron:nth-child(3) {
    transform: rotate(28.8deg);
}

.element .model .orbital .electron:nth-last-child(25):first-child~.electron:nth-child(4) {
    transform: rotate(43.2deg);
}

.element .model .orbital .electron:nth-last-child(25):first-child~.electron:nth-child(5) {
    transform: rotate(57.6deg);
}

.element .model .orbital .electron:nth-last-child(25):first-child~.electron:nth-child(6) {
    transform: rotate(72deg);
}

.element .model .orbital .electron:nth-last-child(25):first-child~.electron:nth-child(7) {
    transform: rotate(86.4deg);
}

.element .model .orbital .electron:nth-last-child(25):first-child~.electron:nth-child(8) {
    transform: rotate(100.8deg);
}

.element .model .orbital .electron:nth-last-child(25):first-child~.electron:nth-child(9) {
    transform: rotate(115.2deg);
}

.element .model .orbital .electron:nth-last-child(25):first-child~.electron:nth-child(10) {
    transform: rotate(129.6deg);
}

.element .model .orbital .electron:nth-last-child(25):first-child~.electron:nth-child(11) {
    transform: rotate(144deg);
}

.element .model .orbital .electron:nth-last-child(25):first-child~.electron:nth-child(12) {
    transform: rotate(158.4deg);
}

.element .model .orbital .electron:nth-last-child(25):first-child~.electron:nth-child(13) {
    transform: rotate(172.8deg);
}

.element .model .orbital .electron:nth-last-child(25):first-child~.electron:nth-child(14) {
    transform: rotate(187.2deg);
}

.element .model .orbital .electron:nth-last-child(25):first-child~.electron:nth-child(15) {
    transform: rotate(201.6deg);
}

.element .model .orbital .electron:nth-last-child(25):first-child~.electron:nth-child(16) {
    transform: rotate(216deg);
}

.element .model .orbital .electron:nth-last-child(25):first-child~.electron:nth-child(17) {
    transform: rotate(230.4deg);
}

.element .model .orbital .electron:nth-last-child(25):first-child~.electron:nth-child(18) {
    transform: rotate(244.8deg);
}

.element .model .orbital .electron:nth-last-child(25):first-child~.electron:nth-child(19) {
    transform: rotate(259.2deg);
}

.element .model .orbital .electron:nth-last-child(25):first-child~.electron:nth-child(20) {
    transform: rotate(273.6deg);
}

.element .model .orbital .electron:nth-last-child(25):first-child~.electron:nth-child(21) {
    transform: rotate(288deg);
}

.element .model .orbital .electron:nth-last-child(25):first-child~.electron:nth-child(22) {
    transform: rotate(302.4deg);
}

.element .model .orbital .electron:nth-last-child(25):first-child~.electron:nth-child(23) {
    transform: rotate(316.8deg);
}

.element .model .orbital .electron:nth-last-child(25):first-child~.electron:nth-child(24) {
    transform: rotate(331.2deg);
}

.element .model .orbital .electron:nth-last-child(25):first-child~.electron:nth-child(25) {
    transform: rotate(345.6deg);
}

.element .model .orbital .electron:nth-last-child(26):first-child~.electron:nth-child(1) {
    transform: rotate(0deg);
}

.element .model .orbital .electron:nth-last-child(26):first-child~.electron:nth-child(2) {
    transform: rotate(13.8461538462deg);
}

.element .model .orbital .electron:nth-last-child(26):first-child~.electron:nth-child(3) {
    transform: rotate(27.6923076923deg);
}

.element .model .orbital .electron:nth-last-child(26):first-child~.electron:nth-child(4) {
    transform: rotate(41.5384615385deg);
}

.element .model .orbital .electron:nth-last-child(26):first-child~.electron:nth-child(5) {
    transform: rotate(55.3846153846deg);
}

.element .model .orbital .electron:nth-last-child(26):first-child~.electron:nth-child(6) {
    transform: rotate(69.2307692308deg);
}

.element .model .orbital .electron:nth-last-child(26):first-child~.electron:nth-child(7) {
    transform: rotate(83.0769230769deg);
}

.element .model .orbital .electron:nth-last-child(26):first-child~.electron:nth-child(8) {
    transform: rotate(96.9230769231deg);
}

.element .model .orbital .electron:nth-last-child(26):first-child~.electron:nth-child(9) {
    transform: rotate(110.7692307692deg);
}

.element .model .orbital .electron:nth-last-child(26):first-child~.electron:nth-child(10) {
    transform: rotate(124.6153846154deg);
}

.element .model .orbital .electron:nth-last-child(26):first-child~.electron:nth-child(11) {
    transform: rotate(138.4615384615deg);
}

.element .model .orbital .electron:nth-last-child(26):first-child~.electron:nth-child(12) {
    transform: rotate(152.3076923077deg);
}

.element .model .orbital .electron:nth-last-child(26):first-child~.electron:nth-child(13) {
    transform: rotate(166.1538461538deg);
}

.element .model .orbital .electron:nth-last-child(26):first-child~.electron:nth-child(14) {
    transform: rotate(180deg);
}

.element .model .orbital .electron:nth-last-child(26):first-child~.electron:nth-child(15) {
    transform: rotate(193.8461538462deg);
}

.element .model .orbital .electron:nth-last-child(26):first-child~.electron:nth-child(16) {
    transform: rotate(207.6923076923deg);
}

.element .model .orbital .electron:nth-last-child(26):first-child~.electron:nth-child(17) {
    transform: rotate(221.5384615385deg);
}

.element .model .orbital .electron:nth-last-child(26):first-child~.electron:nth-child(18) {
    transform: rotate(235.3846153846deg);
}

.element .model .orbital .electron:nth-last-child(26):first-child~.electron:nth-child(19) {
    transform: rotate(249.2307692308deg);
}

.element .model .orbital .electron:nth-last-child(26):first-child~.electron:nth-child(20) {
    transform: rotate(263.0769230769deg);
}

.element .model .orbital .electron:nth-last-child(26):first-child~.electron:nth-child(21) {
    transform: rotate(276.9230769231deg);
}

.element .model .orbital .electron:nth-last-child(26):first-child~.electron:nth-child(22) {
    transform: rotate(290.7692307692deg);
}

.element .model .orbital .electron:nth-last-child(26):first-child~.electron:nth-child(23) {
    transform: rotate(304.6153846154deg);
}

.element .model .orbital .electron:nth-last-child(26):first-child~.electron:nth-child(24) {
    transform: rotate(318.4615384615deg);
}

.element .model .orbital .electron:nth-last-child(26):first-child~.electron:nth-child(25) {
    transform: rotate(332.3076923077deg);
}

.element .model .orbital .electron:nth-last-child(26):first-child~.electron:nth-child(26) {
    transform: rotate(346.1538461538deg);
}

.element .model .orbital .electron:nth-last-child(27):first-child~.electron:nth-child(1) {
    transform: rotate(0deg);
}

.element .model .orbital .electron:nth-last-child(27):first-child~.electron:nth-child(2) {
    transform: rotate(13.3333333333deg);
}

.element .model .orbital .electron:nth-last-child(27):first-child~.electron:nth-child(3) {
    transform: rotate(26.6666666667deg);
}

.element .model .orbital .electron:nth-last-child(27):first-child~.electron:nth-child(4) {
    transform: rotate(40deg);
}

.element .model .orbital .electron:nth-last-child(27):first-child~.electron:nth-child(5) {
    transform: rotate(53.3333333333deg);
}

.element .model .orbital .electron:nth-last-child(27):first-child~.electron:nth-child(6) {
    transform: rotate(66.6666666667deg);
}

.element .model .orbital .electron:nth-last-child(27):first-child~.electron:nth-child(7) {
    transform: rotate(80deg);
}

.element .model .orbital .electron:nth-last-child(27):first-child~.electron:nth-child(8) {
    transform: rotate(93.3333333333deg);
}

.element .model .orbital .electron:nth-last-child(27):first-child~.electron:nth-child(9) {
    transform: rotate(106.6666666667deg);
}

.element .model .orbital .electron:nth-last-child(27):first-child~.electron:nth-child(10) {
    transform: rotate(120deg);
}

.element .model .orbital .electron:nth-last-child(27):first-child~.electron:nth-child(11) {
    transform: rotate(133.3333333333deg);
}

.element .model .orbital .electron:nth-last-child(27):first-child~.electron:nth-child(12) {
    transform: rotate(146.6666666667deg);
}

.element .model .orbital .electron:nth-last-child(27):first-child~.electron:nth-child(13) {
    transform: rotate(160deg);
}

.element .model .orbital .electron:nth-last-child(27):first-child~.electron:nth-child(14) {
    transform: rotate(173.3333333333deg);
}

.element .model .orbital .electron:nth-last-child(27):first-child~.electron:nth-child(15) {
    transform: rotate(186.6666666667deg);
}

.element .model .orbital .electron:nth-last-child(27):first-child~.electron:nth-child(16) {
    transform: rotate(200deg);
}

.element .model .orbital .electron:nth-last-child(27):first-child~.electron:nth-child(17) {
    transform: rotate(213.3333333333deg);
}

.element .model .orbital .electron:nth-last-child(27):first-child~.electron:nth-child(18) {
    transform: rotate(226.6666666667deg);
}

.element .model .orbital .electron:nth-last-child(27):first-child~.electron:nth-child(19) {
    transform: rotate(240deg);
}

.element .model .orbital .electron:nth-last-child(27):first-child~.electron:nth-child(20) {
    transform: rotate(253.3333333333deg);
}

.element .model .orbital .electron:nth-last-child(27):first-child~.electron:nth-child(21) {
    transform: rotate(266.6666666667deg);
}

.element .model .orbital .electron:nth-last-child(27):first-child~.electron:nth-child(22) {
    transform: rotate(280deg);
}

.element .model .orbital .electron:nth-last-child(27):first-child~.electron:nth-child(23) {
    transform: rotate(293.3333333333deg);
}

.element .model .orbital .electron:nth-last-child(27):first-child~.electron:nth-child(24) {
    transform: rotate(306.6666666667deg);
}

.element .model .orbital .electron:nth-last-child(27):first-child~.electron:nth-child(25) {
    transform: rotate(320deg);
}

.element .model .orbital .electron:nth-last-child(27):first-child~.electron:nth-child(26) {
    transform: rotate(333.3333333333deg);
}

.element .model .orbital .electron:nth-last-child(27):first-child~.electron:nth-child(27) {
    transform: rotate(346.6666666667deg);
}

.element .model .orbital .electron:nth-last-child(28):first-child~.electron:nth-child(1) {
    transform: rotate(0deg);
}

.element .model .orbital .electron:nth-last-child(28):first-child~.electron:nth-child(2) {
    transform: rotate(12.8571428571deg);
}

.element .model .orbital .electron:nth-last-child(28):first-child~.electron:nth-child(3) {
    transform: rotate(25.7142857143deg);
}

.element .model .orbital .electron:nth-last-child(28):first-child~.electron:nth-child(4) {
    transform: rotate(38.5714285714deg);
}

.element .model .orbital .electron:nth-last-child(28):first-child~.electron:nth-child(5) {
    transform: rotate(51.4285714286deg);
}

.element .model .orbital .electron:nth-last-child(28):first-child~.electron:nth-child(6) {
    transform: rotate(64.2857142857deg);
}

.element .model .orbital .electron:nth-last-child(28):first-child~.electron:nth-child(7) {
    transform: rotate(77.1428571429deg);
}

.element .model .orbital .electron:nth-last-child(28):first-child~.electron:nth-child(8) {
    transform: rotate(90deg);
}

.element .model .orbital .electron:nth-last-child(28):first-child~.electron:nth-child(9) {
    transform: rotate(102.8571428571deg);
}

.element .model .orbital .electron:nth-last-child(28):first-child~.electron:nth-child(10) {
    transform: rotate(115.7142857143deg);
}

.element .model .orbital .electron:nth-last-child(28):first-child~.electron:nth-child(11) {
    transform: rotate(128.5714285714deg);
}

.element .model .orbital .electron:nth-last-child(28):first-child~.electron:nth-child(12) {
    transform: rotate(141.4285714286deg);
}

.element .model .orbital .electron:nth-last-child(28):first-child~.electron:nth-child(13) {
    transform: rotate(154.2857142857deg);
}

.element .model .orbital .electron:nth-last-child(28):first-child~.electron:nth-child(14) {
    transform: rotate(167.1428571429deg);
}

.element .model .orbital .electron:nth-last-child(28):first-child~.electron:nth-child(15) {
    transform: rotate(180deg);
}

.element .model .orbital .electron:nth-last-child(28):first-child~.electron:nth-child(16) {
    transform: rotate(192.8571428571deg);
}

.element .model .orbital .electron:nth-last-child(28):first-child~.electron:nth-child(17) {
    transform: rotate(205.7142857143deg);
}

.element .model .orbital .electron:nth-last-child(28):first-child~.electron:nth-child(18) {
    transform: rotate(218.5714285714deg);
}

.element .model .orbital .electron:nth-last-child(28):first-child~.electron:nth-child(19) {
    transform: rotate(231.4285714286deg);
}

.element .model .orbital .electron:nth-last-child(28):first-child~.electron:nth-child(20) {
    transform: rotate(244.2857142857deg);
}

.element .model .orbital .electron:nth-last-child(28):first-child~.electron:nth-child(21) {
    transform: rotate(257.1428571429deg);
}

.element .model .orbital .electron:nth-last-child(28):first-child~.electron:nth-child(22) {
    transform: rotate(270deg);
}

.element .model .orbital .electron:nth-last-child(28):first-child~.electron:nth-child(23) {
    transform: rotate(282.8571428571deg);
}

.element .model .orbital .electron:nth-last-child(28):first-child~.electron:nth-child(24) {
    transform: rotate(295.7142857143deg);
}

.element .model .orbital .electron:nth-last-child(28):first-child~.electron:nth-child(25) {
    transform: rotate(308.5714285714deg);
}

.element .model .orbital .electron:nth-last-child(28):first-child~.electron:nth-child(26) {
    transform: rotate(321.4285714286deg);
}

.element .model .orbital .electron:nth-last-child(28):first-child~.electron:nth-child(27) {
    transform: rotate(334.2857142857deg);
}

.element .model .orbital .electron:nth-last-child(28):first-child~.electron:nth-child(28) {
    transform: rotate(347.1428571429deg);
}

.element .model .orbital .electron:nth-last-child(29):first-child~.electron:nth-child(1) {
    transform: rotate(0deg);
}

.element .model .orbital .electron:nth-last-child(29):first-child~.electron:nth-child(2) {
    transform: rotate(12.4137931034deg);
}

.element .model .orbital .electron:nth-last-child(29):first-child~.electron:nth-child(3) {
    transform: rotate(24.8275862069deg);
}

.element .model .orbital .electron:nth-last-child(29):first-child~.electron:nth-child(4) {
    transform: rotate(37.2413793103deg);
}

.element .model .orbital .electron:nth-last-child(29):first-child~.electron:nth-child(5) {
    transform: rotate(49.6551724138deg);
}

.element .model .orbital .electron:nth-last-child(29):first-child~.electron:nth-child(6) {
    transform: rotate(62.0689655172deg);
}

.element .model .orbital .electron:nth-last-child(29):first-child~.electron:nth-child(7) {
    transform: rotate(74.4827586207deg);
}

.element .model .orbital .electron:nth-last-child(29):first-child~.electron:nth-child(8) {
    transform: rotate(86.8965517241deg);
}

.element .model .orbital .electron:nth-last-child(29):first-child~.electron:nth-child(9) {
    transform: rotate(99.3103448276deg);
}

.element .model .orbital .electron:nth-last-child(29):first-child~.electron:nth-child(10) {
    transform: rotate(111.724137931deg);
}

.element .model .orbital .electron:nth-last-child(29):first-child~.electron:nth-child(11) {
    transform: rotate(124.1379310345deg);
}

.element .model .orbital .electron:nth-last-child(29):first-child~.electron:nth-child(12) {
    transform: rotate(136.5517241379deg);
}

.element .model .orbital .electron:nth-last-child(29):first-child~.electron:nth-child(13) {
    transform: rotate(148.9655172414deg);
}

.element .model .orbital .electron:nth-last-child(29):first-child~.electron:nth-child(14) {
    transform: rotate(161.3793103448deg);
}

.element .model .orbital .electron:nth-last-child(29):first-child~.electron:nth-child(15) {
    transform: rotate(173.7931034483deg);
}

.element .model .orbital .electron:nth-last-child(29):first-child~.electron:nth-child(16) {
    transform: rotate(186.2068965517deg);
}

.element .model .orbital .electron:nth-last-child(29):first-child~.electron:nth-child(17) {
    transform: rotate(198.6206896552deg);
}

.element .model .orbital .electron:nth-last-child(29):first-child~.electron:nth-child(18) {
    transform: rotate(211.0344827586deg);
}

.element .model .orbital .electron:nth-last-child(29):first-child~.electron:nth-child(19) {
    transform: rotate(223.4482758621deg);
}

.element .model .orbital .electron:nth-last-child(29):first-child~.electron:nth-child(20) {
    transform: rotate(235.8620689655deg);
}

.element .model .orbital .electron:nth-last-child(29):first-child~.electron:nth-child(21) {
    transform: rotate(248.275862069deg);
}

.element .model .orbital .electron:nth-last-child(29):first-child~.electron:nth-child(22) {
    transform: rotate(260.6896551724deg);
}

.element .model .orbital .electron:nth-last-child(29):first-child~.electron:nth-child(23) {
    transform: rotate(273.1034482759deg);
}

.element .model .orbital .electron:nth-last-child(29):first-child~.electron:nth-child(24) {
    transform: rotate(285.5172413793deg);
}

.element .model .orbital .electron:nth-last-child(29):first-child~.electron:nth-child(25) {
    transform: rotate(297.9310344828deg);
}

.element .model .orbital .electron:nth-last-child(29):first-child~.electron:nth-child(26) {
    transform: rotate(310.3448275862deg);
}

.element .model .orbital .electron:nth-last-child(29):first-child~.electron:nth-child(27) {
    transform: rotate(322.7586206897deg);
}

.element .model .orbital .electron:nth-last-child(29):first-child~.electron:nth-child(28) {
    transform: rotate(335.1724137931deg);
}

.element .model .orbital .electron:nth-last-child(29):first-child~.electron:nth-child(29) {
    transform: rotate(347.5862068966deg);
}

.element .model .orbital .electron:nth-last-child(30):first-child~.electron:nth-child(1) {
    transform: rotate(0deg);
}

.element .model .orbital .electron:nth-last-child(30):first-child~.electron:nth-child(2) {
    transform: rotate(12deg);
}

.element .model .orbital .electron:nth-last-child(30):first-child~.electron:nth-child(3) {
    transform: rotate(24deg);
}

.element .model .orbital .electron:nth-last-child(30):first-child~.electron:nth-child(4) {
    transform: rotate(36deg);
}

.element .model .orbital .electron:nth-last-child(30):first-child~.electron:nth-child(5) {
    transform: rotate(48deg);
}

.element .model .orbital .electron:nth-last-child(30):first-child~.electron:nth-child(6) {
    transform: rotate(60deg);
}

.element .model .orbital .electron:nth-last-child(30):first-child~.electron:nth-child(7) {
    transform: rotate(72deg);
}

.element .model .orbital .electron:nth-last-child(30):first-child~.electron:nth-child(8) {
    transform: rotate(84deg);
}

.element .model .orbital .electron:nth-last-child(30):first-child~.electron:nth-child(9) {
    transform: rotate(96deg);
}

.element .model .orbital .electron:nth-last-child(30):first-child~.electron:nth-child(10) {
    transform: rotate(108deg);
}

.element .model .orbital .electron:nth-last-child(30):first-child~.electron:nth-child(11) {
    transform: rotate(120deg);
}

.element .model .orbital .electron:nth-last-child(30):first-child~.electron:nth-child(12) {
    transform: rotate(132deg);
}

.element .model .orbital .electron:nth-last-child(30):first-child~.electron:nth-child(13) {
    transform: rotate(144deg);
}

.element .model .orbital .electron:nth-last-child(30):first-child~.electron:nth-child(14) {
    transform: rotate(156deg);
}

.element .model .orbital .electron:nth-last-child(30):first-child~.electron:nth-child(15) {
    transform: rotate(168deg);
}

.element .model .orbital .electron:nth-last-child(30):first-child~.electron:nth-child(16) {
    transform: rotate(180deg);
}

.element .model .orbital .electron:nth-last-child(30):first-child~.electron:nth-child(17) {
    transform: rotate(192deg);
}

.element .model .orbital .electron:nth-last-child(30):first-child~.electron:nth-child(18) {
    transform: rotate(204deg);
}

.element .model .orbital .electron:nth-last-child(30):first-child~.electron:nth-child(19) {
    transform: rotate(216deg);
}

.element .model .orbital .electron:nth-last-child(30):first-child~.electron:nth-child(20) {
    transform: rotate(228deg);
}

.element .model .orbital .electron:nth-last-child(30):first-child~.electron:nth-child(21) {
    transform: rotate(240deg);
}

.element .model .orbital .electron:nth-last-child(30):first-child~.electron:nth-child(22) {
    transform: rotate(252deg);
}

.element .model .orbital .electron:nth-last-child(30):first-child~.electron:nth-child(23) {
    transform: rotate(264deg);
}

.element .model .orbital .electron:nth-last-child(30):first-child~.electron:nth-child(24) {
    transform: rotate(276deg);
}

.element .model .orbital .electron:nth-last-child(30):first-child~.electron:nth-child(25) {
    transform: rotate(288deg);
}

.element .model .orbital .electron:nth-last-child(30):first-child~.electron:nth-child(26) {
    transform: rotate(300deg);
}

.element .model .orbital .electron:nth-last-child(30):first-child~.electron:nth-child(27) {
    transform: rotate(312deg);
}

.element .model .orbital .electron:nth-last-child(30):first-child~.electron:nth-child(28) {
    transform: rotate(324deg);
}

.element .model .orbital .electron:nth-last-child(30):first-child~.electron:nth-child(29) {
    transform: rotate(336deg);
}

.element .model .orbital .electron:nth-last-child(30):first-child~.electron:nth-child(30) {
    transform: rotate(348deg);
}

.element .model .orbital .electron:nth-last-child(31):first-child~.electron:nth-child(1) {
    transform: rotate(0deg);
}

.element .model .orbital .electron:nth-last-child(31):first-child~.electron:nth-child(2) {
    transform: rotate(11.6129032258deg);
}

.element .model .orbital .electron:nth-last-child(31):first-child~.electron:nth-child(3) {
    transform: rotate(23.2258064516deg);
}

.element .model .orbital .electron:nth-last-child(31):first-child~.electron:nth-child(4) {
    transform: rotate(34.8387096774deg);
}

.element .model .orbital .electron:nth-last-child(31):first-child~.electron:nth-child(5) {
    transform: rotate(46.4516129032deg);
}

.element .model .orbital .electron:nth-last-child(31):first-child~.electron:nth-child(6) {
    transform: rotate(58.064516129deg);
}

.element .model .orbital .electron:nth-last-child(31):first-child~.electron:nth-child(7) {
    transform: rotate(69.6774193548deg);
}

.element .model .orbital .electron:nth-last-child(31):first-child~.electron:nth-child(8) {
    transform: rotate(81.2903225806deg);
}

.element .model .orbital .electron:nth-last-child(31):first-child~.electron:nth-child(9) {
    transform: rotate(92.9032258065deg);
}

.element .model .orbital .electron:nth-last-child(31):first-child~.electron:nth-child(10) {
    transform: rotate(104.5161290323deg);
}

.element .model .orbital .electron:nth-last-child(31):first-child~.electron:nth-child(11) {
    transform: rotate(116.1290322581deg);
}

.element .model .orbital .electron:nth-last-child(31):first-child~.electron:nth-child(12) {
    transform: rotate(127.7419354839deg);
}

.element .model .orbital .electron:nth-last-child(31):first-child~.electron:nth-child(13) {
    transform: rotate(139.3548387097deg);
}

.element .model .orbital .electron:nth-last-child(31):first-child~.electron:nth-child(14) {
    transform: rotate(150.9677419355deg);
}

.element .model .orbital .electron:nth-last-child(31):first-child~.electron:nth-child(15) {
    transform: rotate(162.5806451613deg);
}

.element .model .orbital .electron:nth-last-child(31):first-child~.electron:nth-child(16) {
    transform: rotate(174.1935483871deg);
}

.element .model .orbital .electron:nth-last-child(31):first-child~.electron:nth-child(17) {
    transform: rotate(185.8064516129deg);
}

.element .model .orbital .electron:nth-last-child(31):first-child~.electron:nth-child(18) {
    transform: rotate(197.4193548387deg);
}

.element .model .orbital .electron:nth-last-child(31):first-child~.electron:nth-child(19) {
    transform: rotate(209.0322580645deg);
}

.element .model .orbital .electron:nth-last-child(31):first-child~.electron:nth-child(20) {
    transform: rotate(220.6451612903deg);
}

.element .model .orbital .electron:nth-last-child(31):first-child~.electron:nth-child(21) {
    transform: rotate(232.2580645161deg);
}

.element .model .orbital .electron:nth-last-child(31):first-child~.electron:nth-child(22) {
    transform: rotate(243.8709677419deg);
}

.element .model .orbital .electron:nth-last-child(31):first-child~.electron:nth-child(23) {
    transform: rotate(255.4838709677deg);
}

.element .model .orbital .electron:nth-last-child(31):first-child~.electron:nth-child(24) {
    transform: rotate(267.0967741935deg);
}

.element .model .orbital .electron:nth-last-child(31):first-child~.electron:nth-child(25) {
    transform: rotate(278.7096774194deg);
}

.element .model .orbital .electron:nth-last-child(31):first-child~.electron:nth-child(26) {
    transform: rotate(290.3225806452deg);
}

.element .model .orbital .electron:nth-last-child(31):first-child~.electron:nth-child(27) {
    transform: rotate(301.935483871deg);
}

.element .model .orbital .electron:nth-last-child(31):first-child~.electron:nth-child(28) {
    transform: rotate(313.5483870968deg);
}

.element .model .orbital .electron:nth-last-child(31):first-child~.electron:nth-child(29) {
    transform: rotate(325.1612903226deg);
}

.element .model .orbital .electron:nth-last-child(31):first-child~.electron:nth-child(30) {
    transform: rotate(336.7741935484deg);
}

.element .model .orbital .electron:nth-last-child(31):first-child~.electron:nth-child(31) {
    transform: rotate(348.3870967742deg);
}

.element .model .orbital .electron:nth-last-child(32):first-child~.electron:nth-child(1) {
    transform: rotate(0deg);
}

.element .model .orbital .electron:nth-last-child(32):first-child~.electron:nth-child(2) {
    transform: rotate(11.25deg);
}

.element .model .orbital .electron:nth-last-child(32):first-child~.electron:nth-child(3) {
    transform: rotate(22.5deg);
}

.element .model .orbital .electron:nth-last-child(32):first-child~.electron:nth-child(4) {
    transform: rotate(33.75deg);
}

.element .model .orbital .electron:nth-last-child(32):first-child~.electron:nth-child(5) {
    transform: rotate(45deg);
}

.element .model .orbital .electron:nth-last-child(32):first-child~.electron:nth-child(6) {
    transform: rotate(56.25deg);
}

.element .model .orbital .electron:nth-last-child(32):first-child~.electron:nth-child(7) {
    transform: rotate(67.5deg);
}

.element .model .orbital .electron:nth-last-child(32):first-child~.electron:nth-child(8) {
    transform: rotate(78.75deg);
}

.element .model .orbital .electron:nth-last-child(32):first-child~.electron:nth-child(9) {
    transform: rotate(90deg);
}

.element .model .orbital .electron:nth-last-child(32):first-child~.electron:nth-child(10) {
    transform: rotate(101.25deg);
}

.element .model .orbital .electron:nth-last-child(32):first-child~.electron:nth-child(11) {
    transform: rotate(112.5deg);
}

.element .model .orbital .electron:nth-last-child(32):first-child~.electron:nth-child(12) {
    transform: rotate(123.75deg);
}

.element .model .orbital .electron:nth-last-child(32):first-child~.electron:nth-child(13) {
    transform: rotate(135deg);
}

.element .model .orbital .electron:nth-last-child(32):first-child~.electron:nth-child(14) {
    transform: rotate(146.25deg);
}

.element .model .orbital .electron:nth-last-child(32):first-child~.electron:nth-child(15) {
    transform: rotate(157.5deg);
}

.element .model .orbital .electron:nth-last-child(32):first-child~.electron:nth-child(16) {
    transform: rotate(168.75deg);
}

.element .model .orbital .electron:nth-last-child(32):first-child~.electron:nth-child(17) {
    transform: rotate(180deg);
}

.element .model .orbital .electron:nth-last-child(32):first-child~.electron:nth-child(18) {
    transform: rotate(191.25deg);
}

.element .model .orbital .electron:nth-last-child(32):first-child~.electron:nth-child(19) {
    transform: rotate(202.5deg);
}

.element .model .orbital .electron:nth-last-child(32):first-child~.electron:nth-child(20) {
    transform: rotate(213.75deg);
}

.element .model .orbital .electron:nth-last-child(32):first-child~.electron:nth-child(21) {
    transform: rotate(225deg);
}

.element .model .orbital .electron:nth-last-child(32):first-child~.electron:nth-child(22) {
    transform: rotate(236.25deg);
}

.element .model .orbital .electron:nth-last-child(32):first-child~.electron:nth-child(23) {
    transform: rotate(247.5deg);
}

.element .model .orbital .electron:nth-last-child(32):first-child~.electron:nth-child(24) {
    transform: rotate(258.75deg);
}

.element .model .orbital .electron:nth-last-child(32):first-child~.electron:nth-child(25) {
    transform: rotate(270deg);
}

.element .model .orbital .electron:nth-last-child(32):first-child~.electron:nth-child(26) {
    transform: rotate(281.25deg);
}

.element .model .orbital .electron:nth-last-child(32):first-child~.electron:nth-child(27) {
    transform: rotate(292.5deg);
}

.element .model .orbital .electron:nth-last-child(32):first-child~.electron:nth-child(28) {
    transform: rotate(303.75deg);
}

.element .model .orbital .electron:nth-last-child(32):first-child~.electron:nth-child(29) {
    transform: rotate(315deg);
}

.element .model .orbital .electron:nth-last-child(32):first-child~.electron:nth-child(30) {
    transform: rotate(326.25deg);
}

.element .model .orbital .electron:nth-last-child(32):first-child~.electron:nth-child(31) {
    transform: rotate(337.5deg);
}

.element .model .orbital .electron:nth-last-child(32):first-child~.electron:nth-child(32) {
    transform: rotate(348.75deg);
}

.element input[type="radio"] {
    -webkit-appearance: none;
    position: absolute;
    z-index: 2;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
    outline: none;
}

.element input[type="radio"].activate:hover~.square {
    z-index: 2;
    transform: scale(1.35);
    transition-delay: 0ms;
    outline: none;
    pointer-events: none;
}

.element input[type="radio"].activate:checked+input[type="radio"].deactivate {
    z-index: 3;
    pointer-events: all;
}

.element input[type="radio"].activate:checked~.overlay {
    opacity: 0.75;
}

.element input[type="radio"].activate:checked~.square {
    z-index: 3;
    transform: scale(3);
    transition-duration: 500ms, 0ms, 200ms, 200ms, 200ms, 200ms;
    transition-delay: 0ms;
    outline: none;
    cursor: auto;
}

.element input[type="radio"].activate:checked~.square .label {
    transition-duration: 500ms;
    transform: scale(0.75);
}

.element input[type="radio"].activate:checked~.square .atomic-weight {
    opacity: 1;
    transition: 500ms;
}

.element input[type="radio"].activate:checked~.square .model {
    display: block;
    animation: fade-in;
    animation-duration: 1s;
}

.element input[type="radio"].activate:checked~.square .orbital {
    animation-name: rotate;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
}

.element input[type="radio"].deactivate {
    position: fixed;
    display: block;
    z-index: 1;
    opacity: 0;
    pointer-events: none;
}

.element input[type="radio"].deactivate:checked~.square {
    z-index: 1;
}

.placeholder {
    position: relative;
    z-index: -1;
    font-size: 1vw;
    padding-bottom: 100%;
    color: #fff;
    transition: 500ms;
}

.placeholder .square {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    border: 2px solid;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    opacity: 0.5;
}

.gap {
    position: relative;
    padding-bottom: 100%;
    transition: 500ms;
}

.gap::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 0;
    width: 50%;
    height: calc(200% + 5px * 2 - 4px);
    border-width: 0 0 2px 2px;
    border-style: solid;
    margin-left: -1px;
    color: #fff;
    opacity: 0.2;
}

.alkali-metal {
    color: #ecbe59;
}

.alkaline-earth-metal {
    color: #dee955;
}

.lanthanoid {
    color: #ec77a3;
}

.actinoid {
    color: #c686cc;
}

.transition-metal {
    color: #fd8572;
}

.post-transition-metal {
    color: #4cddf3;
}

.metalloid {
    color: #3aefb6;
}

.other-nonmetal {
    color: #52ee61;
}

.noble-gas {
    color: #759fff;
}

.unknown {
    color: #cccccc;
}

.r1 {
    grid-row: 1;
}

.r2 {
    grid-row: 2;
}

.r3 {
    grid-row: 3;
}

.r4 {
    grid-row: 4;
}

.r5 {
    grid-row: 5;
}

.r6 {
    grid-row: 6;
}

.r7 {
    grid-row: 7;
}

.r8 {
    grid-row: 8;
}

.r9 {
    grid-row: 9;
}

.r10 {
    grid-row: 10;
}

.c1 {
    grid-column: 1;
}

.c2 {
    grid-column: 2;
}

.c3 {
    grid-column: 3;
}

.c4 {
    grid-column: 4;
}

.c5 {
    grid-column: 5;
}

.c6 {
    grid-column: 6;
}

.c7 {
    grid-column: 7;
}

.c8 {
    grid-column: 8;
}

.c9 {
    grid-column: 9;
}

.c10 {
    grid-column: 10;
}

.c11 {
    grid-column: 11;
}

.c12 {
    grid-column: 12;
}

.c13 {
    grid-column: 13;
}

.c14 {
    grid-column: 14;
}

.c15 {
    grid-column: 15;
}

.c16 {
    grid-column: 16;
}

.c17 {
    grid-column: 17;
}

.c18 {
    grid-column: 18;
}

.r1 input[type="radio"].activate:checked~.square {
    top: 100%;
}

.r10 input[type="radio"].activate:checked~.square {
    top: -100%;
}

.c1 input[type="radio"].activate:checked~.square {
    left: 100%;
}

.c18 input[type="radio"].activate:checked~.square {
    left: -100%;
}

@keyframes rotate {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

@keyframes fade-in {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@keyframes noise {
    0%,
    100% {
        background-position: 0 0;
    }
    10% {
        background-position: -5% -10%;
    }
    20% {
        background-position: -15% 5%;
    }
    30% {
        background-position: 7% -25%;
    }
    40% {
        background-position: 20% 25%;
    }
    50% {
        background-position: -25% 10%;
    }
    60% {
        background-position: 15% 5%;
    }
    70% {
        background-position: 0% 15%;
    }
    80% {
        background-position: 25% 35%;
    }
    90% {
        background-position: -10% 10%;
    }
}

.key {
    position: relative;
    z-index: 1;
    grid-row: 1;
    grid-column-start: 3;
    grid-column-end: 17;
    font-size: 0.8vw;
    line-height: 1.5;
    display: flex;
    align-items: center;
    pointer-events: none;
    user-select: none;
}

.key .row {
    position: relative;
    display: flex;
    width: 100%;
    justify-content: space-between;
}

.key .row label {
    opacity: 0.85;
    cursor: pointer;
    transition: 120ms;
    pointer-events: all;
}

.key .row label:hover {
    opacity: 1 !important;
}

#alkali-metals:checked~.periodic-table .element:not(.alkali-metal),
#alkaline-earth-metals:checked~.periodic-table .element:not(.alkaline-earth-metal),
#lanthanoids:checked~.periodic-table .element:not(.lanthanoid),
#actinoids:checked~.periodic-table .element:not(.actinoid),
#transition-metals:checked~.periodic-table .element:not(.transition-metal),
#post-transition-metals:checked~.periodic-table .element:not(.post-transition-metal),
#metalloids:checked~.periodic-table .element:not(.metalloid),
#other-nonmetals:checked~.periodic-table .element:not(.other-nonmetal),
#noble-gasses:checked~.periodic-table .element:not(.noble-gas),
#unknown:checked~.periodic-table .element:not(.unknown),
#alkali-metals:checked~.periodic-table .placeholder,
#alkaline-earth-metals:checked~.periodic-table .placeholder,
#lanthanoids:checked~.periodic-table .placeholder:not(.lanthanoid),
#actinoids:checked~.periodic-table .placeholder:not(.actinoid),
#transition-metals:checked~.periodic-table .placeholder,
#post-transition-metals:checked~.periodic-table .placeholder,
#metalloids:checked~.periodic-table .placeholder,
#other-nonmetals:checked~.periodic-table .placeholder,
#noble-gasses:checked~.periodic-table .placeholder,
#unknown:checked~.periodic-table .placeholder {
    opacity: 0.15;
    pointer-events: none;
}

#alkali-metals:checked~.periodic-table .key label:not(.alkali-metal),
#alkaline-earth-metals:checked~.periodic-table .key label:not(.alkaline-earth-metal),
#lanthanoids:checked~.periodic-table .key label:not(.lanthanoid),
#actinoids:checked~.periodic-table .key label:not(.actinoid),
#transition-metals:checked~.periodic-table .key label:not(.transition-metal),
#post-transition-metals:checked~.periodic-table .key label:not(.post-transition-metal),
#metalloids:checked~.periodic-table .key label:not(.metalloid),
#other-nonmetals:checked~.periodic-table .key label:not(.other-nonmetal),
#noble-gasses:checked~.periodic-table .key label:not(.noble-gas),
#unknown:checked~.periodic-table .key label:not(.unknown) {
    opacity: 0.65;
}

.category-toggle:not(#lanthanoids):not(#actinoids):checked~.periodic-table .gap {
    opacity: 0.5;
}

.category-toggle:checked~.category-cancel {
    visibility: visible;
    pointer-events: all;
    cursor: pointer;
}
