/* Main CSS */ .mainContent { padding-top: 10rem; width: 100%; height: 100vh; } .name { margin: 0 auto; width: 80%; font-size: 4rem; white-space: nowrap; text-align: center; height: 5rem; } .quickButtons { margin: 0 auto; width: 50%; display: flex; justify-content: center; } .goButton { background-color: #33353d; border: 0; margin-top: 8rem; border-radius: .3rem; color: white; border-bottom: #26282f 5px solid; padding: 2rem; font-size: 2rem; } .goButton:active { border: 0; border-top: #26282f 5px solid; } .slideUp { position: absolute; padding: .7rem; width: 4rem; height: 4rem; border-radius: 50%; border: 2px solid white; text-align: center; left: calc(50% - 2rem); top: 90vh; } .slideUp:hover { color: white!important; } /* .name:hover + #rocket { animation-name: launchRocket; animation-duration: 2.5s; animation-timing-function: ease-in-out; } @keyframes launchRocket { from {top: 100vh} to {top: -20vh} } #rocket { position: absolute; top: 100vh; z-index: -1; left: calc(50% - 7rem); width: 12rem; height: 14rem; } */ .aboutPages { height: 30vh; float: left; background-color: #33353d; width: 100%; box-shadow: 0 -1px 15px 5px hsla(0, 0%, 0%, 0.8); } .infoBlockPages { width: 50%; border-right: #454752 5px solid; display: flex; align-items: center; height: 100%; float: left; } .infoHeadPages { margin-left: 1rem; padding-right: 1rem; border-right: 5px solid white; } .infoTextPages { margin-left: 2rem; } /* About */ .about { position: relative; display: flex; justify-content: center; align-items: center; width: 100%; float: left; height: 30vh; background-color: #454752; } .infoBlockMe { padding: 1rem; text-align: center; display: inline-block; height: 10rem; width: 25rem; border-right: 4px solid white; } /* Mobile support */ @viewport { width: device-width; zoom: 1.0; } /* Support for mobile devices */ @media screen and (min-width:0px) and (max-width:1000px) { .mainContent { width: 100%!important; } svg { display: none; } .time { font-size: 4rem!important; } }