pedf
/
spolky
Archived
1
0
Fork 0
Code Pull Requests Releases Activity

mvp

Browse Source
master
Lukáš Hozda 5 years ago
parent fca2e8a6ef
commit 235e0cba86
9 changed files with 715 additions and 50 deletions
Show Stats Download Patch File Download Diff File

15
css/main.css
Unescape Escape View File

@ -124,6 +124,12 @@ body > canvas {
padding: 3rem 9rem;
font-size: calc(var(--font-size) * 0.7);
}
.smol-button {
background-color: #fff !important;
border: solid 0.5vh var(--color-primary);
color: #000 !important;
padding: 1rem 3rem;
}
.horizontal-menu {
font-size: calc(var(--font-size) / 2);
position: absolute;
@ -232,6 +238,12 @@ body > canvas {
.row {
width: 100vw;
}
.hover-man {
transition: 0.3s;
}
.hover-man:hover {
filter: brightness(0.7) contrast(0.7);
}
.down {
display: flex;
flex-direction: column;
@ -241,3 +253,6 @@ body > canvas {
display: flex;
flex-direction: row;
}
.no-underline a {
text-decoration: none !important;
}

15
css/main.styl
Unescape Escape View File

@ -114,6 +114,12 @@ body > canvas
padding: 3rem 9rem
font-size: calc(var(--font-size) * 0.7)
.smol-button
background-color: #fff !important
border: solid 0.5vh var(--color-primary)
color: #000 !important
padding: 1rem 3rem
.horizontal-menu
font-size calc(var(--font-size) / 2)
position: absolute
@ -214,6 +220,11 @@ body > canvas
.row
width: 100vw
.hover-man
transition: .3s
&:hover
filter brightness(.7) contrast(.7)
.down
display flex
flex-direction column
@ -222,3 +233,7 @@ body > canvas
align-items center
display flex
flex-direction row
.no-underline
a
text-decoration none !important

20
index.html
Unescape Escape View File

@ -33,6 +33,10 @@
</ul>
</nav>
</div>
<div class="cross menu-btn">
<img src="svg/menu1.svg" class="idle">
<img src="svg/menu2.svg" class="active">
</div>
<main id="root">
</main>
@ -42,11 +46,15 @@
</div>
<code style="display: none">
clicking on ".cross-og" removes class "open-nav" on ".navigation-overlay"
clicking on ".cross-og" removes class "darken" on "#root"
clicking on ".menu-link" removes class "open-nav" on ".navigation-overlay" no-prevent
clicking on ".menu-btn" adds class "open-nav" on ".navigation-overlay"
clicking on ".menu-btn" adds class "darken" on "#root"
clicking on ".cross-og" toggles class "open-nav" on ".navigation-overlay"
clicking on ".cross-og" toggles class "darken" on "#root"
clicking on ".cross-og" toggles class "darken" on ".menu-btn"
clicking on ".menu-link" toggles class "open-nav" on ".navigation-overlay" no-prevent
clicking on ".menu-link" toggles class "darken" on "#root" no-prevent
clicking on ".menu-link" toggles class "darken" on ".menu-btn" no-prevent
clicking on ".menu-btn" toggles class "open-nav" on ".navigation-overlay"
clicking on ".menu-btn" toggles class "darken" on "#root"
clicking on ".menu-btn" toggles class "darken" on ".menu-btn"
</code>
<script src="https://unpkg.com/@riotjs/dom-bindings/dist/umd.dom-bindings.js"></script>
@ -58,7 +66,7 @@
<script src="js/particles.js"></script>
<script src="js/router.js"></script>
<script src="js/script.js"></script>
<script src="/js/carousel.js"></script>
<script src="js/carousel.js"></script>
<script>
const { initDomListeners, setBase, router } = route;

38
js/carousel.js
Unescape Escape View File

@ -17,18 +17,19 @@ var slideIndex = 1;
// Next/previous controls
function plusSlides(n) {
showSlides(slideIndex += n);
function plusSlides(n, className = "mySlides") {
console.log("changing slides");
showSlides(slideIndex += n, className);
}
// Thumbnail image controls
function currentSlide(n) {
showSlides(slideIndex = n);
function currentSlide(n, className = "mySlides") {
showSlides(slideIndex = n, className);
}
function showSlides(n) {
function showSlides(n, className = "mySlides") {
var i;
var slides = document.getElementsByClassName("mySlides");
var slides = document.getElementsByClassName(className);
var dots = document.getElementsByClassName("dot");
if (n > slides.length) {slideIndex = 1}
if (n < 1) {slideIndex = slides.length}
@ -47,3 +48,28 @@ checkElement('.mySlides') //use whichever selector you want
console.log("sldaldsaldsa");
showSlides(slideIndex);
});
checkElement('.mySlides2') //use whichever selector you want
.then((element) => {
console.log("sldaldsaldsa");
showSlides(slideIndex, "mySlides2");
});
checkElement('.mySlides3') //use whichever selector you want
.then((element) => {
console.log("sldaldsaldsa");
showSlides(slideIndex, "mySlides3");
});
checkElement('.mySlides4') //use whichever selector you want
.then((element) => {
console.log("sldaldsaldsa");
showSlides(slideIndex, "mySlides4");
});
checkElement('.mySlides5') //use whichever selector you want
.then((element) => {
console.log("sldaldsaldsa");
showSlides(slideIndex, "mySlides5");
});

48
js/router.js
View File

File diff suppressed because one or more lines are too long

199
page/prebiram.html
Unescape Escape View File

@ -1,6 +1,199 @@
<section class="row fullheight">
<div class="cross menu-btn">
<img src="svg/menu1.svg" class="idle">
<img src="svg/menu2.svg" class="active">
<div class="logo">
<a href="https://pedf.cuni.cz/PEDF-1.html"><img src="img/logo.png"></a>
</div>
<div class="row" style="width: 100%">
<section class="col-1"></section>
<section class="col-5">
<div style="margin-top: 23vh">
<h1 style="margin-bottom: 5vh">Přebírám spolek</h1>
<hr class="gay-hr">
<h6 style="line-height: 1.4; margin-top: 5vh; font-size: calc(var(--font-size) / 1.75)">
Většinou se stává, že minulý předseda tomu současnému hodně do začátku pomůže a provede ho všemi náležitostmi,
které z toho vyplývají. Ale někdy se tak nestane, a proto jsme s ostatními předsedi dali hlavy dohromady a vytvořili
návod toho, co bys měl/a určitě dělat.
</h6>
<button type="button" class="button primary cool-button" style="margin-top: 1vh; border-radius: 4vw">
↓ Zjisti více
</button>
</div>
</section>
</div>
</section>
<section class="row" style="margin-top: 9rem">
<div class="col-1"></div>
<div class="col-5 bg-square">
<h3>Přebírám formální spolek</h3>
<hr class="gay-hr">
<p style="font-size: calc(var(--font-size) / 2); margin-top: 5vh; text-align: left">
Většinou se stává, že minulý předseda tomu současnému hodně do začátku pomůže a provede ho všemi náležitostmi,
které z toho vyplývají. Ale někdy se tak nestane, a proto jsme s ostatními předsedi dali hlavy dohromady a vytvořili
návod toho, co bys měl/a určitě dělat.
</p>
</div>
</section>
<section class="row" style="margin-top: 5vh">
<div class="col-1"></div>
<div class="col-3 side-line" style="line-height: 1">
<div>
<h6 style="margin-bottom: 0"><b>Postup přebírání</b></h6>
<div>
</div>
</section>
<section class="row" style="margin-top: 5vh">
<div class="col-1"></div>
<div class="col">
<div class="number-gay">
<div class="down">
<span>1.</span>
<h6 style="font-size: calc(var(--font-size) / 1.8)"><b>Seznam se s terminologií</b></h6>
<p>Formální spolek je spolek s IČem a volenými orgány.
Má vlastní účet atp. Neformální spolek je sdružení kamarádů,
které hrozně baví dělat různé věci. Nemá IČO a většinou ani žádné orgány.
Studentská oborová rada pomáhá studentům v komunikaci s katedrou. Hlavní předpisy,
kterými je třeba se řídit jsou tady.</p>
</div>
</div>
<div class="number-gay">
<div class="down">
<span>4.</span>
<h6 style="font-size: calc(var(--font-size) / 1.8)"><b>Přístup ke spolkovému účtu</b></h6>
<p>
Peníze nejsou všechno, ale je dobré mít přístup ke spolkovému účtu.
Sežeň si co nejdříve údaje k němu.
</p>
</div>
</div>
<div class="number-gay">
<div class="down">
<span>7.</span>
<h6 style="font-size: calc(var(--font-size) / 1.8)"><b>Inspiruj se u podobných organizací</b></h6>
<p>
Doporučujeme se podívat, jak to vypadá i v jiných organizacích a spolcích - doporučujeme spolky na UK,
dobře zpracované to má VŠE, v zahraničí (německy: Verbindung, Burschenshaft, anglicky: student society, sorority, fraternity)
</p>
</div>
</div>
<div class="number-gay">
<div class="down">
<span>10.</span>
<h6 style="font-size: calc(var(--font-size) / 1.8)"><b>Nastav fungování týmu</b></h6>
<p>
Nastav si fungování nejbližšího týmu (většinou se mu říká rada). Neboj se ozvat dalším spolkům,
které dobře fungují. Pravděpodobně řešili to samé.
</p>
</div>
</div>
<div class="number-gay">
<div class="down">
<span>13.</span>
<h6 style="font-size: calc(var(--font-size) / 1.8)"><b>Rady od starších</b></h6>
<p>
A aby toho nebylo málo, tady máš rady od bývalých a současných předsedů.
</p>
</div>
</div>
</div>
<div class="col">
<div style="height: 6vh"></div>
<div class="number-gay">
<div class="down">
<span>2.</span>
<h6 style="font-size: calc(var(--font-size) / 1.8)"><b>Napiš na soud</b></h6>
<p>
Napiš na soud, že se změnil statutární orgán.
</p>
</div>
</div>
<div class="number-gay">
<div class="down">
<span>5.</span>
<h6 style="font-size: calc(var(--font-size) / 1.8)"><b>Nejdříve zkontroluj finanční dokumenty</b></h6>
<p>
Zkontroluj si, zda byla na daňový úřad podána daňová přiznání za minulé roky,
ať první, co budeš řešit, není návštěva berňáku.
</p>
</div>
</div>
<div class="number-gay">
<div class="down">
<span>8.</span>
<h6 style="font-size: calc(var(--font-size) / 1.8)"><b>Přečti si pravidla spolkovky</b></h6>
<p>
Asi víš, že máte přístup do spolkovky, tak je dobré si přečíst její pravidla, aby na tebe nebyly ostatní spolky
naštvané.
</p>
</div>
</div>
<div class="number-gay">
<div class="down">
<span>11.</span>
<h6 style="font-size: calc(var(--font-size) / 1.8)"><b>Kdo je kdo na fakultě</b></h6>
<button
type="button"
class="button primary cool-button smol-button"
style="margin-top: 1vh; border-radius: 4vw;"
>
↓ Zjisti více
</button>
</div>
</div>
</div>
<div class="col">
<div style="height: 12vh"></div>
<div class="number-gay">
<div class="down">
<span>3.</span>
<h6 style="font-size: calc(var(--font-size) / 1.8)"><b>Nahlas to fakultě</b></h6>
<p>
Když budeš v tom, je to třeba nahlásit i na fakultě, abychom věděli, s kým jednat.
<a href="javascript:void(0)">stačí vyplnit tohle</a>
</p>
</div>
</div>
<div class="number-gay">
<div class="down">
<span>6.</span>
<h6 style="font-size: calc(var(--font-size) / 1.8)"><b>Nejdříve zkontroluj finanční dokumenty</b></h6>
<p>
Zkontroluj si, zda byla podána daňová přiznání za minulé roky, ať první, co budeš
řešit, není návštěva berňáku.
</p>
</div>
</div>
<div class="number-gay">
<div class="down">
<span>9.</span>
<h6 style="font-size: calc(var(--font-size) / 1.8)"><b>Nahlašování akcí</b></h6>
<p>
Tohle asi víc, ale pro jistotu: nahlašování akcí, které budeš se spolkem dělat se dělá tady:
<a href="javascript:void(0)">formulář nahlašování akcí</a>
</p>
</div>
</div>
<div class="number-gay">
<div class="down">
<span>12.</span>
<h6 style="font-size: calc(var(--font-size) / 1.8)"><b>Nahlašování akcí</b></h6>
<p>
Hodně doporučujeme si udělat základní SWOT analýzu, která ti prozradí, jak na tom váš spolek j
a kam je možné ho směřovat dál. O tom, jak udělat SWOTku najdeš info třeba tady:
<a href="https://managementmania.com/cs/swot-analyza">https://managementmania.com/cs/swot-analyza</a>
<a href="https://www.marketingmind.cz/swot-analyza">https://www.marketingmind.cz/swot-analyza</a>
<a href="https://mladypodnikatel.cz/co-to-je-swot-analyza-t2797">https://mladypodnikatel.cz/co-to-je-swot-analyza-t2797</a>
</p>
</div>
</div>
</div>
<div class="col-1"></div>
</section>
<section class="row" style="margin-top: 9rem">
<div class="col-1"></div>
<div class="col-5 bg-circle" style="background-position: top center">
<h4>Přebírám neformální spolek</h4>
<hr class="gay-hr">
<p style="font-size: calc(var(--font-size) / 1.3); margin-top: 5vh; text-align: justify">
Zde odpadá většina formálních náležitostí. Je třeba nahlásit na fakultě změnu předsedy.
</p>
</div>
</section>

6
page/predseda.html
Unescape Escape View File

@ -1,8 +1,4 @@
<section class="row fullheight">
<div class="cross menu-btn">
<img src="svg/menu1.svg" class="idle">
<img src="svg/menu2.svg" class="active">
</div>
<div class="logo">
<a href="https://pedf.cuni.cz/PEDF-1.html"><img src="img/logo.png"></a>
</div>
@ -222,7 +218,7 @@
<span class="dot" onclick="currentSlide(4)"></span>
</div>
</section>
<script src="/js/carousel.js"></script>
<script src="js/carousel.js"></script>
</section>
<section class="row" style="margin-top: 9rem">
<div class="col-1"></div>

142
page/zalozit_spolek.html
Unescape Escape View File

@ -1,6 +1,142 @@
<section class="row fullheight">
<div class="cross menu-btn">
<img src="svg/menu1.svg" class="idle">
<img src="svg/menu2.svg" class="active">
<div class="logo">
<a href="https://pedf.cuni.cz/PEDF-1.html"><img src="img/logo.png"></a>
</div>
<div class="row" style="width: 100%">
<section class="col-1"></section>
<section class="col-5">
<div style="margin-top: 23vh">
<h1 style="margin-bottom: 5vh">Přebírám spolek</h1>
<hr class="gay-hr">
<h6 style="line-height: 1.4; margin-top: 5vh; font-size: calc(var(--font-size) / 1.75)">
Většinou se stává, že minulý předseda tomu současnému hodně do začátku pomůže a provede ho všemi náležitostmi,
které z toho vyplývají. Ale někdy se tak nestane, a proto jsme s ostatními předsedi dali hlavy dohromady a vytvořili
návod toho, co bys měl/a určitě dělat.
</h6>
<button type="button" class="button primary cool-button" style="margin-top: 1vh; border-radius: 4vw">
↓ Zjisti více
</button>
</div>
</section>
</div>
</section>
<section class="row" style="margin-top: 5vh">
<div class="col-1"></div>
<div class="col-10 side-line" style="line-height: 1">
<div>
<h6 style="margin-bottom: 0"><b>Informace k založení neformálního spolku</b></h6>
<div>
</div>
</section>
<section class="row" style="margin-top: 5vh">
<div class="col-1"></div>
<div class="col">
<div class="number-gay">
<span>1.</span>
<p>Je třeba sehnat tolik a tolik lidí a zaregistrovat se tady - <a href="javascript:void(0)">formulář</a></p>
</div>
</div>
<div class="col">
<div style="height: 6vh"></div>
<div class="number-gay">
<span>2.</span>
<p>O granty můžeš žádat tady, až bude venku výzva (dáme ti vědět na email)</p>
</div>
</div>
<div class="col">
<div style="height: 12vh"></div>
<div class="number-gay">
<span>3.</span>
<p>Pamatuj ale, že všechny akce musíš nahlašovat tady - <a href="javascript:void(0)">odkaz</a></p>
</div>
</div>
<div class="col-1"></div>
</section>
<section class="row" style="margin-top: 5vh">
<div class="col-1"></div>
<div class="col-10" style="line-height: 1">
<div class="side-line">
<h6 style="margin-bottom: 0"><b>Informace k založení formálního spolku</b></h6>
</div>
<p style="font-size: calc(var(--font-size) / 1.8); margin-left:1.15vw; margin-top: 0.5vw">
Tady je to už trochu složitější, ale neboj se, zas tak hrozné to není
</p>
</div>
</section>
<section class="row" style="margin-top: 5vh">
<div class="col-1"></div>
<div class="col">
<div class="number-gay">
<div class="down">
<span>1.</span>
<h6 style="font-size: calc(var(--font-size) / 1.8)"><b>Nejdříve potřebuješ přípravný výbor, ten se musí skládat z alespoň 3 osob</b></h6>
</div>
</div>
<div class="number-gay">
<div class="down">
<span>4.</span>
<h6 style="font-size: calc(var(--font-size) / 1.8)"><b>Po registraci může článek oficiálně začít fungovat.</b></h6>
</div>
</div>
<div class="number-gay">
<div class="down">
<span>7.</span>
<h6 style="font-size: calc(var(--font-size) / 1.8)"><b>Základní předpisy</b></h6>
</div>
</div>
</div>
<div class="col">
<div style="height: 6vh"></div>
<div class="number-gay">
<div class="down">
<span>2.</span>
<h6 style="font-size: calc(var(--font-size) / 1.8)"><b>Je třeba sepsat osnovy</b></h6>
<p>
Jak to má Agora se můžeš podívat tady, Drosophila tady a Emil tady. Otevřeno má pobočkovou strukturu,
takže je to složitější, ale co kdyby.
</p>
</div>
</div>
<div class="number-gay">
<div class="down">
<span>5.</span>
<h6 style="font-size: calc(var(--font-size) / 1.8)"><b>Zajít do banky založit transparentní účet</b></h6>
</div>
</div>
<div class="number-gay">
<div class="down">
<span>8.</span>
<h6 style="font-size: calc(var(--font-size) / 1.8)"><b>Povinnosti a práva spolku</b></h6>
</div>
</div>
</div>
<div class="col">
<div style="height: 12vh"></div>
<div class="number-gay">
<div class="down">
<span>3.</span>
<h6 style="font-size: calc(var(--font-size) / 1.8)"><b>Po tomhle všem musíš vyplnit</b></h6>
<p>
<a href="javascript:void(0)">tenhle formulář</a>
</p>
</div>
</div>
<div class="number-gay">
<div class="down">
<span>6.</span>
<h6 style="font-size: calc(var(--font-size) / 1.8)"><b>Registrace jako fakultní spolek - <a href="javascript:void(0)">zde</a></b></h6>
</div>
</div>
<div class="number-gay">
<div class="down">
<span>9.</span>
<h6 style="font-size: calc(var(--font-size) / 1.8)"><b>Nahlašování akcí</b></h6>
<p>
Tohle asi víc, ale pro jistotu: nahlašování akcí, které budeš se spolkem dělat se dělá tady:
<a href="javascript:void(0)">formulář nahlašování akcí</a>
</p>
</div>
</div>
</div>
<div class="col-1"></div>
</section>

282
page/zapojit_se.html
Unescape Escape View File

@ -1,6 +1,282 @@
<section class="row fullheight">
<div class="cross menu-btn">
<img src="svg/menu1.svg" class="idle">
<img src="svg/menu2.svg" class="active">
<div class="logo">
<a href="https://pedf.cuni.cz/PEDF-1.html"><img src="img/logo.png"></a>
</div>
<div class="row" style="width: 100%">
<section class="col-1"></section>
<section class="col-5">
<div style="margin-top: 23vh">
<h1 style="margin-bottom: 5vh">Chci se zapojit</h1>
<hr class="gay-hr">
<h6 style="line-height: 1.4; margin-top: 5vh">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Fusce wisi. Duis bibendum, lectus ut viverra rhoncus.
</h6>
<button type="button" class="button primary cool-button" style="margin-top: 1vh; border-radius: 4vw">
↓ Zjisti více
</button>
</div>
</section>
</div>
</section>
<section class="row" style="margin-top: 5vh">
<div class="col-1"></div>
<div class="col-5" style="line-height: 1">
<div class="down" style="margin-right: 3vw">
<div class="side-line" style="margin-bottom: 1vh+">
<h6 style="margin-bottom: 0"><b>Co jsou vlastně studentské organizace?</b></h6>
</div>
<p style="margin-top:0; margin-bottom: 2vh; margin-left: 1.14vw; line-height: 1.5; font-size: calc(var(--font-size) / 1.8)">
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis
nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore
eu fugiat nulla pariatur.
</p>
</div>
</div>
<div class="col-5" style="line-height: 1">
<div style="height: 8vh"></div>
<div class="down" style="margin-right: 3vw">
<div class="side-line" style="margin-bottom: 1vh">
<h6 style="margin-bottom: 0"><b>Proč bych se měl do toho pouštět?</b></h6>
</div>
<p style="margin-top:0; margin-bottom: 2vh; margin-left: 1.14vw; line-height: 1.5; font-size: calc(var(--font-size) / 1.8)">
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis
nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore
eu fugiat nulla pariatur.
</p>
</div>
</div>
</section>
<section class="row" style="margin-top: 5vh">
<div class="col flexy-boi">
<h5 style="color: var(--color-primary)"><b>Jak se v tom všem vyznat?</b></h5>
</div>
</section>
<section class="row" style="margin-top: 5vh">
<div class="col-1"></div>
<div class="col-5" style="line-height: 1">
<div class="down" style="margin-right: 3vw">
<div class="side-line" style="margin-bottom: 1vh+">
<h6 style="margin-bottom: 0"><b>Formální spolek</b></h6>
</div>
<p style="margin-top:0; margin-bottom: 2vh; margin-left: 1.14vw; line-height: 1.5; font-size: calc(var(--font-size) / 1.8)">
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis
nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore
eu fugiat nulla pariatur.
</p>
</div>
<div class="down" style="margin-right: 3vw">
<div class="side-line" style="margin-bottom: 1vh+">
<h6 style="margin-bottom: 0"><b>SORka</b></h6>
</div>
<p style="margin-top:0; margin-bottom: 2vh; margin-left: 1.14vw; line-height: 1.5; font-size: calc(var(--font-size) / 1.8)">
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis
nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore
eu fugiat nulla pariatur.
</p>
</div>
<div class="down" style="margin-right: 3vw">
<div class="side-line" style="margin-bottom: 1vh+">
<h6 style="margin-bottom: 0"><b>Univerzitní spolek</b></h6>
</div>
<p style="margin-top:0; margin-bottom: 2vh; margin-left: 1.14vw; line-height: 1.5; font-size: calc(var(--font-size) / 1.8)">
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis
nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore
eu fugiat nulla pariatur.
</p>
</div>
</div>
<div class="col-5" style="line-height: 1">
<div style="height: 8vh"></div>
<div class="down" style="margin-right: 3vw">
<div class="side-line" style="margin-bottom: 1vh">
<h6 style="margin-bottom: 0"><b>Neformální spolky</b></h6>
</div>
<p style="margin-top:0; margin-bottom: 2vh; margin-left: 1.14vw; line-height: 1.5; font-size: calc(var(--font-size) / 1.8)">
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis
nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore
eu fugiat nulla pariatur.
</p>
</div>
<div class="down" style="margin-right: 3vw">
<div class="side-line" style="margin-bottom: 1vh">
<h6 style="margin-bottom: 0"><b>Fakultní spolek</b></h6>
</div>
<p style="margin-top:0; margin-bottom: 2vh; margin-left: 1.14vw; line-height: 1.5; font-size: calc(var(--font-size) / 1.8)">
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis
nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore
eu fugiat nulla pariatur.
</p>
</div>
</div>
</section>
<section class="row" style="margin-top: 14vh">
<div class="col-1"></div>
<div class="col-6" style="background-position: top center">
<h5>Zkušenosti členů a bývalých členů</h5>
<hr class="gay-hr">
</div>
</section>
<section class="row" style="margin-top: 4vh">
<section class="col">
<link rel="stylesheet" href="/css/carousel.css">
<!-- Slideshow container -->
<div class="slideshow-container">
<!-- Full-width images with number and caption text -->
<div class="mySlides fade">
<div class="numbertext">1 / 3</div>
<img src="img/trump.jpg" style="width:100%">
<div class="text">Caption Text</div>
</div>
<div class="mySlides fade">
<div class="numbertext">2 / 3</div>
<img src="img/trump.jpg" style="width:100%">
<div class="text">Caption Two</div>
</div>
<div class="mySlides fade">
<div class="numbertext">3 / 3</div>
<img src="img/trump.jpg" style="width:100%">
<div class="text">Caption Three</div>
</div>
<div class="mySlides fade">
<div class="numbertext">3 / 3</div>
<img src="img/trump.jpg" style="width:100%">
<div class="text">Caption Three</div>
</div>
<!-- Next and previous buttons -->
<a class="prev" onclick="plusSlides(-1)">&#10094;</a>
<a class="next" onclick="plusSlides(1)">&#10095;</a>
</div>
<br>
<!-- The dots/circles -->
<div style="text-align:center">
<span class="dot" onclick="currentSlide(1)"></span>
<span class="dot" onclick="currentSlide(2)"></span>
<span class="dot" onclick="currentSlide(3)"></span>
<span class="dot" onclick="currentSlide(4)"></span>
</div>
</section>
</section>
<section class="row" style="margin-top: 14vh">
<div class="col-1"></div>
<div class="col-6" style="background-position: top center">
<h5>Proč bys měl jít právě k nám?</h5>
<hr class="gay-hr">
</div>
</section>
<section class="row" style="margin-top: 4vh">
<section class="col">
<link rel="stylesheet" href="/css/carousel.css">
<!-- Slideshow container -->
<div class="slideshow-container">
<!-- Full-width images with number and caption text -->
<div class="mySlides2 fade">
<div class="numbertext">1 / 3</div>
<img src="img/trump.jpg" style="width:100%">
<div class="text">Caption Text</div>
</div>
<div class="mySlides2 fade">
<div class="numbertext">2 / 3</div>
<img src="img/trump.jpg" style="width:100%">
<div class="text">Caption Two</div>
</div>
<div class="mySlides2 fade">
<div class="numbertext">3 / 3</div>
<img src="img/trump.jpg" style="width:100%">
<div class="text">Caption Three</div>
</div>
<div class="mySlides2 fade">
<div class="numbertext">3 / 3</div>
<img src="img/trump.jpg" style="width:100%">
<div class="text">Caption Three</div>
</div>
<!-- Next and previous buttons -->
<a class="prev" onclick="plusSlides(-1, 'mySlides2')">&#10094;</a>
<a class="next" onclick="plusSlides(1, 'mySlides2')">&#10095;</a>
</div>
<br>
<!-- The dots/circles -->
<div style="text-align:center">
<span class="dot" onclick="currentSlide(1, 'mySlides2')"></span>
<span class="dot" onclick="currentSlide(2, 'mySlides2')"></span>
<span class="dot" onclick="currentSlide(3, 'mySlides2')"></span>
<span class="dot" onclick="currentSlide(4, 'mySlides2')"></span>
</div>
</section>
</section>
<section class="row" style="margin-top: 5vh">
<div class="col flexy-boi" style="background-position: top center">
<h5>Seznam spolků a studentských oborových rad</h5>
<hr class="gay-hr">
</div>
</section>
<section class="row" style="margin-top: 5vh">
<div class="col flexy-boi">
<h5 style="color: var(--color-primary)"><b>Najdi ten svůj</b></h5>
</div>
</section>
<section class="row" style="margin-top: 5vh">
<div class="col-1"></div>
<div class="col flexy-boi">
<div class="horizontal-menu no-underline" style="position: relative; text-decoration: none !important; font-weight: 900">
<a href="javascript:void(0)">Sport</a>
<a href="javascript:void(0)">Umění</a>
<a href="javascript:void(0)">Psychologie</a>
<a href="javascript:void(0)">Pedagogika</a>
<a href="javascript:void(0)">Logika</a>
<a href="javascript:void(0)">Filozofie</a>
<a href="javascript:void(0)">Společnost</a>
<a href="javascript:void(0)">Hudba</a>
<a href="javascript:void(0)">Dějiny</a>
</div>
</div>
<div class="col-1"></div>
</section>
<section class="row" style="margin-top: 3vh">
<div class="col-1"></div>
<div class="col">
<a href="javascript:void(0)" class="hover-man"><img src="img/trump.jpg"></a>
<a href="javascript:void(0)" class="hover-man"><img src="img/trump.jpg"></a>
<a href="javascript:void(0)" class="hover-man"><img src="img/trump.jpg"></a>
<a href="javascript:void(0)" class="hover-man"><img src="img/trump.jpg"></a>
</div>
<div class="col">
<a href="javascript:void(0)" class="hover-man"><img src="img/trump.jpg"></a>
<a href="javascript:void(0)" class="hover-man"><img src="img/trump.jpg"></a>
<a href="javascript:void(0)" class="hover-man"><img src="img/trump.jpg"></a>
<a href="javascript:void(0)" class="hover-man"><img src="img/trump.jpg"></a>
</div>
<div class="col">
<a href="javascript:void(0)" class="hover-man"><img src="img/trump.jpg"></a>
<a href="javascript:void(0)" class="hover-man"><img src="img/trump.jpg"></a>
<a href="javascript:void(0)" class="hover-man"><img src="img/trump.jpg"></a>
<a href="javascript:void(0)" class="hover-man"><img src="img/trump.jpg"></a>
</div>
<div class="col-1"></div>
</section>