@charset 'utf-8';
@font-face {
	font-family: 'MyriadPro';
	src: url('../fonts/MyriadPro-Regular.otf');
	font-weight: normal;
}
@font-face {
	font-family: 'MyriadPro';
	src: url('../fonts/MyriadPro-Light.otf');
	font-weight: 300;
}
@font-face {
	font-family: 'Xolonium';
	src:url('../fonts/xolonium-Regular.otf'),
		url('../fonts/xolonium-Regular.otf') format('embedded-opentype'),
		url("../fonts/xolonium-Regular.ttf") format("opentype"),
		url("../fonts/xolonium-regular.eot");
	font-weight: normal;
	font-style: normal;
}
@import url('https://fonts.googleapis.com/css?family=Fjalla+One');
/*------RESET---------*/
	#hd {
		margin: 0;
		padding:0;
		background-color: #000000;
		font-size: 16px;
	}
	#hd {
		background: #000000;
		color: #FFF;
	}
	::selection {
		background: #1d2124;
		color: #CE0000;
	}
	::-moz-selection {
		background: #1d2124;
		color: #ffffff;
	}
	#hd * {
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
		word-wrap: break-word;
		word-break: break-word;
	}

	#hd img {
		display: block;
		max-width: 100% !important;
		height: auto;
		border: none;
	}
	#hd a {
		font-family: 'MyriadPro', sans-serif;
		font-size: 1em;
		text-decoration: none;
		color: #c70a0a;
		font-weight: 600;
	}
	#hd a:hover {
		text-decoration: none;
		color: #d30000;
	}
	#hd h1,
	#hd h2,
	#hd h3,
	#hd h4,
	#hd h5,
	#hd h6 {
		font-family: 'MyriadPro', sans-serif;
		color: #FFF;
		line-height: 1.4em;
		margin: 0;
		font-weight: normal;
	}
	#hd p {
		font-family: 'MyriadPro', sans-serif;
		font-size: 1em;
		font-weight: 300;
		letter-spacing: .5px;
		line-height: 1.5;
		margin: 0;
		padding-bottom: 20px;
		color: #FFF;
	}
	#hd b {
		display: block;
		font-size: 1em;
		font-weight: 600;
		letter-spacing: 0.5px;
	}
	#hd small {
		font-family: 'MyriadPro', sans-serif;
		font-size: .9em;
		line-height: 13px;
		font-weight: 300;
	}
	#hd small.txt-red{
		font-weight: 600;
	}
	#hd ul{
		font-family: 'MyriadPro', sans-serif;
		margin: 0;
		padding: 0;
		list-style: none;
	}
	#hd ol{
		font-family: 'MyriadPro', sans-serif;
		margin: 0;
		padding: 0;
	}
	#hd ul li,
	#hd ol li {
		font-family: 'MyriadPro', sans-serif;
		font-size: 1em;
		color: #FFF;
	}
	#hd figure{
		margin:0;
		padding:0;
	}
	#fp-nav ul li .fp-tooltip{
		max-width: 300px;
		text-transform: uppercase;
	}
/*------TXT-----------*/
	#hd h1{
		font-family: 'xolonium', sans-serif;
	    font-size: 2.2em;
	    line-height: 1;
		font-weight: normal;
	    color: #fff !important;
	}
	#hd h1 span{
		font-size: 2.5em;
	}
	#hd h2{
		/*font-family: 'Fjalla One', sans-serif;*/
		font-family: 'xolonium', sans-serif;
		font-weight: 400;
		font-size: 2.6em;
		line-height: 1.2;
		padding-bottom:20px;
		position: relative;
		color:#fff !important;
		text-transform:uppercase;
	}
	#hd h3{
		font-family: 'Fjalla One', sans-serif;
		font-size: 1.6em;
		font-weight: 400;
		line-height: 1.3;
		text-transform: uppercase;
		margin-bottom: 15px;
	}
	#hd .txt-center{text-align: center; }
	#hd .txt-left{text-align: left; }
	#hd .txt-grey{
		color:#808080;
		font-weight: 400;
	}
	#hd a.hd-link {
		font-size: inherit;
		color: #C50012;
		font-weight: 400;
		display: initial;
	}
	#hd a.hd-link:hover {
		color: white;
		opacity: 1;
	}
	#hd .title-red{
		text-shadow: 0 0 10px #ff0000;
		/*background: #a80012;
		background: -moz-linear-gradient(left, #a80012 0%, #ff7700 80%);
		background: -webkit-linear-gradient(left, #a80012 0%,#ff7700 80%);
		background: linear-gradient(to right, #a80012 0%,#ff7700 80%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a80012', endColorstr='#ff7700',GradientType=1 );
		-webkit-background-clip: text;
		-webkit-text-fill-color: transparent;*/
	}
	#hd .title-orange{
		text-shadow: 0 0 10px #ff7700;
		/*background: #ff7700;
		background: -moz-linear-gradient(left, #ff7700 0%, #fff100 100%);
		background: -webkit-linear-gradient(left, #ff7700 0%,#fff100 100%);
		background: linear-gradient(to right, #ff7700 0%,#fff100 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff7700', endColorstr='#fff100',GradientType=1 );
		-webkit-background-clip: text;
		-webkit-text-fill-color: transparent;*/
	}
	#hd .title-yellow{
		text-shadow: 0 0 10px #fff100;
		/*background: #fff100;
		background: -moz-linear-gradient(left, #fff100 0%, #70ff20 100%);
		background: -webkit-linear-gradient(left, #fff100 0%,#70ff20 100%);
		background: linear-gradient(to right, #fff100 0%,#70ff20 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fff100', endColorstr='#70ff20',GradientType=1 );
		-webkit-background-clip: text;
		-webkit-text-fill-color: transparent;*/
	}
	#hd .title-green{
		text-shadow: 0 0 10px #77baff;
		/*background: #70ff20;
		background: -moz-linear-gradient(left, #70ff20 0%, #19e9f7 100%);
		background: -webkit-linear-gradient(left, #70ff20 0%,#19e9f7 100%);
		background: linear-gradient(to right, #70ff20 0%,#19e9f7 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#70ff20', endColorstr='#19e9f7',GradientType=1 );
		-webkit-background-clip: text;
		-webkit-text-fill-color: transparent;*/
	}
	#hd .title-blue{
		text-shadow: 0 0 10px #19e9f7;
		/*background: #19e9f7;
		background: -moz-linear-gradient(left, #19e9f7 0%, #7740d1 100%);
		background: -webkit-linear-gradient(left, #19e9f7 0%,#7740d1 100%);
		background: linear-gradient(to right, #19e9f7 0%,#7740d1 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#19e9f7', endColorstr='#7740d1',GradientType=1 );
		-webkit-background-clip: text;
		-webkit-text-fill-color: transparent;*/
	}
	#hd .title-purple{
		text-shadow: 0 0 10px #ff64ec;
		/*background: #7740d1;
		background: -moz-linear-gradient(left, #7740d1 0%, #ff1900 100%);
		background: -webkit-linear-gradient(left, #7740d1 0%,#ff1900 100%);
		background: linear-gradient(to right, #7740d1 0%,#ff1900 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7740d1', endColorstr='#ff1900',GradientType=1 );
		-webkit-background-clip: text;
		-webkit-text-fill-color: transparent;*/
	}
	/*_:-ms-input-placeholder, :root #hd h2[class*="title-"] {background: transparent}*/
/*------BLOCK---------*/
	#hd .w90{
		width: 90%;
		max-width: 1920px;
		margin:0 auto;
		position: relative;
		z-index: 2;
	}
	#hd .w1200,
	#hd .w1250,
	#hd .w1400,
	#hd .w1100,
	#hd .w1000{
	    width: 90%;
	    max-width: 1200px;
	    margin: 0 auto;
	    position: relative;
	}
	#hd .w1400 {max-width: 1400px; }
	#hd .w1250 {max-width: 1250px; }
	#hd .w1000 {max-width: 1000px; }
	#hd .w1100 {max-width: 1100px; }
	#hd .ib,
	#hd .col25,
	#hd .col30,
	#hd .col33,
	#hd .col40,
	#hd .col50,
	#hd .col60,
	#hd .col70{
		display: inline-block;
		margin-left: -5px;
		vertical-align: middle;
	}
	#hd .col25{width: 25%; }
	#hd .col30{width: 30%; }
	#hd .col33{width: 33%; }
	#hd .col40{width: 40%; }
	#hd .col50{width: 50%; }
	#hd .col60{width: 60%; }
	#hd .col70{width: 70%; }

	#hd .h750{height: 750px; }

	#hd .fleft {float: left; }
	#hd .fright {float: right; }

	#hd .hd-rtl{direction: rtl; }
	#hd .mobile-on{display: none; }

	#hd .hd-btn {
		display: inline-block;
		border: none;
		outline: none;
		cursor: pointer;
		padding: 5px 20px;
		margin:20px 10px;
		font-family: 'Fjalla One', sans-serif;
		font-weight: 400;
		font-size: 18px;
		text-align: center;
		text-transform: uppercase;
		color: #fff;
		border-radius: 17px;
		position: relative;
		z-index: 1;
	}
	#hd .hd-btn:before {
		content: '';
		display: block;
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
		z-index: -1;
		border-radius: 17px;
		background: #0f0f0f;
	}
	#hd .hd-btn:after {
		content: '';
		display: block;
		width: calc(100% + 6px);
		height: calc(100% + 4px);
		position: absolute;
		top: -2px;
		left: -3px;
		z-index: -2;
		border-radius: 18px;
		background: #ff7700;
		background: -moz-linear-gradient(left, #ff7700 0%, #fff100 100%);
		background: -webkit-linear-gradient(left, #ff7700 0%, #fff100 100%);
		background: linear-gradient(to right, #ff7700 0%, #fff100 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff7700', endColorstr='#fff100',GradientType=1 );
	}
	#hd .hd-btn:hover {
		color: #ff2b00;
	}
	#hd .cf:after{
		content:'';
		display: block;
		clear:both;
	}
/*------SCROLL UP-----*/
	#scrollUp {
	    position: fixed;
	    right: 30px;
	    bottom: 30px;
	    width: 45px;
	    height: 45px;
	    text-align: center;
	    cursor: pointer;
	    border-radius: 50%;
	    -webkit-border-radius: 50%;
	    -moz-border-radius: 50%;
	    border: 2px solid #8D0000;
	    z-index: 999;
	    opacity: 0;
	}
	#scrollUp.hd-show {
	    opacity: 1;
	}
	#scrollUp:hover {
	    background-color: #8D0000;
	}
	#scrollUp:hover svg {
	    fill: #FFF;
	}
	#scrollUp svg {
	    display: block;
	    position: absolute;
	    margin: auto;
	    top: 0;
	    right: 0;
	    bottom: 5px;
	    left: 0;
	    fill: #8D0000;
	    -webkit-transform: rotateZ(270deg);
	    -moz-transform: rotateZ(270deg);
	    -ms-transform: rotateZ(270deg);
	    -o-transform: rotateZ(270deg);
	    transform: rotateZ(270deg);
	}
/*----- lightbox----- */
	#hd_lightbox {
	    width: 100%;
	    height: 100vh;
	    position: fixed;
	    top: 0;
	    left: 0;
	    display: none;
	    z-index: 10;
	}
	#hd .hd_filter {
	    width: 100%;
	    height: 100%;
	    background: rgba(0, 0, 0, .7);
	}
	#hd .hd_box {
	    width: 1000px;
	    height: 480px;
	    background: #232323;
	    position: absolute;
	    top: 0;
	    right: 0;
	    bottom: 0;
	    left: 0;
	    margin: auto;
	    padding: 35px 60px;
	    box-sizing: border-box;
	}
	#hd .hd_close {
	    position: absolute;
	    top: 25px;
	    right: 20px;
	    cursor: pointer;
	}
	#hd .hd_close>span {
	    display: block;
	    width: 20px;
	    height: 3px;
	    background: #777777;
	    -webkit-border-radius: 1.5px;
	    -moz-border-radius: 1.5px;
	    border-radius: 1.5px;
	}
	#hd .hd_close>span:first-child {
	    -webkit-transform: rotateZ(45deg);
	    -moz-transform: rotateZ(45deg);
	    -ms-transform: rotateZ(45deg);
	    -o-transform: rotateZ(45deg);
	    transform: rotateZ(45deg);
	}
	#hd .hd_close>span:last-child {
	    -webkit-transform: rotateZ(-45deg) translate(2px, -2px);
	    -moz-transform: rotateZ(-45deg) translate(2px, -2px);
	    -ms-transform: rotateZ(-45deg) translate(2px, -2px);
	    -o-transform: rotateZ(-45deg) translate(2px, -2px);
	    transform: rotateZ(-45deg) translate(2px, -2px);
	}
	#hd .hd_box>img {
	    position: absolute;
	    right: 40px;
	    bottom: 60px;
	}
	#hd .hd_box iframe {
	    width: 100%;
	    height: 100%;
	}
/*----- transition ---*/
	#hd a.hd-link,
	#kv .vid_btn,
	#switch_img li img{
		-webkit-transition: all .25s ease;
		   -moz-transition: all .25s ease;
		    -ms-transition: all .25s ease;
		     -o-transition: all .25s ease;
		        transition: all .25s ease;
	}
/*--------top---------*/
	#hd #top{
		background-image: url(../img/top-bg-01.jpg);
		background-size: cover;
		background-position: left bottom;
		padding: 230px 0;
	}
	#hd #top .text{
		width: 40%;
		float: right;
	}
	#hd #top .mobile_pd{
		display: none;
	}
/*--------banner------*/
	#hd #banner .photo{
		width: 33.3333333333%;
		height: 0;
		padding-top: 18%;
		background-position: center;
		background-size: cover;
	}
	#hd #banner .photo:nth-child(1){
		background-image: url(../img/s-banner-01.jpg);
	}
	#hd #banner .photo:nth-child(2){
		background-image: url(../img/s-banner-02.jpg);
	}
	#hd #banner .photo:nth-child(3){
		background-image: url(../img/s-banner-03.jpg);
	}
/*--------template----*/
	#hd #template{
		background-image: url(../img/template_bg-01.jpg);
		background-position: center;
		background-size: cover;
		padding: 100px 0;
	}
	#hd #template ul{
		padding-top: 50px;
	}
	#hd #template li{
		width: 33.3333%;
		float: left;
		padding: 0 10px;
	}
	#hd #template li img{
		display: inline-block;
		width: 75%;
		margin-bottom: 20px;
	}
/*--------video-------*/
	#hd #video{
		padding: 100px 0;
		background-image: url(../img/video-bg-01.jpg);
		background-size: cover;
		background-position: center top;
	}
	#hd #video .row{
		margin-top: 50px;
	}
	#hd #video ul.tab_list{
		width: 25%;
		padding-right: 30px;
	}
	#hd #video ul.tab_list li{
		border: 1px solid #777;
		margin-bottom: 15px;
		padding: 15px;
		opacity: .6;
		cursor: pointer;
		-webkit-transition: all .25s ease;
		   -moz-transition: all .25s ease;
		    -ms-transition: all .25s ease;
		     -o-transition: all .25s ease;
		        transition: all .25s ease;
	}
	#hd #video ul.tab_list li:hover{
		opacity: 1;
	}
	#hd #video ul.tab_list li.active{
		opacity: 1;
		border-color: #CE0000;
	}
	#hd #video ul.tab_list li h3{
		margin-bottom: 0;
		font-size: 1.3em;
	}
	#hd #video .right{
		float: left;
		width: 75%;
		padding: 30px;
		background-color: #222;
		min-height: 280px;
	}
	#hd #video .right .videoBox{
		position: relative;
	    width: 100%;
	    height: 0;
	    padding-top: 56.25%;
	}
	#hd #video .right iframe {
	    position: absolute;
	    width: 100%;
	    top: 0;
	    left: 0;
	}
	#hd #video .right ul.remarks_list > li{
		display: none;
	}
	#hd #video .right ul.remarks_list > li.active{
		display: block;
	}
	#hd #video .right ol{
		padding-left: 20px;
		padding-top: 15px;
	}
	#hd #video .right ol li{
		margin: 6px 0;
		font-weight: 300;
	}

/* ---------- ANIMATIONS ---------- */
	@-webkit-keyframes fadeInFromBottom{
		from{
			opacity: 0;
			-webkit-transform: translateY(10%);
		}
		to  {
			opacity: 1;
			-webkit-transform: translateY(0);
		}
	}
	@keyframes fadeInFromBottom{
		from{
			opacity: 0;
			   -moz-transform: translateY(10%);
				-ms-transform: translateY(10%);
				 -o-transform: translateY(10%);
					transform: translateY(10%);
		}
		to  {
			opacity: 1;
			   -moz-transform: translateY(0);
				-ms-transform: translateY(0);
				 -o-transform: translateY(0);
					transform: translateY(0);
		}
	}
	#hd .colorrun{
		-webkit-animation: colorrun 5s infinite;
		-o-animation: colorrun 5s infinite;
		animation: colorrun 5s infinite;
	}
	@keyframes colorrun {
		from {
			-webkit-filter: hue-rotate(0deg);
			filter: hue-rotate(0deg);
		}
		to {
			-webkit-filter: hue-rotate(359deg);
			filter: hue-rotate(359deg);
		}
	}
	@-webkit-keyframes colorrun {
		from {
			-webkit-filter: hue-rotate(0deg);
			filter: hue-rotate(0deg);
		}
		to {
			-webkit-filter: hue-rotate(359deg);
			filter: hue-rotate(359deg);
		}
	}

	@-webkit-keyframes static {
	  0%		{opacity: 1}
	  50%		{opacity: 1}
	}
	@keyframes static {
	  0%		{opacity: 1}
	  50%		{opacity: 1}
	}
	@-webkit-keyframes breathing {
	  0%		{opacity: 1}
	  50%		{opacity: 0}
	}
	@keyframes breathing {
	  0%		{opacity: 1}
	  50%		{opacity: 0}
	}

	@-webkit-keyframes cycle {
	  0%		{background-color: red;}
	  2%		{background-color: red;}
	  10.3%		{background-color: orange;}
	  18.6%		{background-color: yellow;}
	  26.9%		{background-color: #b0ff00;}
	  35.2%		{background-color: #00db4a;}
	  43.5%		{background-color: #00ffd9;}
	  51.8%		{background-color: #00deff;}
	  60.1%		{background-color: #0093ff;}
	  68.4%		{background-color: #0023ff;}
	  76.7%		{background-color: #8e00ff;}
	  85%		{background-color: #e100ff;}
	  93.3%		{background-color: #ff008b;}
	  100%		{background-color: red;}
	}
	@keyframes cycle {
	  0%		{background-color: red;}
	  2%		{background-color: red;}
	  10.3%		{background-color: orange;}
	  18.6%		{background-color: yellow;}
	  26.9%		{background-color: #b0ff00;}
	  35.2%		{background-color: #00db4a;}
	  43.5%		{background-color: #00ffd9;}
	  51.8%		{background-color: #00deff;}
	  60.1%		{background-color: #0093ff;}
	  68.4%		{background-color: #0023ff;}
	  76.7%		{background-color: #8e00ff;}
	  85%		{background-color: #e100ff;}
	  93.3%		{background-color: #ff008b;}
	  100%		{background-color: red;}
	}

	@-webkit-keyframes jumping {
		0%		{bottom:-30%; left: 20%;}
		25%		{bottom:30%; left:20%;}
		50%		{bottom:-15%; left: -30%;}
		75%		{bottom:20%; left: -30%;}
	}
	@keyframes jumping {
		0%		{bottom:-15%; left: 20%;}
		25%		{bottom:30%; left:20%;}
		50%		{bottom:-15%; left: -30%;}
		75%		{bottom:20%; left: -30%;}
	}
	@-webkit-keyframes ripple {
		0%		{
			   -webkit-transform: scale(1);
			        opacity: 1;
		}
		100%	{
			   -webkit-transform: scale(19);
			        opacity: 0;
		}
	}
	@keyframes ripple {
		0%		{
			   -moz-transform: scale(1);
			    -ms-transform: scale(1);
			     -o-transform: scale(1);
			        transform: scale(1);
		}
		100%	{
			   -moz-transform: scale(100);
			    -ms-transform: scale(100);
			     -o-transform: scale(100);
			        transform: scale(100);
		}
	}
	@-webkit-keyframes quicksand {
		0%		{background-position-y:-650%;}
	    100%	{background-position-y: 1430%;}
	}
	@keyframes quicksand {
		0%		{background-position-y:-650%;}
	    100%	{background-position-y: 1430%;}
	}
	@keyframes wave_block {
	  0%		{background-color: red;}
	  2%		{background-color: red;}
	  10.3%		{background-color: orange;}
	  18.6%		{background-color: yellow;}
	  35.2%		{background-color: #00db4a;}
	  51.8%		{background-color: #00deff;}
	  68.4%		{background-color: #0023ff;}
	  85%		{background-color: #e100ff;}
	  100%		{background-color: red;}
	}

	.hd-rainbow{
		background-image:url(../img/lighting-wave.png);
		background-repeat: repeat-x;
		background-position: center 0;
	}
	.hd-wave:before{
		/*content:'';
		display: block;
		width: 15%;
		height: 20%;
		position: absolute;
		top: 5%;
		right: 18%;
		background-color: #ffffff;
		-webkit-animation: wave_block 1.95s -1.4s infinite;
		-o-animation: wave_block 1.95s -1.4s infinite;
		animation: wave_block 1.95s -1.4s infinite;*/
	}

	.hd-ripple{
		background-color: transparent!important;
		background: url(../img/lighting-ripple.png) repeat;
		background-size: 100%;
		background-position-x: center;
		background-position-y: 40%;
	}
	.hd-ripple ~ #keyboard{
		opacity: 1;
		z-index: -3;
	}
	.hd-ripple ~ #keyboard:before{
		content:'';
		display: block;
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;left: 0;
		background: #131313;
		background: -moz-linear-gradient(left, #131313 0%, #131313 12%, #ff2828 12%, #ff9028 21%, #f7e92e 38%, #4ded2d 58%, #207cca 70%, #bc25ea 87%, #131313 88%, #131313 100%);
		background: -webkit-linear-gradient(left, #131313 0%,#131313 12%,#ff2828 12%,#ff9028 21%,#f7e92e 38%,#4ded2d 58%,#207cca 70%,#bc25ea 87%,#131313 88%,#131313 100%);
		background: linear-gradient(to right, #131313 0%,#131313 12%,#ff2828 12%,#ff9028 21%,#f7e92e 38%,#4ded2d 58%,#207cca 70%,#bc25ea 87%,#131313 88%,#131313 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#131313', endColorstr='#131313',GradientType=1 );
	}
	.hd-quicksand ~ #keyboard{
		opacity: 1;
		z-index: -3;
	}
	.hd-quicksand ~ #keyboard:before{
		content:'';
		display: block;
		width: 75%;
		height: 100%;
		position: absolute;
		top: 0;left: 0;
		margin-left: 12.5%;
		background: #0a79ff;
		background: -webkit-linear-gradient(top,black,black,#0a79ff,#ff2a79,#00fff4,#0a79ff,#fd91f5,#0a79ff,black,black);
		background: -o-linear-gradient(top,black,black,#0a79ff,#ff2a79,#00fff4,#0a79ff,#fd91f5,#0a79ff,black,black);
		background: -moz-linear-gradient(top,black,black,#0a79ff,#ff2a79,#00fff4,#0a79ff,#fd91f5,#0a79ff,black,black);
		background: linear-gradient(to bottom,black,black,#0a79ff,#ff2a79,#00fff4,#0a79ff,#fd91f5,#0a79ff,black,black);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0a79ff', endColorstr='#ff2a79',GradientType=1 );
	}
	#keyboard.hd-starry,
	#keyboard.hd-current,
	#keyboard.hd-rain{
		opacity: 1;
		z-index: -3;
	}

	@-webkit-keyframes showroutine{
		0%		{opacity: 0;}
		10%		{opacity: 1;}
		11%		{opacity: 1;}
		20%		{opacity: 0;}
		100%	{opacity: 0;}
	}
	@keyframes showroutine{
		0%		{opacity: 0;}
		10%		{opacity: 1;}
		11%		{opacity: 1;}
		20%		{opacity: 0;}
		100%	{opacity: 0;}
	}

	@keyframes keyFadeIn {
		0% {opacity: 0;}
		10% {opacity: 1;}
		15% {opacity: 0;}
		100% {opacity: 0;}
	}
	@-webkit-keyframes keyFadeIn {
		0% {opacity: 0;}
		10% {opacity: 1;}
		15% {opacity: 0;}
		100% {opacity: 0;}
	}