div.container {width: 100%; margin: 0;}
nav {font-size: 0.8em; margin: 0; text-align: center; background-color: #fcfcfc; padding: 1em;}
article {margin-right: 1%; margin-left: 1%; margin-top: 1%; margin-bottom: 1%; padding: 2em; color: black; background-color: white; }
	
		body {margin: 0; background-color: #333333;}
		p {font-size: 0.8em; text-align:left; color: #252525; font-family: Palatino, "Palatino Linotype", "Times New Roman", serif;} 
		.center {text-align:center;}
		.normal {font-weight: normal; margin:0;}
		.capitulum {font-size:1em; font-family: "Times New Roman", serif;}		
		.colcolor {background-color: #fcfcfc; border-right: 1px solid lightgrey;}
		.colcolor2 {background-color: #fcfcfc;}
		.work {border-bottom:none; color: #252525;}
		.opus {font-size: 0.9em; margin:0;}
		.toptitle {padding-right:5%; color:grey; font-family: "Times New Roman", serif;}
		hr {border: 0; height: 0; border-top: 1px solid rgba(0, 0, 0, 0.1); border-bottom: 1px solid rgba(255, 255, 255, 0.3);}
		.thick {border: 0; height: 0; border-top: 3px solid rgba(0, 0, 0, 0.1); border-bottom: 1px solid rgba(255, 255, 255, 0.3);}
		#first {margin-bottom:0; padding-bottom:0; padding:2%;}
		#second {margin-top:0;}
		address {font-style: normal;}
		img {display: block; image-orientation: from-image;}
		.logo {width: 100%;}
		.cover {width: 99%;}	
		a {color:black; text-decoration:none; border-bottom: 0.0625rem solid lightgrey;}
		.signature {text-align:center; text-indent:0; color:grey; font-family: Palatino, "Palatino Linotype", "Times New Roman", serif; line-height: 2em;}
		.none {color: grey; text-decoration: none; border-bottom: none;}		
		
		div.icon {width: 35px; height: 4px; background-color: #252525; margin: 6px 0;}
		.dropbtn {background-color: #fcfcfc; color: #252525; font-size: 1em; border: none; cursor: pointer; text-align: center; font-family: "Times New Roman", serif;}
		.dropdown {position: relative; display: inline-block;}
		.dropdown-content {display: none; position: absolute; text-align: left; background-color: #f9f9f9; min-width: 200px; box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); z-index: 1;}
		.dropdown-content a {color: #252525; font-family: "Palatino Linotype", "Times New Roman", serif; padding: 1em; text-decoration: none; display: block;}
		.dropdown-content a:hover {background-color: #99ff99;}
		.dropdown:hover .dropdown-content {display: block;}
		.dropdown:hover .dropbtn {background-color: #f1f1f1;}
		
		* { box-sizing: border-box;}
		.column {flex: 50%; padding-top: 3%; padding-left: 5%; padding-bottom: 3%;}
		.column a:hover {background-color: #99ff99; padding:1%; font-style:italic;}
		.row {display: flex;}
		
		* { box-sizing: border-box;}
		.columna {flex: 50%; padding-top: 3%; padding-left: 5%; padding-bottom: 3%; padding-right: 5%;}
		.rowa {display: flex;}
		
		@media only screen and (max-width:450px) {
			article {padding: 1em; text-align: left;}
			body {margin: 0; background-color: #e6e6e6;}
			nav {font-size: 0.8em;}
			p {font-size: 0.9em;}
			.logo {width: 150%;}
			.cover {width: 98%;}
			.dropbtn {font-size: 0.7em;}}
						
		@media only screen and (min-width:450px) and (max-width:720px) {
			article {margin-left: 5%; margin-right: 5%; margin-top: 5%; margin-bottom: 5%; padding: 2em; text-align: left; }
			body {margin: 0; background-color: #b3b3b3; position: relative;}
			nav {font-size: 0.9em;}
			p {font-size: 1em;}
			.logo {width: 150%;}
			.cover {width: 90%;}
			.capitulum {font-size:1.1em;}
			.opus {font-size: 1.1em; margin:0;}
			.dropbtn {font-size: 0.8em;}}

		@media only screen and (min-width:720px) and (max-width:950px) {
			article {margin-left: 10%; margin-right: 10%; margin-top: 5%; margin-bottom: 5%; padding: 4em; padding-top: 3em; text-align: left; }
			body {margin: 0; background-color: #808080; position: relative;}
			nav {font-size: 1em;}
			p {font-size: 1em;}
			.logo {width: 150%;}
			.cover {width: 80%;}
			.capitulum {font-size:1.3em; font-style: normal;}
			.opus {font-size: 1.2em; margin:0;}
			.dropbtn {font-size: 0.9em;}}	
			
		@media only screen and (min-width:950px) and (max-width:1224px) {
			article {margin-left: 15%; margin-right: 15%; margin-top: 5%; margin-bottom: 5%; padding: 6em; padding-top: 3em; text-align: left;}
			body {margin: 0; background-color: #4d4d4d; position: relative;}
			nav {font-size: 1em;}
			p {font-size: 1.1em;}
			.logo {width: 150%;}
			.cover {width: 70%;}
			.capitulum {font-size:1.3em; font-style: normal;}
			.opus {font-size: 1.3em; margin:0;}}
		
		@media only screen and (min-width:1224px) {
			article {margin-left: 15%; margin-right: 15%; margin-top: 5%; margin-bottom: 5%; padding: 8em; padding-top: 3em; text-align: left;}
			body {margin: 0; background-color: #333333; position: relative;}
			nav {font-size: 1.1em;}
			p {font-size: 1.2em;}
			.logo {width: 150%;}
			.cover {width: 70%;}
			.capitulum {font-size:1.5em; font-style: normal;}
			.opus {font-size: 1.6em; margin:0;}}

			@media screen and (max-width: 600px) {
			.columna {width: 100%;}
			.column {width: 100%;}}