diff --git a/style.css b/style.css index c2771e7..9373bc2 100644 --- a/style.css +++ b/style.css @@ -1,14 +1,126 @@ -body{ - background-attachment:fixed; - background-image:url("fondecran.jpg"); - background-position:center; - background-repeat:no-repeat; - background-size:cover; - margin:0; -} -h1{ - text-align: center; - font-size:100px; - font-family:Arial Narrow, sans-serif; - color:white; -} +body{ + background-attachment:fixed; + background-image:url(geometric-5969508.png); + background-position:center; + background-repeat:no-repeat; + background-size:cover; + margin:0; + width: 100% ; +} + +h1{ + text-align: center; + font-size:100px; + font-family:Arial Narrow, sans-serif; + color:white; +} +* { + box-sizing: border-box; +} + +body { + height: 100vh; + display: flex; + justify-content: center; + align-items: center; +} + +.wrapper { + display: flex; + justify-content: center; +} + +.cta { + display: flex; + padding: 10px 15px; + text-decoration: none; + font-family: 'Police'; + font-size: 48px; + color: White; + font-style: italic; + background-image: url(test.PNG ); + transition: 1s; + box-shadow: 6px 6px 0 black; + transform: skewX(-15deg); +} + +.cta:focus { + outline: none; +} + +.cta:hover { + transition: 0.5s; + box-shadow: 15px 15px 0 black; +} + +.cta span:nth-child(2) { + transition: 0.5s; + margin-right: 0px; +} + +.cta:hover span:nth-child(2) { + transition: 0.5s; + margin-right: 45px; +} + + span { + transform: skewX(15deg) + } + + span:nth-child(2) { + width: 20px; + margin-left: 30px; + position: relative; + top: 12%; + } + +@font-face { + font-family: "Police"; + src: url("CASIQN__.TTF") format("woff2"); +} +#a{ + position: absolute; + top: 13%; + left:32%; + z-index:2; + font-family: 'Test'; + font-size: 158px; +} +#b{ + position: absolute; + top: 13%; + left:41%; + z-index:2; + font-family: 'Test'; + font-size: 158px; +} +#c{ + position: absolute; + top: 13%; + left:51%; + z-index:2; + font-family: 'Test'; + font-size: 158px; +} +machineasous { + + position: absolute; + top: 5%; + left:25%; + z-index: 1; +} + +regles { + position: absolute; + top: 79%; + left:26%; + + +} +lancer { + position: absolute; + top: 79%; + left:54%; + display:inline-block + +}