.about {
padding: 5%; margin: 30px 15vw 30px 15vw; img { max-width: 500px; } h1 { text-shadow: 2px 2px black; background-color: #ff805b; color: white; padding: 5px 5px 5px 10px; -webkit-clip-path: polygon(0 0, 100% 0, 95% 100%, 0 100%); clip-path: polygon(0 0, 100% 0, 85% 100%, 0 100%); width: 90%; } h2 { text-shadow: 2px 2px black; background-color: #ff805b; color: white; padding: 5px 5px 5px 10px; -webkit-clip-path: polygon(0 0, 100% 0, 85% 100%, 0 100%); clip-path: polygon(0 0, 100% 0, 85% 100%, 0 100%); } h2.first { width: 190px; } h2.second { width: 170px; } h2.third { width: 150px; }
}
.about-container-top {
margin-top: 100px;
}
.about-container-bottom {
margin-bottom: 60px;
}
@media screen and (max-width : 1200px){
.about { margin: 20px 10vw 20px 10vw; } .about-container-top { margin-top: 100px; } .about-container-bottom { margin-bottom: 80px; }
}
@media screen and (max-width : 760px){
.about { margin: 10px 10px 10px 10px; } .about-container-top { margin-top: 80px; } h1 { font-size: 130%; } h2 { font-size: 120%; } p, ol, li { font-size: 100%; }
}