style.css

@import url('https://fonts.googleapis.com/css2?family=Roboto+Mono:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500;1,600;1,700&display=swap');*{margin: 0px; padding: 0px;}body, th, td{background-color: #080808; font-family: 'Roboto Mono', monospace; color: white;}p{color: white; text-align: justify;}.pageContainer{position: relative; min-height: 100vh;}/* CUSTOM SCROLL *//* width */::-webkit-scrollbar{width: 8px;}/* track */ ::-webkit-scrollbar-track{border-radius: 10px;}/* handle */ ::-webkit-scrollbar-thumb{background: #a10fd1; border-radius: 10px;}/* handle on hover */ ::-webkit-scrollbar-thumb:hover{background: #6e0a8f;}.grids{display: grid; grid-template-columns: 41.6625% 16.665% 41.6625%; width: 100%; height: 100%;}.box{display: flex; align-items: center; justify-content: center; color: #fff;}.prompt{position: absolute; align-items: center; justify-content: center;float: left; left: 0px; padding-left: 2%;}.pageTitle{margin-top: 0%; padding-left: 140px; text-decoration: none; list-style: none; font-family: 'Roboto Mono', monospace; font-weight: 500; font-size: 100px; line-height: 16px;}.welcome{margin: 12% 0% 0% 5%; padding-left: 140px; text-decoration: none;list-style: none; font-family: 'Roboto Mono', monospace; font-weight: lighter; font-size: 25px; line-height: 16px;}.inspired{margin: 2% 0% 0% 5%; padding-left: 140px; text-decoration: none;list-style: none; font-family: 'Roboto Mono', monospace; font-weight: lighter; font-size: 15px; line-height: 16px; color: #7a7a7a;}.inspired a{color: #a10fd1b7; cursor: crosshair; font-weight: 700;}.copyright{color: #a10fd1; font-family: 'Roboto Mono', monospace; font-style: italic; font-weight: 500; font-size: 14px; line-height: 16px; text-align: center; position: absolute; left: 0px; bottom: 0px; margin: 0px 0px 30px 30px; padding-left: 140px;}.socMed_img{position: absolute; right: 0px; bottom: 0px; margin: 0px 10px 10px 0px; padding-right: 140px;}.socMed_img a img{float: right;width: 30px;margin: 20px 35px; cursor: crosshair;}/* TOP NAV BAR */.navBar{background-color: #080808; box-shadow: #080808 0px 5px 50px 50px; width: 100%; height: 49.5px; position: fixed; transition: all 0.5s ease; z-index: 1;}.siteLogo{float: left; line-height: 55px; font-family: 'Roboto Mono', monospace; font-weight: bolder; font-size: 20px; color: #a10fd1; padding-left: 150px;}.linksContainer{padding-right: 140px;}.linksTopNav{list-style: none; float: right; line-height: 46px; font-weight: 500; transition: all 0.5s ease;}.linksTopNav a{text-decoration: none; font-family: 'Roboto Mono', monospace; font-size: 17px; color: #fafafab2; padding: 0px 20px; cursor: crosshair; transition: all 0.5s ease; font-weight: 700;}.linksTopNav a:hover{color: #a10fd1;}.linksActive{list-style: none; float: right; line-height: 46px; font-weight: 700; transition: all 0.1s ease;}.linksActive a{text-decoration: none; font-family: 'Roboto Mono', monospace; font-weight: 700; font-size: 17px; color: #a10fd1af; padding: 0px 20px; cursor: crosshair;}.linksActive a:hover{color: #a10fd1;}/* INFO CONTENT */.gridsUni{display: flex;}.boxUni1{align-items: center; justify-content: center; width: 10%;}.boxUni2{color: #fff; width: 80%;}.boxUni3{align-items: center; justify-content: center; width: 10%;}.infoContent{padding: 0px;}.infoHeader{margin-top: 49.5px; width: 100%; align-items: center; opacity: 0.5; transition: all 0.2s ease; cursor: crosshair;}.label{font-family: 'Roboto Mono', monospace; font-size: 20px; font-weight: 500; color: #7a7a7a;}.info1{font-family: 'Roboto Mono', monospace; font-weight: bolder; font-size: 100px; color: #fafafa7a; z-index: 1; transition: all .5s ease; cursor: crosshair; padding: 0px; margin: 0px;}.info2{font-family: 'Roboto Mono', monospace; font-weight: normal; font-size: 50px; color: #6e0a8f70; transition: all 0.4s ease; cursor: crosshair; padding-left: 10px;}.info1:hover{color: #fafafa00; padding-left: 10px; background-color: #6e0a8f70; -webkit-text-stroke-width: .8px; -webkit-text-stroke-color: #fafafa;}.info2:hover{border-left: solid #fafafa 3px; border-top-right-radius: 30px; color: #a10fd1; margin-left: 30px;}.spaceInfo{margin-top: 70px;}.table{padding-top: 20px;}.tableInfo{padding-left: 200px; font-size: 15px; font-weight: 300; transition: all 0.4s ease; cursor: crosshair;}.tableInfo:hover{background-color: #a10fd1; padding-left: 210px; font-style: italic;}.tableInfoMain{color: #a10fd1; padding-left: 200px; font-size: 25px; font-weight: 700; transition: all 0.4s ease; cursor: crosshair;}.tableInfoMain:hover{background-color: #fafafa; padding-left: 210px; font-style: italic;}.tableInfoTitle{color: #a10fd1; padding-left: 50px; font-size: 25px; font-weight: 700;}/* HOBBIES CONTENT */.hobbiesContent{padding: 0px;}.hobbiesHeader{padding-top: 49.5px; width: 100%; height: 100vh; transition: all 0.2s ease; cursor: crosshair; background-color: #a10fd117;}.word{padding-top: 10vh; font-size: 180px; font-weight: 700; text-align: center; color: #a10fd1;}.pro{font-size: 45px; font-weight: 300; text-align: center; color: #fafafa;}.mean{padding-top: 40px; font-size: 20px; font-weight: 500; text-align: center; color: #fafafa;}.labelHobbies{font-family: 'Roboto Mono', monospace; font-size: 20px; font-weight: 500; color: #7a7a7a;}.hobbyTxt{font-family: 'Roboto Mono', monospace; font-size: 20px; font-weight: 500; color: #fafafa; margin-left: 30px; margin-top: 3%; text-align: left;}.hobbyTxtBull{font-family: 'Roboto Mono', monospace; font-size: 20px; font-weight: 500; color: #fafafa; margin-left: 30px; margin-top: 1%;}.hobbyTxtCy{font-family: 'Roboto Mono', monospace; font-size: 20px; font-weight: 500; color: #7a7a7a; margin-left: 30px; margin-top: 1%;}.defTxt{font-family: 'Roboto Mono', monospace; font-size: 20px; font-weight: 500; color: #a10fd1;}.soloImg{display: block; margin-left: auto; margin-right: auto; width: 40%; padding: 20px 0px 0px 0px; opacity: 0.5; transition: all 0.4s ease;}.soloImg:hover{opacity: 1;}.soloImgCy{display: block; margin-left: auto; margin-right: auto; width: 60%; padding: 20px 0px 0px 0px; opacity: 0.5; transition: all 0.4s ease;}.soloImgCy:hover{opacity: 1;}.subtitle{font-family: 'Roboto Mono', monospace; font-size: 15px; font-weight: 500; color: #7a7a7a; margin: 0.5% 0%; text-align: center;}.tableVex{margin-top: 0px;}.vexContainer img{opacity: 0.5; width: 100%; outline: solid 3px #080808; outline-offset: -3px; transition: all 0.4s ease;}.vexContainer img:hover{opacity: 1;}/* SPACE BETWEEN FOOTER AND CONTENT */.space{height: 250px;}/* FOOTER */.footer{background-color: #fafafa; position: absolute; bottom: 0px; height: 100px; width: 100%;}.copyright_footer{color: #101010; font-family: 'Roboto Mono', monospace; font-style: italic; font-weight: 700; font-size: 14px; line-height: 30px; text-align: center; position: absolute; left: 0px; bottom: 0px; padding: 0px 0px 30px 30px; margin-left: 140px;}.socMed_footer{position: absolute; right: 0px; bottom: 0px; margin: 0px 10px 10px 0px; padding-right: 140px;}.socMed_footer a img{float: right;width: 30px;margin: 25px 35px; cursor: crosshair;}/* MEDIA QUERRIES */@media screen and (max-width: 950px){.prompt{justify-content: center; align-items: center; float: left; left: 0px; padding: 0px;}.pageTitle{font-size: 65px; margin-top: 0%; padding-left: 0px;}.welcome{font-size: 20px; padding-left: 0px;}.inspired{font-size: 10px; padding-left: 0px;}.copyright{font-size: 10px; position: absolute; left: 0px; bottom: 0px; padding-left: 0px; margin: 0px 0px 20px 10px;}.socMed_img{position: absolute; right: 0px; bottom: 0px; margin: 0px; padding-right: 0px;}.socMed_img a img{display: flex; float: none; width: 25px; margin: 0px 10px 20px 0px;}/* NAV BAR */ .siteLogo{display: none;}.navBar{display: flex; justify-content: center; align-items: center;}.linksContainer{padding: 0px 0px;}.linksTopNav a{font-size: 100%; padding: 0px 10px; font-weight: 500;}.linksActive a{font-size: 100%; padding: 0px 10px; font-weight: 500;}/* INFO */ .infoHeader{width: 100%; height: 300px; object-fit: cover;}.spaceInfo{margin-top: 10%;}.label{font-size: 85%;}.info1{font-size: 220%; color: #fafafa;}.info2{font-size: 120%; color: #a10fd1; padding-left: 0px;}.tableInfoMain{font-size: 90%; padding-left: 20px;}.tableInfoTitle{font-size: 90%; padding-left: 0px;}.tableInfo{font-size: 70%; padding-left: 20px;}.tableInfoMain:hover{padding-left: 25px; font-style: normal;}.tableInfo:hover{padding-left: 25px; font-style: italic;}/* HOBBIES */ .word{padding-top: 20vh; font-size: 700%;}.pro{font-size: 150%;}.mean{font-size: 100%;}.labelHobbies{font-size: 85%;}.defTxt{font-size: 85%;}.hobbyTxt{font-size: 85%;}.hobbyTxtBull{font-size: 85%;}.hobbyTxtCy{font-size: 85%;}.space{height: 30vh;}.subtitle{font-size: 65%;}.vexContainer img{outline: solid 1px #080808; outline-offset: -1px;}.tableVex{margin-top: 0px;}.soloImgCy{width: 100%;}/* FOOTER */ .footer{display: flex; justify-content: center; align-items: center; height: 20vh; padding: 0px; margin: 0px;}.copyright_footer{font-size: 70%; width: auto; position: absolute; display: flex; align-items: center; padding: 0% 0%; margin: 2% 0%; bottom: 0%; left: 50%; transform: translate(-50%, 0%);}.socMed_footer{position: static; padding: 0px; padding-bottom: 5%;}.socMed_footer a img{width: 25px; padding: 0px; margin: 0px 30px 0px 30px;}}