/* 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; margin-top: 8rem; width: 50%; display: flex; justify-content: center; } .goButton { background-color: #33353d; border: 0; min-width: 25rem; text-align: center; cursor: pointer; border-radius: .3rem; margin: 2rem; color: white; border-bottom: #26282f 5px solid; padding: 2rem; font-size: 2rem; } .goButton:hover { color: white!important; } .goButton:active { border: 0; border-top: #26282f 5px solid; } .slideDown { position: absolute; padding: .8rem; width: 4rem; height: 4rem; border-radius: 50%; border: 2px solid white; text-align: center; left: calc(50% - 2rem); top: 85vh; } .slideDown:hover { color: white!important; } /* About Me*/ .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: 3px solid white; } /* About Website */ .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 2px solid; display: flex; align-items: center; height: 100%; float: left; } .infoHeadPages { width: 40%; margin-left: 1rem; padding-right: 1rem; border-right: 3px solid white; } .infoTextPages { margin-left: 2rem; width: 50%; } /* 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; } }