#body-container{width:70%;height:70%;max-width:60rem;max-height:60rem;z-index:200;display:grid;place-items:center}#line-container{width:100%;height:100%;max-width:80%;max-height:90%;z-index:8;display:grid;place-items:center}#line{display:flex;align-items:center;justify-content:space-between;width:100%}.word{color:var(--light-text);font-family:Rubik,sans-serif;transition:opacity .3s ease,color .3s ease}.dark .word{color:var(--dark-text)}.fancy{cursor:pointer;font-weight:bolder}.letter{color:var(--light-text);display:inline-block;transition:transform .35s ease,color .3s ease}.dark .letter{color:var(--dark-text)}.fancy .letter{display:inline-block;transition:transform .35s ease,color .3s ease}.dark .fancy .letter{color:var(--dark-text)}.fancy .letter{color:var(--light-text)}.dark .fancy[href*=linkedin] .letter{color:var(--dark-linkedin-color)}.dark .fancy[href*=github] .letter{color:var(--dark-github-color)}.dark .fancy[href*=mailto] .letter{color:var(--dark-email-color)}.fancy:hover .letter{transition-duration:.8s;color:var(--light-text-hover)}.dark .fancy:hover .letter{color:var(--dark-text-hover)}.fancy:hover .letter:first-child{transform:translate(-80%,60%) rotate(8deg)}.fancy:hover .letter:nth-child(2){transform:translate(-10%,60%) rotate(-6deg)}.fancy:hover .letter:nth-child(3){transform:translateY(8%) rotate(-3deg)}.fancy:hover .letter:nth-child(4){transform:translateY(-40%) rotate(-5deg)}.fancy:hover .letter:nth-child(5){transform:translateY(20%) rotate(10deg)}.fancy:hover .letter:nth-child(6){transform:translateY(15%) rotate(8deg)}.fancy:hover .letter:nth-child(7){transform:translateY(-50%) rotate(-6deg)}.fancy:hover .letter:nth-child(8){transform:translate(50%,-16%) rotate(13deg)}@media only screen and (max-width:200px){#body-container{width:100%;height:70%}.word{font-size:.6rem}}@media only screen and (min-width:200px){#body-container{height:90vw;width:90vw}.word{font-size:1.2rem}}@media only screen and (min-width:300px){#body-container{height:80vw;width:80vw}.word{font-size:1.2rem}}@media only screen and (min-width:400px){#body-container{height:70vw;width:70vw}.word{font-size:1.4rem}}@media only screen and (min-width:600px){#body-container{height:60vw;width:60vw}.word{font-size:1.7rem}}@media only screen and (min-width:800px){#body-container{height:40vw;width:40vw}.word{font-size:2rem}}@media only screen and (min-width:1000px){#body-container{height:35vw;width:35vw}.word{font-size:2rem}}