
/* Setup Each Selector */#notice {-webkit-animation-duration: 8s;    -webkit-animation-iteration-count: 1;    -webkit-animation-timing-function: ease;    -webkit-animation-fill-mode: both;-moz-animation-duration: 8s;    -moz-animation-iteration-count: 1;    -moz-animation-timing-function: ease;    -moz-animation-fill-mode: both;-o-animation-duration: 8s;    -o-animation-iteration-count: 1;    -o-animation-timing-function: ease;    -o-animation-fill-mode: both;animation-duration: 8s;    animation-iteration-count: 1;    animation-timing-function: ease;    animation-fill-mode: both;} /* Setup #notice Keyframes */@-webkit-keyframes notice {0% {opacity: 1;}81% {opacity: 1;}100% {opacity: 0;}}@-moz-keyframes notice {0% {opacity: 1;}81% {opacity: 1;}100% {opacity: 0;}}@-o-keyframes notice {0% {opacity: 1;}81% {opacity: 1;}100% {opacity: 0;}}@keyframes notice {0% {opacity: 1;}81% {opacity: 1;}100% {opacity: 0;}}/* Add Animation to Selector */#notice {-webkit-animation-name: notice;-moz-animation-name: notice;-o-animation-name: notice;animation-name: notice;}

/* ////////////////////////////////////////////////////// */
/* Setup Each Selector */
/* ////////////////////////////////////////////////////// */
#helloiam-wrap, #viewmy-wrap, #looklike-wrap, #ido-wrap, #contact-wrap, #things-wrap, #connect-wrap {
	-webkit-animation-duration: 5s;
	   -moz-animation-duration: 5s;
	    -ms-animation-duration: 5s;
	     -o-animation-duration: 5s;
	        animation-duration: 5s;
	-webkit-animation-iteration-count: 1;
	   -moz-animation-iteration-count: 1;
	    -ms-animation-iteration-count: 1;
	     -o-animation-iteration-count: 1;
	        animation-iteration-count: 1;
	-webkit-animation-timing-function: ease;
	   -moz-animation-timing-function: ease;
	    -ms-animation-timing-function: ease;
	     -o-animation-timing-function: ease;
	        animation-timing-function: ease;
	-webkit-animation-fill-mode: both;
	   -moz-animation-fill-mode: both;
	    -ms-animation-fill-mode: both;
	     -o-animation-fill-mode: both;
	        animation-fill-mode: both;
} 
	/* ////////////////////////////////////////////////////// */
	/* Setup #helloiam-wrap Keyframes */
	/* ////////////////////////////////////////////////////// */
	@-ms-keyframes helloiam-wrap {
		0% {
			opacity: 0;
			-ms-transform:  translateY(-25px)
		}
		10% {
			opacity: 1;
		}
		20% {
			-ms-transform:  translateY(0px)
		}
		100% {
			-ms-transform:  translateY(0px)
			;opacity: 1;
		}
	}
	@-webkit-keyframes helloiam-wrap {
		0% {
			opacity: 0;
			-webkit-transform:  translateY(-25px)
		}
		10% {
			opacity: 1;
		}
		20% {
			-webkit-transform:  translateY(0px)
		}
		100% {
			-webkit-transform:  translateY(0px)
			;opacity: 1;
		}
	}
	@-moz-keyframes helloiam-wrap {
		0% {
			opacity: 0;
			-moz-transform:  translateY(-25px)
		}
		10% {
			opacity: 1;
		}
		20% {
			-moz-transform:  translateY(0px)
		}
		100% {
			-moz-transform:  translateY(0px)
			;opacity: 1;
		}
	}
	@-o-keyframes helloiam-wrap {
		0% {
			opacity: 0;
			-o-transform:  translateY(-25px)
		}
		10% {
			opacity: 1;
		}
		20% {
			-o-transform:  translateY(0px)
		}
		100% {
			-o-transform:  translateY(0px)
			;opacity: 1;
		}
	}
	@keyframes helloiam-wrap {
		0% {
			opacity: 0;
			transform:  translateY(-25px)
		}
		10% {
			opacity: 1;
		}
		20% {
			transform:  translateY(0px)
		}
		100% {
			transform:  translateY(0px)
			;opacity: 1;
		}
	}
/* ////////////////////////////////////////////////////// */
/* Add Animation to Selector */
/* ////////////////////////////////////////////////////// */
#helloiam-wrap {
	-webkit-animation-name: helloiam-wrap;
	-moz-animation-name: helloiam-wrap;
	-ms-animation-name: helloiam-wrap;
	-o-animation-name: helloiam-wrap;
	animation-name: helloiam-wrap;
}
		/* ////////////////////////////////////////////////////// */
	/* Setup #viewmy-wrap Keyframes */
	/* ////////////////////////////////////////////////////// */
	@-ms-keyframes viewmy-wrap {
		0% {
			opacity: 0;
			-ms-transform:  translateY(-25px)
		}
		10% {
			opacity: 0;
			-ms-transform:  translateY(-25px)
		}
		20% {
			opacity: 1;
		}
		30% {
			-ms-transform:  translateY(0px)
		}
		100% {
			-ms-transform:  translateY(0px)
			;opacity: 1;
		}
	}
	@-webkit-keyframes viewmy-wrap {
		0% {
			opacity: 0;
			-webkit-transform:  translateY(-25px)
		}
		10% {
			opacity: 0;
			-webkit-transform:  translateY(-25px)
		}
		20% {
			opacity: 1;
		}
		30% {
			-webkit-transform:  translateY(0px)
		}
		100% {
			-webkit-transform:  translateY(0px)
			;opacity: 1;
		}
	}
	@-moz-keyframes viewmy-wrap {
		0% {
			opacity: 0;
			-moz-transform:  translateY(-25px)
		}
		10% {
			opacity: 0;
			-moz-transform:  translateY(-25px)
		}
		20% {
			opacity: 1;
		}
		30% {
			-moz-transform:  translateY(0px)
		}
		100% {
			-moz-transform:  translateY(0px)
			;opacity: 1;
		}
	}
	@-o-keyframes viewmy-wrap {
		0% {
			opacity: 0;
			-o-transform:  translateY(-25px)
		}
		10% {
			opacity: 0;
			-o-transform:  translateY(-25px)
		}
		20% {
			opacity: 1;
		}
		30% {
			-o-transform:  translateY(0px)
		}
		100% {
			-o-transform:  translateY(0px)
			;opacity: 1;
		}
	}
	@keyframes viewmy-wrap {
		0% {
			opacity: 0;
			transform:  translateY(-25px)
		}
		10% {
			opacity: 0;
			transform:  translateY(-25px)
		}
		20% {
			opacity: 1;
		}
		30% {
			transform:  translateY(0px)
		}
		100% {
			transform:  translateY(0px)
			;opacity: 1;
		}
	}
/* ////////////////////////////////////////////////////// */
/* Add Animation to Selector */
/* ////////////////////////////////////////////////////// */
#viewmy-wrap {
	-webkit-animation-name: viewmy-wrap;
	-moz-animation-name: viewmy-wrap;
	-ms-animation-name: viewmy-wrap;
	-o-animation-name: viewmy-wrap;
	animation-name: viewmy-wrap;
}
		/* ////////////////////////////////////////////////////// */
	/* Setup #looklike-wrap Keyframes */
	/* ////////////////////////////////////////////////////// */
	@-ms-keyframes looklike-wrap {
		0% {
			opacity: 0;
			-ms-transform:  translateY(-25px)
		}
		20% {
			opacity: 0;
			-ms-transform:  translateY(-25px)
		}
		30% {
			opacity: 1;
		}
		40% {
			-ms-transform:  translateY(0px)
		}
		100% {
			-ms-transform:  translateY(0px)
			;opacity: 1;
		}
	}
	@-webkit-keyframes looklike-wrap {
		0% {
			opacity: 0;
			-webkit-transform:  translateY(-25px)
		}
		20% {
			opacity: 0;
			-webkit-transform:  translateY(-25px)
		}
		30% {
			opacity: 1;
		}
		40% {
			-webkit-transform:  translateY(0px)
		}
		100% {
			-webkit-transform:  translateY(0px)
			;opacity: 1;
		}
	}
	@-moz-keyframes looklike-wrap {
		0% {
			opacity: 0;
			-moz-transform:  translateY(-25px)
		}
		20% {
			opacity: 0;
			-moz-transform:  translateY(-25px)
		}
		30% {
			opacity: 1;
		}
		40% {
			-moz-transform:  translateY(0px)
		}
		100% {
			-moz-transform:  translateY(0px)
			;opacity: 1;
		}
	}
	@-o-keyframes looklike-wrap {
		0% {
			opacity: 0;
			-o-transform:  translateY(-25px)
		}
		20% {
			opacity: 0;
			-o-transform:  translateY(-25px)
		}
		30% {
			opacity: 1;
		}
		40% {
			-o-transform:  translateY(0px)
		}
		100% {
			-o-transform:  translateY(0px)
			;opacity: 1;
		}
	}
	@keyframes looklike-wrap {
		0% {
			opacity: 0;
			transform:  translateY(-25px)
		}
		20% {
			opacity: 0;
			transform:  translateY(-25px)
		}
		30% {
			opacity: 1;
		}
		40% {
			transform:  translateY(0px)
		}
		100% {
			transform:  translateY(0px)
			;opacity: 1;
		}
	}
/* ////////////////////////////////////////////////////// */
/* Add Animation to Selector */
/* ////////////////////////////////////////////////////// */
#looklike-wrap {
	-webkit-animation-name: looklike-wrap;
	-moz-animation-name: looklike-wrap;
	-ms-animation-name: looklike-wrap;
	-o-animation-name: looklike-wrap;
	animation-name: looklike-wrap;
}
		/* ////////////////////////////////////////////////////// */
	/* Setup #ido-wrap Keyframes */
	/* ////////////////////////////////////////////////////// */
	@-ms-keyframes ido-wrap {
		0% {
			opacity: 0;
			-ms-transform:  translateY(-25px)
		}
		30% {
			opacity: 0;
			-ms-transform:  translateY(-25px)
		}
		40% {
			opacity: 1;
		}
		50% {
			-ms-transform:  translateY(0px)
		}
		100% {
			-ms-transform:  translateY(0px)
			;opacity: 1;
		}
	}
	@-webkit-keyframes ido-wrap {
		0% {
			opacity: 0;
			-webkit-transform:  translateY(-25px)
		}
		30% {
			opacity: 0;
			-webkit-transform:  translateY(-25px)
		}
		40% {
			opacity: 1;
		}
		50% {
			-webkit-transform:  translateY(0px)
		}
		100% {
			-webkit-transform:  translateY(0px)
			;opacity: 1;
		}
	}
	@-moz-keyframes ido-wrap {
		0% {
			opacity: 0;
			-moz-transform:  translateY(-25px)
		}
		30% {
			opacity: 0;
			-moz-transform:  translateY(-25px)
		}
		40% {
			opacity: 1;
		}
		50% {
			-moz-transform:  translateY(0px)
		}
		100% {
			-moz-transform:  translateY(0px)
			;opacity: 1;
		}
	}
	@-o-keyframes ido-wrap {
		0% {
			opacity: 0;
			-o-transform:  translateY(-25px)
		}
		30% {
			opacity: 0;
			-o-transform:  translateY(-25px)
		}
		40% {
			opacity: 1;
		}
		50% {
			-o-transform:  translateY(0px)
		}
		100% {
			-o-transform:  translateY(0px)
			;opacity: 1;
		}
	}
	@keyframes ido-wrap {
		0% {
			opacity: 0;
			transform:  translateY(-25px)
		}
		30% {
			opacity: 0;
			transform:  translateY(-25px)
		}
		40% {
			opacity: 1;
		}
		50% {
			transform:  translateY(0px)
		}
		100% {
			transform:  translateY(0px)
			;opacity: 1;
		}
	}
/* ////////////////////////////////////////////////////// */
/* Add Animation to Selector */
/* ////////////////////////////////////////////////////// */
#ido-wrap {
	-webkit-animation-name: ido-wrap;
	-moz-animation-name: ido-wrap;
	-ms-animation-name: ido-wrap;
	-o-animation-name: ido-wrap;
	animation-name: ido-wrap;
}
		/* ////////////////////////////////////////////////////// */
	/* Setup #contact-wrap Keyframes */
	/* ////////////////////////////////////////////////////// */
	@-ms-keyframes contact-wrap {
		0% {
			opacity: 0;
			-ms-transform:  translateY(-25px)
		}
		40% {
			opacity: 0;
			-ms-transform:  translateY(-25px)
		}
		50% {
			opacity: 1;
		}
		60% {
			-ms-transform:  translateY(0px)
		}
		100% {
			-ms-transform:  translateY(0px)
			;opacity: 1;
		}
	}
	@-webkit-keyframes contact-wrap {
		0% {
			opacity: 0;
			-webkit-transform:  translateY(-25px)
		}
		40% {
			opacity: 0;
			-webkit-transform:  translateY(-25px)
		}
		50% {
			opacity: 1;
		}
		60% {
			-webkit-transform:  translateY(0px)
		}
		100% {
			-webkit-transform:  translateY(0px)
			;opacity: 1;
		}
	}
	@-moz-keyframes contact-wrap {
		0% {
			opacity: 0;
			-moz-transform:  translateY(-25px)
		}
		40% {
			opacity: 0;
			-moz-transform:  translateY(-25px)
		}
		50% {
			opacity: 1;
		}
		60% {
			-moz-transform:  translateY(0px)
		}
		100% {
			-moz-transform:  translateY(0px)
			;opacity: 1;
		}
	}
	@-o-keyframes contact-wrap {
		0% {
			opacity: 0;
			-o-transform:  translateY(-25px)
		}
		40% {
			opacity: 0;
			-o-transform:  translateY(-25px)
		}
		50% {
			opacity: 1;
		}
		60% {
			-o-transform:  translateY(0px)
		}
		100% {
			-o-transform:  translateY(0px)
			;opacity: 1;
		}
	}
	@keyframes contact-wrap {
		0% {
			opacity: 0;
			transform:  translateY(-25px)
		}
		40% {
			opacity: 0;
			transform:  translateY(-25px)
		}
		50% {
			opacity: 1;
		}
		60% {
			transform:  translateY(0px)
		}
		100% {
			transform:  translateY(0px)
			;opacity: 1;
		}
	}
/* ////////////////////////////////////////////////////// */
/* Add Animation to Selector */
/* ////////////////////////////////////////////////////// */
#contact-wrap {
	-webkit-animation-name: contact-wrap;
	-moz-animation-name: contact-wrap;
	-ms-animation-name: contact-wrap;
	-o-animation-name: contact-wrap;
	animation-name: contact-wrap;
}
		/* ////////////////////////////////////////////////////// */
	/* Setup #things-wrap Keyframes */
	/* ////////////////////////////////////////////////////// */
	@-ms-keyframes things-wrap {
		0% {
			opacity: 0;
			-ms-transform:  translateY(-25px)
		}
		50% {
			opacity: 0;
			-ms-transform:  translateY(-25px)
		}
		60% {
			opacity: 1;
		}
		70% {
			-ms-transform:  translateY(0px)
		}
		100% {
			-ms-transform:  translateY(0px)
			;opacity: 1;
		}
	}
	@-webkit-keyframes things-wrap {
		0% {
			opacity: 0;
			-webkit-transform:  translateY(-25px)
		}
		50% {
			opacity: 0;
			-webkit-transform:  translateY(-25px)
		}
		60% {
			opacity: 1;
		}
		70% {
			-webkit-transform:  translateY(0px)
		}
		100% {
			-webkit-transform:  translateY(0px)
			;opacity: 1;
		}
	}
	@-moz-keyframes things-wrap {
		0% {
			opacity: 0;
			-moz-transform:  translateY(-25px)
		}
		50% {
			opacity: 0;
			-moz-transform:  translateY(-25px)
		}
		60% {
			opacity: 1;
		}
		70% {
			-moz-transform:  translateY(0px)
		}
		100% {
			-moz-transform:  translateY(0px)
			;opacity: 1;
		}
	}
	@-o-keyframes things-wrap {
		0% {
			opacity: 0;
			-o-transform:  translateY(-25px)
		}
		50% {
			opacity: 0;
			-o-transform:  translateY(-25px)
		}
		60% {
			opacity: 1;
		}
		70% {
			-o-transform:  translateY(0px)
		}
		100% {
			-o-transform:  translateY(0px)
			;opacity: 1;
		}
	}
	@keyframes things-wrap {
		0% {
			opacity: 0;
			transform:  translateY(-25px)
		}
		50% {
			opacity: 0;
			transform:  translateY(-25px)
		}
		60% {
			opacity: 1;
		}
		70% {
			transform:  translateY(0px)
		}
		100% {
			transform:  translateY(0px)
			;opacity: 1;
		}
	}
/* ////////////////////////////////////////////////////// */
/* Add Animation to Selector */
/* ////////////////////////////////////////////////////// */
#things-wrap {
	-webkit-animation-name: things-wrap;
	-moz-animation-name: things-wrap;
	-ms-animation-name: things-wrap;
	-o-animation-name: things-wrap;
	animation-name: things-wrap;
}
		/* ////////////////////////////////////////////////////// */
	/* Setup #connect-wrap Keyframes */
	/* ////////////////////////////////////////////////////// */
	@-ms-keyframes connect-wrap {
		0% {
			opacity: 0;
			-ms-transform:  translateY(-25px)
		}
		60% {
			opacity: 0;
			-ms-transform:  translateY(-25px)
		}
		70% {
			opacity: 1;
		}
		80% {
			-ms-transform:  translateY(0px)
		}
		100% {
			-ms-transform:  translateY(0px)
			;opacity: 1;
		}
	}
	@-webkit-keyframes connect-wrap {
		0% {
			opacity: 0;
			-webkit-transform:  translateY(-25px)
		}
		60% {
			opacity: 0;
			-webkit-transform:  translateY(-25px)
		}
		70% {
			opacity: 1;
		}
		80% {
			-webkit-transform:  translateY(0px)
		}
		100% {
			-webkit-transform:  translateY(0px)
			;opacity: 1;
		}
	}
	@-moz-keyframes connect-wrap {
		0% {
			opacity: 0;
			-moz-transform:  translateY(-25px)
		}
		60% {
			opacity: 0;
			-moz-transform:  translateY(-25px)
		}
		70% {
			opacity: 1;
		}
		80% {
			-moz-transform:  translateY(0px)
		}
		100% {
			-moz-transform:  translateY(0px)
			;opacity: 1;
		}
	}
	@-o-keyframes connect-wrap {
		0% {
			opacity: 0;
			-o-transform:  translateY(-25px)
		}
		60% {
			opacity: 0;
			-o-transform:  translateY(-25px)
		}
		70% {
			opacity: 1;
		}
		80% {
			-o-transform:  translateY(0px)
		}
		100% {
			-o-transform:  translateY(0px)
			;opacity: 1;
		}
	}
	@keyframes connect-wrap {
		0% {
			opacity: 0;
			transform:  translateY(-25px)
		}
		60% {
			opacity: 0;
			transform:  translateY(-25px)
		}
		70% {
			opacity: 1;
		}
		80% {
			transform:  translateY(0px)
		}
		100% {
			transform:  translateY(0px)
			;opacity: 1;
		}
	}
/* ////////////////////////////////////////////////////// */
/* Add Animation to Selector */
/* ////////////////////////////////////////////////////// */
#connect-wrap {
	-webkit-animation-name: connect-wrap;
	-moz-animation-name: connect-wrap;
	-ms-animation-name: connect-wrap;
	-o-animation-name: connect-wrap;
	animation-name: connect-wrap;
}



/* top ----------- */


#topbar {
	-webkit-animation-duration: 6s;
	   -moz-animation-duration: 6s;
	    -ms-animation-duration: 6s;
	     -o-animation-duration: 6s;
	        animation-duration: 6s;
	-webkit-animation-iteration-count: 1;
	   -moz-animation-iteration-count: 1;
	    -ms-animation-iteration-count: 1;
	     -o-animation-iteration-count: 1;
	        animation-iteration-count: 1;
	-webkit-animation-timing-function: ease;
	   -moz-animation-timing-function: ease;
	    -ms-animation-timing-function: ease;
	     -o-animation-timing-function: ease;
	        animation-timing-function: ease;
	-webkit-animation-fill-mode: both;
	   -moz-animation-fill-mode: both;
	    -ms-animation-fill-mode: both;
	     -o-animation-fill-mode: both;
	        animation-fill-mode: both;
} 
	/* ////////////////////////////////////////////////////// */
	/* Setup #topbar Keyframes */
	/* ////////////////////////////////////////////////////// */
	@-ms-keyframes topbar {
		0% {
			-ms-transform:  translateY(-100px)
		}
		42% {
			-ms-transform:  translateY(-100px)
		}
		67% {
			-ms-transform:  translateY(0px)
		}
		100% {
			-ms-transform:  translateY(0px)
		}
	}
	@-webkit-keyframes topbar {
		0% {
			-webkit-transform:  translateY(-100px)
		}
		42% {
			-webkit-transform:  translateY(-100px)
		}
		67% {
			-webkit-transform:  translateY(0px)
		}
		100% {
			-webkit-transform:  translateY(0px)
		}
	}
	@-moz-keyframes topbar {
		0% {
			-moz-transform:  translateY(-100px)
		}
		42% {
			-moz-transform:  translateY(-100px)
		}
		67% {
			-moz-transform:  translateY(0px)
		}
		100% {
			-moz-transform:  translateY(0px)
		}
	}
	@-o-keyframes topbar {
		0% {
			-o-transform:  translateY(-100px)
		}
		42% {
			-o-transform:  translateY(-100px)
		}
		67% {
			-o-transform:  translateY(0px)
		}
		100% {
			-o-transform:  translateY(0px)
		}
	}
	@keyframes topbar {
		0% {
			transform:  translateY(-100px)
		}
		42% {
			transform:  translateY(-100px)
		}
		67% {
			transform:  translateY(0px)
		}
		100% {
			transform:  translateY(0px)
		}
	}
/* ////////////////////////////////////////////////////// */
/* Add Animation to Selector */
/* ////////////////////////////////////////////////////// */
#topbar {
	-webkit-animation-name: topbar;
	-moz-animation-name: topbar;
	-ms-animation-name: topbar;
	-o-animation-name: topbar;
	animation-name: topbar;
}


