/* 
    Matthew J. Stellato
    matthewstellato.com // mattstellato.com
    Copyright 2014, 2021
*/

@import url("reset.css");

html, body {
	height: 100%;
}

body {
	background-color :#212121;
	text-align: center;
	-webkit-font-smoothing: antialiased;
  font-family: 'aktiv-grotesk', sans-serif;	
}

.cover {
	background: #212121 url('../img/yellowstone.jpg') no-repeat center top;
	background-size:cover;
	position: absolute;
	top:0;
	left:0;
	width: 100%;
	height: 100%;
	opacity: .4;
}

section {
	position: absolute;
	z-index: 100;
	width: 100%;
}

h1 {
	font-family: "ff-market-web",cursive;
	font-style: normal;
	font-weight: 400;
	font-size:65px;
	line-height: normal;
	padding-top:200px;
	text-shadow: 0 1px 2px rgba(0,0,0,.7);
	color: #FFF;
	text-align: center;
}

h3 {
  position: fixed;
  bottom:20px;
  right: 20px;
  font-style: italic;
	color: rgba(255,255,255,.3);
}

h3 a {
  display: inline-block;
  padding-left: 3px;
  
}

p {
	font-style: normal;
	font-weight: 600;
	font-size:18px;
	color: rgba(255,255,255,.8);
	padding-bottom:25px;
}

li {
	display: inline-block;
	margin:0 15px;
}

li a {
  text-indent: -99999em;
  display: block;
  border-radius: 100%;
  height: 65px;
  width: 65px;
  background-color:rgba(255,255,255,.2);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 35px;
	box-shadow: 0 1px 5px rgba(0,0,0,.1);	  
	cursor: pointer;
}

li a.mail {
  background-image: url('../img/mail-open.svg');
}

li a.insta {
  background-image: url('../img/logo-instagram.svg');
}

li a.tw {
  background-image: url('../img/logo-twitter.svg');
}

li a.linked {
  background-image: url('../img/logo-linkedin.svg');
}

li a:hover {
  background-color:rgba(255,255,255,.4);
}


a {
	color: rgba(255,255,255,.6);
	text-decoration: none;
	text-shadow: 0 1px 1px rgba(0,0,0,.1);	
	display: block;
}

a:hover {
	color:rgba(255,255,255,1);
}



h1, p, a {
	transition: ease 0.3s all;
}


@media only screen and (min-width: 1550px) {
	h1 {
		font-size:85px;
	}
	p {
		font-size:24px;
		padding-bottom:40px;
	}
	
	li {
		font-size:70px;
		margin:0 25px;
	}	
	
}


@media only screen and (max-width: 600px) {
	h1 {
		padding:50px 0 0 0;
		font-size:42px;
	}
	p {
		font-size:13px;
	}
}