@font-face {
  font-family: 'Aileron';
  src: url('../fonts/Aileron-Thin.otf')  format('opentype'), url('../fonts/Aileron-Thin.woff') format('woff'), url('../fonts/Aileron-Thin.ttf')  format('truetype'), url('../fonts/Aileron-Bold.svg#Aileron-Thin') format('svg');
  font-weight: 300;
  font-style: normal;
}
@font-face {
  font-family: 'Aileron';
  src: url('../fonts/Aileron-Regular.otf')  format('opentype'), url('../fonts/Aileron-Regular.woff') format('woff'), url('../fonts/Aileron-Regular.ttf')  format('truetype'), url('../fonts/Aileron-Regular.svg#Aileron-Regular') format('svg');
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: 'Aileron';
  src: url('../fonts/Aileron-Bold.otf')  format('opentype'), url('../fonts/Aileron-Bold.woff') format('woff'), url('../fonts/Aileron-Bold.ttf')  format('truetype'), url('../fonts/Aileron-Bold.svg#Aileron-Bold') format('svg');
  font-weight: 700;
  font-style: normal;
}

html {
	box-sizing: border-box;
    height: 100%;
}


body {
	/*background: linear-gradient(to top right, #f2f266, #E1E88D);*/
	margin: 0;
	padding:3rem 6rem;
	background: linear-gradient(to top right, #FFFF66, #FFFFA6);
	background: #FFF;
	background-repeat: no-repeat;
	background-attachment: fixed;
	color: #567;
	/*color: darkgreen;*/
	font-size: 18px;
	font-family: 'Helvetica Neue', 'SF UI Display' , Aileron, Roboto, Arial, Helvetica, Sans-Serif;
	font-weight: 400;
	line-height: 1.6rem;
}

a {
	color: #567;
	text-decoration: none;
	border-bottom: 1px dotted #567;
}
a:hover {
	border-bottom: 1px solid #567;
}
a:active {
	color: #0F9954;
	border-bottom: 1px solid #0F9954;
}

h1   {
	margin-bottom:4rem;
	/*background-color: yellow;*/
	color: #0F9954; /*#46A035;*/
	color: #234; /*#46A035;*/
	font-size: 2.5rem;
	line-height: 2.8rem;
	font-weight: 300;
	letter-spacing: .5px;
}

h3, h4   {
	font-size: 1.1rem;
	font-weight: 700;
	margin-top: 2rem;
	margin-bottom: .7rem;
}
p {
	margin-top: .7rem;
	margin-bottom: .7rem;
}

svg {
	fill: #567 !important ;
	width:20px;
	height:20px;
}

a:hover svg {
	fill: #789 !important ;
}

a:active svg {
	fill: #0F9954 !important ;
}

.social-links {
	margin-top: 2.5em;
}
.social-links a {
	border:none !important;
	margin-right: .75em;
}

.foot {
	margin-top: 7em;
	font-size: 0.7em;
}
.foot a {
	margin-right: 1em;
}
@media (max-width: 639px) {
  h1 { 
    font-size:2rem;  
    line-height: 2.25rem;
  }
  body {
	padding:2rem 2rem;
  }
}
@media (max-width: 419px) {
	  h1 { 
	    font-size:1.75rem;  
	    line-height: 2rem;
		margin-bottom: 1rem;
	  }
	  body {
		padding:1rem 1rem;
	  }
	.foot {
		margin-top: 4em;
	}
}