body {
	background: #fff;	
}
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display: block;
}
* {
	margin: 0;
	padding: 0;
}
img, object, embed, video {
	max-width: 100%;
}


/* OFFICE LOGO */	
.logo {
	position: absolute;
	top: 20px;
	left: 0;
	width: 45%;
	height: 30%;
	z-index: -9999;
}

.logo-btm {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 80%;
	/*height: 30%;*/
	z-index: -9998;
}


/* BlackBerry (portrait)
______________________________________________________________*/
@media all and (max-width: 480px) and (min-width: 320px) {
#wrapper {
	position: relative;
	top: 10px;
	left: 0;
	width: 340px; /* BlackBerry Portrait width */
	height: 500px;
}

/* OFFICE LOGO */	
.logo {
	position: absolute;
	top: -10px;
	left: 0;
	width: 40%;
	height: 30%;
	z-index: -9999;
}
.t1 {
	position: absolute;
	width: 212px;
	top: 355px;
	left: 114px;
	-webkit-animation-name: trainer-one;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-timing-function: linear;
	-webkit-animation-duration: 3s;
	height: 125px;
}
.t2 {
	position: absolute;
	width: 132px;
	top: 12px;
	left: 23px;
	-webkit-animation-name: trainer-two;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-timing-function: linear;
	-webkit-animation-duration: 3s;
	height: 93px;
}
.t3 {
	position: absolute;
	width: 135px;
	left: 21px;
	top: 62px;
	-webkit-animation-name: trainer-three;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-timing-function: linear;
	-webkit-animation-duration: 3s;
	height: 95px;
}
.t4 {
	position: absolute;
	width: 116px;
	left: 137px;
	top: 10px;
	-webkit-animation-name: trainer-four;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-timing-function: linear;
	-webkit-animation-duration: 3s;
	height: 77px;
}
.t5 {
	position: absolute;
	width: 155px;
	left: 145px;
	top: 87px;
	-webkit-animation-name: trainer-five;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-timing-function: linear;
	-webkit-animation-duration: 3s;
	height: 78px;
}
.t6 {
	position: absolute;
	width: 136px;
	left: 11px;
	top: 354px;
	-webkit-animation-name: trainer-six;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-timing-function: linear;
	-webkit-animation-duration: 3s;
	height: 73px;
}
.t7 {
	position: absolute;
	width: 117px;
	left: 101px;
	top: 354px;
	-webkit-animation-name: trainer-seven;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-timing-function: linear;
	-webkit-animation-duration: 3s;
	height: 65px;
}
.t8 {
	position: absolute;
	width: 101px;
	left: 15px;
	top: 404px;
	-webkit-animation-name: trainer-eight;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-timing-function: linear;
	-webkit-animation-duration: 3s;
	height: 75px;
}
.t9 {
	position: absolute;
	width: 57px;
	left: 258px;
	top: 11px;
	-webkit-animation-name: trainer-nine;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-timing-function: linear;
	-webkit-animation-duration: 3s;
	height: 115px;
}
/* TXT */
.txt {
	display: none;
}
.txt-1 {
	position: absolute;
	top: 186px;
	left: 153px;
	margin-left: -140px;
	width: 314px;
	height: 211px;
	z-index: 10001;
}
.shopMag {
	position: absolute;
	width: 26.2%;
	height: 26.2%;
	top: 58%;
	left: 300px;
	margin-left: -66px;
	overflow: hidden;
	z-index: 100001;
 }

	}
   
/* iPAD (portrait)
______________________________________________________________*/
@media all and (max-width: 768px) and (min-width: 481px) {
	
#wrapper {
	position: relative;
	top: -20px;
	left: 0;
	width: 768px;
	height: 1024px;
	overflow: hidden;
}
.t1 {
	position: absolute;
	width: 440px;
	top: 726px;
	left: 285px;
	-webkit-animation-name: trainer-one;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-timing-function: linear;
	-webkit-animation-duration: 3s;
}
.t2 {
	position: absolute;
	width: 350px;
	top: 110px;
	left: 56px;
	-webkit-animation-name: trainer-two;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-timing-function: linear;
	-webkit-animation-duration: 3s;
}
.t3 {
	position: absolute;
	width: 332px;
	left: 72px;
	top: 227px;
	-webkit-animation-name: trainer-three;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-timing-function: linear;
	-webkit-animation-duration: 3s;
}
.t4 {
	position: absolute;
	width: 270px;
	left: 317px;
	top: 115px;
	-webkit-animation-name: trainer-four;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-timing-function: linear;
	-webkit-animation-duration: 3s;
}
.t5 {
	position: absolute;
	width: 363px;
	left: 372px;
	top: 290px;
	-webkit-animation-name: trainer-five;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-timing-function: linear;
	-webkit-animation-duration: 3s;
}
.t6 {
	position: absolute;
	width: 316px;
	left: 73px;
	top: 692px;
	-webkit-animation-name: trainer-six;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-timing-function: linear;
	-webkit-animation-duration: 3s;
}
.t7 {
	position: absolute;
	width: 228px;
	left: 286px;
	top: 710px;
	-webkit-animation-name: trainer-seven;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-timing-function: linear;
	-webkit-animation-duration: 3s;	
}
.t8 {
	position: absolute;
	width: 229px;
	left: 68px;
	top: 811px;
	-webkit-animation-name: trainer-eight;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-timing-function: linear;
	-webkit-animation-duration: 3s;
}
.t9 {
	position: absolute;
	width: 122px;
	left: 592px;
	top: 118px;
	-webkit-animation-name: trainer-nine;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-timing-function: linear;
	-webkit-animation-duration: 3s;	
}

.txt {
	position: absolute;
	top: 43%;
	left: 50%;
	margin-left: -325px; 
	width: 640px;
	z-index: 10001;
}

.txt-1 {
	display: none;
}

.shopMag {
	position: absolute;
	width: 21.2%;
	height: 21.2%;
	top: 63%;
	left: 78%;
	margin-left: -66px;
	overflow: hidden;
	z-index: 100001;
 }
 
 .logo-btm {
	position: absolute;
	top: 1004px;
	left: 0;
	width: 80%;
	/*height: 30%;*/
	z-index: -9998;
}
  
	}

/* iPAD (landscape) 
______________________________________________________________*/
@media all and (max-width: 1024px) and (min-width: 769px) {
#wrapper {
	position: relative;
	top: -20px;
	left: 0;
	width: 1024px;
	height: 1365px;
	overflow: hidden;
}
.t1 {
	position: absolute;
	width: 580px;
	/*height: 358px;*/
	top: 972px;
	left: 367px;
	-webkit-animation-name: trainer-one;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-timing-function: linear;
	-webkit-animation-duration: 3s;
}
.t2 {
	position: absolute;
	width: 450px;
	/*height: 331px;*/
	top: 143px;
	left: 56px;
	-webkit-animation-name: trainer-two;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-timing-function: linear;
	-webkit-animation-duration: 3s;
}
.t3 {
	position: absolute;
	width: 412px;
	/*height: 289px;*/
	left: 98px;
	top: 327px;
	-webkit-animation-name: trainer-three;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-timing-function: linear;
	-webkit-animation-duration: 3s;
}
.t4 {
	position: absolute;
	width: 360px;
	/*height: 235px;*/
	left: 402px;
	top: 148px;
	-webkit-animation-name: trainer-four;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-timing-function: linear;
	-webkit-animation-duration: 3s;
}
.t5 {
	position: absolute;
	width: 475px;
	height: 237px;
	left: 480px;
	top: 390px;
	-webkit-animation-name: trainer-five;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-timing-function: linear;
	-webkit-animation-duration: 3s;
}
.t6 {
	position: absolute;
	width: 431px;
	/*height: 253px;*/
	left: 73px;
	top: 922px;
	-webkit-animation-name: trainer-six;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-timing-function: linear;
	-webkit-animation-duration: 3s;
}
.t7 {
	position: absolute;
	width: 301px;
	/*height: 210px;*/
	left: 369px;
	top: 956px;
	-webkit-animation-name: trainer-seven;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-timing-function: linear;
	-webkit-animation-duration: 3s;
	
}
.t8 {
	position: absolute;
	width: 299px;
	/*height: 182px;*/
	left: 77px;
	top: 1085px;
	-webkit-animation-name: trainer-eight;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-timing-function: linear;
	-webkit-animation-duration: 3s;
}
.t9 {
	position: absolute;
	width: 170px;
	/*height: 214px;*/
	left: 762px;
	top: 150px;
	-webkit-animation-name: trainer-nine;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-timing-function: linear;
	-webkit-animation-duration: 3s;
}

.txt {
	position: absolute;
	top: 43%;
	left: 50%;
	margin-left: -400px; 
	width: 800px;
	height: 333px;
	z-index: 10001;
}
.txt-1 {
	display: none;
}

.shopMag {
	position: absolute;
	width: 22%;
	height: 22%;
	top: 61.2%;
	left: 80%;
	margin-left: -120px;
	overflow: hidden;
	z-index: 100001;
 }
 
.logo-btm {
	position: absolute;
	top: 1356px;
	left: 0;
	width: 80%;
	/*height: 30%;*/
	z-index: -9998;
}
	}
	
/* KEYFRAMES
____________________________________*/

 @-webkit-keyframes trainer-one {
	 0% { opacity:0;}
	 10%  { opacity:0; -webkit-transform: scale(0.1) rotate(0deg) translateY(0px);}
	 11%  { opacity:1;-webkit-transform: scale(0.3)rotate(-1deg) translateY(46px);}
	 13%  { -webkit-transform: scale(1.1) rotate(2deg) translateY(-66px);}
	 14%  { -webkit-transform: scale(1) rotate(-2deg) translateY(16px);}
	 16%  { -webkit-transform: rotate(2deg) translateY(-6px);}
	 18%  { -webkit-transform: rotate(-1deg) translateY(3px);}
	 20%  { -webkit-transform: rotate(0deg) translateY(0px);}	
 }
 @-webkit-keyframes trainer-two {
	 0% { opacity:0;}
	 10%  { opacity: 0; -webkit-transform: scale(0.1);}
	 11%  { opacity: 1; -webkit-transform: scale(0.5) rotate(-6deg) translateY(8px);}
	 12%  { -webkit-transform: scale(1.1) rotate(6deg) translateY(-8px);}
	 13%  { -webkit-transform: scale(1) rotate(-2deg) translateY(6px);}
	 15%  { -webkit-transform: rotate(2deg) translateY(-6px);}
	 18%  { -webkit-transform: rotate(-1deg) translateY(3px);}
	 20%  { -webkit-transform: rotate(0deg) translateY(0px);}	
 }

@-webkit-keyframes trainer-three {
	 0% { opacity:0;}
	 15%  { opacity: 0; -webkit-transform: scale(0.1);}
	 17%  { opacity: 1; -webkit-transform: scale(0.5) rotate(-6deg) translateY(8px);}
	 18%  { -webkit-transform: scale(1.1) rotate(6deg) translateY(-8px);}
	 19%  { -webkit-transform: scale(1) rotate(-2deg) translateY(6px);}
	 20%  { -webkit-transform: rotate(2deg) translateY(-6px);}
	 23%  { -webkit-transform: rotate(-1deg) translateY(3px);}
	 25%  { -webkit-transform: rotate(0deg) translateY(0px);}	
 }
 
@-webkit-keyframes trainer-four {
	 0% { opacity:0;}
	 1%  { opacity: 0; -webkit-transform: scale(0.1);}
	 2%  { opacity: 1; -webkit-transform: scale(0.5) rotate(-6deg) translateY(8px);}
	 3%  { -webkit-transform: scale(1.1) rotate(6deg) translateY(-8px);}
	 4%  { -webkit-transform: scale(1) rotate(-2deg) translateY(6px);}
	 5%  { -webkit-transform: rotate(2deg) translateY(-6px);}
	 8%  { -webkit-transform: rotate(-1deg) translateY(3px);}
	 10%  { -webkit-transform: rotate(0deg) translateY(0px);}	
 }
@-webkit-keyframes trainer-five {
	 0% { opacity:0;}
	 25%  { opacity: 0; -webkit-transform: scale(0.1);}
	 27%  { opacity: 1; -webkit-transform: scale(0.5) rotate(-6deg) translateY(16px);}
	 28%  { -webkit-transform: scale(1.1) rotate(6deg) translateY(-16px);}
	 29%  { -webkit-transform: scale(1) rotate(-2deg) translateY(8px);}
	 30%  { -webkit-transform: rotate(2deg) translateY(-8px);}
	 33%  { -webkit-transform: rotate(-1deg) translateY(3px);}
	 35%  { -webkit-transform: rotate(0deg) translateY(0px);}	
 }
@-webkit-keyframes trainer-six {
	 0% { opacity:0;}
	 4%  { opacity: 0; -webkit-transform: scale(0.1);}
	 6%  { opacity: 1; -webkit-transform: scale(0.5) rotate(-6deg) translateY(8px);}
	 7%  { -webkit-transform: scale(1.1) rotate(6deg) translateY(-8px);}
	 8%  { -webkit-transform: scale(1) rotate(-2deg) translateY(6px);}
	 9%  { -webkit-transform: rotate(2deg) translateY(-6px);}
	 10%  { -webkit-transform: rotate(-1deg) translateY(3px);}
	 12%  { -webkit-transform: rotate(0deg) translateY(0px);}	
 }
@-webkit-keyframes trainer-seven {
	  0% { opacity:0;}
	 47%  { opacity: 0; -webkit-transform: scale(0.1);}
	 49%  { opacity: 1; -webkit-transform: scale(0.5) rotate(-6deg) translateY(8px);}
	 50%  { -webkit-transform: scale(1.1) rotate(6deg) translateY(-8px);}
	 51%  { -webkit-transform: scale(1) rotate(-2deg) translateY(6px);}
	 52%  { -webkit-transform: rotate(2deg) translateY(-6px);}
	 55%  { -webkit-transform: rotate(-1deg) translateY(3px);}
	 57%  { -webkit-transform: rotate(0deg) translateY(0px);}
 }
@-webkit-keyframes trainer-eight {
	 0% { opacity:0;}
	 20%  { opacity: 0; -webkit-transform: scale(0.1);}
	 22%  { opacity: 1; -webkit-transform: scale(0.5) rotate(-6deg) translateY(8px);}
	 23%  { -webkit-transform: scale(1.1) rotate(6deg) translateY(-8px);}
	 24%  { -webkit-transform: scale(1) rotate(-2deg) translateY(6px);}
	 25%  { -webkit-transform: rotate(2deg) translateY(-6px);}
	 28%  { -webkit-transform: rotate(-1deg) translateY(3px);}
	 30%  { -webkit-transform: rotate(0deg) translateY(0px);}	
 }
@-webkit-keyframes trainer-nine {
 	  0% { opacity:0;}
	 31%  { opacity: 0; -webkit-transform: scale(0.1);}
	 33%  { opacity: 1; -webkit-transform: scale(0.5) rotate(-6deg) translateY(8px);}
	 34%  { -webkit-transform: scale(1.1) rotate(6deg) translateY(-8px);}
	 35%  { -webkit-transform: scale(1) rotate(-2deg) translateY(6px);}
	 38%  { -webkit-transform: rotate(2deg) translateY(-6px);}
	 39%  { -webkit-transform: rotate(-1deg) translateY(3px);}
	 43%  { -webkit-transform: rotate(0deg) translateY(0px);}	
	
	 	
 }