premier commit

style_2.css

@@ -0,0 +1,143 @@
+@font-face
+{
+    font-family: 'figli-ouidade';
+    src: url('polices/figli-ouidade-webfont.eot');
+    src: url('polices/figli-ouidade-webfont.eot') format('embedded-opentype'),
+         url('polices/figli-ouidade-webfont.woff') format('woff'),
+         url('polices/figli-ouidade-webfont.ttf') format('truetype'),
+         url('polices/figli-ouidade-webfont.svg') format('svg');
+    font-weight: normal;
+    font-style: normal;
+}
+
+@font-face
+{
+    font-family: 'droidsans';
+    src: url('polices/droidsans-webfont.eot');
+    src: url('polices/droidsans-webfont.eot') format('embedded-opentype'),
+         url('polices/droidsans-webfont.woff') format('woff'),
+         url('polices/droidsans-webfont.ttf') format('truetype'),
+         url('polices/droidsans-webfont.svg') format('svg');
+    font-weight: normal;
+    font-style: normal;
+}
+
+
+body {
+  display: flex;
+  flex-direction: column;
+  width: 80%;
+  position: absolute;
+  right: 0;
+  background-image: url(images/fond.png);
+  box-sizing: border-box;
+
+}
+
+
+header p {
+  font-size: 0.8em;
+}
+
+header img {
+
+  top: ;
+  right:;
+  margin: 20px;
+}
+
+
+header {
+  display: flex;
+  flex-direction: row;
+  justify-content: center;
+  font-family: figli-ouidade, sans-serif;
+  margin-left: 50px;
+  margin: 20px;
+  margin-top: 40px;
+  border-bottom: #e30613 solid 3px;
+  padding-bottom: 20px;
+  text-align: center;
+}
+
+header div {
+
+}
+h2 {
+  color: #5b2d87;
+}
+
+.bonjour {
+  display: flex;
+  font-family: droidsans, sans-serif;
+  position: relative;
+  width: 18%;
+  height: 100%;
+  background-color: #5b2d87;
+  border-radius: 20px;
+  position: fixed;
+  top: 0;
+  left: 0;
+  font-family: figli-ouidade;
+  font-size: 8vw;
+  writing-mode: vertical-lr;
+
+}
+
+/* exemple trouvé sur web pour font scaling based on container's width:
+div {
+    width: 50%;
+    border: 1px solid black;
+    margin: 20px;
+    font-size: 16px;
+    /* 100 = viewport width, as 1vw = 1/100th of that
+       So if the container is 50% of viewport (as here)
+       then factor that into how you want it to size.
+       Let's say you like 5vw if it were the whole width,
+       then for this container, size it at 2.5vw (5 * .5 [i.e. 50%])
+    font-size: 2.5vw;
+}
+*/
+
+.bonjour p {
+  position: relative;
+  margin: auto;
+  /* transform: rotateX(90deg); */
+}
+
+.contenu {
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+
+  margin-left: 50px;
+  margin-top: 40px;
+  padding: 40px;
+  font-family: droidsans;
+  box-shadow: 4px 4px 4px;
+}
+/*
+.contenu div {
+  padding: 10px;
+  flex-grow: 1;
+  flex-shrink: 1;
+  flex-basis: 0;
+}
+*/
+.contenu section {
+  flex: 1;
+  padding: 20px;
+}
+
+section ul {
+  list-style-image: url(images/O_signature_puce.png) ;
+}
+
+footer {
+  margin: 40px;
+  padding: 40px;
+}
+
+.contact {
+  text-align: center;
+}