.topnav,.topnav a{text-align:center}.button,.topnav a{text-decoration:none}.topnav,.topnav a:hover,body,html{background-color:#000}.everything,.homecontainer{background-image:url(images/BWbathroom.png);background-position:center;background-repeat:no-repeat;background-size:cover}body,html{height:100%;margin:0;padding:0}.everything{margin:0;padding:0 height: 100vh;width:100vw;overflow:hidden}.topnav{overflow:hidden;position:fixed;opacity:.9;z-index:3;top:0;width:100%}.grid-container,.homecontainer{height:100vh;width:100vw;margin:0}.topnav a{font-family:fresno;float:left;display:block;color:#fff;padding:10px 16px;font-size:24px;letter-spacing:1px}.menuright{float:right}a.effect-shine:hover{-webkit-mask-image:linear-gradient(-75deg,rgba(0,0,0,.6) 30%,#000 50%,rgba(0,0,0,.6) 70%);-webkit-mask-size:200%;animation:shine 2s infinite}@-webkit-keyframes shine{from{-webkit-mask-position:150%}to{-webkit-mask-position:-50%}}.active{background-color:#2F323F}.topnav .icon{display:none}@media screen and (max-width:900px){.menuright a,.topnav a:not(:first-child){display:none}.topnav a.icon{float:right;display:block}.topnav.responsive{position:relative}.topnav.responsive a.icon{position:absolute;right:0;top:0}.topnav.responsive a{float:none;display:block;text-align:left}}.homecontainer{padding:0}.grid-container{display:grid;grid-template-columns:1fr 1fr 1fr 1fr 1fr;padding:0;position:absolute}.Rtooltip,.tooltip{display:inline-block}.grid-container>div{align-self:end;border:0;padding:0;margin:0;position:relative}.grid-container img{width:19.5vw}.Rtooltip .Rtooltiptext,.tooltip .tooltiptext{width:200px;background-color:#000;border-radius:6px;padding:20px 20px 20px 30px;z-index:1;font-family:adelle,serif;font-size:14px;color:#fff;text-align:left}.tooltip{position:relative}.tooltip .tooltiptext{visibility:hidden;position:absolute;top:-10%;left:70%}.tooltip .tooltiptext::after{content:"";position:absolute;top:50%;right:100%;margin-top:-5px;border-width:5px;border-style:solid;border-color:transparent #000 transparent transparent}.tooltip:hover .tooltiptext{visibility:visible}.Rtooltip{position:relative;border-bottom:1px dotted #000}.Rtooltip .Rtooltiptext{visibility:hidden;position:absolute;top:15%;right:70%}.zoom,h3{padding:0}.Rtooltip .Rtooltiptext::after{content:"";position:absolute;top:50%;left:100%;margin-top:-5px;border-width:5px;border-style:solid;border-color:transparent transparent transparent #000}.Rtooltip:hover .Rtooltiptext{visibility:visible}h3{text-align:left;font-size:20px;color:#fff;font-family:fresno,sans-serif;letter-spacing:1.75px;margin:3px}.zoom{transition:transform .4s;margin:0}.zoom:hover{-ms-transform:scale(1.2);-webkit-transform:scale(1.2);transform:scale(1.2)}.holder{margin:6em auto 3em;display:block;width:700px;background-color:#fff;padding:40px 20px 80px;border-radius:10px}.container,.elements,.table{display:inline-block}p{text-align:left;margin:0;font-size:16px;font-family:adelle,serif}.para{margin:0 60px}h1{text-align:center;font-size:80px;color:#000;padding:0;margin:20px;font-family:fresno,sans-serif;letter-spacing:5px}h2,h4{font-size:30px;color:#000;padding:0;font-family:fresno,sans-serif}.prevnext,h2,h4{letter-spacing:1.75px}h2{text-align:left;margin:20px 60px}h4,h5{text-align:center}h4{margin:0 0 .5em}h5{margin:0;font-size:18px;font-weight:400;font-family:adelle,serif;color:#FD6740}.elementscontainer{margin:30px;text-align:center}.atomno,.elementinfo{text-align:left;padding:0}.elements{width:100px;height:100px;border-radius:5px;background-color:#e2e0e0;margin:10px}.elementinfo{margin:0}.atomno{margin:5px 0 0 5px}.atom,.atomname{text-align:center;margin:0;padding:0}.atom{font-size:30px;font-weight:700}.atomname{font-size:10px}.atomweight{text-align:right;padding:0;margin:0 5px 5px 0}.tablecontainer{text-align:center;margin:30px;padding:0}table,td,th{border:1px solid #e2e0e0;border-collapse:collapse;text-align:left;margin:40px 70px;padding:3px 15px}.blackbox,.learn-container>div{text-align:center;border-radius:5px}.close-background{display:block;position:absolute;top:0;left:0;width:100%;height:100%}.prevnext{color:#000;display:flex;justify-content:space-between;margin:60px 0 0;padding:0 60px;font-family:fresno,sans-serif;font-size:20px}.prevnext a{color:grey}.blackbox{background-color:#14161F;padding:2em 0 4em;width:95vw;height:73vh;margin:4em 2.5vw 4em 0;overflow-y:scroll}#one,#three,#two{background-color:#fff}.learn{padding-left:2.5vw}.learn-container{display:flex;flex-wrap:wrap;justify-content:center;margin:0 1em}.learn-container>div{width:10em;margin:1em;font-size:30px;padding:1em}.button,.next{font-family:fresno,sans-serif;letter-spacing:1.75px;display:inline-block;font-size:20px;text-align:center}.learn-container img{width:5em;text-align:center}#three,#two{opacity:.1}.button{background-color:#EF444D;border:none;color:#fff;border-radius:5px;padding:1em 2em}.center{text-align:center}.next{margin-top:1em;border:none;color:#EE434C;border-radius:5px;padding:0;text-decoration:underline}#slideout{z-index:99;position:fixed;top:100px;left:-10px;width:45px;height:100px;padding:12px 0;text-align:center;background:#F0464C;border-radius:5px;-webkit-transition-duration:.3s;-moz-transition-duration:.3s;-o-transition-duration:.3s;transition-duration:.3s}#slideout_inner{position:fixed;top:0;left:-100vw;-webkit-transition-duration:.3s;-moz-transition-duration:.3s;-o-transition-duration:.3s;transition-duration:.3s}#slideout:hover{left:350px}#slideout:hover #slideout_inner{left:0}
