body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#000;font-family:Rockwell;margin:0}.disable-scroll{overflow-y:hidden}.loadingScreen{background-image:url(/static/media/chemistry-loading.85588e8de2a1b1fafdb4.png);background-position:50%;background-repeat:no-repeat;background-size:contain;color:#f5f5f5;font-size:8vh;height:82.5vh;text-align:center}.App{flex-direction:column;gap:2vh;margin:auto;text-align:center;width:175vh}.App,.nav{display:flex}.nav{align-items:center;color:hsla(180,9%,83%,.99);font-size:3vh;justify-content:space-around}.periodicTable{grid-gap:.75vh;display:grid;gap:.75vh;grid-template-columns:repeat(18,9vh);grid-template-rows:repeat(10,9vh);position:relative}.header{color:#f5f5f5;cursor:pointer;text-decoration:underline;text-decoration-thickness:.25vh;text-shadow:0 2px 0 #9400d3;text-underline-offset:1vh}.header:hover{text-shadow:0 0 6px #1e90ff,0 4px 0 #9400d3,2px 2px 4px #b8860b}.randomWikiElement-img,.react-icon{-webkit-animation:spin 5s linear infinite;animation:spin 5s linear infinite;border:.35vh solid transparent;border-radius:50%;height:10vh;width:10vh}.loader,.randomWikiElement{padding:1vh}.randomWikiElement-img{background:linear-gradient(#000,#000) padding-box,linear-gradient(#1e90ff,#b8860b,#9400d3) border-box;height:8.5vh;width:8.5vh}.randomWikiElement-img:hover{box-shadow:0 0 8px #9400d3,0 0 8px #1e90ff,0 0 8px #b8860b}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}.linkContainer{display:flex;height:7vh;justify-content:space-evenly;width:40vh}.linkContainer img{background:linear-gradient(#000,#000) padding-box,linear-gradient(0deg,#1e90ff,#9400d3) border-box;border:.35vh solid transparent;border-radius:50%;height:6vh;padding:.5vh;width:6vh}.linkContainer img:hover{background:linear-gradient(#000,#000) padding-box,linear-gradient(0deg,#9400d3,#1e90ff) border-box;box-shadow:0 0 6px #9400d3,0 0 6px #1e90ff,0 0 6px #b8860b}.basicInfoBox{display:grid;font-size:2.35vh;grid-column:3/span 4;grid-row:1/span 3}.basicInfo{border:.4vh solid transparent;border-radius:10%;height:27vh;margin:auto;width:27vh}.categoryBtns{font-size:1.25vh;grid-column:7/span 6;grid-row:1/span 3}.groupColor{display:flex;flex-wrap:wrap;gap:.25vh;justify-content:space-around}.categoryHolder{border-radius:1.5vh;color:var(--color);display:flex;justify-content:center;transition:all .25s ease-in-out;width:28vh;a{color:inherit;text-decoration:inherit;&:active,&:focus,&:hover,&:link,&:visited{text-decoration:none}}h2{cursor:pointer}}.categoryHolder:hover{background-color:var(--hover-background-color);color:#000}.sameCategory{align-items:center;display:flex;flex-direction:row;gap:1.5vh;height:5vh;text-transform:capitalize;white-space:nowrap;width:26vh}.colorBox{cursor:pointer;height:3vh;width:3vh}.colorBox,.elementCard{border:.25vh solid;border-radius:10%}.elementCard{background-color:initial;border-color:var(--border-color);color:var(--color);display:flex;flex-direction:column;font-size:.72vh;transition:all .25s ease-in-out;a{color:inherit;text-decoration:inherit;&:active,&:focus,&:hover,&:link,&:visited{text-decoration:none}}}.elementCard:hover{background-color:var(--hover-background-color);color:#000;cursor:pointer;-webkit-transform:scale(1.25);transform:scale(1.25)}.modalContainer{align-items:center;background-color:rgba(0,0,0,.75);display:flex;flex-direction:column;gap:3vh;height:100%;left:0;position:fixed;text-align:center;top:0;width:100%}.modalHeader{font-size:6vh;margin:2.5vh 0 0;text-transform:capitalize}.downArrow img{-webkit-animation:oscillate-Y 1s infinite alternate;animation:oscillate-Y 1s infinite alternate;border-radius:50%;height:7.5vh;width:7.5vh}@-webkit-keyframes oscillate-Y{0%{-webkit-transform:translateY(0);transform:translateY(0)}to{-webkit-transform:translateY(20px);transform:translateY(20px)}}@keyframes oscillate-Y{0%{-webkit-transform:translateY(0);transform:translateY(0)}to{-webkit-transform:translateY(20px);transform:translateY(20px)}}.carousel{flex-direction:row;justify-content:space-evenly;width:inherit}.carousel,.left,.right{align-items:center;display:flex}.left,.right{background-color:#000;border-radius:50%;cursor:pointer;height:10vh;justify-content:center;width:10vh}.modal{align-items:center;display:flex;flex-direction:column}.modalCategories,.randomWikiElementContainer{align-items:center;display:flex;flex-direction:row;gap:2.5vh}.modal,.modalCategories{background-color:#000;border-radius:10%;box-shadow:0 1px 15px 0 #f5f5f5;height:50vh;line-height:2vh;margin:auto;overflow:auto;width:50vh}.modal::-webkit-scrollbar,.modalCategories::-webkit-scrollbar{display:none}.modalCategories{height:70vh;margin:0;padding:0 3.5vh;width:120vh}.wiki-wrapper{display:flex;width:100%;a{display:contents}}.wiki{border:.4vh solid;border-radius:50%;cursor:pointer;height:6vh;margin:2vh 2vh 2vh 21.5vh;padding:.25vh;width:6vh}.left:hover,.right:hover,.wiki:hover{box-shadow:0 1px 15px 0 #f5f5f5}.close{border-radius:1vh;cursor:pointer;font-size:5vh;padding:2vh}.close:hover{background-color:var(--hover-background-color);color:#000}.scrolldown{height:3vh;margin-left:auto;width:3vh}.scrollup{margin-left:2vh;width:auto}.modal h1{font-size:9vh}.modal h3{font-size:4.5vh}.elementModal{font-size:2.25vh;line-height:normal;margin:2vh;padding:.5vh;text-align:center;width:40vh}.moreInfo{text-align:left}select{background-color:inherit;border:solid;border-color:inherit;border-radius:1vh;color:inherit;margin-left:6px}.btn{align-items:center;border:.25vh solid #fff;color:#fff;display:flex;height:3vh;justify-content:center}model-viewer{border-radius:10%;height:30vh;width:35vh}.basicInputBox{display:grid;grid-column:3/span 4;grid-row:1/span 3;transition:border-color .5s ease-in-out,-webkit-transform .5s ease-in-out;transition:transform .5s ease-in-out,border-color .5s ease-in-out;transition:transform .5s ease-in-out,border-color .5s ease-in-out,-webkit-transform .5s ease-in-out}.basicInputBox.correct{-webkit-transform:translateY(-20px);transform:translateY(-20px);.basicInput{background:none;border-color:green}}.basicInputBox.incorrect{-webkit-animation:shake .5s ease-in-out;animation:shake .5s ease-in-out;.basicInput{background:none;border-color:#b91818}}@-webkit-keyframes shake{0%{-webkit-transform:translateX(0);transform:translateX(0)}25%{-webkit-transform:translateX(-10px);transform:translateX(-10px)}50%{-webkit-transform:translateX(10px);transform:translateX(10px)}75%{-webkit-transform:translateX(-10px);transform:translateX(-10px)}to{-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes shake{0%{-webkit-transform:translateX(0);transform:translateX(0)}25%{-webkit-transform:translateX(-10px);transform:translateX(-10px)}50%{-webkit-transform:translateX(10px);transform:translateX(10px)}75%{-webkit-transform:translateX(-10px);transform:translateX(-10px)}to{-webkit-transform:translateX(0);transform:translateX(0)}}.basicInput{border:.4vh dashed #000;border-radius:10%;height:27vh;margin:auto;padding:.25vh;width:27vh}.basicInput,.basicInput button,.basicInput input{background:linear-gradient(#000,#000) padding-box,linear-gradient(#1e90ff,#b8860b,#9400d3) border-box}.basicInput button,.basicInput input{border:.25vh dashed #000;border-radius:.5vh;color:#fff;font-size:2vh;margin:.25vh auto;padding:.4vh;text-shadow:0 2px 0 #9400d3;width:80%}input:focus{outline-color:#9400d3}.basicInput input::-webkit-input-placeholder{color:#fff;text-shadow:0 2px 0 #9400d3}.basicInput input::placeholder{color:#fff;text-shadow:0 2px 0 #9400d3}input:-webkit-autofill,input:-webkit-autofill:hover{-webkit-text-fill-color:#fff;border-color:#9400d3;-webkit-box-shadow:inset 0 0 0 1000px #000000b0}.basicInput button:hover,input:hover{border-color:transparent;border-style:solid;color:#fff;cursor:pointer}form{display:flex;flex-direction:column;justify-content:space-evenly}.resetElement{background-color:initial;border:none;border-radius:1vh;color:var(--color);cursor:pointer;font-size:1vh;padding-right:1vh;position:absolute;right:0;top:.25vh}.studyCategoryHolder{border-radius:1.5vh;color:var(--color);display:flex;justify-content:center;transition:all .25s ease-in-out;width:28vh;a{color:inherit;text-decoration:inherit;&:active,&:focus,&:hover,&:link,&:visited{text-decoration:none}}h2{cursor:pointer}}.studyCategoryHolder:hover{background-color:var(--hover-background-color);color:var(--hover-color)}.sameStudyCategory{align-items:center;display:flex;flex-direction:row;gap:1.5vh;height:5vh;text-transform:capitalize;white-space:nowrap;width:26vh}.gridColorBox{border-radius:10%;border-style:var(--border-style);border-width:.25vh;cursor:pointer;height:3vh;width:3vh}.studyElementCard{border:.25vh solid;a{color:inherit;text-decoration:inherit;&:active,&:focus,&:hover,&:link,&:visited{text-decoration:none}}}.gridElement{border:.25vh dashed #fff;display:inline;a{color:inherit;text-decoration:inherit;&:active,&:focus,&:hover,&:link,&:visited{text-decoration:none}}}.gridElement,.studyElementCard{border-color:var(--border-color);border-radius:10%;color:var(--color);display:flex;flex-direction:column;font-size:.72vh;position:relative;transition:all .25s ease-in-out}.studyElementCard:hover{background-color:var(--hover-background-color);color:#000;cursor:pointer;-webkit-transform:scale(1.25);transform:scale(1.25);.resetElement{color:#000}}.popupTrigger{color:#fff;cursor:pointer;font-size:2vh;line-height:4.2;visibility:hidden}.popup .popuptext,.popupTrigger:hover{text-shadow:0 1px 0 #9400d3}.popup .popuptext{background-color:#555;border-radius:1vh;bottom:100%;color:#fff;font-size:2vh;line-height:normal;margin-left:-80px;padding:8px;position:absolute;width:160px;z-index:1}.popup .popuptext:after{border:5px solid transparent;border-top-color:#555;content:"";left:50%;margin-left:-12.5px;position:absolute;top:100%}.popup{-webkit-animation:fadeIn 1s;animation:fadeIn 1s}@-webkit-keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.message{-webkit-animation:fadeInOut 2s ease;animation:fadeInOut 2s ease}@-webkit-keyframes fadeInOut{0%{opacity:0}50%{opacity:1}to{opacity:0}}@keyframes fadeInOut{0%{opacity:0}50%{opacity:1}to{opacity:0}}.gridElement:hover .popupTrigger{visibility:visible}.showAll{background:linear-gradient(#000,#000) padding-box,linear-gradient(#1e90ff,#b8860b,#9400d3) border-box;border:.25vh dashed #000;border-radius:10%;color:#fff;cursor:pointer;font-size:2vh;grid-column:2;grid-row:1;height:9vh;text-shadow:0 2px 0 #9400d3;a{color:inherit;text-decoration:inherit;&:active,&:focus,&:hover,&:link,&:visited{text-decoration:none}}}.showAll:hover{border-color:transparent;border-style:solid;color:#fff}.hints{background:linear-gradient(#000,#000) padding-box,linear-gradient(#1e90ff,#b8860b,#9400d3) border-box;border:.4vh dashed #000;font-size:2.5vh;grid-column:13/span 4;grid-row:1;padding:1vh}.hints,.message{border-radius:1vh;color:#fff;text-shadow:0 2px 0 #9400d3}.message{font-size:2.05vh;left:22.25vh;margin-top:-4.5vh;padding:4px;position:absolute;text-align:center}
/*# sourceMappingURL=main.559ef6ec.css.map*/