@import "variables"; section { h1 { font-weight: 100; } h3 { font-weight: 300; } .linear-gradient-card-wrapper > .col { @media only screen and (max-width: 993px) { float: none; margin: 0 auto; } .linear-gradient-card { background-color: $black; color: $white; width: 100%; border-radius: 10px; padding: 25px; text-align: center; margin-bottom: 15px; -webkit-box-shadow: 0 4px 5px 0 rgba(0,0,0,0.14), 0 1px 10px 0 rgba(0,0,0,0.12), 0 2px 4px -1px rgba(0,0,0,0.3); box-shadow: 0 4px 5px 0 rgba(0,0,0,0.14), 0 1px 10px 0 rgba(0,0,0,0.12), 0 2px 4px -1px rgba(0,0,0,0.3); &.blue-gradient { background: linear-gradient(40deg, #2186f3, #01579b); } &.pink-gradient { background: linear-gradient(40deg, #ec407a, #880e4f); } &.orange-gradient { background: linear-gradient(40deg, #ff9800, #bf360c); } &.green-gradient { background: linear-gradient(40deg, #7cb342, #1b5e20); } .title { font-size: 1.75rem; display: block; } .description { display: block; } .links { margin-top: 15px; a { background-color: transparent; font-size: 26px; margin: 5px 10px; -webkit-box-shadow: 0 6px 10px 0 rgba(0,0,0,0.14), 0 1px 18px 0 rgba(0,0,0,0.12), 0 3px 5px -1px rgba(0,0,0,0.3); box-shadow: 0 6px 10px 0 rgba(0,0,0,0.14), 0 1px 18px 0 rgba(0,0,0,0.12), 0 3px 5px -1px rgba(0,0,0,0.3); &:hover { -webkit-box-shadow: 0 6px 10px 0 rgba(0,0,0,0.14), 0 1px 18px 0 rgba(0,0,0,0.12), 0 3px 5px -1px rgba(0,0,0,0.3); box-shadow: 0 6px 10px 0 rgba(0,0,0,0.14), 0 1px 18px 0 rgba(0,0,0,0.12), 0 3px 5px -1px rgba(0,0,0,0.3); } } } } } }