7
@@ -37,41 +37,14 @@
7
-
diff --git a/image/777blanc.png b/image/777blanc.png
new file mode 100644
index 0000000..b652513
Binary files /dev/null and b/image/777blanc.png differ
diff --git a/image/Sans titre.png b/image/Sans titre.png
new file mode 100644
index 0000000..74eee59
Binary files /dev/null and b/image/Sans titre.png differ
diff --git a/image/bgcasino.jpg b/image/bgcasino.jpg
new file mode 100644
index 0000000..7450496
Binary files /dev/null and b/image/bgcasino.jpg differ
diff --git a/image/imgnoir.jpg b/image/imgnoir.jpg
new file mode 100644
index 0000000..e7fd8f7
Binary files /dev/null and b/image/imgnoir.jpg differ
diff --git a/image/imgnoirbj.png b/image/imgnoirbj.png
new file mode 100644
index 0000000..27108ae
Binary files /dev/null and b/image/imgnoirbj.png differ
diff --git a/image/imgnoirroulette.png b/image/imgnoirroulette.png
new file mode 100644
index 0000000..6b3b06e
Binary files /dev/null and b/image/imgnoirroulette.png differ
diff --git a/image/imgnoirslot.png b/image/imgnoirslot.png
new file mode 100644
index 0000000..65fdc7b
Binary files /dev/null and b/image/imgnoirslot.png differ
diff --git a/styles.css b/styles.css
index a6c6149..499d27d 100644
--- a/styles.css
+++ b/styles.css
@@ -1,14 +1,90 @@
.logo {
position:absolute;
- right: 41%
+ right: 43%
+
+
+}
+
+
+
+.img1 {
+ position: absolute;
+ z-index:1; bottom:52%; left:16%;
+ border-radius: 10px;
+ height:100px;
+ width: 200px;
+ transition: opacity linear .5s;
+
+
+}
+
+.img2 {
+ position: absolute;
+ z-index:1; bottom:52%; left:33%;
+ border-radius: 10px;
+ height:100px;
+ width: 200px;
+ transition: opacity linear .5s;
+
}
+.img3 {
+ position: absolute;
+ z-index:1; bottom:52%; left:51%;
+ border-radius: 10px;
+ height:100px;
+ width: 200px;
+ transition: opacity linear .5s;
+}
+
+.img4 {
+ position: absolute;
+ z-index:1; bottom:52%; left:69%;
+ border-radius: 10px;
+ height:100px;
+ width: 200px;
+ transition: opacity linear .5s;
+
+}
+.img1 {
+ -webkit-transition: all 0.2s;
+ -moz-transition: all 0.2s;
+ -ms-transition: all 0.2s;
+ -o-transition: all 0.2s;
+ transition: all 0.2s;
+}
+.img1:hover {
+ border : 2px solid rgba(147,112,219,0.5);
+ box-shadow:8px 8px 10px 0 rgba(147,112,219,0.5);
+}
+.img2 {
+ -webkit-transition: all 0.2s;
+ -moz-transition: all 0.2s;
+ -ms-transition: all 0.2s;
+ -o-transition: all 0.2s;
+ transition: all 0.2s;
+}
+.img2:hover {
+ border : 2px solid rgba(147,112,219,0.5);
+ box-shadow:8px 8px 10px 0 rgba(147,112,219,0.5);
+}
+.img3 {
+ -webkit-transition: all 0.2s;
+ -moz-transition: all 0.2s;
+ -ms-transition: all 0.2s;
+ -o-transition: all 0.2s;
+ transition: all 0.2s;
+}
+.img3:hover {
+ border : 2px solid rgba(147,112,219,0.5);
+ box-shadow:8px 8px 10px 0 rgba(147,112,219,0.5);
+}
.loader {
position: absolute;
@@ -125,7 +201,7 @@
.card-fan {
position: absolute;
width: 15%;
- /*transform-origin: bottom;*/
+ transform-origin: bottom;
transition: .3s linear;
}
@@ -182,222 +258,15 @@
}
-nav {
-
- width: 100%;
-
- font-size: 18px;
-
- position: sticky;
-
- top: 0;
-
-}
-
-
-
-nav > ul {
-
- display: flex;
-
- text-align: center;
-
- box-shadow: 0px 1px 2px 1px rgba(0,0,0,0.3);
-
- height: var(--hauteur-menu);
-
-}
-
-
-
-nav ul {
-
- list-style-type: none;
-
-}
-
-
-
-nav > ul > li {
-
- background-color: white;
-
- position: relative;
-
- height: 100%;
-
- flex: 1;
-
-}
-
-
-
-
-
-nav > ul > li > a {
-
- position: absolute;
-
- top: 50%;
-
- left: 50%;
-
- transform: translate(-50%, -50%);
-
-}
-
-
-
-li a {
-
- text-decoration: none;
-
- color: black;
-
-}
-
-
-
-.menu-deroulant > a:after{
-
- content: 'â¯';
-
- font-size: 15px;
-
- margin-left: 7px;
-
- display: inline-block;
-
-}
-.sous-menu {
- margin-top: var(--hauteur-menu);
- width: 100%;
-
- text-align: left;
-
- background-color: white;
-
- border-radius: 2px;
-
- overflow: hidden;
-
- max-height: 0;
-
-}
-
-
-
-.sous-menu > li > a {
-
- height: 50px;
-
- padding-left: 20px;
-
- width: 100%;
-
- align-items: center;
-
- display: flex;
-
-}
-
-
-
-nav > ul > li:hover > a{
-
- color: #F38B4A;
-
-}
-
-
-
-.sous-menu > li:hover {
-
- background-color: #F38B4A;
-
-
-
-
-
-}
-
-
-
-.sous-menu > li:hover > a {
-
- color: white;
-
-}
-
-
-
-@keyframes rotationFleche {
-
- 0% {
-
- transform: rotate(0deg);
-
- }
-
- 100%{
-
- transform: rotate(90deg);
-
- }
-
-
-
-}
-
-
-
-.menu-deroulant:hover > a:after{
-
- animation: rotationFleche 0.2s linear forwards;
-
-}
-
-
-
-@keyframes apparitionSousMenu {
-
- 0% {
-
- box-shadow: 0px 3px 3px 1px black;
-
- border-top: 3px solid black;
-
- }
-
- 30% {
-
- box-shadow: 0px 3px 3px 1px #438B97;
-
- }
-
- 100% {
-
- max-height: 50em;
-
- border-top: 3px solid #438B97;
-
- box-shadow: 0px 3px 3px 1px #438B97;
-
- }
-
-}
-.menu-deroulant:hover > .sous-menu {
- animation: apparitionSousMenu 1s forwards;
-}
diff --git a/tests.html b/tests.html
index a9aef31..71bd770 100644
--- a/tests.html
+++ b/tests.html
@@ -1,27 +1 @@
-
-
- 
- 
- 
- 
- 
-
-
+
-
-
-
-
- 