| Server IP : 109.234.162.214 / Your IP : 216.73.216.222 Web Server : Apache System : Linux servd162214.srv.odns.fr 4.18.0-372.26.1.lve.1.el8.x86_64 #1 SMP Fri Sep 16 14:08:19 EDT 2022 x86_64 User : carpe ( 1178) PHP Version : 8.0.30 Disable Function : NONE MySQL : OFF | cURL : ON | WGET : ON | Perl : ON | Python : ON | Sudo : OFF | Pkexec : OFF Directory : /home/carpe/public_html/sae 202/ |
Upload File : |
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Trash²Trend</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap" rel="stylesheet">
</head>
<style>
body{
margin:0;
padding:0;
background-color:#f5efe2;
width:100%;
height:100vh;
font-family: "Inter", sans-serif;
}
#contain{
width:100%;
height:558vh;
overflow:hidden;
position:relative;
}
.form{
position:absolute;
z-index:100;
}
#form1{
width:800px;
top:-200px;
left:400px;
transform:rotate(-5deg);
}
#form2{
width:500px;
height:500px;
top:-100px;
left:1420px;
transform:rotate(-15deg);
}
#form3{
width:700px;
height:500px;
top:550px;
transform:rotate(93deg);
left:0px;
}
#form4{
width:400px;
height:500px;
top:450px;
transform:rotate(12deg);
left:1420px;
}
#form5{
width:500px;
height:500px;
top:350px;
left:800px;
transform:rotate(-8deg);
}
img{
width:100%;
height:auto;
border: 5px dashed black;
}
#cont1{
z-index:110;
width:100%;
position:absolute;
right:0;
height:auto;
display:flex;
flex-wrap:wrap;
justify-content:right;
}
#cont11{
width:80%;
height:85vh;
background:grey;
margin-top:70vh;
position:relative;
}
#absolu{
width:100%;
height:100vh;
position:absolute;
top:-50vh;
overflow:hidden;
}
#form_abs1{
background:grey;
width:100%;
height:100%;
transform:rotate(12deg);
position:absolute;
left:-140px;
bottom:-48vh;
}
#form_abs2{
background:grey;
width:150%;
height:100%;
transform:rotate(-4deg);
position:absolute;
right:-100px;
bottom:-46vh;
}
#cont12{
width:90%;
height:auto;
}
#cont121{
width:100%;
height:auto;
}
.cont1210{
width:100%;
height:25vh;
margin-top:15px;
display:flex;
flex-wrap:wrap;
justify-content:space-between;
}
.cont12101{
width:100%;
height:auto;
margin-top:15px;
display:flex;
justify-content:space-between;
}
#cont12101_cont1{
width:100%;
height:auto;
}
#cont12101_cont1_form1{
background:lightgrey;
width:100%;
height:24vh;
}
#cont12101_cont1_form2{
margin-top:22px;
background:lightgrey;
width:100%;
height:24vh;
}
#cont12101_cont2{
width:100%;
margin-left:50px;
height:50vh;
display:flex;
flex-wrap:wrap;
justify-content:space-between;
}
#cont12101_cont2_cont1{
height:100%;
width:30%;
background:lightgrey;
}
#cont12101_cont2_cont2{
height:100%;
width:68%;
}
#cont12101_cont2_cont2_form1{
width:100%;
height:47%;
display:flex;
justify-content:space-between;
}
#cont12101_cont2_cont2_form3{
background:lightgrey;
width:48%;
height:100%;
}
#cont12101_cont2_cont2_form4{
background:lightgrey;
width:49%;
height:100%;
}
#cont12101_cont2_cont2_form2{
margin-top:19px;
background:lightgrey;
width:100%;
height:49%;
}
#cont1210_form1{
background:lightgrey;
width:70%;
height:100%;
}
#cont1210_form2{
background:lightgrey;
width:28%;
height:100%;
}
#cont1210_flex1{
background:lightgrey;
width:60%;
height:100%;
}
#cont1210_flex2{
background:lightgrey;
width:38%;
height:100%;
}
#cont122{
background:grey;
width:100%;
height:25%;
display:flex;
justify-content:space-around;
align-items:center;
position:relative;
}
.cont122_cont{
width:250px;
height:300px;
}
.cont122_cont p{
padding:0;
margin:0;
margin-top:5px;
color:white;
}
.fill{
width:100%;
height:70%;
background:lightgrey;
}
#cont122_titre{
position:absolute;
top:0;
left:0;
margin:50px;
width:300px;
height:70px;
background:lightgrey;
}
#cont122_titre h2{
position:absolute;
font-size:2.5rem;
top:-4vh;
line-height:1;
}
.fill2{
width:100%;
height:70%;
display:grid;
grid-template-rows:1fr 1fr ;
grid-template-columns: 1fr 1fr ;
grid-gap:10px
}
.fill3{
background:lightgrey;
}
#button1{
width:150px;
height:50px;
background:black;
position:absolute;
top:60vh;
color:lightgrey;
display:flex;
justify-content:center;
align-items:center;
padding-left:10px;
padding-right:10px;
}
#cont123{
margin-top:50px;
width:100%;
height:80vh;
display:flex;
flex-wrap:wrap;
justify-content:center;
}
#cont123_cont1{
width:90%;
height:100%;
display:flex;
justify-content:space-between;
}
#cont123_cont1_cont1{
width:28%;
height:100%;
position:relative;
}
#cont123_cont1_cont2{
padding-right:10px;
width:auto;
height:100%;
background:green;
position:relative;
margin-right:10px;
display:flex;
align-items:flex-end;
}
#cont123_cont1_cont2 h2{
font-size:2.8rem;
margin:0;
padding:0;
display:inline-block;
}
#cont123_cont1_cont3 h2{
font-size:2.8rem;
margin:0;
padding:0;
display:inline-block;
}
#cont123_cont1_cont4 h2{
font-size:2.8rem;
margin:0;
padding:0;
display:inline-block;
}
.gallerie{
all:initial;
height:100%;
}
#cont123_cont1_cont3{
display:flex;
align-items:flex-end;
margin-right:10px;
width:auto;
padding-right:10px;
height:100%;
background:green;
position:relative;
}
#cont123_cont1_cont4{
display:flex;
align-items:flex-end;
margin-right:10px;
padding-right:10px;
width:auto;
height:100%;
background:green;
position:relative;
}
#cont123_cont1_cont1_cont1{
background:lightgrey;
width:90%;
height:10vh;
position:relative;
}
#cont123_cont1_cont1_cont1 h2{
display:inline;
width:auto;
height:auto;
font-size:2.8rem;
}
#cont123_cont1_cont1 p{
width:70%;
font-size:1.2rem;
height:auto;
}
#button2{
position:absolute;
bottom:0;
background:black;
display:flex;
justify-content:center;
width:200px;
height:10vh;
align-items:center;
}
#toi{
font-size:2rem;
color:lightgrey;
text-align:center;
}
#cont124{
margin-top:100px;
background:grey;
width:100%;
height:100vh;
display:flex;
justify-content:center;
align-items:center;
}
#cont124_cont1{
width:70%;
height:70%;
display:flex;
justify-content:center;
}
#cont124_cont1_cont1{
background:lightgrey;
position:relative;
width:70%;
height:80%;
display:flex;
justify-content:center;
align-items:center;
}
#cont124_cont1_cont2{
width:30%;
height:100%;
}
#cont124_cont1_cont2 p{
float:right;
text-align:right;
width:80%;
font-size:1.2rem;
}
#cont124_cont1_cont2_cont1{
float:right;
background:lightgrey;
width:70%;
height:8vh;
display:flex;
align-items:flex-end;
}
#cont124_cont1_cont2_cont1 h2{
font-size:2.8rem;
}
#cont124_cont1_cont1_cont1{
width:100%;
height:100%;
display:flex;
justify-content:center;
}
#cont124_cont1_cont1_cont1 form{
width:80%;
height:100%;
display : flex;
flex-direction: column;
justify-content: center;
position:relative;
}
#cont124_cont1_cont1_cont1 form div{
width:100%;
display: flex;
flex-direction: column;
margin-top:20px;
}
#cont124_cont1_cont1_cont1 form div label{
margin-bottom:10px;
}
#retour2{
height:15vh;
}
#envoyer{
border:none;
position:absolute;
bottom:-20px;
right:-120px;
width:200px;
height:40px;
background:black;
color:white;
font-size:1.6rem;
font-style:italic;
}
#absolue2{
position:absolute;
top:-20px;
left:-20px;
background:lightgrey;
height:50px;
text-align:center;
display:flex;
align-items:center;
font-size:1.8rem;
font-style:italic;
justify-content:center;
box-shadow:2px 2px 10px black;
}
@media (min-width: 601px) and (max-width: 1324px) {
}
</style>
<body>
<div id='contain'>
<?php include 'header.php'; ?>
<div class='form' id='form1'>
<img src='d3.jpg'>
</div>
<div class='form' id='form2'>
<img src='d1.jpeg'>
</div>
<div class='form' id='form3'>
<img src='d2.jpg'>
</div>
<div class='form' id='form4'>
<img src='d4.jpg'>
</div>
<div class='form' id='form5'>
<img src='d5.jpg'>
</div>
<div id='cont1'>
<div id='cont11'>
<div id='absolu'>
<div id='form_abs1'></div>
<div id='form_abs2'></div>
</div>
</div>
<div id='cont12'>
<div id='cont121'>
<div class='cont1210'>
<div id='cont1210_flex1'></div>
<div id='cont1210_flex2'></div>
</div>
<div class='cont12101'>
<div id='cont12101_cont1'>
<div id='cont12101_cont1_form1'></div>
<div id='cont12101_cont1_form2'></div>
</div>
<div id='cont12101_cont2'>
<div id='cont12101_cont2_cont1'></div>
<div id='cont12101_cont2_cont2'>
<div id='cont12101_cont2_cont2_form1'>
<div id='cont12101_cont2_cont2_form3'></div>
<div id='cont12101_cont2_cont2_form4'></div>
</div>
<div id='cont12101_cont2_cont2_form2'></div>
</div>
</div>
</div>
<div class='cont1210'>
<div id='cont1210_form1'></div>
<div id='cont1210_form2'></div>
</div>
</div>
<div id='cont122'>
<div id='cont122_titre'>
<i><h2>d'autres pistes, d'autres gens</h2></i>
</div>
<div class='cont122_cont'>
<div class='fill'></div>
<p>Marwan tes mort</p>
</div>
<div class='cont122_cont'>
<div class='fill2'>
<div class='fill3'></div>
<div class='fill3'></div>
<div class='fill3'></div>
<div class='fill3'></div>
</div>
<p>Marwan tes mort</p>
</div>
<div class='cont122_cont'>
<div class='fill'></div>
<p>Marwan tes mort</p>
</div>
<h2 id='button1'><i>Partenaires</i></h2>
</div>
<div id='cont123'>
<div id='cont123_cont1'>
<div id='cont123_cont1_cont1'>
<div id='cont123_cont1_cont1_cont1'>
<h2><i>la galerie</i></h2>
</div>
<p>Jsp parageraph etout ca tout ca jai la flemme de ce site de merde sortrez moi de la la svp j e veux dormir</p>
<div id='button2'>
<h2 id='toi'><i>Visiter la galerie</i></h2>
</div>
</div>
<div id='cont123_cont1_cont2'>
<h2><i>nos affiches</i></h2>
</div>
<div id='cont123_cont1_cont3'><h2><i>shootings pics</i></h2></div>
<div id='cont123_cont1_cont4'><h2><i>le spot video</i></h2></div>
</div>
</div>
<div id='cont124'>
<div id='cont124_cont1'>
<div id='cont124_cont1_cont1'>
<div id='absolue2'>
<h2>exprimez-vous !</h2>
</div>
<div id='cont124_cont1_cont1_cont1'>
<form method='POST' action='content3.php'>
<div>
<label>nom et prenom : </label>
<input type='text' name='nom'>
</div>
<div>
<label>adresse mail : </label>
<input type='mail' name='mail'>
</div>
<div>
<label>retours / demandes : </label>
<input type='message' name='retour' id='retour2'>
</div>
<input type='submit' name='send' id='envoyer' value='Envoyer'>
</form>
</div>
</div>
<div id='cont124_cont1_cont2'>
<div id='cont124_cont1_cont2_cont1'>
<h2><i>contact</i></h2>
</div>
<p>Jsp parageraph etout ca tout ca jai la flemme de ce site de merde sortrez moi de la la svp j e veux dormir</p>
</div>
</div>
</div>
</div>
</div>
<?php include 'footer.php'; ?>
</div>
</body>
</html>