<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;
}
}
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>
</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