haha

resources/style/le_style.css

@@ -0,0 +1,245 @@
+#frame {
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	flex-direction: column;
+}
+
+#header {
+	height: 100px;
+}
+
+#content {
+	max-width: 1200px;
+	min-width: 500px;
+}
+
+#content > #description {
+	font-family: baskerville;
+	font-size: 2rem;	
+}
+
+ma {
+	font-family: baskerville;
+	font-size: 5rem;
+}
+
+#footer {
+	display: flex;
+	align-items: center;
+	flex-direction: column;
+	width: 1200px;
+/*	min-width: 500px;	*/
+	margin-top: 0.5em;
+	padding: 0.5em;
+	border-top: 3px double black;
+}
+
+#footer > img {
+	max-width: 250px;
+}
+
+
+/*section*/
+
+.section {
+	padding-bottom: 1em;
+}
+
+
+.section_header {
+	display: flex;
+	flex-direction: row;
+	border-bottom: 3px double red;
+	margin-bottom: 1.5em;	
+}
+
+.section_header > h2 {
+	padding-right: 0.5em;
+}
+
+#events .list > details {
+	background-color: lightgoldenrodyellow;
+}
+
+.list > details {
+	font-size: 1.8rem;
+	border: 1px solid #aaa;
+	border-radius: 4px;
+	margin-bottom: 0.5em;
+}
+
+.list > details[open] {
+	background-color: lightsalmon;
+	border-bottom: 3px black solid;	
+	border-radius: 4px;
+	padding: 0 1em 1em 1em;
+}
+
+.list > details > summary {
+	font-size: 1.8rem;
+/*	font-weight: bold;*/
+/*	margin: 0.5em;*/
+	padding: 0.5em;
+}
+
+.list > details[open] > summary {
+	border-bottom: 2px black solid;	
+	margin-bottom: 1em;
+}
+
+/*cases*/
+
+.hidden {
+	display: none;
+}
+
+#cases {
+/*	border: green 1px solid;*/
+	display: flex;
+	flex-direction: row;
+}
+
+.case {
+	margin: 1em;
+	padding: 1em;
+	width: 500px;
+	border: 1px solid black;
+	background-color: lightgrey;
+	border-radius: 5px;
+}
+
+.case.close {
+	height: 2em;
+}
+
+.title {
+	font-family: helvetica, sans-serif;
+	padding-bottom: 0.8em;
+}
+
+
+.definition, .origin {
+	font-family: helvetica, sans-serif;
+}
+
+.title entry {
+	font-size: 1.5em;
+}
+
+.title phone {
+	color: grey;
+	font-size: 1.2em;
+}
+
+.qual {
+	font-size: 1em;
+}
+
+.qual genre {
+	font-size: 1.2em;
+}
+
+extra {
+	color: grey;
+	font-style: italic;
+}
+
+ex {
+	font-family: Arial, sans-serif;
+	font-style: italic;
+	font-weight: lighter;
+}
+
+xe {
+	font-style: italic;	
+	font-weight: bold;
+}
+
+.def {
+	margin: 1em;
+}
+
+.example {
+	margin-top: 1em;
+	margin-bottom: 1em;
+}
+
+.origin or {
+	color: grey;
+	font-size: 0.8em;
+	text-transform: uppercase;
+}
+
+/*  max-width: 1200px  */
+
+@media screen and (max-width: 1200px) {
+
+	body {
+/*		background: #aaa;*/
+	}
+
+	#header {
+		margin-bottom: 1em;
+	}
+
+
+	ma {
+		font-size: 6em;
+	}
+
+	#content > #description, .section_header > h2  {
+		font-size: 3rem;	
+		font-weight: 400;
+	}
+
+	.title {
+		font-size: 1.7em;
+	}
+
+	.origin {
+		font-size: 1.2em;
+	}
+
+	.title entry {
+		font-size: 1.7em;
+	}
+
+	.title phone {
+		color: grey;
+		font-size: 1.4em;
+	}
+
+	.qual {
+		font-size: 1.7em;
+	}
+
+	.qual genre {
+		font-size: 1.4em;
+	}
+
+	.list > details, .list > details > summary {
+		font-size: 1.7rem;
+	}
+
+	#content, #footer, #cases, .case {
+		width: 95%;
+	}
+
+	#cases {
+		display: flex;
+		flex-direction: column;
+	}
+
+	.case {
+		margin-left: 0.5em;
+	}
+
+	.case.close {
+		height: 4rem;
+	}
+
+
+}
+
+