From: Vincent Vanwaelscappel <vincent@cubedesigners.com>
Date: Wed, 22 Dec 2021 15:41:00 +0000 (+0100)
Subject: wip #4966 @0.25
X-Git-Url: http://git.cubedesigners.com/?a=commitdiff_plain;h=db8a4a6198f5da7258caf53292cc46d67c0255b8;p=Animations.git

wip #4966 @0.25
---

diff --git a/RenaultLanding/index.html b/RenaultLanding/index.html
index d87a904..3db6c43 100644
--- a/RenaultLanding/index.html
+++ b/RenaultLanding/index.html
@@ -6,21 +6,36 @@
     <title>Guide des tarifs 2021 - Renault Group</title>
     <style type="text/css">
 
+        @font-face {
+            font-family: 'NouvelR';
+            src: url('nouvelr-bold.woff2') format('woff2'),
+            url('nouvelr-bold.woff') format('woff');
+            font-weight: bold;
+            font-style: normal;
+        }
 
+        @font-face {
+            font-family: 'NouvelR';
+            src: url('nouvelr-regular.woff2') format('woff2'),
+            url('nouvelr-regular.woff') format('woff');
+            font-weight: normal;
+            font-style: normal;
+        }
 
-        *{
+        * {
             padding: 0;
             margin: 0;
             box-sizing: border-box;
         }
-        html,body{
-            min-height:100%;
-            height:100%;
+
+        html, body {
+            min-height: 100%;
+            height: 100%;
         }
 
-        header{
-            background-color:#fff;
-            height:80px;
+        header {
+            background-color: #fff;
+            height: 80px;
             position: relative;
         }
 
@@ -31,17 +46,74 @@
         }
 
         main {
-            height:calc(100% - 80px);
+            display: table;
+            height: calc(100% - 80px);
             width: 100%;
             background-color: #000;
-            color:#fff;
+            color: #fff;
             text-align: center;
             background-image: url('back.jpg');
             background-size: cover;
             background-position: 50% 50%;
+            font-family: "NouvelR", Arial, Helvetica, sans-serif;
+        }
+
+        main > div {
+            display: table-cell;
+            vertical-align: middle;
+            width: 100%;
+            height: 100%;
+        }
+
+        main h1, main h2 {
+            font-size: 60px;
+            line-height: 1.1em;
+            text-transform: uppercase;
+            text-shadow: #000 0 0 10px;
+        }
+
+        main h2 {
+            font-weight: 400;
+        }
+
+        main a {
+            display: inline-block;
+            width: 325px;
+            height: 125px;
+            background-color: #000;
+            vertical-align: top;
+            margin: 25px 25px;
+            position: relative;
+            color: #fff;
+            transition: all 150ms;
+        }
+
+
+        main a svg {
+            position: absolute;
+            transform: translate(-50%, -50%);
+            left: 50%;
+            top: 50%;
         }
-        main a svg{
-            color:#fff;
+
+        main a.dacia:hover {
+            background-color: #576045;
+        }
+
+        main a.renault:hover {
+            background-color: #fff;
+            color: #000;
+        }
+
+
+        @media screen and (max-width: 800px) {
+            main{
+                padding: 0 30px;
+            }
+            main h1, main h2 {
+                font-size: 50px;
+                margin:10px 0;
+            }
         }
     </style>
 </head>
@@ -54,22 +126,24 @@
     </svg>
 </header>
 <main>
-    <h1>Contrats de services</h1>
-    <h2>Guide des tarifs 2021</h2>
-    <a href="./renault/index.html">
-        <svg xmlns="http://www.w3.org/2000/svg" width="59.515" height="77.897" viewBox="0 0 59.515 77.897">
-            <g id="Emblem" transform="translate(0 0)">
-                <path d="M189.318,180.649,168.476,219.6h-5.949L141.7,180.649,162.528,141.7h5.949l-20.814,38.949,17.846,33.385,17.846-33.385-10.414-19.467,2.981-5.564Zm-8.93-38.949h-5.949l-20.828,38.949,13.4,25.032,2.981-5.564-10.414-19.481L177.42,147.25l17.846,33.385L174.439,219.6h5.949l20.828-38.949Z"
-                      transform="translate(-141.7 -141.7)" fill="currentColor"/>
-            </g>
-        </svg>
-    </a>
-    <a href="./dacia/index.html">
-        <svg xmlns="http://www.w3.org/2000/svg" width="210.215" height="22.909" viewBox="0 0 210.215 22.909">
-            <path d="M113.863,30.086a1.366,1.366,0,0,0-.921.524L91.1,53h11.479l11.205-11.6L125.044,53h11.579L114.784,30.61A1.366,1.366,0,0,0,113.863,30.086Zm120.247.524a1.072,1.072,0,0,0-1.842,0L210.429,53h11.479l11.206-11.6L244.369,53h11.579Zm-155.606,1a3.516,3.516,0,0,0-2.988-1.22H45.734V38.03H73.225l3.884,3.66L73.225,45.35H45.734V53H75.516a3.516,3.516,0,0,0,2.988-1.22l9.039-9.163a1.1,1.1,0,0,0,0-1.843Zm70.719,0-9.039,9.163a1.1,1.1,0,0,0,0,1.843l9.039,9.163A3.516,3.516,0,0,0,152.21,53h29.782V45.35H154.5l-3.884-3.661,3.884-3.66h27.491V30.385H152.21A3.516,3.516,0,0,0,149.222,31.605ZM194.493,53h8.341V30.385h-8.341Z"
-                  transform="translate(-45.734 -30.086)" fill="currentColor"/>
-        </svg>
-    </a>
+    <div>
+        <h1>Contrats de services</h1>
+        <h2>Guide des tarifs 2021</h2>
+        <a class="renault" href="./renault/index.html">
+            <svg xmlns="http://www.w3.org/2000/svg" width="59.515" height="77.897" viewBox="0 0 59.515 77.897">
+                <g id="Emblem" transform="translate(0 0)">
+                    <path d="M189.318,180.649,168.476,219.6h-5.949L141.7,180.649,162.528,141.7h5.949l-20.814,38.949,17.846,33.385,17.846-33.385-10.414-19.467,2.981-5.564Zm-8.93-38.949h-5.949l-20.828,38.949,13.4,25.032,2.981-5.564-10.414-19.481L177.42,147.25l17.846,33.385L174.439,219.6h5.949l20.828-38.949Z"
+                          transform="translate(-141.7 -141.7)" fill="currentColor"/>
+                </g>
+            </svg>
+        </a>
+        <a class="dacia" href="./dacia/index.html">
+            <svg xmlns="http://www.w3.org/2000/svg" width="210.215" height="22.909" viewBox="0 0 210.215 22.909">
+                <path d="M113.863,30.086a1.366,1.366,0,0,0-.921.524L91.1,53h11.479l11.205-11.6L125.044,53h11.579L114.784,30.61A1.366,1.366,0,0,0,113.863,30.086Zm120.247.524a1.072,1.072,0,0,0-1.842,0L210.429,53h11.479l11.206-11.6L244.369,53h11.579Zm-155.606,1a3.516,3.516,0,0,0-2.988-1.22H45.734V38.03H73.225l3.884,3.66L73.225,45.35H45.734V53H75.516a3.516,3.516,0,0,0,2.988-1.22l9.039-9.163a1.1,1.1,0,0,0,0-1.843Zm70.719,0-9.039,9.163a1.1,1.1,0,0,0,0,1.843l9.039,9.163A3.516,3.516,0,0,0,152.21,53h29.782V45.35H154.5l-3.884-3.661,3.884-3.66h27.491V30.385H152.21A3.516,3.516,0,0,0,149.222,31.605ZM194.493,53h8.341V30.385h-8.341Z"
+                      transform="translate(-45.734 -30.086)" fill="currentColor"/>
+            </svg>
+        </a>
+    </div>
 </main>
 </body>
 </html>
\ No newline at end of file