@import url(https://fonts.googleapis.com/css?family=Roboto+Mono:300,400,500,700&subset=latin-ext);@import url(https://fonts.googleapis.com/css?family=Indie+Flower);.modal-mask{position:fixed;z-index:9999;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,.5);display:table;-webkit-transition:opacity .3s ease;transition:opacity .3s ease}.modal-wrapper{display:table-cell;vertical-align:middle}.modal-container{max-width:700px;max-height:500px;margin-left:auto;margin-right:auto;border-radius:2px;-webkit-box-shadow:0 2px 8px rgba(0,0,0,.33);box-shadow:0 2px 8px rgba(0,0,0,.33);-webkit-transition:all .2s cubic-bezier(1,.53,0,.52);transition:all .2s cubic-bezier(1,.53,0,.52);color:#fff}.modal-body,.modal-container{height:100%;position:relative;padding:20px}.modal-body{width:100%;border:2px solid #fff;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-ms-flex-line-pack:end;align-content:flex-end}.modal-body .info .group_name,.modal-body .info .name_tr{font-size:2em}.modal-body .info .name_small{font-size:13em;text-align:center}.modal-body .info.small-size .name_small{font-size:9em}.modal-body .head,.modal-body .info .detail{display:-webkit-box;display:-ms-flexbox;display:flex}.modal-body .head{-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.modal-body .info .detail .number{position:absolute;right:0;bottom:0;padding:20px;background:#fff;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end;-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end;font-size:2.5em;overflow:hidden;width:170px;height:170px}.modal-body .info .detail .number:after{content:"";position:absolute;width:290px;height:125px;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);top:0;right:-2px;-webkit-box-shadow:-1px -1px 10px -2px rgba(0,0,0,.5);box-shadow:-1px -1px 10px -2px rgba(0,0,0,.5)}.modal-body .info .detail .number.color-1{color:#4bc42f}.modal-body .info .detail .number.color-1:after{background:#4bc42f}.modal-body .info .detail .number.color-2{color:#e8593d}.modal-body .info .detail .number.color-2:after{background:#e8593d}.modal-body .info .detail .number.color-3{color:#f2a000}.modal-body .info .detail .number.color-3:after{background:#f2a000}.modal-body .info .detail .number.color-4{color:#f2c201}.modal-body .info .detail .number.color-4:after{background:#f2c201}.modal-body .info .detail .number.color-5{color:#bbc42f}.modal-body .info .detail .number.color-5:after{background:#bbc42f}.modal-body .info .detail .number.color-6{color:#31bba0}.modal-body .info .detail .number.color-6:after{background:#31bba0}.modal-body .info .detail .number.color-7{color:#22b6e0}.modal-body .info .detail .number.color-7:after{background:#22b6e0}.modal-body .info .detail .number.color-8{color:#2089ff}.modal-body .info .detail .number.color-8:after{background:#2089ff}.modal-body .info .detail .number.color-9{color:#d887d9}.modal-body .info .detail .number.color-9:after{background:#d887d9}.modal-body .info .detail .number.color-10{color:#b186d9}.modal-body .info .detail .number.color-10:after{background:#b186d9}.modal-body .info.small-size .detail .number{font-size:1.9em}.modal-body .info .detail .molar{position:absolute;left:0;bottom:0;padding:20px;font-size:2.5em}.modal-body .info .detail .molar em{font-size:15px}.modal-container.color-1{background:#4bc42f}.modal-container.color-2{background:#e8593d}.modal-container.color-3{background:#f2a000}.modal-container.color-4{background:#f2c201}.modal-container.color-5{background:#bbc42f}.modal-container.color-6{background:#31bba0}.modal-container.color-7{background:#22b6e0}.modal-container.color-8{background:#2089ff}.modal-container.color-9{background:#d887d9}.modal-container.color-10{background:#b186d9}.modal-default-button{position:absolute;z-index:100;top:8px;right:8px;font-weight:700;width:34px;height:34px;font-size:20px;cursor:pointer;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;background:#fff;border-radius:50%;-webkit-box-shadow:0 0 0 6px;box-shadow:0 0 0 6px;border:none}.modal-default-button.color-1{color:#4bc42f}.modal-default-button.color-2{color:#e8593d}.modal-default-button.color-3{color:#f2a000}.modal-default-button.color-4{color:#f2c201}.modal-default-button.color-5{color:#bbc42f}.modal-default-button.color-6{color:#31bba0}.modal-default-button.color-7{color:#22b6e0}.modal-default-button.color-8{color:#2089ff}.modal-default-button.color-9{color:#d887d9}.modal-default-button.color-10{color:#b186d9}.modal-default-button:active{opacity:.5}.modal-enter,.modal-leave-active{opacity:0}.modal-enter .modal-container,.modal-leave-active .modal-container{-webkit-transform:scale(1.1);transform:scale(1.1)}.darkMode .modal-container.color-1{background:#03a9f4}.darkMode .modal-container.color-2{background:#f44336}.darkMode .modal-container.color-3{background:#ff9800}.darkMode .modal-container.color-4{background:#efbb31}.darkMode .modal-container.color-5{background:#19caa7}.darkMode .modal-container.color-6{background:#673ab7}.darkMode .modal-container.color-7{background:#f06292}.darkMode .modal-container.color-8{background:#00bcd4}.darkMode .modal-container.color-9{background:#8bc34a}.darkMode .modal-container.color-10{background:#cddc39}.darkMode .info .detail .number.color-1{color:#03a9f4}.darkMode .info .detail .number.color-1:after{background:#03a9f4}.darkMode .info .detail .number.color-2{color:#f44336}.darkMode .info .detail .number.color-2:after{background:#f44336}.darkMode .info .detail .number.color-3{color:#ff9800}.darkMode .info .detail .number.color-3:after{background:#ff9800}.darkMode .info .detail .number.color-4{color:#efbb31}.darkMode .info .detail .number.color-4:after{background:#efbb31}.darkMode .info .detail .number.color-5{color:#19caa7}.darkMode .info .detail .number.color-5:after{background:#19caa7}.darkMode .info .detail .number.color-6{color:#673ab7}.darkMode .info .detail .number.color-6:after{background:#673ab7}.darkMode .info .detail .number.color-7{color:#f06292}.darkMode .info .detail .number.color-7:after{background:#f06292}.darkMode .info .detail .number.color-8{color:#00bcd4}.darkMode .info .detail .number.color-8:after{background:#00bcd4}.darkMode .info .detail .number.color-9{color:#8bc34a}.darkMode .info .detail .number.color-9:after{background:#8bc34a}.darkMode .info .detail .number.color-10{color:#cddc39}.darkMode .info .detail .number.color-10:after{background:#cddc39}.darkMode .info.small-size .detail .number{font-size:1.9em}.darkMode .modal-default-button.color-1{color:#03a9f4}.darkMode .modal-default-button.color-2{color:#f44336}.darkMode .modal-default-button.color-3{color:#ff9800}.darkMode .modal-default-button.color-4{color:#efbb31}.darkMode .modal-default-button.color-5{color:#19caa7}.darkMode .modal-default-button.color-6{color:#673ab7}.darkMode .modal-default-button.color-7{color:#f06292}.darkMode .modal-default-button.color-8{color:#00bcd4}.darkMode .modal-default-button.color-9{color:#8bc34a}.darkMode .modal-default-button.color-10{color:#cddc39}.home{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;height:100vh;padding:20px}.elementinfo,.home{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.elementinfo{position:absolute;left:calc(((66.72vw - 10px)/18 + .46vw)*2 + .3vw);bottom:0;width:calc(((66.72vw - 10px)/18 + .46vw)*10 - .3vw);z-index:999;background:transparent;color:#000}.elementinfo.group{padding:20px}.elementinfo.group .title{font-size:2em}.elementinfo.group .title .sembol{width:100%;background:transparent}.elementinfo .title{display:-webkit-box;display:-ms-flexbox;display:flex;margin-left:1rem}.elementinfo .title .name{padding:1rem}.elementinfo .title .name h3{font-weight:500;font-size:1.5rem;line-height:1.1;margin-bottom:.7rem}.elementinfo .title .name span{opacity:.4;font-size:.9rem}.elementinfo .title .sembol{background:#35404d;color:#fff;width:5rem;height:5rem;display:-webkit-box;display:-ms-flexbox;display:flex;font-size:3vw;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.elementinfo .title .sembol.color-1{color:#4bc42f;border-bottom:.4rem solid #4bc42f}.elementinfo .title .sembol.color-2{color:#e8593d;border-bottom:.4rem solid #e8593d}.elementinfo .title .sembol.color-3{color:#f2a000;border-bottom:.4rem solid #f2a000}.elementinfo .title .sembol.color-4{color:#f2c201;border-bottom:.4rem solid #f2c201}.elementinfo .title .sembol.color-5{color:#bbc42f;border-bottom:.4rem solid #bbc42f}.elementinfo .title .sembol.color-6{color:#31bba0;border-bottom:.4rem solid #31bba0}.elementinfo .title .sembol.color-7{color:#22b6e0;border-bottom:.4rem solid #22b6e0}.elementinfo .title .sembol.color-8{color:#2089ff;border-bottom:.4rem solid #2089ff}.elementinfo .title .sembol.color-9{color:#d887d9;border-bottom:.4rem solid #d887d9}.elementinfo .title .sembol.color-10{color:#b186d9;border-bottom:.4rem solid #b186d9}.elementinfo .detail{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%;margin-top:20px}.elementinfo .detail .d__item{width:50%;padding:10px;font-weight:500}.elementinfo .detail .d__item .info{opacity:.5}.elementinfo .detail .d__item .val.color-1{color:#4bc42f}.elementinfo .detail .d__item .val.color-2{color:#e8593d}.elementinfo .detail .d__item .val.color-3{color:#f2a000}.elementinfo .detail .d__item .val.color-4{color:#f2c201}.elementinfo .detail .d__item .val.color-5{color:#bbc42f}.elementinfo .detail .d__item .val.color-6{color:#31bba0}.elementinfo .detail .d__item .val.color-7{color:#22b6e0}.elementinfo .detail .d__item .val.color-8{color:#2089ff}.elementinfo .detail .d__item .val.color-9{color:#d887d9}.elementinfo .detail .d__item .val.color-10{color:#b186d9}.periodictable{width:75vw;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;max-width:100vw;position:relative;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.periodictable.title{margin-bottom:50px;-webkit-transform:translateX(-10%);transform:translateX(-10%)}.periodictable .item,.periodictable.title{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.periodictable .item{width:calc((66.72vw - 10px)/18);height:calc((66.72vw - 10px)/18);margin:.23vw;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-shadow:0;box-shadow:0;border:0;cursor:pointer;font-size:1vw;font-weight:700;position:relative;color:#fff;-webkit-transform-origin:center;transform-origin:center;opacity:1}.periodictable .item .el_number{display:block;font-size:50%;margin-top:5px;opacity:.5}.periodictable .item.blur{opacity:.1}.description{width:100%;-ms-flex-negative:0;flex-shrink:0}.description .item{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin-bottom:10px;font-size:1vw}.description .item.blur{opacity:.5}.description .item.blur.set{text-decoration:line-through}.description .item:before{content:"";display:inline-block;width:30px;height:20px;margin-right:5px}.description .item.color-1:before{background:#4bc42f}.description .item.color-2:before{background:#e8593d}.description .item.color-3:before{background:#f2a000}.description .item.color-4:before{background:#f2c201}.description .item.color-5:before{background:#bbc42f}.description .item.color-6:before{background:#31bba0}.description .item.color-7:before{background:#22b6e0}.description .item.color-8:before{background:#2089ff}.description .item.color-9:before{background:#d887d9}.description .item.color-10:before{background:#b186d9}.periodictable .item .small{font-size:50%;opacity:.5}.periodictable .item.color-1{background:rgba(75,196,47,.9);border:1px solid #4bc42f}.periodictable .item.color-2{background:rgba(232,89,61,.9);border:1px solid #e8593d}.periodictable .item.color-3{background:rgba(242,160,0,.9);border:1px solid #f2a000}.periodictable .item.color-4{background:rgba(242,194,1,.9);border:1px solid #f2c201}.periodictable .item.color-5{background:rgba(187,196,47,.9);border:1px solid #bbc42f}.periodictable .item.color-6{background:rgba(49,187,160,.9);border:1px solid #31bba0}.periodictable .item.color-7{background:rgba(34,182,224,.9);border:1px solid #22b6e0}.periodictable .item.color-8{background:rgba(32,137,255,.9);border:1px solid #2089ff}.periodictable .item.color-9{background:rgba(216,135,217,.9);border:1px solid #d887d9}.periodictable .item.color-10{background:rgba(177,134,217,.9);border:1px solid #b186d9}.periodictable .item:hover{background:#323232!important;border-color:#000!important}.periodictable .item.second{margin-right:calc(((66.72vw - 10px)/18 + .46vw)*10 + .69vw)}.periodictable.p-footer{margin-top:20px}.periodictable.p-footer .item.x2{margin-left:calc(((66.72vw - 10px)/18 + .46vw)*2)}.periodictable.p-footer .item.x{margin-right:calc((66.72vw - 10px)/18 + .46vw)}.checkbox{width:70px;height:30px;background:#fff;border-radius:30px;position:relative;margin-bottom:10px;margin-top:20px;cursor:pointer;-webkit-transition:all .3s ease;transition:all .3s ease;color:inherit;border:1.4px solid #000}.checkbox.lang{height:70px;background:transparent;border:none}.checkbox.lang:after{display:none}.checkbox:after{content:"";display:-webkit-box;display:-ms-flexbox;display:flex;width:20px;height:20px;background:#000;position:absolute;left:5px;top:3px;border-radius:50%}.checkbox.dark-active{background:#000;border:1.4px solid #fff}.checkbox.dark-active:after{background:#fff;right:5px;left:auto}.checkbox label{position:absolute;right:calc(-100% - 10px);top:4px;font-size:13px;font-weight:600}.footer{display:-webkit-box;display:-ms-flexbox;display:flex;color:inherit;position:fixed;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:calc(25vw - 30px);height:100vh;right:0;top:0;padding:20px;-webkit-box-shadow:-2px 5px 10px rgba(0,0,0,.3);box-shadow:-2px 5px 10px rgba(0,0,0,.3)}.footer h3{font-size:2vw;line-height:50px}.footer h3:after{content:"";display:block;width:100%;height:1px;background:currentColor;opacity:.2}.footer .end{-ms-flex-negative:0;flex-shrink:0;width:100%;align-self:flex-end;display:grid;grid-template-rows:auto auto auto auto;grid-template-columns:80px auto}.footer .end .checkbox{margin:5px 0}.footer .end label{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.footer .text{font-size:15px;grid-area:1 span/2 span/2}.footer .text a{color:inherit;font-weight:700}.github{grid-area:1 span/2 span/1;width:100%}.github a{background:#323232;color:#fff;width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;padding:9px;font-size:14px;border-radius:3px;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;text-decoration:none;margin-bottom:30px;font-weight:500}.github a svg{margin-right:5px}.darkMode .periodictable .item.color-1{background:rgba(3,169,244,.25);border:1px solid #03a9f4}.darkMode .periodictable .item.color-2{background:rgba(244,67,54,.25);border:1px solid #f44336}.darkMode .periodictable .item.color-3{background:rgba(255,152,0,.25);border:1px solid #ff9800}.darkMode .periodictable .item.color-4{background:rgba(239,187,49,.25);border:1px solid #efbb31}.darkMode .periodictable .item.color-5{background:rgba(25,202,167,.25);border:1px solid #19caa7}.darkMode .periodictable .item.color-6{background:rgba(103,58,183,.25);border:1px solid #673ab7}.darkMode .periodictable .item.color-7{background:rgba(240,98,146,.25);border:1px solid #f06292}.darkMode .periodictable .item.color-8{background:rgba(0,188,212,.25);border:1px solid #00bcd4}.darkMode .periodictable .item.color-9{background:rgba(139,195,74,.25);border:1px solid #8bc34a}.darkMode .periodictable .item.color-10{background:rgba(205,220,57,.25);border:1px solid #8bc34a}.darkMode .description .item.color-1:before{background:#03a9f4}.darkMode .description .item.color-2:before{background:#f44336}.darkMode .description .item.color-3:before{background:#ff9800}.darkMode .description .item.color-4:before{background:#efbb31}.darkMode .description .item.color-5:before{background:#19caa7}.darkMode .description .item.color-6:before{background:#673ab7}.darkMode .description .item.color-7:before{background:#f06292}.darkMode .description .item.color-8:before{background:#00bcd4}.darkMode .description .item.color-9:before{background:#8bc34a}.darkMode .description .item.color-10:before{background:#cddc39}.darkMode .footer{background:#1e2f38}.darkMode .github a{background:#eee;color:#000}.darkMode .elementinfo{color:#fff}.darkMode .elementinfo .sembol.color-1{color:#03a9f4;border-bottom:.4rem solid #03a9f4}.darkMode .elementinfo .sembol.color-2{color:#f44336;border-bottom:.4rem solid #f44336}.darkMode .elementinfo .sembol.color-3{color:#ff9800;border-bottom:.4rem solid #ff9800}.darkMode .elementinfo .sembol.color-4{color:#efbb31;border-bottom:.4rem solid #efbb31}.darkMode .elementinfo .sembol.color-5{color:#19caa7;border-bottom:.4rem solid #19caa7}.darkMode .elementinfo .sembol.color-6{color:#673ab7;border-bottom:.4rem solid #673ab7}.darkMode .elementinfo .sembol.color-7{color:#f06292;border-bottom:.4rem solid #f06292}.darkMode .elementinfo .sembol.color-8{color:#00bcd4;border-bottom:.4rem solid #00bcd4}.darkMode .elementinfo .sembol.color-9{color:#8bc34a;border-bottom:.4rem solid #8bc34a}.darkMode .elementinfo .sembol.color-10{color:#cddc39;border-bottom:.4rem solid #cddc39}.darkMode .elementinfo .detail .val.color-1{color:#03a9f4}.darkMode .elementinfo .detail .val.color-2{color:#f44336}.darkMode .elementinfo .detail .val.color-3{color:#ff9800}.darkMode .elementinfo .detail .val.color-4{color:#efbb31}.darkMode .elementinfo .detail .val.color-5{color:#19caa7}.darkMode .elementinfo .detail .val.color-6{color:#673ab7}.darkMode .elementinfo .detail .val.color-7{color:#f06292}.darkMode .elementinfo .detail .val.color-8{color:#00bcd4}.darkMode .elementinfo .detail .val.color-9{color:#8bc34a}.darkMode .elementinfo .detail .val.color-10{color:#cddc39}*{-webkit-box-sizing:border-box;box-sizing:border-box;margin:0;padding:0}button:focus{outline:0}#app{font-family:Roboto Mono,monospace;background:rgba(156,39,176,.05);min-height:100vh;color:#323232}#app.darkMode{background:#192229;color:#fff}.Loading{display:-webkit-box;display:-ms-flexbox;display:flex;height:88vh;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-animation:color-change 20s infinite;animation:color-change 20s infinite;font-size:3em;font-weight:700;font-family:Indie Flower,cursive}@-webkit-keyframes color-change{0%{color:#4bc42f}10%{color:#e8593d}20%{color:#f2a000}30%{color:#f2c201}40%{color:#bbc42f}50%{color:#31bba0}60%{color:#22b6e0}70%{color:#2089ff}80%{color:#d887d9}90%{color:#b186d9}to{color:#4bc42f}}@keyframes color-change{0%{color:#4bc42f}10%{color:#e8593d}20%{color:#f2a000}30%{color:#f2c201}40%{color:#bbc42f}50%{color:#31bba0}60%{color:#22b6e0}70%{color:#2089ff}80%{color:#d887d9}90%{color:#b186d9}to{color:#4bc42f}}