-
Notifications
You must be signed in to change notification settings - Fork 1
/
style.css
208 lines (205 loc) · 7.38 KB
/
style.css
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
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
.section1{
height:700px;width:100%;background-image: url("assets/backgrounds/landing.jpg");
opacity:0.9;background-size: cover;
}
.menunav{
width:40px;height:40px;color:white;cursor:pointer;top: 100px;left: 100px;font-weight:bolder;
font-size: 36px;position: absolute;
}
.logo{
height:300px;width:300px;margin:0 auto;border-radius: 50%;background-image: url("assets/logoBig.png");
background-size: cover;position: absolute;margin-top: 10%;margin-left:40%;
}
.logocontent{
width: 100%;min-height:10px;text-align: center;background:transparent;position:absolute;
top: 550px;color:white;text-transform: capitalize;font-family:'Franklin Gothic Medium';
font-size: 40px;
}
.midholder{
height:200px;width:200%;display:flex;flex-direction: row;
}
.midholder1{
height:250px;width:25%;float:left;
}
.midholderfcontent{
background-color:#b8b3b3;height: 50%;text-align:center;
line-height: 120px;font-weight:bold;font-size:28px;
}
.midholderscontent{
background-color:#F15A29;height:50%;text-align:center;
line-height:120px;font-weight:bold;color: #ccc;font-size:28px;
}
.lunch{
height:250px;width:25%;float:left;background-image: url("assets/foodtop/lunch.jpg");
color:white;text-align:center;background-size: cover;font-weight: bolder;font-size: 28px;
line-height:250px;opacity:0.4;font-style:italic;
}
.breakfast{
height:250px;width:25%;float:left;background-image: url("assets/foodtop/breakfast.jpg");
color:white;text-align:center;background-size: cover;font-weight: bolder;font-size: 28px;
line-height:250px;font-style:italic;
}
.dinner{
height:250px;width:25%;float:left;background-image: url("assets/foodtop/dinner.jpg");
color:white;text-align:center;background-size: cover;font-weight: bolder;font-size: 28px;
line-height:250px;font-style:italic;
}
.middleholder{
background-color: ivory;width:100%;height:auto;display: flex;flex-direction: column;margin-bottom: 30px;
}
.fastfood ,.fastdrink{
height:400px;width:100%;display:flex;position:relative;margin-top:50px;
justify-content: center;flex-direction: row;
}
.fastfoodimage{
border:1px solid white;box-shadow: -1px 1px 5px 9px rgba(104, 104, 104, 0.2);float:left;
position: relative;margin-left:100px;margin-right: 50px;padding:20px;padding: 0 auto;
text-align: center;display: flex;flex-direction: column;
}
.fastfoodcont ,.fastdrinkcont{
height: inherit;float:left;margin-left:50px;margin-right: 50px;width:500px;
}
.fastdrink .fastdrinkcont h1,.fastdrinkcont h3,.fastdrinkcont p{
text-align: right;
}
.fastfoodcont h1 ,.fastdrinkcont h1{
text-transform: capitalize;
}
.fastdrinkimage{
border: solid white;box-shadow: -1px 1px 5px 9px rgba(104, 104, 104, 0.2);width:400px;
text-align: center;position:relative;margin-left: 30px;
}
.btholder{
height:50px;border:2px solid #F15A29;width: 180px;font-family: bold;
color:#F15A29;font-size:18px;line-height: 40px;text-align: center;
}
.arrowspan{
font-size:36px;
}
.btholder1{
float:right; height:50px;border:2px solid #F15A29;width:180px;text-align: center;
font-family:bold;color:#F15A29;font-size: 18px;line-height: 40px;
}
.btholder:hover,.btholder1:hover{
height:55px;border: 2px;width:175px;font-size:18px; border:2px solid #F15A29;font-family: bold;
color:#F15A29;line-height: 55px;text-align: center;
}
.postmiddle{
height:500px;width:100%;background-image: url("assets/backgrounds/foodsBg.jpg");
}
.postmiddlecontholder{
height:400px;width:65%;background: white;position: absolute;margin-top: 2.5%;left:15%;
display: flex;flex-direction: row;float: left;
}
.postmiddledivh{
height:80px;background: #857f7f;position: absolute;width: 100%;
}
.postmiddledivhdiv{
width:25%;font-weight:bold;text-transform: capitalize;float: left;flex-direction: row;
line-height:80px;border-width: 0.5px;border-color:black;text-align: center;
}
.postmiddlediv{
height:220px;width:29%;justify-content: space-around;
position: relative;top: 120px;left:20px;float: left;margin-left: 5px;
}
.postmiddledivhdiv:hover{
background: white;cursor: pointer;border: none;color:#F15A29;
}
figcaption{
text-align: center;color:#F15A29;text-transform: capitalize;font-weight: bold;
}
.slide{
color:#F15A29 ;font-weight: bold;font-size: 40px;width:40px;
height:220px;justify-content: space-around;line-height: 220px;
position: relative;top: 120px;left:20px;float: left;
}
.slide span:hover{
cursor:pointer;color:blue;font-size: 48px;
}
.cus{
height:500px;width:100%;background:white;display: flex;position: absolute;padding-top:2%;
justify-content: center;align-items: center;
}
.cusholder{
width:80%;flex-direction: row;height:400px;
box-shadow:-1px 1px 5px 9px rgba(104,104,104,0.2);background:white;
}
.happycus{
width:63%;height:96%;background-color: transparent;float:left;text-align: center;
}
.happycuscont{
width:36%;height:90%;background: transparent;float:left;border-left:2px solid gray;margin-top:20px;
margin-bottom:10px;
}.happycusspan,.menudet{
color:#F15A29;;text-align: center;text-transform: capitalize;
}
.cusnameholder{
font-weight:bold;font-family:sans-serif;font-size: 20px;text-align:center;text-transform:capitalize;
}
.menudet p{
color:black;font-size: 22px;text-align: center;padding:10px;
}
.picarea{
width:30%;height:120px;background-color:transparent;text-align:center;position: absolute;left:24%;
}
.picholder{
height:120px;width:120px;border-radius: 50%;background-size: cover;float: left;
margin-right:10px;align-items: center;margin-left: 10px;
}
.picholder1{
margin-right:20px;margin-left:20px;height:80px;width:80px;border-radius: 50%;
background-size: cover; float:left;padding-top:20px;
}
.slide2{
color:#F15A29 ;font-weight: bold;font-size: 40px;width:40px;
height:120px;justify-content: space-around;line-height: 120px;
position: relative;top: 0px;left:20px;float: left;align-items: center;
}
.slide2 span:hover{
cursor:pointer;color:blue;font-size: 48px;
}
.subscribe{
width: 100%;height:350px;background-image: url("assets/backgrounds/subscribe.jpg");
position: relative;top:520px;
}
.formholder{
text-align: center;color:white;padding-top:30px;font-size: 20px;
width: 70%;height:200px;margin: 0 auto;;
}
.btn{
height:40px;width:15%;color:white;background: #F15A29;cursor:pointer;font-weight: bold;
vertical-align:center;text-align:center;line-height: 40px;margin-left:10px;
float:left;border: 1px solid #F15A29;padding: 3px;
}
input[type="email"]{
margin-left:26%;height:40px;width:30%;font-weight: bold;background:rgba(206,206,206,255);
margin-right: 20px;float: left;color:#ffffff;font-size: 24px;
}
::placeholder{
color:white;font-size: 20px;
}
.emailholder{
height:50px;width:100%;font-weight: bold;margin: 0 auto;text-align: center;
}
.bottomdiv{
height:300px;width:100%;max-height:600px;background-color: #F15A29;position: relative;top:500px;
display: flex;flex-direction: column;justify-content:flex-start;align-items: center;padding-top:30px;
}
.footlogo{
width:200px;height:100px;border-radius:50%;
}
.logospan{
font-weight: bold;font-size: 40px;margin-left:10px;color:white;
}
.logotxt{
text-transform: capitalize;color:rgb(255, 255, 255);font-weight: bold;font-size: 24px;
}
.social{
width: 300px;height:150px;background-size:fill;margin-top:10px;padding-left:10px
}
.social img{
padding-left: 10px;margin-left:15px;margin-right:5px;
}
.footnote{
bottom:10px;
}