retouche

CSS/accueil.css

@@ -16,30 +16,14 @@ header{
 
 }
 
-
+a{
-
+outline: none;
-#img_gauche_txt_droite{
-
-	display: flex;
-	flex-direction: row-reverse;
-	justify-content: space-around;
-	align-items: center;
-	padding-bottom: 20vh;
-
 }
 
 
 
-#img_gauche_txt_droite p{
-	background-color: rgba(250,250,250,0.2);
-	backdrop-filter: blur(10px);
-	border-radius: 30px;
-	width: 40%;
-	padding: 1%;
-}
 
-
+#img-txt div{
-#img_droite_txt_gauche{
 	display: inline-flex;
 	flex-direction: row;
 	justify-content: space-around;
@@ -48,39 +32,34 @@ header{
 }
 
 
-#img_droite_txt_gauche p{
+
-	background-color: rgba(250,250,250,0.2);
+#img-txt p{
 	backdrop-filter: blur(10px);
 	border-radius: 30px;
 	padding: 1%;
 	width: 40%;
 }
 
-
-
 .img_main{
 	backdrop-filter: blur(10px);
-	height: 22rem;
+	height: 18rem;
-	width: 35rem;
+	width: 30rem;
 	border-radius: 15px;
 	transition: transform ease 0.4s;
 	filter: saturate(0.2);
 }
 
-.img_txt:hover .img_main{
+#img-txt div:hover .img_main{
 	box-shadow: 0 40px 60px rgba(150,0,0,0.7);
 	transform: scale(1.2,1.2);
 	transition: transform ease 0.8s;
 	filter: saturate(1);
 }
 
-#img_gauche_txt_droite:not(:hover) p{
+#img-txt div:not(:hover) p{
 	background-color: rgba(150,150,150,0.4);
 }
 
-#img_droite_txt_gauche:not(:hover) p{
-	background-color: rgba(150,150,150,0.4);
-}
 
 
 
@@ -100,7 +79,7 @@ header{
 #fond_2 video{
 	margin: 1%;
 }
-#
+
 @media only screen and (max-width: 800px){
 
 	body{

CSS/partenaire.css

@@ -57,8 +57,8 @@
 }
 
 #ligne-colonne img{
-	width: 20vw;
+	width: 15vw;
-	height: 30vh;
+	height: 25vh;
 }
 #ligne-colonne ul{
 	color: black;
@@ -67,7 +67,7 @@
 }
 
 aside{
-	width: 50vw;
+	width: 40vw;
 }
 
 #btn-contact{

CSS/print.css

@@ -0,0 +1,3 @@
+nav,footer{
+	display: none;
+}

CSS/propos.css

@@ -0,0 +1,10 @@
+#cv-1-2{
+	display: flex;
+	justify-content: space-between;
+}
+
+
+#cv-1{
+	display: flex;
+	flex-direction: column;
+}

CSS/styles.css

@@ -2,13 +2,17 @@ body{
 	margin: 0;
 }
 
+p{
+	font-family:sans-serif ;
+}
+
 header{
 		margin-bottom: 10vh;
 }
 
 
-.txt_rouge{color: red;font-weight: bold;}
+.txt_rouge{color: red;}
-.txt_jaune{color: gold;font-weight: bold;}
+.txt_jaune{color: gold;}
 
 ul{
 	margin: 0;
@@ -40,8 +44,9 @@ h3{
 	font-size: 2em;
 }
 
-p {
+
-	margin: 0;
+a{
+	text-decoration: none;
 }
 
 nav{
@@ -159,6 +164,9 @@ nav li{
 
 
 main p{
+	font-weight: 100;
+	margin: 0;
+	text-align: justify;
 	font-size: 25px;
 }
 

HTML/page_4.html

@@ -4,6 +4,7 @@
 		<title> Casino du coeur </title> 
 		<meta charset="utf-8"> 
 		<link rel = "stylesheet" type = "text/css" href = "../CSS/styles.css">
+		<link rel = "stylesheet" type = "text/css" href = "../CSS/propos.css">
 		<link rel = "stylesheet" type = "text/css" href = "../CSS/print.css" media="print">
 		<meta name="keywords" content="casino">
 		<link rel = "icon" type = "/image/png" href = "../img/icon.png">
@@ -26,6 +27,25 @@
 				</nav>
 			</div>
 		</header>
+		<main>
+			<div id="cv-1-2">
+				<div id="cv-1">
+					<h2> NOM </h2>
+					<div class="parcours-scolaire">
+						<ul>
+							<li> BUT Informatique </li>
+							<li> Baccalauréat général </li>
+						</ul> 
+
+					</div>
+				</div>
+
+				<div id="cv-2">
+					<h2> NOM2 </h2>
+				</div>
+			</div>
+
+		</main>
 		<footer>
 
 			<div id="reseaux">

index.html

@@ -55,30 +55,39 @@
 			<h2>
 				Qui sommes-nous ?
 			</h2>
-			<div id="img_gauche_txt_droite" class="img_txt">
+			<div id="img-txt">
+				<div id="img_gauche_txt_droite">
 
-				<p>
+					<p>
-					ipsum <a href="HTML/page_4.html"><span class="txt_rouge"> dolor</span></a> sit amet, consectetur adipisicing elit, sed do eiusmod
+						ipsum <a href="HTML/page_4.html"><span class="txt_rouge"> <strong>dolor</strong></span></a> sit amet, consectetur adipisicing elit, sed do eiusmod
-					tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
+						tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
-					quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
+						quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
-				</p>
+						adipisicing elit, sed do eiusmod
+						tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
+						quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
+					</p>
 					
-				<img class="img_main" src="img/casion_background.jpeg">
+					<img class="img_main" src="img/casion_background.jpeg">
 
-			</div>
+				</div>
 
-			<h2>
+				<h2>
-				Nos valeurs
+					Nos valeurs
-			</h2>
+				</h2>
-			<div id="img_droite_txt_gauche" class="img_txt">
+				<div id="img_droite_txt_gauche">
-				<p>
+					<img class="img_main" src="img/casion_background.jpeg">
-					ipsum dolor sit amet,<a href="HTML/page_3.html"><span class="txt_rouge"> dolor </span></a>adipisicing elit, sed do eiusmod
+					<p>
-					tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
+						ipsum dolor sit amet,<a href="HTML/page_3.html"><span class="txt_rouge"><strong> dolor</strong> </span></a>adipisicing elit, sed do eiusmod
-					quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
+						tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
+						quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
+						adipisicing elit, sed do eiusmod
+						tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
+						quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
 
-				</p>
+					</p>
 				
-				<img class="img_main" src="img/casion_background.jpeg">
+					
+				</div>
 			</div>
 			
 
@@ -87,7 +96,7 @@
 					Notre devise : <span class="txt_rouge">Tout</span> le monde est <span class="txt_jaune">Gagnant</span> !
 				</h3>
 			
-				<video  id="video-presentation" controls>
+				<video  id="video-presentation" controls autoplay muted loop>
 					<source src="img/video_presentation.mp4" type="video/mp4">
 				</video>