#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;
	}


}