-
Notifications
You must be signed in to change notification settings - Fork 3
/
Copy pathcyberbullying.html
155 lines (127 loc) · 6.58 KB
/
cyberbullying.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
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
<!DOCTYPE html>
<html>
<head>
<title>EmpowerHer</title>
<meta name="description" content="The HTML5 Herald">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
<link rel = "stylesheet" href ="Files/style.css">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<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=Source+Sans+Pro:ital@1&family=Ubuntu:wght@700&display=swap" rel="stylesheet">
</head>
<body>
<div>
<nav style="box-shadow: rgba(17, 12, 46, 0.15) 0px 48px 100px 0px;" class="navbar navbar-expand-lg navbar-light bg-light">
<div class="container-fluid">
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarTogglerDemo03" aria-controls="navbarTogglerDemo03" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<a class="navbar-brand" href="#"> <h6 style="font-size:2em" class="logo title1">EmpowerHer</h6></a>
<div class="collapse navbar-collapse" id="navbarTogglerDemo03">
<ul style="color:hsl(253, 71%, 61%) !important; font-weight:bold;"class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item">
<a class="nav-link active" href="index.html">Handmade product</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="menstrualcycleawareness.html">Menstrual Cycle</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="cyberbullying.html">Cyberbullying</a>
</li>
</ul>
</div>
</div>
</nav>
</div>
<div class="container">
<h2 style="margin-top:1em; text-align:center; margin-bottom:1em" class="logo">ARE YOU ALSO SUFFERING?</h2>
<div class="row">
<div class="col-lg-6 box2">
<article style="color:rgb(220,20,60); margin-top:1.6em; font-weight:bolder">
<span class="text5"></span>
</article>
<center>
<a style="text-decoration:none" href="https://www.alarms.org/guide-to-cyberbullying-awareness-and-prevention/"><button class="btn btn-responsive button-pink">Need a guide?</button>
</a>
<button class="btn btn-responsive button-pink"> <a style="text-decoration:none" href="https://cyberbullying.org/report">Helpful links</a></button>
</center>
</div>
<div class="col-lg-6">
<img class="gif" src="Files/Images/bullyinggif.gif">
</div>
</div>
</div>
<!--heading style="color:pink;"-->
<div style="margin-top:3em" class="box1 container">
<div class="row">
<div class="col-lg-7">
<h1 style="margin-left:3.4em !important"class="logo">It can cause</h1>
<h1 class="numbers">01</h1>
<p class="purple">LOW SELF-ESTEEM</p>
<h1 class="numbers">02</h1>
<p class="purple">PSYCHOLOGICAL PROBLEMS</p>
<h1 class="numbers">03</h1>
<p class="purple" >SOCIAL EXCLUSION</p>
</div>
<div class="col-lg-5">
<h1 style="color:azure;" class="left-aligned-heading">
Be sure to test
your words before
you spit them out
<BR><br>
Pulling down will never help you reach the top
</h1>
</div>
</div>
</div>
<div class="container">
<h1 style="text-align:center; color:hsl(253, 71%, 61%); margin-top:2em;" class="logo">Clubs and societies only for women</h1>
<div class="row">
<div class="col-lg-3 card-deck">
<h2>Sheroes</h2>
<img class="round-img" src="Files/Images/she.png" alt="websites"><br>
<button type="button" style="font-weight:bold"class="btn btn-outline-danger">
<a href = "https://sheroes.com/">
Join</a></button>
</div>
<div class="col-lg-3 card-deck">
<h2>Women.com</h2>
<img class="round-img" src="Files/Images/women.com" alt="websites"><br>
<button type="button" style="font-weight:bold"class="btn btn-outline-danger">
<a href = "https://www.women.com/">
Join</a></button>
</div>
<div class="col-lg-3 card-deck">
<h2>Glassbreakers</h2>
<img class="round-img" src="Files/Images/glassbreakers.jpg" alt="websites">
<Br> <button type="button" style="font-weight:bold"class="btn btn-outline-danger"> <a href = "https://www.linkedin.com/company/glassbreakers">
Join</a></button>
</div>
<div class="col-lg-3 card-deck">
<h2>ActionAid <br>India</h2>
<img class="round-img" src="Files/Images/actionaid.jpg" alt="websites"><bR>
<button type="button" style="font-weight:bold"class="btn btn-outline-danger"> <a href = "https://www.aidindia.in/">
Join</a></button>
</div>
</div>
</div>
<div style="margin-top:2em; margin-bottom:2em; background-color:#e25098"class="container box1">
<div class="row">
<div class="col-lg-5 left-aligned-heading">
SOME FACTS ABOUT <Br> CYBER <br>BULLYING
</div>
<div class="col-lg-7 right-aligned-heading"><p>
<span class="shape"></span>
About 37% of young people between the ages of 12 and 17 have been bullied online. 30% have had it happen more than once.<br>
<span class="shape"></span>
15% of teen girls have been the target of at least four different kinds of abusive online behaviors, compared with 6% of boys.<bR>
<span class="shape"></span>
Instagram is the social media site where most young people report experiencing cyberbullying.<bR>
<span class="shape"></span>
60% of young people have witnessed online bullying. Most do not intervene.<br></p>
</div>
</div>
</div>
</body>
</html>