-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathtwo.html
110 lines (103 loc) · 4.13 KB
/
two.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Untitled Document</title>
<!-- Bootstrap -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.min.css">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons"
rel="stylesheet">
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">
<link href="css/bootstrap.css" rel="stylesheet">
<link href="style2.css" rel="stylesheet" type="text/css">
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<style>
.fadeRight{
position: fixed;
width: 50%;
height: 100%;
top: 0;
right: 0;
background: rgba(0,0,0,0.5)
}
.testimonials{
position: absolute;
width: 50%;
height: 100%;
top: 0;
left: 0;
background: white;
}
.testimonials .top h1{
text-transform: uppercase;
position: absolute;
top: 0.5vw;
font-weight: normal;
font-size: 1.6vw;
left: 2vw;
}
.testimonials .top p{
position: relative;
top: 5.5vw;
font-weight: normal;
font-size: 0.8vw;
left: 2vw;
width: 41vw;
}
</style>
<div class="fadeRight">
</div>
<div class="testimonials">
<div class="top">
<h1>Vos témoignages</h1>
<p>C’est vous qui en parlez le mieux !</p>
<br>
<p>Votre témoignage est précieux pour les futurs mariés. <br>
Si notre prestation vous a plu, partagez votre expérience, votre ressenti et ce qui vous a le plus touché dans notre travail en remplissant ce petit formulaire ! Merci ;)</p>
<input type="text">
<input type="text">
<input type="text">
<input type="text">
<button>Envoyer</button>
</div>
</div>
<div id="bg">
<img src="images/two.png" alt="">
</div>
<div id="content">
<div class="menu animated fadeInRight">
<p class="menu-text"><a href="menu.html">MENU</a></p><i class="material-icons">menu</i>
<div class="links">
<p class="news">News</p>
<p class="some_text">Some text</p>
<p class="contact">contact</p>
<i class="fa fa-facebook fa-1x" aria-hidden="true"></i>
<i class="fa fa-twitter fa-1x" aria-hidden="true"></i>
<i class="fa fa-pinterest fa-1x" aria-hidden="true"></i>
</div>
</div>
<div class="left">
<h1 class="animated fadeInDown">Lorem ipsum.</h1>
<p class="animated fadeInDown">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Labore, maiores, quasi, optio voluptatem in accusantium minima blanditiis incidunt itaque ex natus quidem recusandae expedita tenetur provident necessitatibus reiciendis praesentium mollitia vel fugit vero totam ea hic consequatur obcaecati suscipit eius dolore nostrum consequuntur ipsum nisi non soluta commodi quisquam iusto.</p>
<div class="buttons">
<a href="" class="b1 animated fadeInDown">Marriges</a>
<a href="" class="b2 animated fadeInDown">Potraits</a>
<a href="" class="b3 animated fadeInDown">Bebes</a>
</div>
</div>
</div>
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="js/jquery-1.11.2.min.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="js/bootstrap.js"></script>
</body>
</html>