diff --git a/public/100.html b/public/100.html
new file mode 100644
index 0000000..0ec9661
--- /dev/null
+++ b/public/100.html
@@ -0,0 +1,53 @@
+
+
+
+ Fermium Atom Details
+ Fermium Fermium is a synthetic element discovered in the debris of a hydrogen bomb explosion, used primarily for research.
+
+
+ Atomic Structure
+
+
+ Atomic Information
+
+
+ Property
+ Value
+
+
+ Atomic Number
+ 100
+
+
+ Symbol
+ Fm
+
+
+ Atomic Mass
+ 257 u
+
+
+ Electron Configuration
+ [Rn] 5f12 7s2
+
+
+ State at Room Temperature
+ Solid
+
+
+
+ Uses of Fermium
+
+ Primarily used for scientific research.
+ Helps in the study of heavy elements.
+
+
+
diff --git a/public/101.html b/public/101.html
new file mode 100644
index 0000000..ef37952
--- /dev/null
+++ b/public/101.html
@@ -0,0 +1,52 @@
+
+
+
+ Mendelevium Atom Details
+ Mendelevium Mendelevium is a synthetic element named after Dmitri Mendeleev, known for the periodic table, used exclusively for research.
+
+
+ Atomic Structure
+
+
+ Atomic Information
+
+
+ Property
+ Value
+
+
+ Atomic Number
+ 101
+
+
+ Symbol
+ Md
+
+
+ Atomic Mass
+ 258 u
+
+
+ Electron Configuration
+ [Rn] 5f13 7s2
+
+
+ State at Room Temperature
+ Solid
+
+
+
+ Uses of Mendelevium
+
+ Used in research to understand heavy element properties.
+
+
+
diff --git a/public/102.html b/public/102.html
new file mode 100644
index 0000000..cae5437
--- /dev/null
+++ b/public/102.html
@@ -0,0 +1,52 @@
+
+
+
+ Nobelium Atom Details
+ Nobelium Nobelium is a synthetic element named in honor of Alfred Nobel, primarily used for research in chemistry and physics.
+
+
+ Atomic Structure
+
+
+ Atomic Information
+
+
+ Property
+ Value
+
+
+ Atomic Number
+ 102
+
+
+ Symbol
+ No
+
+
+ Atomic Mass
+ 259 u
+
+
+ Electron Configuration
+ [Rn] 5f14 7s2
+
+
+ State at Room Temperature
+ Solid
+
+
+
+ Uses of Nobelium
+
+ Used in scientific research of heavy elements.
+
+
+
diff --git a/public/103.html b/public/103.html
new file mode 100644
index 0000000..3e0d046
--- /dev/null
+++ b/public/103.html
@@ -0,0 +1,52 @@
+
+
+
+ Lawrencium Atom Details
+ Lawrencium Lawrencium is a synthetic element named after Ernest Lawrence, known for developing the cyclotron, used for advanced research purposes.
+
+
+ Atomic Structure
+
+
+ Atomic Information
+
+
+ Property
+ Value
+
+
+ Atomic Number
+ 103
+
+
+ Symbol
+ Lr
+
+
+ Atomic Mass
+ 262 u
+
+
+ Electron Configuration
+ [Rn] 5f14 7s2 7p1
+
+
+ State at Room Temperature
+ Solid
+
+
+
+ Uses of Lawrencium
+
+ Used in the research of transuranium elements.
+
+
+
diff --git a/public/104.html b/public/104.html
new file mode 100644
index 0000000..93edd7a
--- /dev/null
+++ b/public/104.html
@@ -0,0 +1,52 @@
+
+
+
+ Rutherfordium Atom Details
+ Rutherfordium Rutherfordium is a synthetic element and is the first transactinide element. It has no stable isotopes.
+
+
+ Atomic Structure
+
+
+ Atomic Information
+
+
+ Property
+ Value
+
+
+ Atomic Number
+ 104
+
+
+ Symbol
+ Rf
+
+
+ Atomic Mass
+ [267] u
+
+
+ Electron Configuration
+ [Rn] 5f14 6d2 7s2
+
+
+ State at Room Temperature
+ Solid (predicted)
+
+
+
+ Uses of Rutherfordium
+
+ Used in scientific research to study chemical properties of transactinides.
+
+
+
diff --git a/public/105.html b/public/105.html
new file mode 100644
index 0000000..e0d2731
--- /dev/null
+++ b/public/105.html
@@ -0,0 +1,52 @@
+
+
+
+ Dubnium Atom Details
+ Dubnium Dubnium is a synthetic element named after Dubna, Russia, where it was first produced.
+
+
+ Atomic Structure
+
+
+ Atomic Information
+
+
+ Property
+ Value
+
+
+ Atomic Number
+ 105
+
+
+ Symbol
+ Db
+
+
+ Atomic Mass
+ [270] u
+
+
+ Electron Configuration
+ [Rn] 5f14 6d3 7s2
+
+
+ State at Room Temperature
+ Solid (predicted)
+
+
+
+ Uses of Dubnium
+
+ Primarily used for scientific research.
+
+
+
diff --git a/public/106.html b/public/106.html
new file mode 100644
index 0000000..c0ba761
--- /dev/null
+++ b/public/106.html
@@ -0,0 +1,52 @@
+
+
+
+ Seaborgium Atom Details
+ Seaborgium Seaborgium is a synthetic element named after Glenn T. Seaborg, a prominent nuclear chemist.
+
+
+ Atomic Structure
+
+
+ Atomic Information
+
+
+ Property
+ Value
+
+
+ Atomic Number
+ 106
+
+
+ Symbol
+ Sg
+
+
+ Atomic Mass
+ [271] u
+
+
+ Electron Configuration
+ [Rn] 5f14 6d4 7s2
+
+
+ State at Room Temperature
+ Solid (predicted)
+
+
+
+ Uses of Seaborgium
+
+ Used in chemical and physical experiments related to transactinides.
+
+
+
\ No newline at end of file
diff --git a/public/107.html b/public/107.html
new file mode 100644
index 0000000..9d89e03
--- /dev/null
+++ b/public/107.html
@@ -0,0 +1,52 @@
+
+
+
+ Bohrium Atom Details
+ Bohrium Bohrium is a synthetic element named after Niels Bohr, a pioneer in atomic structure research.
+
+
+ Atomic Structure
+
+
+ Atomic Information
+
+
+ Property
+ Value
+
+
+ Atomic Number
+ 107
+
+
+ Symbol
+ Bh
+
+
+ Atomic Mass
+ [270] u
+
+
+ Electron Configuration
+ [Rn] 5f14 6d5 7s2
+
+
+ State at Room Temperature
+ Solid (predicted)
+
+
+
+ Uses of Bohrium
+
+ Limited to theoretical research on heavy elements.
+
+
+
diff --git a/public/108.html b/public/108.html
new file mode 100644
index 0000000..28f0a01
--- /dev/null
+++ b/public/108.html
@@ -0,0 +1,52 @@
+
+
+
+ Hassium Atom Details
+ Hassium Hassium is a synthetic element named after the German state of Hesse.
+
+
+ Atomic Structure
+
+
+ Atomic Information
+
+
+ Property
+ Value
+
+
+ Atomic Number
+ 108
+
+
+ Symbol
+ Hs
+
+
+ Atomic Mass
+ [277] u
+
+
+ Electron Configuration
+ [Rn] 5f14 6d6 7s2
+
+
+ State at Room Temperature
+ Solid (predicted)
+
+
+
+ Uses of Hassium
+
+ Primarily used for scientific research in nuclear physics.
+
+
+
diff --git a/public/109.html b/public/109.html
new file mode 100644
index 0000000..b1445d7
--- /dev/null
+++ b/public/109.html
@@ -0,0 +1,52 @@
+
+
+
+ Meitnerium Atom Details
+ Meitnerium Meitnerium is a synthetic element named after Lise Meitner, a physicist who contributed to the discovery of nuclear fission.
+
+
+ Atomic Structure
+
+
+ Atomic Information
+
+
+ Property
+ Value
+
+
+ Atomic Number
+ 109
+
+
+ Symbol
+ Mt
+
+
+ Atomic Mass
+ [278] u
+
+
+ Electron Configuration
+ [Rn] 5f14 6d7 7s2
+
+
+ State at Room Temperature
+ Solid (predicted)
+
+
+
+ Uses of Meitnerium
+
+ Primarily used for research in the field of nuclear chemistry.
+
+
+
diff --git a/public/110.html b/public/110.html
new file mode 100644
index 0000000..17b0a41
--- /dev/null
+++ b/public/110.html
@@ -0,0 +1,52 @@
+
+
+
+ Darmstadtium Atom Details
+ Darmstadtium Darmstadtium is a synthetic element named after Darmstadt, Germany, where it was first synthesized.
+
+
+ Atomic Structure
+
+
+ Atomic Information
+
+
+ Property
+ Value
+
+
+ Atomic Number
+ 110
+
+
+ Symbol
+ Ds
+
+
+ Atomic Mass
+ [281] u
+
+
+ Electron Configuration
+ [Rn] 5f14 6d7 7s2
+
+
+ State at Room Temperature
+ Solid (predicted)
+
+
+
+ Uses of Darmstadtium
+
+ Primarily used for scientific research, particularly in nuclear chemistry.
+
+
+
diff --git a/public/111.html b/public/111.html
new file mode 100644
index 0000000..7f1b38e
--- /dev/null
+++ b/public/111.html
@@ -0,0 +1,52 @@
+
+
+
+ Roentgenium Atom Details
+ Roentgenium Roentgenium is a synthetic element named after Wilhelm Röntgen, the discoverer of X-rays.
+
+
+ Atomic Structure
+
+
+ Atomic Information
+
+
+ Property
+ Value
+
+
+ Atomic Number
+ 111
+
+
+ Symbol
+ Rg
+
+
+ Atomic Mass
+ [280] u
+
+
+ Electron Configuration
+ [Rn] 5f14 6d8 7s2
+
+
+ State at Room Temperature
+ Solid (predicted)
+
+
+
+ Uses of Roentgenium
+
+ Primarily used for scientific research in nuclear chemistry.
+
+
+
diff --git a/public/112.html b/public/112.html
new file mode 100644
index 0000000..b2bb9d3
--- /dev/null
+++ b/public/112.html
@@ -0,0 +1,52 @@
+
+
+
+ Copernicium Atom Details
+ Copernicium Copernicium is a synthetic element named after Nicolaus Copernicus, the astronomer who formulated the heliocentric model of the solar system.
+
+
+ Atomic Structure
+
+
+ Atomic Information
+
+
+ Property
+ Value
+
+
+ Atomic Number
+ 112
+
+
+ Symbol
+ Cn
+
+
+ Atomic Mass
+ [285] u
+
+
+ Electron Configuration
+ [Rn] 5f14 6d9 7s2
+
+
+ State at Room Temperature
+ Solid (predicted)
+
+
+
+ Uses of Copernicium
+
+ Primarily used for scientific research in nuclear chemistry.
+
+
+
diff --git a/public/113.html b/public/113.html
new file mode 100644
index 0000000..5699ec0
--- /dev/null
+++ b/public/113.html
@@ -0,0 +1,52 @@
+
+
+
+ Nihonium Atom Details
+ Nihonium Nihonium is a synthetic element named after Japan (Nihon), where it was first synthesized.
+
+
+ Atomic Structure
+
+
+ Atomic Information
+
+
+ Property
+ Value
+
+
+ Atomic Number
+ 113
+
+
+ Symbol
+ Nh
+
+
+ Atomic Mass
+ [284] u
+
+
+ Electron Configuration
+ [Rn] 5f14 6d10 7s2 7p1
+
+
+ State at Room Temperature
+ Solid (predicted)
+
+
+
+ Uses of Nihonium
+
+ Primarily used for scientific research in the field of nuclear chemistry.
+
+
+
diff --git a/public/114.html b/public/114.html
new file mode 100644
index 0000000..4cee37c
--- /dev/null
+++ b/public/114.html
@@ -0,0 +1,52 @@
+
+
+
+ Flerovium Atom Details
+ Flerovium Flerovium is a synthetic element named after the Flerov Laboratory of Nuclear Reactions in Russia.
+
+
+ Atomic Structure
+
+
+ Atomic Information
+
+
+ Property
+ Value
+
+
+ Atomic Number
+ 114
+
+
+ Symbol
+ Fl
+
+
+ Atomic Mass
+ [289] u
+
+
+ Electron Configuration
+ [Rn] 5f14 6d10 7s2 7p2
+
+
+ State at Room Temperature
+ Solid (predicted)
+
+
+
+ Uses of Flerovium
+
+ Primarily used for scientific research in the field of nuclear chemistry.
+
+
+
diff --git a/public/115.html b/public/115.html
new file mode 100644
index 0000000..e2486b8
--- /dev/null
+++ b/public/115.html
@@ -0,0 +1,52 @@
+
+
+
+ Moscovium Atom Details
+ Moscovium Moscovium is a synthetic element named after Moscow, Russia, where it was first synthesized.
+
+
+ Atomic Structure
+
+
+ Atomic Information
+
+
+ Property
+ Value
+
+
+ Atomic Number
+ 115
+
+
+ Symbol
+ Mc
+
+
+ Atomic Mass
+ [288] u
+
+
+ Electron Configuration
+ [Rn] 5f14 6d10 7s2 7p3
+
+
+ State at Room Temperature
+ Solid (predicted)
+
+
+
+ Uses of Moscovium
+
+ Primarily used for scientific research in the field of nuclear chemistry.
+
+
+
diff --git a/public/116.html b/public/116.html
new file mode 100644
index 0000000..ca560e2
--- /dev/null
+++ b/public/116.html
@@ -0,0 +1,52 @@
+
+
+
+ Livermorium Atom Details
+ Livermorium Livermorium is a synthetic element named after the Lawrence Livermore National Laboratory in California, USA.
+
+
+ Atomic Structure
+
+
+ Atomic Information
+
+
+ Property
+ Value
+
+
+ Atomic Number
+ 116
+
+
+ Symbol
+ Lv
+
+
+ Atomic Mass
+ [293] u
+
+
+ Electron Configuration
+ [Rn] 5f14 6d10 7s2 7p4
+
+
+ State at Room Temperature
+ Solid (predicted)
+
+
+
+ Uses of Livermorium
+
+ Primarily used for scientific research in the field of nuclear chemistry.
+
+
+
diff --git a/public/117.html b/public/117.html
new file mode 100644
index 0000000..d202567
--- /dev/null
+++ b/public/117.html
@@ -0,0 +1,52 @@
+
+
+
+ Tennessine Atom Details
+ Tennessine Tennessine is a synthetic element named after the state of Tennessee in the United States.
+
+
+ Atomic Structure
+
+
+ Atomic Information
+
+
+ Property
+ Value
+
+
+ Atomic Number
+ 117
+
+
+ Symbol
+ Ts
+
+
+ Atomic Mass
+ [294] u
+
+
+ Electron Configuration
+ [Rn] 5f14 6d10 7s2 7p5
+
+
+ State at Room Temperature
+ Solid (predicted)
+
+
+
+ Uses of Tennessine
+
+ Primarily used for scientific research in the field of nuclear chemistry.
+
+
+
diff --git a/public/118.html b/public/118.html
new file mode 100644
index 0000000..19cabb1
--- /dev/null
+++ b/public/118.html
@@ -0,0 +1,53 @@
+
+
+
+ Oganesson Atom Details
+ Oganesson Oganesson is a synthetic element named after Russian physicist Yuri Oganessian for his contributions to the discovery of superheavy elements.
+
+
+ Atomic Structure
+
+
+ Atomic Information
+
+
+ Property
+ Value
+
+
+ Atomic Number
+ 118
+
+
+ Symbol
+ Og
+
+
+ Atomic Mass
+ [294] u
+
+
+ Electron Configuration
+ [Rn] 5f14 6d10 7s2 7p6
+
+
+ State at Room Temperature
+ Gas (predicted)
+
+
+
+ Uses of Oganesson
+
+ Primarily used for scientific research in the field of nuclear chemistry.
+
+
+
diff --git a/public/element.css b/public/element.css
new file mode 100644
index 0000000..3a39544
--- /dev/null
+++ b/public/element.css
@@ -0,0 +1,41 @@
+table, th, td {
+ border: 2px solid black;
+}
+.elec_conf {
+ height: 20%;
+ width: 20%;
+}
+h1{
+ text-align: center;
+ font-size: 60px;
+}
+
+.intro{
+ font-size: large;
+}
+
+html,body{
+ padding: 1%;
+ margin: 0;
+ background-image: linear-gradient(to right,rgb(155, 224, 244),whitesmoke);
+ background-repeat: repeat;
+ background-size: cover;
+}
+
+hr{
+ border-color: blue;
+}
+/* #e6ffff */
+img{
+ border-radius: 12.5%;
+ box-shadow: 0px 0px 4px 1px black;
+}
+
+img:hover{
+ transition: transform .3s;
+ transform: scale(1.07);
+}
+
+table{
+ box-shadow: 0px 0px 4px 1px black;
+}
\ No newline at end of file
diff --git a/public/history.css b/public/history.css
new file mode 100644
index 0000000..3e67c4a
--- /dev/null
+++ b/public/history.css
@@ -0,0 +1,79 @@
+/* General Styles */
+body {
+ font-family: Arial, sans-serif;
+ margin: 0;
+ padding-top: 0;
+ background-color: #f4f4f4;
+ color: #333;
+ line-height: 1.6;
+ }
+
+ header {
+ background-color: #5783bd;
+ color: white;
+ padding: 1.5rem 0;
+ text-align: center;
+ /* position: fixed;
+ right: 0;
+ left: 0;
+ top: 0; */
+}
+
+main {
+ padding: 2rem;
+}
+
+ /* Section Styles */
+h2 {
+ color: #1e3d59;
+ margin-bottom: 1rem;
+}
+
+.event {
+ background: #fff;
+ padding: 1rem;
+ border-left: 5px solid rgb(89, 157, 217);
+ margin-bottom: 1rem;
+ box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
+}
+
+.event h3 {
+ margin: 0;
+ color: #1e3d59;
+}
+
+.event p {
+ margin-top: 0.5rem;
+}
+
+/* footer nav bar */
+
+footer {
+ bottom: 0;
+ width: 100%;
+ background-color: #333;
+ color: white;
+ text-align: center;
+ padding: 0.5rem 0;
+ }
+
+ footer nav ul {
+ list-style-type: none;
+ padding: 0;
+ display: flex;
+ justify-content: center;
+ margin: 0;
+ }
+
+ footer nav ul li {
+ margin: 0 1rem;
+ }
+
+ footer nav ul li a {
+ color: white;
+ text-decoration: none;
+ }
+
+ footer nav ul li a:hover {
+ text-decoration: underline;
+ }
\ No newline at end of file
diff --git a/public/history.html b/public/history.html
new file mode 100644
index 0000000..54e3625
--- /dev/null
+++ b/public/history.html
@@ -0,0 +1,73 @@
+
+
+
+ History of the Periodic Table
+
+ History of the Periodic Table
+
+
+
+
+ Timeline of Key Events
+
+
1869: Dmitri Mendeleev's First Periodic Table
+
+ Dmitri Mendeleev published the first recognizable periodic table,
+ organizing elements by increasing atomic mass and leaving gaps for
+ undiscovered elements.
+
+
+
1894-1898: Discovery of Noble Gases
+
+ William Ramsay and Lord Rayleigh discovered noble gases, adding a
+ new group to the periodic table.
+
+
+
1913: Moseley's Atomic Number Concept
+
+ Henry Moseley rearranged the periodic table by atomic number rather
+ than atomic mass, resolving inconsistencies in Mendeleev's
+ arrangement.
+
+
+
1940s: Discovery of Transuranium Elements
+
+ Seaborg and his team discovered transuranium elements, extending the
+ periodic table and introducing the Actinide series.
+
+
+
The Modern Periodic Table
+
+ The modern periodic table organizes elements by increasing atomic
+ number, grouping them into periods and families with similar
+ chemical properties.
+
+
+
+
+
+
+
diff --git a/public/mnemonics.css b/public/mnemonics.css
new file mode 100644
index 0000000..3604bb9
--- /dev/null
+++ b/public/mnemonics.css
@@ -0,0 +1,63 @@
+body {
+ font-family: Arial, sans-serif;
+ margin: 0;
+ padding: 0;
+ background-color: #f4f4f4;
+ }
+
+ header {
+ background-color: #5783bd;
+ color: white;
+ text-align: center;
+ padding: 1%;
+ }
+
+ main {
+ padding: 1%;
+ }
+
+ section.mnemonic {
+ background-color: #ffffff;
+ margin: 1rem 0;
+ padding: 1rem;
+ border-radius: 5px;
+ box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
+ border-left: 5px solid rgb(89, 157, 217);
+ }
+
+ h2 {
+ color: #0077b6;
+ }
+
+/* footer nav bar */
+
+ footer {
+ bottom: 0;
+ width: 100%;
+ background-color: #333;
+ color: white;
+ text-align: center;
+ padding: 0.5rem 0;
+ }
+
+ footer nav ul {
+ list-style-type: none;
+ padding: 0;
+ display: flex;
+ justify-content: center;
+ margin: 0;
+ }
+
+ footer nav ul li {
+ margin: 0 1rem;
+ }
+
+ footer nav ul li a {
+ color: white;
+ text-decoration: none;
+ }
+
+ footer nav ul li a:hover {
+ text-decoration: underline;
+ }
+
\ No newline at end of file
diff --git a/public/mnemonics.html b/public/mnemonics.html
new file mode 100644
index 0000000..a21f673
--- /dev/null
+++ b/public/mnemonics.html
@@ -0,0 +1,146 @@
+
+
+
+ Indian Mnemonics for the Periodic Table
+
+ Indian Mnemonics for the Periodic Table
+
+
+
+
+
+ Group 1: Alkali Metals
+ Mnemonic: Hai LiNa Kre Rb Csey Friyad
+ Elements: H, Li, Na, K, Rb, Cs, Fr
+
+
+
+
+ Group 2: Alkaline Earth Metals
+ Mnemonic: Beta Mange Car Scooter Baap Raazi
+ Elements: Be, Mg, Ca, Sr, Ba, Ra
+
+
+
+
+ Group 13
+ Mnemonic: Began, Aloo, Gajar In Thela
+ Elements: B, Al, Ga, In, Tl
+
+
+
+
+ Group 14
+ Mnemonic: Chemistry Sir Gives Sanki Problems
+ Elements: C, Si, Ge, Sn, Pb
+
+
+
+
+ Group 15
+ Mnemonic: New-Zealand Pakistan Austrlia Sab Bimar
+ Elements: N, P, As, Sb, Bi
+
+
+
+
+ Group 16
+ Mnemonic: Oye Shi Se TePo
+ Elements: O, S, Se, Te, Po
+
+
+
+
+ Group 17: Halogens
+ Mnemonic: Fir Cl Bahar I Aunty
+ Elements: F, Cl, Br, I, At
+
+
+
+
+ Group 18: Noble Gases
+ Mnemonic: He Never Argue; Kal Xero Run pe out hua
+ Elements: He, Ne, Ar, Kr, Xe, Rn
+
+
+
+
+ Period 4
+ Mnemonic: Scooter T V Car Mat FeCo NiCu Zi
+ Elements: Sc, Ti, V, Cr, Mn, Fe, Co, Ni, Cu, Zn
+
+
+
+
+ Period 5
+ Mnemonic: Ye Zara Nawaab Maut Tak Rooh Rahegi Padhaai Aage Chhodo
+ Elements: Y, Zr, Nb, Mo, Tc, Ru, Rh, Pd, Ag, Cd
+
+
+
+
+ Period 6
+ Mnemonic: La HafTa Warna Re Us (Os) Iron rod se Pitega Aur Hospital JAeega
+ Elements: La, Hf, Ta, W, Re, Os, Ir, Pt, Au, Hg
+
+
+
+
+ Period 7
+ Mnemonic: Akkountant R D Sharma ki Book Mein Hain Maths ke Darawane Sawaal
+ Elements: Ac, Rf, Db, Sg, Bh, Hs, Mt, Ds
+
+
+
+
+ Lanthanides 1
+ Mnemonic: John Cena Parson New Delhi main Prime minister Se Mila
+ Elements: Ce, Pr, Nd, Pm, Sm
+
+
+
+
+ Lanthanides 3
+ Mnemonic: Engineer Tum Yebhi Luto
+ Elements: Eu, Gd, Tb, Dy, Ho
+
+
+
+
+ Actinides 1
+ Mnemonic: Thode Papa Unse Napenge
+ Elements: Th, Pa, U, Np
+
+
+
+
+ Actinides 2
+ Mnemonic: Purana Aam K(C)am Bikenge
+ Elements: Pu, Am, Cm, Bk
+
+
+
+
+ Actinides 3
+ Mnemonic: Final Mood No Larai
+ Elements: Fm, Md, No, Lr
+
+
+
+
+
+
diff --git a/public/style.css b/public/style.css
new file mode 100644
index 0000000..2d91055
--- /dev/null
+++ b/public/style.css
@@ -0,0 +1,170 @@
+table {
+ height: 90%;
+ width: 100%;
+ box-shadow: 0px 0px 25px 7px #D4EBF8;
+ border-radius: 3%;
+ padding: 2%;
+}
+
+.yes,.yes_row td{
+ border: 2px solid black;
+}
+
+/* Text align and zoom effect */
+td {
+ width: 20px;
+ text-align: center;
+ transition: transform .2s; /* Animation */
+ margin: 10px;
+ border-radius: 5px;
+}
+
+.yes_row td:hover,.yes:hover{
+ transform: scale(1.5);
+ box-shadow: 0px 0px 5px 2px whitesmoke;
+}
+.yes_row td:active,.yes:active,#La td:active,#Ac td:active{
+ background-color: whitesmoke;
+}
+
+#lanthanoids:hover,#actinoids:hover{
+ transition: none ;
+ transform: none;
+}
+
+main{
+ padding: 7%;
+ margin: 0%;
+}
+
+body{
+ margin: 0;
+ padding: 0;
+ background-image: url("../assets/bg1.jpg") ;
+ background-repeat: repeat;
+ background-size: cover;
+ padding-bottom: 0;
+}
+
+table{
+ background-color: lightblue;
+}
+
+/* Periodic Table heading */
+h1 {
+ color: lightblue;
+ text-shadow: 0 0 6px #D4EBF8;
+ text-align: center;
+ font-size: 80px;
+ font-family: "Anton", sans-serif;
+ font-weight: 400;
+ font-style: normal;
+}
+/* Row 0 elements (IA,IIA,etc.) */
+#row0 td {
+ font-weight: 900;
+}
+
+/* f-block table */
+#f-block{
+ padding: 8%;
+}
+
+/* To set the color of in-table text and remove underline of hyperlink */
+a{
+ text-decoration: none;
+ color: black;
+ font-weight: bold;
+}
+
+table tr td{
+ font-size: 23px;
+ height: 50px;
+ width: 50px;
+}
+table tr td div{
+ font-size: 18px;
+}
+/* Atomic number in the table */
+.at_no{
+ text-align: right;
+ color: black;
+}
+/* Name of blocks */
+.title{
+ text-align: center;
+ font-weight: bold;
+ text-shadow: 1px 1px 1px grey;
+}
+
+ /* table box color */
+.other_non_metals{
+ background-color:#21ed1a;
+}
+
+.alkali_metals{
+ background-color: orangered;
+}
+
+.alkaline_earth_metals{
+ background-color: gold;
+}
+
+.transition_metals{
+ background-color: lightcoral;
+}
+
+#lanthanoids,#La td{
+ background-color: lightsalmon;
+}
+
+#actinoids,#Ac td{
+ background-color: #d966ff;
+}
+
+.post_transition_metals{
+ background-color: lightgrey;
+}
+
+.metalloids{
+ background-color: #0dd9d9;
+}
+
+.halogens{
+ background-color: #66ffff;
+}
+
+.noble_gas{
+ background-color: #4d94ff;
+}
+
+
+footer {
+ bottom: 0;
+ width: 100%;
+ background-color: #333;
+ color: white;
+ text-align: center;
+ padding: 0.5rem 0;
+}
+
+footer nav ul {
+ list-style-type: none;
+ padding: 0;
+ display: flex;
+ justify-content: center;
+ margin: 0;
+}
+
+footer nav ul li {
+ margin: 0 1rem;
+}
+
+footer nav ul li a {
+ color: white;
+ text-decoration: none;
+}
+
+footer nav ul li a:hover {
+ text-decoration: underline;
+}
diff --git a/public/trends.css b/public/trends.css
new file mode 100644
index 0000000..4e79c75
--- /dev/null
+++ b/public/trends.css
@@ -0,0 +1,76 @@
+/* General Styles */
+body {
+ font-family: Arial, sans-serif;
+ margin: 0;
+ padding: 0;
+ background-color: #f4f4f4;
+ color: #333;
+ line-height: 1.6;
+ }
+
+ header {
+ background-color: #5783bd;
+ color: white;
+ padding: 1.5rem 0;
+ text-align: center;
+ }
+
+ main {
+ padding: 2rem;
+ }
+
+ /* Section Styles */
+ h2 {
+ color: #1e3d59;
+ margin-bottom: 1rem;
+ }
+
+ .trend {
+ background: #fff;
+ padding: 1rem;
+ border-left: 5px solid rgb(89, 157, 217);
+ margin-bottom: 1.5rem;
+ box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
+ }
+
+ .trend h2 {
+ margin-top: 0;
+ }
+
+ .trend p {
+ margin-top: 0.5rem;
+ }
+
+
+ /* footer nav bar */
+
+ footer {
+ bottom: 0;
+ width: 100%;
+ background-color: #333;
+ color: white;
+ text-align: center;
+ padding: 0.5rem 0;
+ }
+
+ footer nav ul {
+ list-style-type: none;
+ padding: 0;
+ display: flex;
+ justify-content: center;
+ margin: 0;
+ }
+
+ footer nav ul li {
+ margin: 0 1rem;
+ }
+
+ footer nav ul li a {
+ color: white;
+ text-decoration: none;
+ }
+
+ footer nav ul li a:hover {
+ text-decoration: underline;
+ }
+
\ No newline at end of file
diff --git a/public/trends.html b/public/trends.html
new file mode 100644
index 0000000..80140dd
--- /dev/null
+++ b/public/trends.html
@@ -0,0 +1,72 @@
+
+
+
+ Trends in the Periodic Table
+
+ Trends in the Periodic Table
+
+
+
+
+ 1. Atomic Radius
+
+ The atomic radius decreases across a period from left to right due to
+ the increasing nuclear charge. However, it increases down a group
+ because of the addition of electron shells.
+
+
+
+
+ 2. Ionization Energy
+
+ Ionization energy increases across a period as the attraction between
+ the nucleus and electrons strengthens, requiring more energy to remove
+ an electron. It decreases down a group due to increased atomic size.
+
+
+
+
+ 3. Electronegativity
+
+ Electronegativity increases across a period as atoms attract electrons
+ more strongly. It decreases down a group as the atomic size increases,
+ reducing the nucleus' pull on bonding electrons.
+
+
+
+
+ 4. Metallic and Non-Metallic Character
+
+ Metallic character decreases across a period and increases down a
+ group. Non-metallic character shows the opposite trend, increasing
+ across a period and decreasing down a group.
+
+
+
+
+ 5. Reactivity
+
+ Reactivity in metals increases down a group, while for non-metals, it
+ decreases. Across a period, reactivity in metals decreases, and in
+ non-metals, it increases.
+
+
+
+
+
+
+
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+