CiF
/
mainpage
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

new file: CiF Logo Gold.svg

Browse Source 
new file:   V2/CiF Logo Gold.svg
	modified:   index.html
	new file:   script.js
	modified:   style.css
main
anthony 3 weeks ago
parent d3cbb4c528
commit f8b0c6b9c9
6 changed files with 671 additions and 23 deletions
Show Stats Download Patch File Download Diff File

BIN
.fuse_hidden00012dd100000001
View File

Binary file not shown.

137
CiF Logo Gold.svg
Unescape Escape View File

@ -0,0 +1,137 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
height="594.962"
width="600"
version="1.1"
id="svg16"
sodipodi:docname="Coat of arms of East-Germany Gold.svg"
inkscape:version="1.4 (e7c3feb100, 2024-10-09)"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:xlink="http://www.w3.org/1999/xlink"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<defs
id="defs16" />
<sodipodi:namedview
id="namedview16"
pagecolor="#ffffff"
bordercolor="#000000"
borderopacity="0.25"
inkscape:showpageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#d1d1d1"
inkscape:zoom="0.92442883"
inkscape:cx="300.18536"
inkscape:cy="297.48099"
inkscape:window-width="1243"
inkscape:window-height="756"
inkscape:window-x="371"
inkscape:window-y="122"
inkscape:window-maximized="0"
inkscape:current-layer="g16" />
<g
transform="matrix(3.1679 0 0 3.1679 -.95 -.947)"
fill="#fc0"
stroke="#000"
stroke-width="1.4"
stroke-linecap="round"
stroke-linejoin="round"
id="g16">
<use
xlink:href="#a"
transform="matrix(-1 0 0 1 190 0)"
width="100%"
height="100%"
id="use1"
style="stroke:#000000;stroke-opacity:1;fill:#00d791;fill-opacity:1" />
<path
d="M84 49h22v112H84z"
id="path1"
style="stroke:#00d791;stroke-opacity:1;fill:#00d791;fill-opacity:1" />
<path
d="M64 54h52l16 21v7H64z"
id="path2"
style="stroke:#00d791;stroke-opacity:1;fill:#00d791;fill-opacity:1" />
<g
id="a"
style="stroke:#000000;stroke-opacity:1">
<g
fill="none"
id="g3"
style="stroke:#000000;stroke-opacity:1">
<path
d="M370 495c-15-28-41-45-72-48M367 498c-14-28-41-45-71-47M365 501c-14-26-36-43-70-46M362 504c-12-24-35-43-68-45M357 502c-15-24-35-37-62-39M354 505c-12-21-30-35-58-38M350 506c-11-19-28-32-53-35"
transform="translate(-194 -446)"
id="path3"
style="stroke:#00d791;stroke-opacity:1;fill:none;fill-opacity:1" />
</g>
<path
d="M262 629h13c37-8 64-23 79-45s17-50 4-81 0-1 1-1h1c14 32 11 60-4 83s-43 40-80 48c-8 2-14-4-14-4z"
transform="translate(-194 -446)"
id="path4"
style="stroke:#00d791;stroke-opacity:1;fill:#00d791;fill-opacity:1" />
<path
d="M370 495c7 31-21 18 0 0z"
transform="translate(-194 -446)"
id="path5"
style="stroke:#00d791;stroke-opacity:1;fill:#00d791;fill-opacity:1" />
<path
d="M346 503c31 5 9 27 0 0z"
transform="translate(-194 -446)"
id="path6"
style="stroke:#00d791;stroke-opacity:1;fill:#00d791;fill-opacity:1" />
<path
d="M378 509c3 39-25 20 0 0z"
transform="translate(-194 -446)"
id="path7"
style="stroke:#00d791;stroke-opacity:1;fill:#00d791;fill-opacity:1" />
<path
d="M352 517c32 10 4 28 0 0zM381 528c0 32-29 22 0 0z"
transform="translate(-194 -446)"
id="path8"
style="stroke:#00d791;stroke-opacity:1;fill:#00d791;fill-opacity:1" />
<path
d="M355 530c0 35 27 15 0 0z"
transform="translate(-194 -446)"
id="path9"
style="stroke:#00d791;stroke-opacity:1;fill:#00d791;fill-opacity:1" />
<path
d="M383 546c-7 33-35 17 0 0z"
transform="translate(-194 -446)"
id="path10"
style="stroke:#00d791;stroke-opacity:1;fill:#00d791;fill-opacity:1" />
<path
d="M353 544c0 32 27 18 0 0z"
transform="translate(-194 -446)"
id="path11"
style="stroke:#00d791;stroke-opacity:1;fill:#00d791;fill-opacity:1" />
<path
d="M379 565c-12 31-34 7 0 0z"
transform="translate(-194 -446)"
id="path12"
style="stroke:#00d791;stroke-opacity:1;fill:#00d791;fill-opacity:1" />
<path
d="M351 556c-6 33 21 24 0 0zM370 585c-8 16-20 15-21 11-1-2-4-6 21-11zM359 603c-20 22-43-7 0 0z"
transform="translate(-194 -446)"
id="path13"
style="stroke:#00d791;stroke-opacity:1;fill:#00d791;fill-opacity:1" />
<path
d="M337 583c-24 28 8 32 0 0z"
transform="translate(-194 -446)"
id="path14"
style="stroke:#00d791;stroke-opacity:1;fill:#00d791;fill-opacity:1" />
<path
d="M343 618c-37-15-29 18 0 0z"
transform="translate(-194 -446)"
id="path15"
style="stroke:#00d791;stroke-opacity:1;fill:#00d791;fill-opacity:1" />
<path
d="M323 594c-28 23 4 35 0 0zM353 491c-3 29 25 15 0 0zM346 569c-9 15-4 24 0 23s7 1 0-23z"
transform="translate(-194 -446)"
id="path16"
style="stroke:#00d791;stroke-opacity:1;fill:#00d791;fill-opacity:1" />
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 4.9 KiB

75
V2/CiF Logo Gold.svg
Unescape Escape View File

@ -0,0 +1,75 @@
<svg
xmlns:xlink="http://www.w3.org/1999/xlink"
xmlns="http://www.w3.org/2000/svg">
<g
transform="matrix(3.1679,0,0,3.1679,-0.95,-0.947)"
stroke-width="1.4"
stroke-linecap="round"
stroke-linejoin="round"
id="g16">
<use
xlink:href="#a"
transform="matrix(-1,0,0,1,190,0)"
width="100%"
height="100%"
id="use1"/>
<path
d="m 84,49 h 22 V 161 H 84 Z"
id="path1"/>
<path
d="m 64,54 h 52 l 16,21 v 7 H 64 Z"
id="path2"/>
<g
id="a"
style="stroke:#000000;stroke-opacity:1">
<g
fill="none"
id="g3">
<path
d="m 370,495 c -15,-28 -41,-45 -72,-48 m 69,51 c -14,-28 -41,-45 -71,-47 m 69,50 c -14,-26 -36,-43 -70,-46 m 67,49 c -12,-24 -35,-43 -68,-45 m 63,43 c -15,-24 -35,-37 -62,-39 m 59,42 c -12,-21 -30,-35 -58,-38 m 54,39 c -11,-19 -28,-32 -53,-35"
transform="translate(-194,-446)"/>
</g>
<path
d="m 262,629 h 13 c 37,-8 64,-23 79,-45 15,-22 17,-50 4,-81 -13,-31 0,-1 1,-1 h 1 c 14,32 11,60 -4,83 -15,23 -43,40 -80,48 -8,2 -14,-4 -14,-4 z"
transform="translate(-194,-446)"/>
<path
d="m 370,495 c 7,31 -21,18 0,0 z"
transform="translate(-194,-446)"/>
<path
d="m 346,503 c 31,5 9,27 0,0 z"
transform="translate(-194,-446)"/>
<path
d="m 378,509 c 3,39 -25,20 0,0 z"
transform="translate(-194,-446)"/>
<path
d="m 352,517 c 32,10 4,28 0,0 z m 29,11 c 0,32 -29,22 0,0 z"
transform="translate(-194,-446)" />
<path
d="m 355,530 c 0,35 27,15 0,0 z"
transform="translate(-194,-446)"/>
<path
d="m 383,546 c -7,33 -35,17 0,0 z"
transform="translate(-194,-446)"/>
<path
d="m 353,544 c 0,32 27,18 0,0 z"
transform="translate(-194,-446)"/>
<path
d="m 379,565 c -12,31 -34,7 0,0 z"
transform="translate(-194,-446)"/>
<path
d="m 351,556 c -6,33 21,24 0,0 z m 19,29 c -8,16 -20,15 -21,11 -1,-2 -4,-6 21,-11 z m -11,18 c -20,22 -43,-7 0,0 z"
transform="translate(-194,-446)"/>
<path
d="m 337,583 c -24,28 8,32 0,0 z"
transform="translate(-194,-446)"/>
<path
d="m 343,618 c -37,-15 -29,18 0,0 z"
transform="translate(-194,-446)"/>
<path
d="m 323,594 c -28,23 4,35 0,0 z m 30,-103 c -3,29 25,15 0,0 z m -7,78 c -9,15 -4,24 0,23 4,-1 7,1 0,-23 z"
transform="translate(-194,-446)"/>
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.5 KiB

99
index.html
Unescape Escape View File

@ -1,19 +1,96 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html lang="en">
<head> <head>
<a rel="me" href="https://mastodon.cif.su/@anthony">Mastodon</a>
<link rel="stylesheet" href="./style.css"> <link rel="stylesheet" href="./style.css">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Communist Internet Federation</title> <title>Communist Internet Federation</title>
</head> </head>
<body> <body>
<h1 class="slidefadein">Communist Internet Federation</h1> <div class="page" id="page1">
<p class="slidefadein">This side is still heavily under construction</p> <h1 class="slidefadein title">[ CiF ].su</h1>
<p class="slidefadein">In the meantime check out our <a href="https://lemmy.cif.su/">Lemmy Instance</a></p> <h2 class="slidefadein">Let's change the World for the Better. Together. Bit for <span class="glitch">Bit</span>.</h2>
<div class="background-arms">
<div class="sunken-arms">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 600 594.962">
<g transform="matrix(3.1679 0 0 3.1679 -.95 -.947)">
<!-- Main filled parts -->
<path class="filled" d="M84 49h22v112H84z"/>
<path class="filled" d="M64 54h52l16 21v7H64z"/>
<!-- Left awns (stroke only) -->
<path class="stroked" d="M370 495c-15-28-41-45-72-48M367 498c-14-28-41-45-71-47M365 501c-14-26-36-43-70-46M362 504c-12-24-35-43-68-45M357 502c-15-24-35-37-62-39M354 505c-12-21-30-35-58-38M350 506c-11-19-28-32-53-35" transform="translate(-194 -446)"/>
<!-- Left filled parts -->
<path class="filled" d="M262 629h13c37-8 64-23 79-45s17-50 4-81 0-1 1-1h1c14 32 11 60-4 83s-43 40-80 48c-8 2-14-4-14-4z" transform="translate(-194 -446)"/>
<path class="filled" d="M370 495c7 31-21 18 0 0z" transform="translate(-194 -446)"/>
<path class="filled" d="M346 503c31 5 9 27 0 0z" transform="translate(-194 -446)"/>
<path class="filled" d="M378 509c3 39-25 20 0 0z" transform="translate(-194 -446)"/>
<path class="filled" d="M352 517c32 10 4 28 0 0zM381 528c0 32-29 22 0 0z" transform="translate(-194 -446)"/>
<path class="filled" d="M355 530c0 35 27 15 0 0z" transform="translate(-194 -446)"/>
<path class="filled" d="M383 546c-7 33-35 17 0 0z" transform="translate(-194 -446)"/>
<path class="filled" d="M353 544c0 32 27 18 0 0z" transform="translate(-194 -446)"/>
<path class="filled" d="M379 565c-12 31-34 7 0 0z" transform="translate(-194 -446)"/>
<path class="filled" d="M351 556c-6 33 21 24 0 0zM370 585c-8 16-20 15-21 11-1-2-4-6 21-11zM359 603c-20 22-43-7 0 0z" transform="translate(-194 -446)"/>
<path class="filled" d="M337 583c-24 28 8 32 0 0z" transform="translate(-194 -446)"/>
<path class="filled" d="M343 618c-37-15-29 18 0 0z" transform="translate(-194 -446)"/>
<path class="filled" d="M323 594c-28 23 4 35 0 0zM353 491c-3 29 25 15 0 0zM346 569c-9 15-4 24 0 23s7 1 0-23z" transform="translate(-194 -446)"/>
<!-- Right awns (stroke only, mirrored) -->
<path class="stroked" d="M370 495c-15-28-41-45-72-48M367 498c-14-28-41-45-71-47M365 501c-14-26-36-43-70-46M362 504c-12-24-35-43-68-45M357 502c-15-24-35-37-62-39M354 505c-12-21-30-35-58-38M350 506c-11-19-28-32-53-35" transform="translate(384 -446) scale(-1,1)"/>
<!-- Right filled parts (mirrored) -->
<path class="filled" d="M262 629h13c37-8 64-23 79-45s17-50 4-81 0-1 1-1h1c14 32 11 60-4 83s-43 40-80 48c-8 2-14-4-14-4z" transform="translate(384 -446) scale(-1,1)"/>
<path class="filled" d="M370 495c7 31-21 18 0 0z" transform="translate(384 -446) scale(-1,1)"/>
<path class="filled" d="M346 503c31 5 9 27 0 0z" transform="translate(384 -446) scale(-1,1)"/>
<path class="filled" d="M378 509c3 39-25 20 0 0z" transform="translate(384 -446) scale(-1,1)"/>
<path class="filled" d="M352 517c32 10 4 28 0 0zM381 528c0 32-29 22 0 0z" transform="translate(384 -446) scale(-1,1)"/>
<path class="filled" d="M355 530c0 35 27 15 0 0z" transform="translate(384 -446) scale(-1,1)"/>
<path class="filled" d="M383 546c-7 33-35 17 0 0z" transform="translate(384 -446) scale(-1,1)"/>
<path class="filled" d="M353 544c0 32 27 18 0 0z" transform="translate(384 -446) scale(-1,1)"/>
<path class="filled" d="M379 565c-12 31-34 7 0 0z" transform="translate(384 -446) scale(-1,1)"/>
<path class="filled" d="M351 556c-6 33 21 24 0 0zM370 585c-8 16-20 15-21 11-1-2-4-6 21-11zM359 603c-20 22-43-7 0 0z" transform="translate(384 -446) scale(-1,1)"/>
<path class="filled" d="M337 583c-24 28 8 32 0 0z" transform="translate(384 -446) scale(-1,1)"/>
<path class="filled" d="M343 618c-37-15-29 18 0 0z" transform="translate(384 -446) scale(-1,1)"/>
<path class="filled" d="M323 594c-28 23 4 35 0 0zM353 491c-3 29 25 15 0 0zM346 569c-9 15-4 24 0 23s7 1 0-23z" transform="translate(384 -446) scale(-1,1)"/>
</g>
</svg>
</div>
</div>
</div>
<div class="page" id="page2">
<div class="card neomorphic about">
<h1>Oh Fuck...</h1>
<p>The World is on Fire. Figuratifly and Litterally. Big Coorperations are Destroying the Planet, Manipulating Politics and Robbing every single one of us. IT'S TIME TO FIGHT BACK. Saddly, we can't change everything at once, Guns Blazing (Even if we REALLY Would Like to...), so we're starting at the Most important Pillar of the Modern World. The Internet.</p>
</div>
<div class="card neomorphic mission">
<h1>Our Mission:</h1>
<p>Free, Open-Source, User-First Software that respects Privacy. No Ads, no Sponsors, no Trackers and Databrokers. Everything financed with Donation, and made and maintained by Volunteers.</p>
</div>
<div class="card neomorphic principals">
<h1>Our Principals</h1>
<ul>
<li><h2>Transparancy</h2><p>All of our work is uploaded to our open Git-Reposetory, even if early development stages, or if they're not even ment for public use.</p></li>
<li><h2>Federation And Unification</h2><p>All Projects that rely on server based Information, have to make sure, that other servers can Interact and can be interacted with, on an Eye-to-Eye Level.</p></li>
<li><h2>Open-Lock Policy</h2><p>We have to make sure all of our projects are build in a way that gives the User the Posibility to leave our Ecosystem, without loosing any Features or Accumulated Userdata, as long as technically possible.</p></li>
<li><h2>Democracy</h2><p>All Decisionmaking, has to be made on a Anarchic-Democratic basis, involving ALL volunteering [CiF] Members</p></li>
<li><h2>Freedom of Speech</h2><p>To ensure Freedom of Speech, all Moderation work has to be documented and publically displayed, with only the most necesary elements obscured.</p></li>
</ul>
<footer> </div>
<p><a href="https://search.cif.su/">Search</a></p>
<p><a href="https://lemmy.cif.su/">Lemmy</a></p> <div class="card neomorphic projects">
<p><a href="https://code.cif.su">Code</a></p> <h1>Our Projects </h1>
</footer> <ul>
<li class="cards1 neomorphic-i project"><img src="https://code.cif.su/CiF/Branding/raw/branch/main/CiF-Lemmy.svg" class="cards2 neomorphic2"/><div class="info"><h2><a href="https://lemmy.cif.su">Lemmy</a></h2><p>A Forum based Social-Media Platform Similar to Reddit and 4Chan. Fully Compatible with the Fediverse. A good place for Discussion and Advice</p></div></li>
<li class="cards1 neomorphic-i project"><img src="https://code.cif.su/CiF/Branding/raw/branch/main/CiF-Peertube.svg" class="cards2 neomorphic2"/><div class="info"><h2><a href="https://peertube.cif.su">Peertube</a></h2><p>A Forum based Social-Media Platform Similar to Reddit and 4Chan. Fully Compatible with the Fediverse. A good place for Discussion and Advice</p></div></li>
<li class="cards1 neomorphic-i project"><img src="https://code.cif.su/CiF/Branding/raw/branch/main/CiF-Mastodon.svg" class="cards2 neomorphic2"/><div class="info"><h2><a href="https://mastodon.cif.su">Mastodon</a></h2><p>A Forum based Social-Media Platform Similar to Reddit and 4Chan. Fully Compatible with the Fediverse. A good place for Discussion and Advice</p></div></li>
<li class="cards1 neomorphic-i project"><h2><a href="https://code.cif.su">Git</a></h2></li>
</ul>
</div>
</div>
<script src="./script.js"></script>
</body> </body>
</html>
</html>

40
script.js
Unescape Escape View File

@ -0,0 +1,40 @@
let initialScrollDone = false;
window.addEventListener('wheel', (e) => {
if (!initialScrollDone && e.deltaY > 0) {
// Only trigger on initial downward scroll
e.preventDefault();
window.scrollTo({
top: window.innerHeight,
behavior: 'smooth'
});
initialScrollDone = true;
// Enable normal scrolling after a short delay
setTimeout(() => {
document.body.style.overflow = 'auto';
}, 10);
}
});
// Touch handling for mobile devices
let startY;
window.addEventListener('touchstart', (e) => {
startY = e.touches[0].clientY;
});
window.addEventListener('touchmove', (e) => {
const currentY = e.touches[0].clientY;
if (!initialScrollDone && currentY < startY) {
// Only trigger on initial upward touch move
e.preventDefault();
window.scrollTo({
top: window.innerHeight,
behavior: 'smooth'
});
initialScrollDone = true;
// Enable normal scrolling after a short delay
setTimeout(() => {
document.body.style.overflow = 'auto';
}, 10);
}
});

343
style.css
Unescape Escape View File

@ -3,19 +3,146 @@
src: url("./FuturaLT-Heavy.ttf") format("truetype"); src: url("./FuturaLT-Heavy.ttf") format("truetype");
} }
body{ * {
position:absolute; margin: 0;
margin-top: 10px; padding: 0;
font-family: "Futura"; box-sizing: border-box;
}
body {
overflow: hidden;
height: 100vh;
scroll-behavior: smooth;
text-align: center;
position: absolute;
margin-top: 10px;
font-family: "Futura";
width: 100%; /* Full width */
}
.page {
width: 100%;
display: flex;
justify-content: center;
align-items: center;
font-size: 3rem;
flex-direction: column; /* Stack children vertically */
}
#page1 {
height: 100vh;
background-color: #fff3f9;
color: rgb(0, 0, 0);
}
.title{
font-size: 120px;
z-index: 1;
color: #ff5a99;
}
#page2 {
background-color: #ffa7c7;
color: white;
}
h2 {
font-size: 25pt;
z-index: 1
} }
footer{ .glitch {
position: fixed; position: relative;
bottom: 0px; display: inline-block;
width:100%; animation: glitch 1.2s infinite steps(1); /* Instant snaps */
height: 75px; }
display: flex;
justify-content: space-around; /* MAIN GLITCH (Subtler movements, more variations) */
@keyframes glitch {
/* Normal state (longer pauses) */
0%, 60%, 62%, 70%, 100% {
transform: translate(0) skew(0deg) scale(1);
text-shadow: none;
}
/* Micro-glitch variations */
2% {
transform: translate(1px, -1px) skew(-2deg) scale(1.01);
text-shadow: 1px 0 rgba(255, 0, 0, 0.7);
}
5% {
transform: translate(-1px, 1px) skew(1deg) scale(0.99);
text-shadow: -1px 0 rgba(0, 0, 255, 0.7);
}
15% {
transform: translate(2px, 0) skew(-3deg) rotate(0.5deg);
}
25% {
transform: translate(-1px, -1px) skew(2deg) scaleY(1.02);
}
35% {
transform: translate(0, 1px) skew(-1deg) rotate(-0.3deg);
text-shadow: 0 1px rgba(0, 255, 255, 0.5);
}
45% {
transform: translate(1px, -1px) skew(1deg) scaleX(1.01);
}
55% {
transform: translate(-2px, 0) skew(-2deg) rotate(0.2deg);
}
65% {
transform: translate(0, -1px) skew(1deg) scaleY(0.98);
}
80% {
transform: translate(1px, 1px) skew(-1deg) rotate(-0.1deg);
text-shadow: -1px -1px rgba(255, 0, 255, 0.4);
}
90% {
transform: translate(-1px, 0) skew(0.5deg) scale(1.005);
}
}
/* PSEUDO-ELEMENTS (Subtle color splits) */
.glitch:before,
.glitch:after {
content: attr(data-text);
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
opacity: 0.8;
animation: none; /* Disable smooth animations */
}
.glitch:before {
color: rgba(0, 255, 255, 0.7); /* Cyan */
clip-path: polygon(0 0, 100% 0, 100% 30%, 0 30%);
transform: translate(-0.5px, -0.3px);
animation: glitch-before 1.5s infinite steps(1);
}
.glitch:after {
color: rgba(255, 0, 255, 0.7); /* Magenta */
clip-path: polygon(0 70%, 100% 70%, 100% 100%, 0 100%);
transform: translate(0.5px, 0.2px);
animation: glitch-after 1.8s infinite steps(1);
}
/* Pseudo-element glitches (tiny offsets) */
@keyframes glitch-before {
0%, 100% { transform: translate(-0.5px, -0.3px); }
10% { transform: translate(-1px, 0) skew(1deg); }
30% { transform: translate(0, -0.5px) scaleY(1.02); }
50% { transform: translate(-0.7px, 0.2px) skew(-0.5deg); }
70% { transform: translate(0.3px, -0.3px); }
}
@keyframes glitch-after {
0%, 100% { transform: translate(0.5px, 0.2px); }
20% { transform: translate(0.7px, -0.2px) skew(-0.3deg); }
40% { transform: translate(0, 0.5px) scaleY(0.98); }
60% { transform: translate(-0.3px, 0) skew(0.2deg); }
80% { transform: translate(0.2px, 0.3px); }
} }
.slidefadein { .slidefadein {
@ -29,4 +156,196 @@ footer{
opacity: 1; opacity: 1;
transform: translateY(0); transform: translateY(0);
} }
} }
footer{
position: fixed;
bottom: 0px;
width:100%;
height: 75px;
display: flex;
justify-content: space-around;
}
.background-arms {
position: absolute;
width: 100%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
z-index: 0;
}
.sunken-arms {
width: 80vmin;
height: 80vmin;
max-width: 600px;
max-height: 600px;
opacity: 1; /* Subtle background appearance */
filter:
drop-shadow(0.5px 0.5px rgba(255, 255, 255, 0.3))
drop-shadow(-0.5px -0.5px rgba(176, 62, 106, 0.3));
}
.sunken-arms svg {
width: 100%;
height: 100%;
}
/* Style for filled paths */
.filled {
fill: #ffebf2;
stroke: #ffebf2;
stroke-width: 1.4;
stroke-linecap: round;
stroke-linejoin: round;
filter:
drop-shadow(inset 0.5px 0.5px rgba(176, 62, 106, 0.3))
drop-shadow(inset -0.5px -0.5px rgba(255, 255, 255, 0.3));
}
/* Style for stroke-only paths (awns) */
.stroked {
fill: none;
stroke: #ffebf2;
stroke-width: 1.4;
stroke-linecap: round;
stroke-linejoin: round;
filter:
drop-shadow(inset 0.5px 0.5px rgba(255, 255, 255, 0.3))
drop-shadow(inset -0.5px -0.5px rgba(176, 62, 106, 0.3));
}
.mission {
color: #55052c;
}
.mission h1 {
font-size: 50pt;
margin-top: 5pt;
}
.mission p {
font-size: 20pt;
margin-top: 5pt;
margin-bottom: 5pt;
}
.about {
color: #55052c;
}
.about h1 {
font-size: 50pt;
margin-top: 5pt;
}
.about p {
font-size: 20pt;
margin-inline: 20pt;
margin-top: 5pt;
margin-bottom: 5pt;
}
.principals {
color: #55052c;
}
.principals h1 {
font-size: 50pt;
margin-top: 5pt;
}
.principals p {
font-size: 20pt;
margin-inline: 20pt;
margin-top: 5pt;
margin-bottom: 5pt;
}
.project {
color: #55052c;
}
.project h1 {
font-size: 50pt;
margin-top: 5pt;
}
.project p {
font-size: 20pt;
margin-inline: 20pt;
margin-top: 5pt;
margin-bottom: 5pt;
}
.neomorphic{
background: #ffa7c7;
box-shadow: -5px -5px 20px rgb(254,254,255, 0.69),
2px 2px 20px rgb(255,90,153)
}
.neomorphic-i{
background: #ffa7c7;
box-shadow: -3px -3px 15px rgba(254, 254, 255, 0.69) inset,
1px 1px 15px rgb(255,90,153) inset
}
.neomorphic2{
background: #ffa7c7;
box-shadow: -5px -5px 20px rgba(254,254,255,0.5),
2px 2px 20px rgb(255,90,153)
}
.card {
width: 800pt;
height: auto;
border-radius: 20px;
display: flex;
align-items: center;
flex-direction: column;
margin-top: 30pt;
}
.cards1 {
width: 700pt;
height: auto;
border-radius: 40pt;
display: flex;
align-items: center;
flex-direction: row; /* Changed from column to row */
margin-top: 30pt;
gap: 20px; /* Adds some space between image and text */
}
.cards2 {
width: 200px;
height: auto;
border-radius: 40pt;
display: flex;
align-items: center;
flex-direction: column;
}
ul {
list-style-type: none;
}
li {
padding: 10pt;
}
img {
width: 160px;
border-radius: 0 100px 100px 0;
padding: 5px;
}
.info {
display: flex;
flex-direction: column;
}
Write Preview
Loading…
Cancel
Save