html{ font-size: 62.5%; } body{ font-family: sans-serif; } .upper{ width: 80%; margin: auto; text-align: left; } .text p{ font-size: 1.4rem; } h2{ font-size: 2.2rem; } h3{ font-size:1.6rem; } header{ padding: 0; margin: auto; background-color: grey; overflow: auto; } .upper{ background-color: black; } img{ padding: 5px; float: left; } ul{ list-style-type: none; overflow: auto; margin: 0; padding: 0; font-size: 1.6rem; float: left; } ul li{ padding: 20px; float: left; } .upper li a{ color:white; text-decoration: none; font-size: 2rem; line-height: 270%; } .intro{ background-color: #f5f5f5; overflow: auto; padding: 40px 10px; } .intro h2{ font-size: 2.5rem; } .intro aside{ float: right; width: 55%; } .intro article{ float: left; width: 40%; } .intro img{ width: 90%; } button{ color: white; background-color: #ff8b3d; padding: 10px; border:none; font-size: 1.6rem; font-weight: 600; border-radius: 5%; } .content{ overflow: auto; padding: 40px 0; } .content h2{ padding-left: 10px; } .content_box{ float: left; padding: 10px; width: calc(33.33% - 20px); } .box content{ width: 100%; height: 200px; background-color: gray; display:inline-block; } footer{ padding: 40px 0px; margin: auto; background-color: gray; overflow: auto; color: white; font-size: 1.4rem; } footer section{ float: left; padding: 10px; width: calc(30% - 20px); } .footer{ width: calc(50% - 20px); } .socials{ width: calc(20% - 20px); } footer dl{ list-style:none; } footer dt{ font-weight: 600; } footer dd{ margin: 0; padding-bottom: 10px; } footer ul{ list-style-type: none; overflow: auto; margin: 0; padding: 0; } footer li{ padding-bottom: 15px; } footer li a{ text-decoration: none; color: white; } .copyright{ display: block; width: 80%; text-align: center; margin: auto; border: none; padding: 40px; font-size: 1.2rem; }
the css coding is good but i think you might improve in some areas like reduce the coding a bit so that it will be easy to read and easy to make chances. but i really like the coding and the color and fonts used in it