/* ----------------------------------------------------------
Get out of my house! I haven't dusted or vacuumed.
---------------------------------------------------------- */


/* ----------------------------------------------------------
universal reset & outline removal
---------------------------------------------------------- */

* { 
	padding: 0; 
	margin: 0; 
	outline: 0;
	}

a:active, button {
	outline:none;
	}

:focus {
	-moz-outline-style:none;
	}

/* ----------------------------------------------------------
html & body
---------------------------------------------------------- */

html {
	margin: 0;
	padding: 0;
	}

body {
	height: 100%;
	widht: 100%;
	overflow: hidden;
	margin: 0; 
	padding: 0;
	font-size: 62.5%;
	text-align: center;
	}
	

/* ----------------------------------------------------------
fonts
---------------------------------------------------------- */
@font-face {
    font-family: 'pacifico';
    src: url('../fonts/pacifico-webfont.eot');
    src: url('../fonts/pacifico-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/pacifico-webfont.woff') format('woff'),
         url('../fonts/pacifico-webfont.ttf') format('truetype'),
         url('../fonts/pacifico-webfont.svg#pacificoregular') format('svg');
    font-weight: normal;
    font-style: normal;

}


/* ----------------------------------------------------------
instagram
---------------------------------------------------------- */
h1 {
	font-family: 'pacifico';
	font-weight: 100;
	font-size: 14em;
	color: #fff;
	text-shadow: rgba(0,0,0,0.75) 4px 6px 6px;
	letter-spacing: -.01em;
	position: absolute;
	top: 35%;
	left: 23%;
	width: 50%;
	z-index: 9999;
	
-webkit-transform: rotate(-8deg);
-moz-transform: rotate(-8deg);
-ms-transform: rotate(-8deg);
-o-transform: rotate(-8deg);
	}

#planetresin {
	display: none;
	}

#instafeed {
	width: 100%;
	height: 100%;
	}

.instagram-img {
	float: left;
	position: relative;
	margin: 0;
	padding: 0;
	border: 0;
	width: 20%;
	height: auto;
	}

.instagram-img img {
	display: block;
	width: 100%;
	height: auto;
	}

.instagram-img img:nth-child(5n) {
	clear: left;
	}

/* ----------------------------------------------------------
connections
---------------------------------------------------------- */
.connections {
	position: absolute;
	display: none;
	top: 2em;
	left: 3em;
	}

@-webkit-keyframes scale{
	from {
		-webkit-transform: scale(1.0);
	}
	to {
		-webkit-transform: scale(1.2);
	}
}
@-moz-keyframes scale{
	from {
		-moz-transform: scale(1.0);
	}
	to {
		-moz-transform: scale(1.2);
	}
}
@keyframes scale{
	from {
		transform: scale(1.0);
	}
	to {
		transform: scale(1.2);
	}
}

.connections a {
	margin: 1em;
	}
	

.connections a img {
	  -moz-opacity: 0.75;
  -khtml-opacity: 0.75;
  opacity: 0.75;
}

.connections a:hover img {
	-webkit-animation: scale .25s linear forwards;
	-moz-animation: scale .25s linear forwards;
	animation: scale .25s linear forwards;
  -moz-opacity: 1.0;
  -khtml-opacity: 1.0;
  opacity: 1.0;
}


/* ----------------------------------------------------------
links
---------------------------------------------------------- */

a:link { 
	text-decoration: none; 
	color: #0077D2;
	}

a:visited { 
	text-decoration: none; 
	color: #0077D2;
	}

a:hover, a:active { 
	text-decoration: underline; 
	color: #0077D2;
	}
	
/* ----------------------------------------------------------
let me clear my float
---------------------------------------------------------- */

.group:after, .section:after {
	content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
    }

/* ----------------------------------------------------------
	media queries
---------------------------------------------------------- */

@media only screen and (max-width: 90em) { /* 1440 */

	}
	
@media only screen and (max-width: 80em) { /* 1280 */

body {
	font-size: 57.5%;
	}

.instagram-img {
	width: 25%;
	}

.instagram-img img:nth-child(4n) {
	clear: left;
	}
}

@media screen and (max-width: 64em) { /* 1024 */

body {
	font-size: 45%;
	}
	



}

@media screen and (max-width: 56.25em) { /* 900 */ 
.instagram-img {
	width: 33.333%;
	}

.instagram-img img:nth-child(3n) {
	clear: left;
	}
	}

@media all and (max-width: 55.625em) { /* 890 */

	}

@media screen and (max-width: 45em) { /* 720 */
body {
	font-size: 35%;
	}
	}

@media screen and (max-width: 37.5em) { /* 600px */
body {
	font-size: 25%;
	}
	
h1 {
	left: 12%;
	}
	}