@font-face {
	font-family: 'AvenirLight';
	src: url('../fonts/AvenirLTStd-Book.woff') format('woff');
}
@font-face {
	font-family: 'AvenirBold';
	src: url('../fonts/AvenirLTStd-Heavy.woff') format('woff');
}
@font-face {
	font-family: 'TypoGroteskBold';
	src: url('../fonts/typo_grotesk_bold_demo-webfont.woff') format('woff');
}

html, body {
    min-height: 100%;
    height: 100%;
    font-family: 'AvenirBold';
    font-weight: 200;
    font-size: 0px;
}
html, body, ul, div, img, h1, h2, h3, a, li {
	padding:0;
	margin:0;
}

/*---BODY---*/
.body {
	height: calc(100% - 118px);
	margin: 130px 30px 0 30px;
  width: calc(100% - 60px);
  max-width: 550px;
  position: relative;
  left: calc(50% - 30px);
  transform: translateX(-50%);
	text-align: center;
}
.body > * {
	vertical-align: top;
}
div {
  display: inline-block;
}
h1 {
	font-size: 25px;
	font-family: 'AvenirBold';
	color: #575f62;
}
h2 {
	font-size: 17px;
	font-family: 'AvenirLight';
	color: #9c9c9c;
	
}

#contact-info {
	margin: 80px 0 0 0;
}
#contact-info > h1 {
	margin-bottom: 30px;
	text-align: left;
}
#contact-info > h2 {
	margin-bottom: 11px;
	text-align: left;
}
#contact-info > #email {
	margin-bottom: 5px;
}

#images img {
    width: 50px;
    transition: all 0.2s ease-out;
    margin-right: 40px;
}
#images .last {
	margin-right: 0px;
}
#images img:hover {
    box-shadow: 0 0 7px rgba(0,0,0,0.4);
    border-radius: 200px;
}
svg {
	width: 100%;
	height: auto;
}
a.svg:after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  box-shadow: 0px 0px 5px rgba(0,0,0,0.5);
}

#Combined-Shape:hover {
	transition: all 0.4s;
	cursor: pointer;
}

circle:hover {
	cursor: pointer;
	transition: all 0.4s;
}

#LinkedIn > path:hover {
	fill: #16a3ed;
}

#Facebook> path:hover {
	fill: #4480e6;
}

#GitHub> path:hover {
	fill: #af79ff;
}

#LinkedIn > circle:hover + path {
	fill: #16a3ed;
	transition: all 0.3s;
}

#Facebook > circle:hover + path {
	fill: #4480e6;
	transition: all 0.3s;
}

#GitHub > circle:hover + path {
	fill: #af79ff;
	transition: all 0.3s;
}

/*---MOBILE---*/
@media screen and (max-width: 480px) {
	h1 {
		font-size: 22px;
	}
	h2 {
		font-size: 14px;
	}
}


/*---ANIMATIONS---*/
/* Underline From Center */
.hvr-underline-from-center {
	display: inline-block;
	vertical-align: middle;
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
	box-shadow: 0 0 1px rgba(0, 0, 0, 0);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	-moz-osx-font-smoothing: grayscale;
	position: relative;
	overflow: hidden;
}
.hvr-underline-from-center:before {
	content: "";
	position: absolute;
	z-index: -1;
	left: 50%;
	right: 50%;
	bottom: 0;
	background: #A9A9A9;
	height: 3px;
	-webkit-transition-property: left, right;
	transition-property: left, right;
	-webkit-transition-duration: 0.25s;
	transition-duration: 0.25s;
	-webkit-transition-timing-function: ease-out;
	transition-timing-function: ease-out;
}
.hvr-underline-from-center:hover:before, .hvr-underline-from-center:focus:before, .hvr-underline-from-center:active:before {
	left: 0;
	right: 0;
}