html { box-sizing: border-box;
		font-size: 16px; font-size: 62.5%; scroll-behavior: smooth;} 

*, *:before, *:after {box-sizing: border-box;}

body {	max-width: 768px;
		min-width: 320px;
		margin: 0; 
		font: 1.6rem/1.5 montserratlight;
		background-color: black;}
		.tablet, .desktop { display: none; }
		/*test*/
		html,body { height: 100%; }

.container { width: 100%; margin: auto; }
header, main, footer,aside { width: 100%; margin: auto; }
section { width: 100%; margin: auto; }

/*----------menu----------*/

.menu-open { display: block; }
.menu-close { display: none; }
.show-menu .menu-close { display: block; }
.show-menu .menu-open { display: none; }

/*-----header-----*/

header { background-color: black; }
#bar, #cross { float: right; font-size: 4.8rem; margin-top: 20px; margin-right: 20px; }
nav ul { width: 120px; margin: auto; float: right; margin-top: 0px; }
nav ul li a { display: block; background-color: grey; text-align: center; 
				color: white; filter: invert(.1); padding-top: 8px; padding-bottom: 8px;}
#social-media { clear: both; height: 30px;}
.social-media i { margin-right:20px; margin-top: 4px; margin-bottom: 4px; font-size: 24px;}

/*-----main-----*/
h1,h2,h3,p,cite { color: white; }
main p { margin-bottom: 16px; }
h2, h3 { width: 90%; margin: auto; }
main section { width: 90%; margin: auto; }
.margin-reset { margin-left: 0; }
/*-----footer-----*/

footer section { width: 100%; }
footer section,
#map { width: 90%; margin: auto; }
iframe { width: 100%; margin-right: auto;}
footer ul { width: 100%; margin: auto; margin-bottom: 20px; margin-top: 20px;}
footer h4 { width:100%; margin:auto; text-align: center;  height: 3rem;}
footer i { font-size: 2rem; padding-top: 8px; }
footer a:nth-of-type(1) { background-color: #3b5998; }
footer a:nth-of-type(2) { background-color: #00c300; }
footer a:nth-of-type(3) { background-color: #f57d00; }
footer a:nth-of-type(4) { background-color: #C13584; }
footer a:nth-of-type(5) { background-color: #ff0000; }
#footer-media i { font-size: 4rem; margin-right: 20px; }
#copyright { display: block; width: 100%; text-align: center; }
.footer-media { margin-bottom: 20px; }
.scale:hover { transform: scale(1.2); }



a { text-decoration: none; }
a:hover{ filter: invert(.2); }
a,a:hover,a:visited,a:link { color: white; }
.black-bold:hover { color: white; font-size: 120%; filter: none; font-weight: 900; }

/*-----Font-----*/

	cite { font-size: 1.4rem; color: grey; line-height: 1.6rem; }
	h1 { font-size: 4rem; line-height: 4.8rem; }
	h2 {font-size: 3.2rem; line-height: 4.8rem; }
	h3 { font-size: 2.4rem; line-height: 3.2rem;}
	p { font-size: 1.6rem; max-width: 48rem; }
	li { color: white; }
	#quote { line-height: 4rem; font-size: 1.6rem; }
	#quote h3 { font-size: inherit; white-space: nowrap; margin-top: 20px; margin-bottom: 20px; }