-
Notifications
You must be signed in to change notification settings - Fork 0
/
styles.css
1 lines (1 loc) · 3.92 KB
/
styles.css
1
@import url(https://fonts.googleapis.com/css?family=Alegreya+Sans+SC:100,300);@import url(https://fonts.googleapis.com/css?family=Oxygen:100,300);@import 'flexboxgrid.min.css';.indigo{background-color:#3f51b5}.indigo:hover,.indigo:active{background-color:#606fc7}.purple{background-color:#9c27b0}.purple:hover,.purple:active{background-color:#bc37d3}.blue{background-color:#2196f3}.blue:hover,.blue:active{background-color:#51adf6}.teal{background-color:#009688}.teal:hover,.teal:active{background-color:#00c9b6}.green{background-color:#4caf50}.green:hover,.green:active{background-color:#6ec071}.gray{background-color:#455a64}.gray:hover,.gray:active{background-color:#5a7582}.yellow{background-color:#cddc39}.yellow:hover,.yellow:active{background-color:#d8e464}.red{background-color:#e51c23}.red:hover,.red:active{background-color:#ea4a4f}.orange{background-color:#ff9800}.orange:hover,.orange:active{background-color:#ffad33}.light-green{background-color:#8bc34a}.light-green:hover,.light-green:active{background-color:#a4d070}.lime{background-color:#cddc39}.lime:hover,.lime:active{background-color:#d8e464}.amber{background-color:#ffc107}.amber:hover,.amber:active{background-color:#ffce3a}.pink{background-color:#e91e63}.pink:hover,.pink:active{background-color:#ee4c83}.cyan{background-color:#00bcd4}.cyan:hover,.cyan:active{background-color:#08e3ff}.deep-orange{background-color:#ff5722}.deep-orange:hover,.deep-orange:active{background-color:#ff7e55}*{margin:0;padding:0;box-sizing:border-box}body{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;min-height:100vh;padding:0 1rem}a{text-decoration:none;outline:none}h1,h3{font-family:'Alegreya Sans SC',sans-serif}p,input[type="email"],textarea{font-family:'Oxygen',sans-serif}.full-weight{-webkit-box-flex:1;-ms-flex:1;flex:1}.container-900{max-width:900px;margin:0 auto}.row{margin-left:0;margin-right:0}header{margin:2rem 0;height:7em}header h1{color:rgba(0,0,0,0.54);font-size:3em}header a{color:rgba(0,0,0,0.54);font-size:1.5em;width:2em;text-align:center;line-height:2em;border-radius:1em;display:inline-block}header a:hover{color:#fff}header .icon-bird:hover{background-color:#2196f3}header .icon-medium:hover{background-color:#4caf50}header .icon-github:hover{background-color:#455a64}header .icon-bird .fa:after{content:"\f099"}header .icon-medium .fa:after{content:"\f23a"}header .icon-github .fa:after{content:"\f09b"}.about{margin:1rem 1rem 3rem 1rem}.about p{font-size:1.5em;font-weight:100;color:rgba(0,0,0,0.54)}.about a{color:rgba(0,0,0,0.74)}.cell{padding:0;height:auto;display:-webkit-box;display:-ms-flexbox;display:flex}.cell:before{content:'';display:inline-block;padding-top:100%}.cell .app{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-ms-flex:1;flex:1;margin:15%;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;border-radius:50%;color:#fff}.cell .app div{padding:0 5%}.cell .app h3{font-weight:400;font-size:2em}.cell .app p{font-size:1.2em}footer{color:rgba(0,0,0,0.54);margin:3rem 0 5rem 0}footer p{font-size:2.8em;margin:2rem}footer input[type="submit"]{display:inline-block;height:38px;padding:0 30px;color:#555;text-align:center;font-size:11px;font-weight:600;line-height:38px;letter-spacing:.1rem;text-transform:uppercase;text-decoration:none;white-space:nowrap;background-color:transparent;border-radius:4px;border:1px solid #bbb;cursor:pointer;min-width:200px}footer input[type="email"],footer textarea{height:38px;padding:6px 10px;background-color:white;border:1px solid rgba(0,0,0,0.34);border-radius:4px;box-shadow:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;padding-top:6px;padding-bottom:6px;margin:.5rem;width:100%;outline:none}footer textarea{min-height:100px}html{font-size:15px}@media (max-width:768px){html{font-size:15px}}@media (max-width:479px){html{font-size:10px}}