/* Paragraph-Designs */

#logo1 {display: block; margin-left: auto; margin-right: auto; width: 20%; height: 20%; object-fit: contain; padding-top: 40px; }
#navigation {text-align: center; font-family: "Courier New", Courier, monospace; letter-spacing: 6px; padding: 40px 0; position: sticky; }
#navigation * {margin: 0 25; padding: 5 5;}
#text {text-align: justify; width: 70%;  margin: 0 auto; line-height: 150%; font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif; }
#date1 {
	margin-left: -5%;
	color: darkslateblue;
	font-family: "Courier New", Courier, monospace;
	font-size: 100%;
}
#date2 {margin-left: -2%; color: darkorange;font-family: "Courier New", Courier, monospace; font-size: 120%; letter-spacing: 1px; border-color: rgba(74, 74, 74, 0.2); border-width: 1px; border-top-style: solid; }
#caption {text-align: center; font-size: 115%; font-weight: 550; font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif; padding-bottom: 10px;}
#alert {
	background-color: rgb(222, 0, 0, 0.4);
	padding: 15 15;
	text-align: center;
	width: 90%;
	margin: 10 auto;
}
#info {background-color: rgb(18, 44, 150, 0.4); padding: 15 15; text-align: center; width: 90%;  margin: 10 auto; }
#head2 {font-size: 110%; font-weight: 500; line-height: 230%; }
#past {width: 50%; margin-left: auto; margin-right: auto; display: block; padding: 10px 0px; }
#past1 {width: 50%; margin-left: auto; margin-right: auto; display: block; padding-top: 30px; padding-bottom: 5px;}
#past3 {width: 100%; margin-left: auto; margin-right: auto; display: block; padding: 20 0; }
#past4 {height: 25%; margin-left: auto; margin-right: auto; display: block; padding: 20 0; }
#que {text-align: center; color: darkorange;font-family: "Courier New", Courier, monospace; font-size: 120%; padding-top: 20px; margin-bottom: 15px;}
#ans {text-align: justify; width: 60%;  margin: 0 auto;width: 70%;  margin: 0 auto; line-height: 150%; font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif; }
#anss {text-align: center; width: 60%;  margin: 0 auto;width: 70%;  margin: 0 auto; line-height: 150%; font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif; }
#projects * {width: 35%; display: block; margin: 20 auto; }
#pojects {text-align: justify; line-height: 150%; font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif}

/* Footer-Designs */

.footer {font-family: sans-serif; text-align: center; letter-spacing: 5px; padding-top: 40px; padding-bottom: 40px; }
.footer * {margin: 0 25; padding: 5 5; }

/* List-Designs */

li {padding-bottom: 10px; }
li.one {padding-bottom: 5px; }
ol {padding-bottom: 5px; }
ol.one {counter-reset: list; margin: 0;}
ol.one > li.one {list-style: none; position: relative;}
ol.one > li.one:before {counter-increment: list; content: counter(list, lower-alpha) ") "; position: absolute; left: -1.4em;}
li.one:before {list-style: none; content: ") "; }

/* Link-Designs */

a.one:link {text-decoration: none; color: #2f4f4f; }
a.one:hover {color: white; background: rgb(47, 79, 79, 0.5); }
a.one:visited {text-decoration: none; color: #2f4f4f; }

a.two:link {text-decoration: none; color: #313131; background: rgb(18, 44, 150, 0.1); padding: 4 7; }
a.two:hover {background: rgb(18, 44, 150, 0.3); }
a.two:visited {text-decoration: none; color: #313131; background: rgb(18, 44, 150, 0.1); padding: 4 7; }

a.three:link {text-decoration: none; color: #313131; padding: 4 7; background: rgb(128, 128, 128, 0.1);}
a.three:hover {background: rgb(128, 128, 128, 0.3); }
a.three:visited {text-decoration: none; color: #313131; padding: 4 7; background: rgb(128, 128, 128, 0.1);}

/* Explinations:

paragraphs:
        logo1: oLaF Logo
        navigation: Navigation Bar Text
        date1: Großüberschrift
        date2: Überschrift
        caption: Bold, Centered
        info: Blue Background, Centered
        alert: Red Background, Centered
        text: Standard Text Design
        que: Question, Centerd
        ans: Answer, Justified
        anss: Answer, Centered
        projects: Pictures (projekte.html)
        past & past2: Calendar & Clock (index.html)
        past3: Trennstrich
        past4: Pictures (about.html)
        head2: Caption, Medium Bold, Centered, (index.html)
links:
        class one: Navbar Links
        class two: "Info-Box" Links
        class three: Standard Links
lists:
        li: List 1.
        li.one: List a)
        ol: List 1.
        ol.one: List a)
*/