@import url(http://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400) $color: #71c341 $txtclr: #2c2928 body, html height: 100% font-size: 20px font-family: Source Sans Pro .b, .bb position: absolute width: 100% height: 100% background: url('http://i.imgur.com/kje4L5j.jpg') attachment: fixed size: cover position: center .bb background: url('http://i.imgur.com/bDBs0et.jpg') attachment: fixed size: cover position: center display: none #go position: absolute top: 30px left: 50% transform: translate(-50%, 0%) color: white border: 0 background: $color width: 100px height: 30px border-radius: 6px font-size: 1rem transition: background 0.2s ease outline: none &:hover background: lighten($color, 10) &:active background: darken($color, 10) .message position: absolute top: -200px left: 50% transform: translate(-50%, 0%) width: 300px background: white border-radius: 8px padding: 30px text-align: center font-weight: 300 color: $txtclr opacity: 0 transition: top 0.3s cubic-bezier(.31,.25,.50,1.50), opacity 0.2s ease-in-out & .check position: absolute top: 0 left: 50% transform: translate(-50%, -50%) scale(4) width: 120px height: 110px background: $color color: white font-size: 3.8rem padding-top: 10px border-radius: 50% opacity: 0 transition: transform 0.2s 0.25s cubic-bezier(.31,.25,.50,1.50), opacity 0.1s 0.25s ease-in-out & .scaledown transform: translate(-50%, -50%) scale(1) opacity: 1 & p font-size: 1.1rem margin: 25px 0px padding: 0 & p:nth-child(2) font-size: 2.3rem margin: 40px 0px 0px 0px & #ok position: relative color: white border: 0 background: $color width: 100% height: 50px border-radius: 6px font-size: 1.2rem transition: background 0.2s ease outline: none &:hover background: lighten($color, 10) &:active background: darken($color, 10) .comein top: 150px opacity: 1