* { margin:0; padding:0; } body { background: linear-gradient(135deg, #9f74be, #3e126b); height: 100svh; } main { background: linear-gradient(to bottom, #1e1e1e 10%, darkgoldenrod 50%, #1e1e1e 90%); border-radius: 1vw; margin-inline: 5%; margin-block: 5%; width: auto; padding-block: 2svh; padding-inline: 1vw; box-shadow: rgba(0, 0, 0, 0.7) 0 0.5svh max(1vw, 1em); @media only screen and (max-device-width: 500px) { min-height: 90svh; } @media only screen and (min-device-width: 1000px) { margin-block: 2.5% } } /* Header */ .headerBar { /*border-bottom: 2px rgb(230, 230, 230) solid;*/ margin-bottom: 20px; display: flex; background-color: rgb(84, 33, 128); } /* Navbar Links */ .navBar { margin: 2svh 1vw 2svh auto; text-align: right; } .work{ color: rgb(255, 255, 255); } .navBar ul { list-style: none; display: flex; margin-left: 100px; } .navBar a { /*border-left: 2px rgb(185, 185, 185) solid;*/ /*padding: 10px 40px;*/ padding-left:5px ;padding-right: 5px; text-decoration: none; /*color:rgb(87, 86, 86);*/ /*// original color*/ color:white; white-space: nowrap; overflow: hidden; float: right; } .navBar a:hover { background-color: rgb(209, 209, 209); } .navBar li{ margin-left: 10px; margin-right: 10px; color: rgb(255, 255, 255); } .navListLast { border-right: 2px rgb(185, 185, 185) solid; margin-right:40px; } /* Navbar Logo */ .Logo { margin-left:10px; padding: 20px; width: fit-content; } .Logo img { width: 120px; margin-left:15px; } /* Footer */ footer { margin-top:auto; display: flex; justify-content: center; background-color: rgb(84, 33, 128); /*border-top: 2px rgb(230, 230, 230) solid;*/ font-size: 1vw; } .footerBar{ text-align: left; display: flex; color: rgb(255, 255, 255); padding-left: 30px; } .footerBar ul { list-style: none; display: flex; } .copyright{ text-align: left; display: flex; } .containerFooter{ display: flex; flex-direction: row; } .leftFooter{ flex:1; color: rgb(255, 255,255); } .centerFooter{ flex: 1; color: rgb(255, 255,255); } .rightFooter{ flex:1; color: rgb(255, 255, 255); } /*CHANGES*/ .headerBar, .footerBar{ margin:0px; padding: 0px; width: 100%; }