css-cols/public/css/demo.min.css

CSS grid.

@import"https://fonts.googleapis.com/css2?family=Lato:wght@400;900&display=swap";:root{--col-background: #001220;--margin-bottom: 3rem}body{position:relative;padding:30px 0 0 0;background-color:var(--col-background);background-image:url("data:image/svg+xml,%3Csvg id='visual' viewBox='0 0 900 600' width='900' height='600' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1'%3E%3Crect x='0' y='0' width='900' height='600' fill='%23001220'%3E%3C/rect%3E%3Cg fill='%2316132d'%3E%3Ccircle r='147' cx='435' cy='11'%3E%3C/circle%3E%3Ccircle r='65' cx='780' cy='97'%3E%3C/circle%3E%3Ccircle r='66' cx='70' cy='356'%3E%3C/circle%3E%3C/g%3E%3C/svg%3E");background-size:contain;background-position:bottom center;color:#fff;font-size:16px;font-family:"Lato",sans-serif}h1{margin-bottom:var(--margin-bottom);text-align:center;text-transform:uppercase;font-size:5rem;font-weight:bold}h2{margin-bottom:var(--margin-bottom);font-size:2rem;font-weight:bold}.footer{display:flex;align-items:flex-end;min-height:100px;padding-bottom:20px;background-image:url("data:image/svg+xml,%3Csvg id='visual' viewBox='0 0 900 100' width='900' height='100' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1'%3E%3Crect x='0' y='0' width='900' height='100' fill='%23001220'%3E%3C/rect%3E%3Cpath d='M0 21L13.7 20.7C27.3 20.3 54.7 19.7 82 20.8C109.3 22 136.7 25 163.8 26.7C191 28.3 218 28.7 245.2 30.2C272.3 31.7 299.7 34.3 327 36.7C354.3 39 381.7 41 409 37.7C436.3 34.3 463.7 25.7 491 26.2C518.3 26.7 545.7 36.3 573 36.7C600.3 37 627.7 28 654.8 26.5C682 25 709 31 736.2 33C763.3 35 790.7 33 818 31.5C845.3 30 872.7 29 886.3 28.5L900 28L900 101L886.3 101C872.7 101 845.3 101 818 101C790.7 101 763.3 101 736.2 101C709 101 682 101 654.8 101C627.7 101 600.3 101 573 101C545.7 101 518.3 101 491 101C463.7 101 436.3 101 409 101C381.7 101 354.3 101 327 101C299.7 101 272.3 101 245.2 101C218 101 191 101 163.8 101C136.7 101 109.3 101 82 101C54.7 101 27.3 101 13.7 101L0 101Z' fill='%23fa7268'%3E%3C/path%3E%3Cpath d='M0 39L13.7 40.2C27.3 41.3 54.7 43.7 82 46.7C109.3 49.7 136.7 53.3 163.8 51.5C191 49.7 218 42.3 245.2 39.7C272.3 37 299.7 39 327 42.2C354.3 45.3 381.7 49.7 409 51.5C436.3 53.3 463.7 52.7 491 51.3C518.3 50 545.7 48 573 48.2C600.3 48.3 627.7 50.7 654.8 50.7C682 50.7 709 48.3 736.2 46.3C763.3 44.3 790.7 42.7 818 42C845.3 41.3 872.7 41.7 886.3 41.8L900 42L900 101L886.3 101C872.7 101 845.3 101 818 101C790.7 101 763.3 101 736.2 101C709 101 682 101 654.8 101C627.7 101 600.3 101 573 101C545.7 101 518.3 101 491 101C463.7 101 436.3 101 409 101C381.7 101 354.3 101 327 101C299.7 101 272.3 101 245.2 101C218 101 191 101 163.8 101C136.7 101 109.3 101 82 101C54.7 101 27.3 101 13.7 101L0 101Z' fill='%23eb5967'%3E%3C/path%3E%3Cpath d='M0 76L13.7 75.5C27.3 75 54.7 74 82 73.3C109.3 72.7 136.7 72.3 163.8 71.5C191 70.7 218 69.3 245.2 69.2C272.3 69 299.7 70 327 70.7C354.3 71.3 381.7 71.7 409 71.5C436.3 71.3 463.7 70.7 491 71.3C518.3 72 545.7 74 573 73.7C600.3 73.3 627.7 70.7 654.8 67.5C682 64.3 709 60.7 736.2 61.8C763.3 63 790.7 69 818 70.5C845.3 72 872.7 69 886.3 67.5L900 66L900 101L886.3 101C872.7 101 845.3 101 818 101C790.7 101 763.3 101 736.2 101C709 101 682 101 654.8 101C627.7 101 600.3 101 573 101C545.7 101 518.3 101 491 101C463.7 101 436.3 101 409 101C381.7 101 354.3 101 327 101C299.7 101 272.3 101 245.2 101C218 101 191 101 163.8 101C136.7 101 109.3 101 82 101C54.7 101 27.3 101 13.7 101L0 101Z' fill='%23da3f67'%3E%3C/path%3E%3Cpath d='M0 71L13.7 73.2C27.3 75.3 54.7 79.7 82 82.2C109.3 84.7 136.7 85.3 163.8 83C191 80.7 218 75.3 245.2 72.8C272.3 70.3 299.7 70.7 327 72.8C354.3 75 381.7 79 409 81C436.3 83 463.7 83 491 83.5C518.3 84 545.7 85 573 85.2C600.3 85.3 627.7 84.7 654.8 83.7C682 82.7 709 81.3 736.2 79.5C763.3 77.7 790.7 75.3 818 74.3C845.3 73.3 872.7 73.7 886.3 73.8L900 74L900 101L886.3 101C872.7 101 845.3 101 818 101C790.7 101 763.3 101 736.2 101C709 101 682 101 654.8 101C627.7 101 600.3 101 573 101C545.7 101 518.3 101 491 101C463.7 101 436.3 101 409 101C381.7 101 354.3 101 327 101C299.7 101 272.3 101 245.2 101C218 101 191 101 163.8 101C136.7 101 109.3 101 82 101C54.7 101 27.3 101 13.7 101L0 101Z' fill='%23c62368'%3E%3C/path%3E%3C/svg%3E");background-repeat:no-repeat;background-size:cover;background-position:top center;text-align:center}a,a:link,a:visited{color:#fff}a:hover,a:active,a:focus{color:#00bfff}.content-align-center{display:flex;justify-content:center}.demo .cols{margin-bottom:var(--margin-bottom)}.demo .col{padding-top:20px;padding-bottom:20px;background-color:purple;background:rgba(141,5,168,.5);background:linear-gradient(180deg, rgba(141, 5, 168, 0.5) 0%, rgba(172, 48, 196, 0.5) 100%);color:#fff;border:#fff0f5 2px solid;border-radius:5px;text-align:center;font-size:1.5rem;font-weight:bold}/*# sourceMappingURL=demo.min.css.map */