/*
Theme Name: Elsword V3
Author: KOG Games Inc.
Author URI: http://elsword.koggames.com
Description: Ain Coming Soon Teaser Microsite 20161202
Tags: custom
Text Domain: elsword

*/

/* =Reset
-------------------------------------------------------------- */

html, body, applet, object, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, acronym, address, big, cite, code, del, dfn, ins, kbd, q, s, samp, small, strike, sub, sup, tt, var, b, u, i, dl, dt, dd, fieldset, form, label, legend, caption, canvas, details, embed, figure, figcaption, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
	margin: 0px;
	padding: 0px;
	border: 0;
	color:#000;
	font-size: 12px;
	font-family: Arial, Helvetica, sans-serif;
	vertical-align: baseline;
	line-height:normal;
}

body {	
/*	width: 100%; */
	background-image: url('images/bg3.jpg');
	background-color: #000;
	background-repeat:no-repeat;
	background-size:container;
	background-position:top center;
}

#container {
	width:auto;
	margin-left:auto;
	margin-right:auto;
	font-size: 13px;
	font-family: Helvetica, sans-serif, Arial;
	color:#000;
}

/* spacers start */
#spacer1 {
	height:512px;
}
/* spacers end */

/* misc start */
#mimg {
	border:none;
	position:relative;
	z-index:2;
}
/* misc end */

/* sections start */
/* sections end */

/* table start */
/* table end */

/* fonts and layout start */
/* fonts and layout end */

/* btt start */
/* btt end */

/* generic footer start */
footer[role="contentinfo"] {
  padding-top: 15px;
  background-color: #000;
}

footer {
  background-image: url(/wp-content/themes/elsword3/images/bg-footer.jpg);
  font-size: 12px;
  font-size: 0.857142857rem;
  font-family: "Open Sans", Helvetica, Arial, sans-serif;
  width: 100%;
  min-width: 1024px;
  margin: 0px auto 0px auto;
  padding: 0px;
  background-repeat: no-repeat;
  background-position: center;
  background-position: top;
  height: 144px;
}

.footernormal {
	font-size:12px;
	color:#4679ba;
	text-align:left;
	font-weight:normal;
}

a.footerlinks:link {color: #4679ba; text-decoration:none; line-height:16px; }
a.footerlinks:active {color: #4679ba; }
a.footerlinks:visited {color: #4679ba; }
a.footerlinks:hover {color: #4679ba; }

.footersections {
	font-size:12px;
	color:#FFF;
	font-weight: bold;
}

.footercopyright {
	font-size:12px;
	color:#FFF;
}
/* generic footer end */

#ain {
	background:url('images/ain4.png');
	width:100%;
	height:912px;
	display:block;
/*	top:50px;
	left:20%;
	left:3.5%; */
	background-position:center top;
	background-repeat:no-repeat;
	position:absolute;
	z-index:2;
	overflow:hidden;
/*	margin-left:200px; */
}

/* @media (min-width:1500px) {
#ain {
	left:15%;
}
}

@media (min-width:1900px) {
#ain {
	left:20%;
}
} */

.crossfade {
	display:block;
	background:url('images/txt-ain-1.png');
	height:245px;
	width:664px;
	margin-top:0px;
	position:relative;
	z-index:4;
	overflow:hidden;
}

#crossfade > img { 
    width: auto;
    height: auto;
    position: relative;
    top: 0px;
    left: 0px;
    color: transparent;
    opacity: 0;
    z-index: 4;
    -webkit-backface-visibility: hidden;
    -webkit-animation: imageAnimation 5s linear infinite 0s;
    -moz-animation: imageAnimation 5s linear infinite 0s;
    -o-animation: imageAnimation 5s linear infinite 0s;
    -ms-animation: imageAnimation 5s linear infinite 0s;
    animation: imageAnimation 5s linear infinite 0s; 
	-webkit-filter: drop-shadow(0px 0px 3px white);
}

#crossfade > img:nth-child(2)  {
    -webkit-animation-delay: 1s;
    -moz-animation-delay: 1s;
    -o-animation-delay: 1s;
    -ms-animation-delay: 1s;
    animation-delay: 1s;
}
#crossfade > img:nth-child(3) {
    -webkit-animation-delay: 3s;
    -moz-animation-delay: 3s;
    -o-animation-delay: 3s;
    -ms-animation-delay: 3s;
    animation-delay: 3s;
}
#crossfade > img:nth-child(4) {
    -webkit-animation-delay: 4s;
    -moz-animation-delay: 4s;
    -o-animation-delay: 4s;
    -ms-animation-delay: 4s;
    animation-delay: 4s;
}

@-webkit-keyframes imageAnimation { 
    0% { opacity: 0;
    -webkit-animation-timing-function: ease-in; }
    8% { opacity: 1;
         -webkit-animation-timing-function: ease-out; }
    17% { opacity: 1 }
    25% { opacity: 0 }
    100% { opacity: 0 }
}

@-moz-keyframes imageAnimation { 
    0% { opacity: 0;
    -moz-animation-timing-function: ease-in; }
    8% { opacity: 1;
         -moz-animation-timing-function: ease-out; }
    17% { opacity: 1 }
    25% { opacity: 0 }
    100% { opacity: 0 }
}

@-o-keyframes imageAnimation { 
    0% { opacity: 0;
    -o-animation-timing-function: ease-in; }
    8% { opacity: 1;
         -o-animation-timing-function: ease-out; }
    17% { opacity: 1 }
    25% { opacity: 0 }
    100% { opacity: 0 }
}

@-ms-keyframes imageAnimation { 
    0% { opacity: 0;
    -ms-animation-timing-function: ease-in; }
    8% { opacity: 1;
         -ms-animation-timing-function: ease-out; }
    17% { opacity: 1 }
    25% { opacity: 0 }
    100% { opacity: 0 }
}

@keyframes imageAnimation { 
    0% { opacity: 0;
    animation-timing-function: ease-in; }
    8% { opacity: 1;
         animation-timing-function: ease-out; }
    17% { opacity: 1 }
    25% { opacity: 0 }
    100% { opacity: 0 }
}