<html lang="en">
<head>
<meta charset="UTF-8">
- <meta name="viewport" content="width:device-width">
+ <meta name="viewport" content="width=device-width">
<title>Guide des tarifs 2021 - Renault Group</title>
- <style type="text/css">
-
+ <style>
@font-face {
font-family: 'NouvelR';
src: url('nouvelr-bold.woff2') format('woff2'),
html, body {
min-height: 100%;
height: 100%;
+ width: 100%;
}
header {
background-color: #fff;
height: 80px;
position: relative;
+ width: 100%;
}
#logo {
left: 15px;
}
+ body {
+ background-image: url('back.jpg');
+ background-size: cover;
+ background-repeat: no-repeat;
+ background-position: 50% 50%;
+ background-color: #000;
+ }
+
main {
display: table;
height: calc(100% - 80px);
width: 100%;
- background-color: #000;
color: #fff;
text-align: center;
- background-image: url('back.jpg');
- background-size: cover;
- background-position: 50% 50%;
font-family: "NouvelR", Arial, Helvetica, sans-serif;
}
text-shadow: #000 0 0 10px;
}
+ main br{
+ display: none;
+ }
+
main h2 {
font-weight: 400;
}
@media screen and (max-width: 800px) {
- main{
+ main {
padding: 0 30px;
}
+
+ main br{
+ display: initial;
+ }
+
main h1, main h2 {
font-size: 50px;
- margin:10px 0;
+ margin: 10px 0;
+ }
+
+ main a{
+ display: block;
+ width: 100%;
+ margin-left:auto;
+ margin-right: auto;
+ max-width: 325px;
+ }
+ }
+
+ @media screen and (max-width: 600px) {
+ main h1, main h2 {
+ font-size: 40px;
+ }
+
+ }
+
+
+ @media screen and (max-width: 400px) {
+ main h1, main h2 {
+ font-size: 40px;
}
}
</style>
</header>
<main>
<div>
- <h1>Contrats de services</h1>
- <h2>Guide des tarifs 2021</h2>
+ <h1>Contrats <br>de services</h1>
+ <h2>Guide des <br>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)">
projects / Animations.git / commitdiff