* {
		box-sizing: border-box;
	}
	@font-face {
    font-family: 'calendas_plusbold';
    src: url('calendas_plus_bold-webfont.eot');
    src: url('calendas_plus_bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('calendas_plus_bold-webfont.woff2') format('woff2'),
         url('calendas_plus_bold-webfont.woff') format('woff'),
         url('calendas_plus_bold-webfont.ttf') format('truetype'),
         url('calendas_plus_bold-webfont.svg#calendas_plusbold') format('svg');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'calendas_plusitalic';
    src: url('calendas_plus_italic-webfont.eot');
    src: url('calendas_plus_italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('calendas_plus_italic-webfont.woff2') format('woff2'),
         url('calendas_plus_italic-webfont.woff') format('woff'),
         url('calendas_plus_italic-webfont.ttf') format('truetype'),
         url('calendas_plus_italic-webfont.svg#calendas_plusitalic') format('svg');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'calendas_plusregular';
    src: url('calendas_plus-webfont.eot');
    src: url('calendas_plus-webfont.eot?#iefix') format('embedded-opentype'),
         url('calendas_plus-webfont.woff2') format('woff2'),
         url('calendas_plus-webfont.woff') format('woff'),
         url('calendas_plus-webfont.ttf') format('truetype'),
         url('calendas_plus-webfont.svg#calendas_plusregular') format('svg');
    font-weight: normal;
    font-style: normal;

}
    html {
        background: gainsboro;
    }
	html,
	body {
		min-height: 100%;

		color: #000;

		font-family: 'calendas_plusregular';

		margin-right: auto;
		margin-left: auto;
	}
	/* sets the body height of the browser, so that backgrounds and div heights work correctly. Color and background will almost certainly be altered; they are just placeholders */
	

	/* sets the base font size for the document; turns on kerning pairs and ligatures */
	
	body,
	ul,
	ol,
	dl {
		margin: 0;
	}
	
	article,
	aside,
	audio,
	footer,
	header,
	nav,
	section,
	video {
		display: block;
	}
	/* ensures that older browsers will display HTML5 elements correctly */
		body {
		font-size: 1.4rem;
		text-rendering: optimizeLegibility;
		max-width: 1000px;
		margin-right: auto;
		margin-left: auto;
		background: #fff;
				padding: 20px;
	}
	
    header {
        position: relative;
    }
	
	p {
		-ms-word-break: break-all;
		word-break: break-all;
		word-break: break-word;
		-moz-hyphens: auto;
		-webkit-hyphens: auto;
		-ms-hyphens: auto;
		hyphens: auto;
	}
	/* sets hyphenation by default on paragraphs */
	
	h1, h2, h3, h4, h5, h6 {
		font-family: 'calendas_plusbold';
	}
	i {

		font-family: 'calendas_plusitalic';

}



em {

    font-family: 'calendas_plusitalic';

color: #434343;
}
p em {
    margin-bottom: -15px;
    display: inline-block;
}
	textarea {
		resize: vertical;
	}
	/* changes textarea resizing from "both" (UA default) to vertical only */
	
	table {
		border-collapse: collapse;
	}
	
	td {
		padding: .5rem;
	}
	/* causes tables to actually look like tables */
	
	img {
		border: none;
		max-width: 100%;
	}
	/* removes outlines from linked images (for older browsers and IE), sets up images for responsive design layout */
	
	input[type="submit"]::-moz-focus-inner,
	input[type="button"]::-moz-focus-inner {
		border: 0px;
	}
	/* removes the inner border effect from focused buttons for form elements in Firefox */
	
	input[type="search"] {
		-webkit-appearance: textfield;
	}
	
	input[type="submit"] {
		-webkit-appearance: none;
	}
	/* removes the OS X appearance from HTML5 search inputs and submit buttons when viewed in Safari */
	
	input:required:after {
		color: #f00;
		content: " *";
	}
	/* sets up required form fields with the conventional following red asterix */
	
	input[type="email"]:invalid {
		background: #f00;
	}
	/* causes a visual alert in browsers that do client-side checking of HTML5 email field – this may already be the default in some browsers. */
	
	.right {
		float: right;
		margin-left: 2rem;
		clear: right;
	}
	
	.left {
		float: left;
		margin-right: 2rem;
		clear: left;
	}
	/* allows a quick shortcut for floating elements left and right while avoiding the “float quirk” problem */
	
	sub,
	sup {
		line-height: 0;
	}
	.textcontrols {
		position: absolute;
		top: 0;
		right: 0;
		font-size: 1rem;
	}
	.textcontrols button {
		width: 50px;
		height: 35px;
		margin-left: 15px;
	}
	.menucontrols button, footer button {
		height: 35px;
		font-size: 1.25rem;
	}
	.textcontrols button em {
		font-size: 1.25rem;
	}
	
	
	/* Mobile Menu */
	#myLinks {
  display: none;
    background-color: #333;
    width: 50%;
  
    margin-left: -20px;
}
#myLinks ul {
    padding: 0;
    list-style-type: none;
}
#myLinks a {
  color: white;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 1.5rem;
  display: block;
}



#myLinks a:hover {
  background-color: #ddd;
  color: black;
}

            .fixed {
            position: fixed;
            bottom: 20px;
            right: 20px;
            z-index: 1000;
            background-color: #007BFF;
            color: white;
            border: none;
            border-radius: 5px;
            padding: 12px 20px;
        }

@media only screen and (max-width: 600px) {
  #myLinks {
    width: calc(100% + 40px  )}
}