Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- /*--------------------------------------------------------------
- Typography
- --------------------------------------------------------------*/
- body {
- margin: 0;
- font-family: 'Source Sans Pro',
- 'Helvetica',
- 'Arial',
- sans-serif;
- font-size: 18px;
- line-height: 1.5;
- }
- span {
- color: orangered;
- }
- .container {
- display: flex;
- width: 500px;
- }
- .img {
- opacity: 0.6;
- }
- .title {
- width: 380px;
- background-color: rgba(255, 255, 255, 0.8);
- border-radius: 15px;
- text-align: center;
- margin: 20px 20px;
- align-self: flex-start;
- position: absolute;
- padding: 0 40px;
- line-height: 45px;
- }
- .hero {
- align-self: center;
- text-align: center;
- position: absolute;
- color: #fff;
- width: 300px;
- margin: 20px 100px;
- font-size: 80px;
- }
- .heroreward {
- align-self: flex-end;
- font-size: 40px;
- text-align: center;
- position: absolute;
- z-index: 110;
- width: 300px;
- margin: 20px 100px;
- opacity: 0;
- }
- /*
- effet de survol
- ================== */
- .img:hover {
- opacity: 1;
- z-index: 100;
- }
- .container:hover>.heroreward {
- opacity: 1;
- color: #fff;
- }
Add Comment
Please, Sign In to add comment