style.min.css

html.body{box-sizing:border-box}.container{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;min-height:100vh}.navbar{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%;margin:0;line-height:5vh;background:#ff6447;color:#fff;border-top:solid 20px purple;border-bottom:solid 20px purple;margin:auto}a:hover{background:linear-gradient(217deg,rgba(255,0,129,.8),rgba(180,95,129,0) 40.91%),linear-gradient(127deg,rgba(0,150,0,.8),rgba(0,255,0,0) 70.71%),linear-gradient(336deg,rgba(0,0,2,.8),rgba(0,0,255,0) 70.71%);line-height:60px}a{text-decoration:none;color:#fff;font-size:30px}#P{width:50%;margin-left:10px}.H{width:20%}.B{width:20%}.L{width:20%}.s1{width:100%;height:500px;border-top:solid 5px red;background:linear-gradient(217deg,rgba(255,0,0,.8),rgba(180,95,129,0) 40.91%),linear-gradient(127deg,rgba(0,150,0,.8),rgba(0,255,0,0) 70.71%),linear-gradient(336deg,rgba(0,0,2,.8),rgba(0,0,255,0) 70.71%)}.s1 p{box-sizing:border-box;color:#fff;text-align:center;font-size:28px;margin:10%}.s2{width:100%;height:200px;border-top:solid 5px red}.s3{width:100%;height:200px;border-top:solid 5px red}.f{width:100%;margin:auto;height:60px;border-top:solid 20px purple;border-bottom:solid 20px purple;line-height:100px}