diff --git a/CSS/styles.css b/CSS/styles.css index e872696..2f01fe6 100644 --- a/CSS/styles.css +++ b/CSS/styles.css @@ -3,13 +3,14 @@ body{ margin: 0; - background: linear-gradient(90deg,rgba(63,94,251,0.7) 0%,rgba(252,70,107,0.7) 100%); + background: linear-gradient(180deg,rgba(63,94,251,0.7),rgba(252,70,107,0.7) 100%); } header{ - margin-bottom: 10vh; + margin-bottom: 20vh; } + nav{ top: 0; left: 0; @@ -29,6 +30,7 @@ nav:hover{ } + #icone{ height: 10vh; width: 10vw; @@ -41,7 +43,7 @@ main{ } #cas{ - margin-top:10% ; + box-shadow: 0 40px 60px rgba(150,0,0,0.7); height: 25%; width: 25%; @@ -71,40 +73,60 @@ p{ .img_gauche_txt_droite{ + display: flex; justify-content: space-around; - align-items: flex-end; + align-items: center; + margin-bottom: 10vh; } .img_gauche_txt_droite p{ - background-color: rgba(100,100,100,0.2); - border-radius: 10px; + background-color: rgba(250,250,250,0.2); + border-radius: 15px; + box-shadow: 15px 10px rgba(0,0,0,0.5); width: 50%; + padding: 1%; +} +.img_gauche_txt_droite p:hover{ + box-shadow: -10px -15px rgba(0,0,0,0.5); } .img_gauche_txt_droite img{border-radius: 10px;} -.img_gauche_txt_droite img:not(:hover){filter: saturate(0.2);} +.img_gauche_txt_droite img:not(:hover){ + filter: saturate(0.2); + transform: scale(0.8,0.8); + +} .img_droite_txt_gauche{ display: flex; flex-direction: row-reverse; justify-content: space-around; - align-items: flex-end; + align-items: center; + margin-bottom: 10vh; } .img_droite_txt_gauche p{ - background-color: rgba(100,100,100,0.2); - border-radius: 10px; + background-color: rgba(250,250,250,0.2); + border-radius: 15px; + padding: 1%; width: 50%; + box-shadow: 15px 10px rgba(0,0,0,0.5); } +.img_droite_txt_gauche p:hover{ + box-shadow: -15px -10px rgba(0,0,0,0.5); +} .img_droite_txt_gauche img{border-radius: 10px;} -.img_droite_txt_gauche img:not(:hover) {filter: saturate(0.2);} +.img_droite_txt_gauche img:not(:hover) { + filter: saturate(0.2); + transform: scale(0.8,0.8); +} @@ -114,6 +136,7 @@ p{ } .page{ + display: block; list-style-type: none; text-decoration: none; color: black; @@ -122,13 +145,15 @@ p{ } .page:hover{ + transform: scale(1.2,1.2); color: gold; } -footer{ + +footer{ background-color: orange; padding-bottom: 15vh; } \ No newline at end of file diff --git a/HTML/page_3.html b/HTML/page_3.html index 82d8180..e9e7265 100644 --- a/HTML/page_3.html +++ b/HTML/page_3.html @@ -1,5 +1,29 @@ - -

dd

- \ No newline at end of file + + Casino du coeur + + + + + + +
+ + + +
+ \ No newline at end of file diff --git a/img/arrow-up.svg b/img/icone/arrow-up.svg similarity index 100% rename from img/arrow-up.svg rename to img/icone/arrow-up.svg diff --git a/index.html b/index.html index 558f92c..9b97567 100644 --- a/index.html +++ b/index.html @@ -21,7 +21,7 @@