@charset "UTF-8";
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - Theme info */
/*
Theme Name: NaAst thema
Theme URI: 
Author: 
Author URI: 
Description: 
Version: 1.0
*/
/* ==================================================================================== 

    RESET

==================================================================================== */
@import url("https://fonts.googleapis.com/css?family=Quicksand:300,400,500,700");
html {
	color: #000;
	background: #FFF;
}
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td {
	margin: 0;
	padding: 0;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
fieldset, img {
	border: 0;
}
address, caption, cite, code, dfn, em, strong, th, var {
	font-style: normal;
	font-weight: normal;
}
ol, ul {
	list-style: none;
}
caption, th {
	text-align: left;
}
h1, h2, h3, h4, h5, h6 {
	font-size: 100%;
	font-weight: normal;
}
q:before, q:after {
	content: '';
}
abbr, acronym {
	border: 0;
	font-variant: normal;
}
sup {
	vertical-align: text-top;
}
sub {
	vertical-align: text-bottom;
}
input, textarea, select {
	font-family: inherit;
	font-size: inherit;
	font-weight: inherit;
}
input, textarea, select {
 *font-size: 100%;
}
legend {
	color: #000;
}
article, aside, audio, bb, canvas, datagrid, datalist, details, dialog, eventsource, figure, footer, header, hgroup, mark, menu, meter, nav, output, progress, section, time, video {
	display: block;
	margin: 0;
	padding: 0;
}
.cf:after, .pageMenu ul:after, .post:after {
	content: ".";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}
.cf {
	min-height: 1px;
}
/* ==================================================================================== 

    COMMON

==================================================================================== */
* {
	box-sizing: border-box;
}
html {
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
	font-size: 10px;
}
body {
	max-height: 100%;
}
h1, h2, h3, h4, h5, h6 {
	line-height: 1.2;
}
p {
	text-align: justify;
	line-height: 1.6;
}
a {
	text-decoration: none;
}
img {
	vertical-align: bottom;
	max-width: 100%;
}
.holder,  .first,  .second,  .third {
	height: 100vh;
	width: 100vw;
}
.first,  .second,  .third {
	position: absolute;
}
.second,  .third {
	opacity: 0;
}
.holder {
	height: 100vh;
	position: relative;
	z-index: 1;
}
.first {
	animation: first 10s infinite;
	background: linear-gradient(#5ff8ca, #60e08c);
	z-index: 10;
}
 @keyframes first {
 0% {
opacity: 1.0;
}
 10% {
opacity: 0.8;
}
 20% {
opacity: 0.6;
}
 30% {
opacity: 0.4;
}
 40% {
opacity: 0.2;
}
 50% {
opacity: 0.1;
}
 60% {
opacity: 0.2;
}
 70% {
opacity: 0.4;
}
 80% {
opacity: 0.6;
}
 90% {
opacity: 0.8;
}
 100% {
opacity: 1.0;
}
}
.second {
	animation: second 10s infinite;
	animation-delay: 2s;
	background: linear-gradient(#19eaa6, #00a1f0);
	z-index: 20;
}
 @keyframes second {
 0% {
opacity: 0;
}
 10% {
opacity: 0.2;
}
 20% {
opacity: 0.4;
}
 30% {
opacity: 0.6;
}
 40% {
opacity: 0.8;
}
 50% {
opacity: 1.0;
}
 60% {
opacity: 0.8;
}
 70% {
opacity: 0.6;
}
 80% {
opacity: 0.4;
}
 90% {
opacity: 0.2;
}
 100% {
opacity: 0;
}
}
.third {
	animation: third 10s infinite;
	animation-delay: 8s;
	background: linear-gradient(#aab7f8, #ff75c6);
	z-index: 30;
}
 @keyframes third {
 0% {
opacity: 0;
}
 10% {
opacity: 0.2;
}
 20% {
opacity: 0.4;
}
 30% {
opacity: 0.6;
}
 40% {
opacity: 0.8;
}
 50% {
opacity: 1.0;
}
 60% {
opacity: 0.8;
}
 70% {
opacity: 0.6;
}
 80% {
opacity: 0.4;
}
 90% {
opacity: 0.2;
}
 100% {
opacity: 0;
}
}
#wrapper {
	max-width:980px;
}
#inner　 {
	position:relative;
}
#inner p {
	z-index:10000;
	width: 60%;
	max-width: 333px;
	position: absolute;
	top: 50%;
	right: 0px;
	bottom: 0px;
	left: 0px;
	margin:-112px auto 0;
}
img[src$=".svg"] {
    width: 100%;
}
}
@media only screen and (max-width: 768px) {
}
@media only screen and (max-width: 640px) {
}
@media only screen and (max-width: 480px) {
}

/*# sourceMappingURL=style.css.map */