-
-
- 
-
- - - -
-
+
+
+
+
+
+
+
+
+
+
diff --git a/new-website/mainstyle.css b/new-website/mainstyle.css
index 9f0febfc..7e65c0a1 100644
--- a/new-website/mainstyle.css
+++ b/new-website/mainstyle.css
@@ -1450,36 +1450,46 @@ body::-webkit-scrollbar-thumb:hover {
}
/* FOOTER STYLES */
+.footer-container {
+ padding: 20px;
+ background-color: #f8f8f8; /* Light background color */
+}
-.footerclass a{
- transition:all 0.3s linear;
+.footer-title {
+ font-size: 1.5em;
+ margin: 0;
}
-.footerclass a:hover{
- color:#00aaff;
- font:bolder;
- text-decoration: underline;
+.footer-description {
+ margin: 10px 0;
+}
+
+.footer-links {
+ list-style: none;
+ padding: 0;
+}
+
+.footer-links li {
+ margin: 5px 0;
}
-/* CONTENT DISPLAY PAGE STYLES */
+.footer-icons {
+ display: flex;
+ gap: 10px; /* Space between icons */
+}
-#project-title {
+.footer-bottom {
text-align: center;
- font-size: 48px;
margin-top: 20px;
- font-family: 'Arial', sans-serif;
}
-.dark-mode {
- background-color: #000000;
- color: white;
+.footer-horizontal-line {
+ border-top: 1px solid #ccc; /* Example horizontal line */
+ margin: 20px 0;
}
-.light-mode
-{
- background-color: white;
- color: black;
-}
+
+
/* Toggle button style */
diff --git a/new-website/style.css b/new-website/style.css
index d4a2b126..7359408d 100644
--- a/new-website/style.css
+++ b/new-website/style.css
@@ -1398,12 +1398,13 @@ body{
flex-direction: column;
align-items: center;
width: 100%;
- max-width: 100%;
+ max-width:100%;
background-color: #e0e0e0d0;
color: black;
padding: 20px;
box-sizing: border-box;
- margin: 40px auto;
+
+ margin: 0; /* Removed unnecessary margin */
}
.footer-content {
@@ -1411,6 +1412,8 @@ body{
justify-content: space-between;
align-items: flex-start;
width: 100%;
+ max-width: 1200px;
+ flex-wrap: wrap;
}
.footer-left,
@@ -1423,18 +1426,21 @@ body{
.logo-and-title {
display: flex;
- align-items: center; /* Align items vertically */
+ align-items: center;
+
+
}
.logo-and-title img {
- width: 50px; /* Adjust the width as needed */
- height: auto; /* Maintain aspect ratio */
- margin-right: 10px; /* Adjust the margin as needed */
+ width: 50px;
+ height: auto;
+ margin-right: 10px;
margin-top: -15px;
}
.footer-right {
- margin-top: 6%;
+ margin-top: 3%;
+
}
.footer-title {
@@ -1452,12 +1458,13 @@ body{
.footer-icons {
display: flex;
- color: black;
- align-items: center; /* Align items vertically in the center */
+ color:black;
+ align-items: center;
+ margin-top: 10px;
}
.footer-icons a {
- margin-right: 10px;
+ margin-right: 10px; /* Fixed spacing between icons */
color: black;
}
@@ -1465,41 +1472,43 @@ body{
list-style: none;
color: white;
padding: 0;
- padding-left: 300px; /* Add right padding to move the links towards the right */
+ padding-left: 300px;
}
.footer-links li {
margin-bottom: 10px;
- position: relative; /* To position the pseudo-element */
+ position: relative;
}
.footer-links a {
color: black;
text-decoration: underline;
font-size: 1em;
- padding-left: 30px; /* Increased padding to make space for the larger arrow */
- position: relative; /* Position relative for absolute positioning of arrow */
+ padding-left: 30px;
+ position: relative;
}
.footer-links a::before {
- content: '→'; /* Unicode for right arrow */
+ content: '→';
position: absolute;
left: 0;
top: 50%;
- transform: translateY(-50%); /* Center the arrow vertically */
+ transform: translateY(-50%);
color: black;
- font-size: 1.5em; /* Increase the font size to make the arrow larger */
- height: 1.5em; /* Set the height of the arrow */
- width: 1.5em; /* Set the width of the arrow */
+ font-size: 1.5em;
+ height:1.5rem;
+ width:1.5rem;
}
.bottom{
- background-color: #e1b6b6;
+ background-color:#e1b6b6;
}
+
.footer-horizontal-line {
border: 1px solid #000;
margin: 3px 0;
padding-inline-end: 100%;
}
+
.footer-bottom {
text-align: center;
margin-top: 20px;
@@ -1511,6 +1520,7 @@ body{
color: rgb(68 110 201);
font-weight: bold;
}
+
.footer-links-below {
text-align: center;
margin-top: 10px;
@@ -1537,16 +1547,17 @@ body{
.footer-links-below a:hover {
color: #555;
}
-/* Back-to-top */
+/* Back-to-top */
footer {
position: relative;
padding: 50px 0;
}
+
#back-to-top-container {
position: fixed;
bottom: 30px;
- right: 30px;
+ right: 30px;
cursor: pointer;
z-index: 1000;
}
@@ -1561,35 +1572,36 @@ footer {
}
#back-to-top {
- width: 40px;
- height: 40px;
+ width: 40px;
+ height: 40px;
fill: currentColor;
transition: fill 0.3s;
}
#back-to-top:hover {
fill: rgb(83, 79, 79);
- transform: scale(1.06);
- transition: all .2s ease-in-out;
+ transform: scale(1.06);
+ transition: all 0.2s ease-in-out;
}
.dark .circle1 {
- background-color: #000000;
+ background-color: #000;
}
.dark #back-to-top:hover {
fill: rgb(207, 200, 200);
- transform: scale(1.06);
- transition: all .2s ease-in-out;
}
+
@media (max-width: 670px) {
.footer-content {
flex-direction: column;
text-align: center;
}
- .footer-left, .footer-right {
- min-width: 100%;
+ .footer-left,
+ .footer-right {
+ width: 100%;
+ padding-right: 0;
}
.footer-right {
@@ -1597,16 +1609,13 @@ footer {
}
.footer-icons {
- display: flex;
justify-content: center;
- width: 100%;
gap: 20px;
}
.footer-links {
- align-items: center;
+ padding-left: 0;
text-align: center;
- padding: 0px;
}
}
@@ -1616,47 +1625,19 @@ footer {
}
.footer-links {
- align-items: center;
text-align: start;
}
}
+/* Dark mode adjustments */
.dark svg path {
- fill: rgb(255, 255, 255);
+ fill: #fff;
}
.dark svg path:hover {
- fill: rgb(207, 200, 200);
+ fill: #cfc8c8;
}
.hov:hover {
color: rgba(58, 113, 224, 0.755);
}
-
-#back-to-top-container {
- position: fixed;
- bottom: 30px;
- right: 30px;
- cursor: pointer;
- z-index: 1000;
-}
-
-.circle1 {
- background-color: #fff;
- border-radius: 50%;
- display: flex;
- justify-content: center;
- align-items: center;
- transition: background-color 0.3s;
-}
-
-#back-to-top {
- width: 40px;
- height: 40px;
- fill: currentColor;
- transition: fill 0.3s;
-}
-
-#back-to-top:hover {
- fill: rgba(58, 55, 55);
-}
- ResourceHub
+ + + +
+
+ + + -
+
+
+ +
+
+
+
+
+
+
+ ResourceHub
++ +
+ + + -
- - - -
-
-
-
-
-