@font-face {
    font-family: 'bold';
    src: url('fonts/Barlow-Semibold-webfont.woff') format('woff');
    font-weight: bold;
    font-style: normal;
}
@font-face {
    font-family: 'medium';
    src: url('fonts/Barlow-Medium-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'regular';
    src: url('fonts/Barlow-Regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'amatic';
    src: url('fonts/amaticsc-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'symbol';
    src: url('fonts/icon-works-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'symbol2';
    src: url('fonts/Entypo-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'curved';
    src: url('fonts/learning_curve_bold_ot_tt-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
body{
	background-image: linear-gradient(160deg, #B6EB7A, #689633);
	background-attachment:fixed;
	font-family:regular;
	font-size:12.0pt;
	color:#333333;
	margin:0;
	height:100%;
}
div.content_box{
	display:block;
	margin-top:3em;
	min-width:60%;
	max-width:60%;
	min-height:calc(100vh - 8em);
	margin-left:20%;
	background-color:#17706e;
	padding:1em;
	border-radius:1em;
	box-shadow:0.2em 0.2em 0.4em 0 #333333;
}
div.content{
	display:block;
	min-height:calc(100vh - 12em);
	border-radius:1em;
	background-color:#F7F7EE;
	padding:2em;
	color:#666666;
}
span.header{
	display:block;
	padding:0;
	margin:0;
	font-family:bold;
	font-size:3em;
	color:#FB7813;
	text-align:center;
	line-height:1em;
}
img{
	display:block;
	width:80%;
	margin-left:10%;
	margin-top:1em;
}

@media screen and (max-width: 700px) {
	div.content_box{
		max-width:calc(90vw - 2em);
		margin-left:5vw;
		min-height:calc(100vh - 12em);
		max-height:calc(100vh - 12em);
	}
	span.header{
		font-size:2em;
	}
	div.content{
		min-height:calc(100vh - 16em);
		max-height:calc(100vh - 16em);
	}
	img{
		margin-left:0;
		width:100%;
	}
	
}