creation formulaire + typo + style.css

style.css

@@ -0,0 +1,212 @@
+body{
+    font-family:sans-serif;
+    background-color: whitesmoke;
+    margin: 0;
+    font-family: ;
+}
+
+@font-face{
+    font-family:police1;
+    src:url("font/Combinedd.otf");} 
+
+a:hover{
+    color: rgb(3, 3, 3);
+}
+
+ul,li{ /*les click en haut à droite*/
+    list-style-type: none;
+    font-size: 14px;
+    text-transform: uppercase;
+}
+
+
+
+h1{
+    font-size: 50px;
+    display: block;
+    margin-top: auto;
+    margin-bottom: auto;
+}
+
+
+
+
+nav{
+    flex-grow: 1;
+    text-align: center;
+    text-transform: uppercase;
+}
+
+header li{
+    margin-left: 25px;
+    margin-top: 12px;
+
+}   
+
+header{
+
+    width: 100%;
+    display: flex;
+    box-sizing: border-box; /*permet de centrer le bloc en responsive, compte les padding dans le centrage*/
+    height: 100px;
+    background-color: rgb(236, 1, 252);
+}
+
+header a{
+    text-decoration: none;
+    color: rgb(255, 255, 255);
+}
+
+header ul{
+    display: flex;
+    justify-content: flex-end;
+}
+
+
+
+
+h2{
+    text-align: center;
+    margin-top: 22px;
+    font-size: 40px;
+    color: black;
+    line-height:50px;
+    margin-bottom: 15px;
+    
+}
+
+
+
+
+#wrapper{
+    max-width: 800px;
+    margin: 0 auto; /*centrer le bloc*/
+}
+
+
+
+.flexit {
+    display: flex;
+    font-size: 17px;
+    
+}
+
+.flexit div {
+    padding:20px;
+}
+
+
+.colonne1{
+    width: 130%;
+}
+
+/* formulaire */
+
+h3{
+
+    margin-top: 22px;
+    margin-bottom: 20px;
+    font-size: 30px;
+    color: rgb(247, 3, 255);
+    font-family: monospace;
+}
+
+label{
+    font-size: 10px;
+    color: rgb(105, 104, 104);
+    text-transform: uppercase;
+    letter-spacing: 0.1em;
+    display: block;
+    margin-bottom: 18px;
+    width: 40%; 
+}
+
+input, select{
+    display: block;
+    border: 1px solid #666;
+    padding: 5px;
+    width: 100%;
+    box-sizing: border-box;
+    font-family: courier, sans-serif;
+}
+
+.bloc{
+    margin-bottom: 1em;
+    display:flex;
+}
+
+input[type='submit']{
+    width: 10em;
+    text-align: center;
+    background-color: #666;
+    color: #fff;
+    border-radius: 6px;
+    border: 0;
+    margin: 0 auto; 
+    font-size: 14px;
+    text-transform: uppercase;
+    padding: 10px 10px 10px 10px;
+    margin-top: 20px;
+}
+
+input[type='number']{
+    width: 6em;
+}
+
+
+/*traitement*/
+
+.texte {
+    margin-top: 10px;
+    margin-bottom: 20px;
+    font-size: 16px;
+    text-transform: uppercase;
+}
+
+
+
+/* max-width */
+
+@media screen and (max-width:850px){
+
+    h1{
+        font-size:40px;
+    } 
+    header li{
+        margin-top: 4px;
+        font-size: 20px;
+    }
+
+    #logo{
+        max-width: 6%
+    }
+
+    header{
+        height: 80px;
+    }
+
+
+    @media screen and (max-width:600px){
+
+        h1{
+            font-size:30px;
+        } 
+        header li{
+            margin-top: 0px;
+            font-size: 16px;
+        }
+
+        #logo{
+            max-width: 6%
+        }
+
+        header{
+            height: 60px;
+        }
+
+
+        .flexit{
+            font-size: 12px;
+        }
+
+