diff --git a/assets/saoult_bg_arbre_full.jpg b/assets/saoult_bg_arbre_full.jpg new file mode 100644 index 0000000..5ee329a Binary files /dev/null and b/assets/saoult_bg_arbre_full.jpg differ diff --git a/avocat/index.html b/avocat/index.html index d782adf..e49eeab 100644 --- a/avocat/index.html +++ b/avocat/index.html @@ -5,13 +5,27 @@ Avocat | Saoul Bonmonsieur + + +
+
+

Saul Bonmonsieur

+
+
+
+
+

Mon Parcours

+

+

+
+
diff --git a/css/avocat.css b/css/avocat.css new file mode 100644 index 0000000..d08e58b --- /dev/null +++ b/css/avocat.css @@ -0,0 +1,20 @@ +.avocat { + overflow: hidden; + width: 100%; + height: 30rem; + display: flex; + background-image: url("../assets/saoult_bg_arbre_full.jpg"); + background-position-y: 50%; + background-size: cover; + position: relative; +} + +.avocat-text { + flex: 1; + width: 100%; + padding: 0 0 0 2rem; + z-index: 1; + font-size: larger; + position: relative; + top: 40%; +} \ No newline at end of file diff --git a/css/base.css b/css/base.css index 84117df..99653d4 100644 --- a/css/base.css +++ b/css/base.css @@ -1,5 +1,10 @@ @import url('https://fonts.googleapis.com/css2?family=Josefin+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&family=Rubik:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap'); +@font-face { + font-family: 'Comic Sans MS'; + src: url("comic-sans-ms/comici.ttf"); + } + :root { --color-dark: #2D2424; --color-main-light: #A55540; @@ -16,11 +21,13 @@ scroll-behavior: smooth; } -*:any-link{ +*:any-link { color: var(--color-light); } -h1,h2,h3 { +h1, +h2, +h3 { font-family: "Comic Sans MS", "Comic Sans", cursive; } @@ -52,14 +59,14 @@ p { transition: all .3s ease 0s; } -.btn:hover{ +.btn:hover { transform: translateY(-3px); background-color: var(--color-light); color: var(--color-white); box-shadow: rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px; } -.black-bg{ +.black-bg { height: 100%; width: 100%; position: fixed; @@ -67,4 +74,28 @@ p { backdrop-filter: blur(4px); z-index: 99; display: none; +} + +@media screen and (min-width: 700px) { + .block { + background-color: var(--color-main-light); + width: 100%; + height: auto; + display: flex; + box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px; + position: relative; + } +} + +@media screen and (max-width: 700px) { + .block { + background-color: var(--color-main-light); + width: 100%; + height: auto; + display: flex; + box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px; + position: relative; + flex-direction: column; + overflow: clip; + } } \ No newline at end of file diff --git a/index.html b/index.html index 4d5383f..7522c28 100644 --- a/index.html +++ b/index.html @@ -42,8 +42,7 @@ les cours de M. Timètres en SVT au lycée Raymond Naves.

J’intérviens à Toulouse, Ramonville Saint-Agne et 39.01939978492492, - 125.75396209686407 + href="https://goo.gl/maps/SAbzNjLLPDPEfkj86">평양 직할시 평양 승리거리