1.  
2. .loader_bg{
3.     position: fixed;
4.     z-index: 999999;
5.     background: #fff;
6.     width: 300%;
7.     height: 300%;
8. }
9. .loader{
10.     border: 0 soild transparent;
11.     border-radius: 50%;
12.     width: 500px;
13.     height: 500px;
14.     position: absolute;
15.     top: calc(50vh - 280px);
16.     left: calc(50vw - 250px);
17. }
18. .loader:before, .loader:after{
19.     content: '';
20.     border: 1em solid #ffffff;
21.     border-radius: 50%;
22.     width: inherit;
23.     height: inherit;
24.     position: absolute;
25.     top: 0;
26.     left: 0;
27.     animation: loader 2s linear infinite;
28.     opacity: 0;
29. }
30. .loader:before{
31.     animation-delay: .5s;
32. }
33. @keyframes loader{
34.     0%{
35.         transform: scale(0);
36.         opacity: 0;
37.     }
38.     50%{
39.         opacity: 1;
40.     }
41.     100%{
42.         transform: scale(1);
43.         opacity: 0;
44.     }
45. }
46. h1{
47.     margin:0;
48.     padding:0;
49.     font-family: Serif ;
50.     text-align: left;
51.     margin-left: 30px;
52.     margin-top:40px;
53.     font-size:100px;
54.     text-decoration: none !important;
55.  
56. }
57. p{
58.     font:32px;
59.     margin: 10px;
60.     line-height: 2.0;
61.     font-family:Serif;
62.     text-decoration: none !important;
63.  
64.    
65. }
66. body{
67.     font-family:serif ;
68. }
69. * {
70.     margin: 0px;
71.     padding: 0px;
72.   }
73.  
74. .banner{
75.     width: 100%;
76.     height: 100vh;
77.    background: linear-gradient(rgba(0,0,0,0.75),rgba(0,0,0,0.75)),url(background.jfif);
78.     background-size: cover;
79.     background-position: center;
80.  
81. }
82. .navbar{
83.     width: 85%;
84.     margin: auto;
85.     padding: 35px 0;
86.     display: flex;
87.     align-items: center;
88.     justify-content: space-between;
89.    
90. }
91. .logo{
92.     width: 120px;
93.     cursor:pointer;
94.     margin-left: -20px;
95.  
96. }
97. .navbar ul li{
98.     list-style: none;
99.     display: inline-block;
100.     margin: 0 20px;
101.     position: relative;
102. }
103. .navbar ul li a{
104.     color: #fff;
105.     text-decoration: none;
106.     text-transform: uppercase;
107. }
108. .navbar ul li::after{
109.     content: '';
110.     height: 3px;
111.     width: 0%;
112.     background: #fff;
113.     position: absolute;
114.     left: 0;
115.     bottom: -10px;
116.     transition: 0.5s;
117. }
118. .navbar ul li:hover::after{
119.     width: 100%;
120. }
121. .content{
122.     width: fit-content;
123.     position: absolute;
124.     top:20%;
125.     text-align:center;
126.     color: #fff;
127.     overflow: hidden;
128.     border-bottom: 5px solid rgba(255, 255, 255, 0);
129.     animation: animate 5s linear forwards;
130.     text-align: left;
131.     margin-top: 40px;
132.     margin-left: 100px;
133.  
134. }
135. .content h1{
136.     font-size: 100px;
137.     color: white;
138. }
139.  
140. @keyframes animate {
141.     0% {
142.         width: 10%;
143.         height: 0%;
144.     }
145.     10% {
146.         width: 20%;
147.         height: 10%;
148.     }
149.     20%{
150.         width: 40%;
151.         height: 20%;
152.     }
153.     30% {
154.         width: 80%;
155.         height: 40%;
156.     }
157.     60% {
158.         width: 100%;
159.         height: 80%;
160.     }
161.     80% {
162.         width: 70%;
163.         height: 100%;
164.     }
165. }
166. .content p{
167.     margin: 20px auto;
168.     font-weight: 100;
169.     line-height: 25px;
170. }
171. button{
172.     text-decoration: none !important;
173.     width: 200px;
174.     padding: 15px 0;
175.     margin: 20px 10px;
176.     border-radius: 25px;
177.     font-weight: bold;
178.     border: 2px solid #fff;
179.     background: transparent;
180.     color: #fff;
181.     cursor: pointer;
182.     overflow: hidden;
183.     font-family: serif;
184.     margin-left: 100px;
185.     margin-top:40px;
186. }
187. button span{
188.     height: 100%;
189.     width: 0;
190.     border-radius: 25px;
191.     left: 0;
192.     bottom: 0;
193.     z-index: -1;
194.     transition: 0.5s;
195.     background: #45a49d;
196.  
197. }
198. button:hover button span{
199.     width: 100%;
200.  
201. }
202. a, a:hover, a:focus, a:active {
203.     text-decoration: none;
204.     color: inherit;
205. }
206. .aboutUsContent{
207.     width: 100%;
208.     position: absolute;
209.     top:50%;
210.     transform: translateY(-50%);
211.     text-align:center;
212.     color: #fff;
213. }
214. .aboutUsContent h1{
215.     font-size: 70px;
216.     margin-top: 80px;
217. }
218. .aboutUscontent p{
219.     margin: 20px auto;
220.     font-weight: 100;
221.     line-height: 25px;
222. }
223. .aboutUsBanner{
224.     width: 100%;
225.    background-color: rgb(255, 255, 255);
226.     background-size: cover;
227.     background-position: center;
228.     float:left;
229.     margin-top: 70px;
230.     font-size: 20px;
231.     text-align: center;
232. }
233. .aboutUsSelfie{
234.     height:300px;
235.      float: left;
236.      margin-left: 50px;
237.      border: 10px solid #000000;
238.      margin-bottom: -50px;;
239. }
240.     .logoimg{
241.         height: 500px;
242.         float: right;
243. }
244. .large-text{
245.     font-weight: 100;
246.     font-size: 1.57em;
247.     line-height: 1.5em;
248.     margin: 30px 0px;
249.     margin-left: 250px;
250.     margin-right: 250px;
251. }
252. .headline-container {
253.     margin-bottom: 30px;
254.     margin-top: 5px;
255.    
256. }
257.  
258.     .headline-container h2 {
259.         max-width: 600px;
260.         margin: 0px auto;
261.     }
262.  
263. .headline-lines {
264.     width: 20%;
265.     height: 2px;
266.     background: #272b2d;
267.     margin: 20px auto;
268. }
269. .OurTeam{
270.     width: 100%;
271.    background-color: rgb(255, 255, 255);
272.     background-size: cover;
273.     background-position: center;
274.     float:left;
275.     margin-top: 70px;
276.     font-size: 20px;
277.     text-align: center;
278. }
279. .text-center{
280.     text-align: center;
281. }
282. .center-btn {
283.   background-color: #45a49d;
284.   border: 2px solid #111;
285.   border-radius: 8px;
286.   box-sizing: border-box;
287.   color: rgb(0, 0, 0);
288.   cursor: pointer;
289.   font-family: serif;
290.   font-size: 16px;
291.   height: 48px;
292.   line-height: 24px;
293.   max-width: 10%;
294.   padding: 0 25px;
295.   position: relative;
296.   text-align: center;
297.   text-decoration: none;
298.   user-select: none;
299.   -webkit-user-select: none;
300.   touch-action: manipulation;
301.   background-position: center;
302.   display: flex;
303.   justify-content: center;
304.   align-items: center;
305.  
306.  
307. }
308.  
309. .center-btn:after {
310.   background-color: rgb(0, 0, 0);
311.   border-radius: 8px;
312.   content: "";
313.   display: block;
314.   height: 48px;
315.   left: 0;
316.   width: 100%;
317.   position: absolute;
318.   top: -2px;
319.   transform: translate(8px, 8px);
320.   transition: transform .2s ease-out;
321.   z-index: -1;
322. }
323.  
324. .center-btn:hover:after {
325.   transform: translate(0, 0);
326. }
327.  
328. .center-btn:active {
329.   background-color: #000000;
330.   outline: 0;
331. }
332.  
333. .center-btn:hover {
334.   outline: 0;
335. }
336.  
337. @media (min-width: 768px) {
338.   .center-btn {
339.     padding: 0 40px;
340.   }
341. }