@charset "utf-8";
/* CSS Document */

body {
	margin:0px; padding:0px;
	background-color:#464646;
}

#main {
	background:#464646 url(img/backgroundmain-slice.png) repeat-x;
	font-family:Microsoft Yi Baiti;
	font-weight:100;
	-webkit-font-smoothing: antialiased;
	color:white;
}

#main .container {
	background-image:url(img/backgroundmain.png);
	background-repeat:no-repeat;
	min-height:600px;
}

#header {
	min-height:70px;
}

#content {
	float:left;
	margin:100px 0px 0px 50px;
	width:50%;
}

#content h1{
	margin-top:-30px;
	margin-bottom:10px;
	font-size:66px;
	-webkit-animation:fadein 2s;
	animation:fadein 2s;
}



#content h2{
	font-size:29px;
	margin-top:15px;
	opacity:0;
	
	opacity:0;  /* make things invisible upon start */
	-webkit-animation:fadein ease-in 1;  
	animation:fadein ease-in 1;
 
	-webkit-animation-fill-mode:forwards; 
	animation-fill-mode:forwards;
 
	-webkit-animation-duration:1s;
	animation-duration:1s;
	
	-webkit-animation-delay: 0.7s;
	animation-delay: 0.7s;
}

#content u{
	text-decoration:none;
	border-bottom:2px solid white;
}

#content .sub-text u{
	border-bottom:2px solid #0099cb;
}

#test {
	margin-top:100px;
	margin-right:20px;
	float:right;
	height:190px;
	width:190px;
	padding-left:10px;
}

#cube {
	width:40px;
	height:40px;
	background-color:#0099cb;
	position:relative;
	-webkit-animation-name:cube;
	-webkit-animation-duration:8s;
	-webkit-animation-iteration-count:infinite;
	-webkit-animation-direction:normal;
	animation-name:cube;
	animation-duration:8s;
	animation-iteration-count:infinite;
	animation-direction:normal;
}

.container {
	width:800px;
	margin:0 auto;
	position:relative;
}

.sub-text {
	color:#0099cb;
}

h1 {
	margin:0px 0px 0px 0px;
	padding-top:10px;
	padding-bottom:-10px;
}

/* Chrome, Safari, Opera */
@-webkit-keyframes cube {
    0%   {left:0px; top:0px;}
    25%  {left:120px; top:0px;}
    50%  {left:120px; top:120px;}
    75%  {left:0px; top:120px;}
    100% {left:0px; top:0px;}
}

/* Standard syntax */
@keyframes cube {
    0%   {left:0px; top:0px;}
    25%  {left:120px; top:0px;}
    50%  {left:120px; top:120px;}
    75%  {left:0px; top:120px;}
    100% {left:0px; top:0px;}
}

@keyframes fadein {
    0%     { opacity: 0; transform:translateY(-25px);}
    100%   { opacity: 1; transform:translateY(0);}
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
    0%     { opacity: 0; -webkit-transform:translateY(-25px);}
    100%   { opacity: 1; -webkit-transform:translateY(0);}
}