@font-face {
	font-family: 'Messina';
	src: url('../fonts/MessinaSansWeb-Regular.eot'); /* IE9 Compat Modes */
	src: url('../fonts/MessinaSansWeb-Regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	     url('../fonts/MessinaSansWeb-Regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/MessinaSansWeb-Regular.woff') format('woff'); /* Pretty Modern Browsers */
	font-weight: 400;
	font-style: normal;
	font-stretch: normal;
	unicode-range: U+000D-FB04;
}

body {
  color: #333;
  font-family: 'Messina';
	font-weight: 400;
	font-style: normal;
  -moz-osx-font-smoothing: grayscale;     /* optimize font rendering */
  -webkit-font-smoothing: antialiased;    /* apply font anti-aliasing */
  text-rendering: optimizeLegibility;     /* emphasizes in legibility over rendering speed */
	-moz-font-feature-settings:"kern" 1;    /* turn on kerning, highly recomened */
  -ms-font-feature-settings:"kern" 1;     /* turn on kerning, highly recomened */
  -o-font-feature-settings:"kern" 1;      /* turn on kerning, highly recomened */
  -webkit-font-feature-settings:"kern" 1; /* turn on kerning, highly recomened */
  font-feature-settings:"kern" 1;         /* turn on kerning, highly recomened */
  font-kerning: normal;                   /* turn on kerning, highly recomened */
  font-feature-settings: "liga" on;       /* ligatures: on or off */
  font-feature-settings: "dlig" off;      /* discretionary-ligatures: on or off */
  font-feature-settings: "onum" off;      /* old-style-figures: on or off */
  font-feature-settings: "lnum" off;      /* lining-figures: on or off */
  font-feature-settings: "ss01" on;      /* alternate glyphs: on or off */
}

p, a{
  font-size: 20px;
	color: #111111;
	line-height: 1.4;
  margin: 0px 0px 20px 0px;
}

a {
	text-decoration: none;
	box-shadow: inset 0 -1px 0 #cccccc;
	transition: 0.2s ease;
}

a:hover {
	box-shadow: inset 0 -30px 0 #cccccc;
  transition: 0.2s ease;
}

.about {
  width: 557px;
  position: absolute;
  top: 50px;
  left: 60px;
}

.logo {
	width: 300px;
	position: absolute;
	left: 60px;
	bottom: 60px;
}

/* XLARGE */
/* min-width 1445px, xlarge screens */
@media only screen and (min-width: 90.625em) {
}

/* MEDIUM */
@media only screen and (min-width: 40.063em) and (max-width: 64em) {
	body {
		/* background-color: pink; */
	}
}

/* SMALL */
@media only screen and (max-width: 40rem) {
	p, a {
	  font-size: 18px;
		line-height: 1.4;
	  margin: 0px 0px 20px 0px;
	}

	a {
		box-shadow: 0 1px 0 #111111;
	}

	a:hover {
		box-shadow: 0 1px 0 #111111;
	}

	.about {
	  width: 100%;
		position: static;
		padding: 30px 30px 0px 30px;
	}

	.logo {
		width: 50vw;
		padding: 50px 0 0 30px;
		position: static;
	}
}