@font-face {
	font-family:'Grotesk-Regular';
	src: url('../fonts/GroteskRegular_gdi.eot');
	src: url('../fonts/GroteskRegular_gdi-.eot#iefix') format('embedded-opentype'),
		url('../fonts/GroteskRegular_gdi.woff') format('woff'),
		url('../fonts/GroteskRegular_gdi.ttf') format('truetype'),
		url('../fonts/GroteskRegular_gdi.svg#GroteskRegular-Regular') format('svg');
	font-weight: normal;
	font-style: normal;
	font-stretch: normal;
	unicode-range: U+0020-25CA;
}

@font-face {
	font-family:'Grotesk-Bold';
	src: url('../fonts/GroteskBold_gdi.eot');
	src: url('../fonts/GroteskBold_gdi-.eot#iefix') format('embedded-opentype'),
		url('../fonts/GroteskBold_gdi.woff') format('woff'),
		url('../fonts/GroteskBold_gdi.ttf') format('truetype'),
		url('../fonts/GroteskBold_gdi.svg#GroteskBold-Regular') format('svg');
	font-weight: normal;
	font-style: normal;
	font-stretch: normal;
	unicode-range: U+0020-25CA;
}


body {
    min-height: 100vh;
    font-family: monospace;
	line-height: 2em;
	padding-top: 50px;
	padding-left: 20px;
	padding-right: 20px;
	font-size:30px;
}



h4 {
color:grey;
font-size: 20px;
text-align: left;
}	

mark {
background-color: black;
color: white;
line-height: 1.6em;
}



.responsive {
	width: 50%;
	height: auto;
	max-width: 900px ;
	padding-top: 0px;
	margin-bottom:150px;
	margin-top:-13px;
	cursor: pointer;
	Min-width : 300px;
	}

	a {
		text-decoration: underline;
	    color: grey;
	}