body{
	margin: 0px;
	padding: 0px;
	background-image: url(../images/bg_body_intro.jpg);
}

#container{
	width: 807px;
	margin-top: 45px;
	margin-right: auto;
	margin-left: auto;
}

.logo{
	float: left;
	width: 220px;
	margin-left: 286px;
position:relative;
animation:mylogo 1s;
-webkit-animation:mylogo 5s; /* Safari and Chrome */
}

@keyframes mylogo
{
0%   {left:0px; top:-1000px;}

100% {left:0px; top:0px;}
}

@-webkit-keyframes mylogo /* Safari and Chrome */
{
0%   {left:0px; top:-1000px;}

10% {left:0px; top:0px;}
}


.logo img{
	border-top-width: 0px;
	border-right-width: 0px;
	border-bottom-width: 0px;
	border-left-width: 0px;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
}

.data_intro{
	background-image: url(../images/bg_data_intro.png);
	float: left;
	height: 129px;
	width: 807px;
	margin-top: 25px;
position:relative;
animation:mydata 3s;
-webkit-animation:mydata 5s; /* Safari and Chrome */
}

@keyframes mydata
{
0%   {left:-3000px; top:0px;}

100% {left:0px; top:0px;}
}

@-webkit-keyframes mydata /* Safari and Chrome */
{
0%   {left:-3000px; top:0px;}

20% {left:0px; top:0px;}
}




.data_grey{
	font-family: Verdana;
	font-size: 12px;
	color: #6F6F6F;
	line-height: 14px;
	float: left;
	width: 710px;
	margin-top: 20px;
	margin-left: 50px;
	text-align: justify;
}

.copyrights{
	font-family: Arial;
	font-size: 11px;
	color: #000;
	text-align: center;
	float: left;
	width: 807px;
	margin-top: 60px;
}

.services{
	float: left;
	width: 762px;
	margin-top: 30px;
	margin-left: 25px;
}

.service1{
	background-image: url(../images/bg_service1.png);
	float: left;
	height: 287px;
	width: 254px;
position:relative;
animation:myfirst 2s;
-webkit-animation:myfirst 5s; /* Safari and Chrome */
}

@keyframes myfirst
{
0%   {left:-3000px; top:0px;}

100% {left:0px; top:0px;}
}

@-webkit-keyframes myfirst /* Safari and Chrome */
{
0%   {left:-3000px; top:0px;}

60% {left:0px; top:0px;}
}




.service2{
	background-image: url(../images/bg_service2.png);
	float: left;
	height: 287px;
	width: 254px;
position:relative;
animation:mysecond 1s;
-webkit-animation:mysecond 5s; /* Safari and Chrome */
}

@keyframes mysecond
{
0%   {left:0px; bottom:-1000px;}

100% {left:0px; bottom:0px;}
}

@-webkit-keyframes mysecond /* Safari and Chrome */
{
0%   {left:0px; bottom:-1000px;}

40% {left:0px; bottom:0px;}
}







.service3{
	background-image: url(../images/bg_service3.png);
	float: left;
	height: 287px;
	width: 254px;
position:relative;
animation:mythird 2s;
-webkit-animation:mythird 5s; /* Safari and Chrome */
}

@keyframes mythird
{
0%   {right:-3000px; top:0px;}

100% {right:0px; top:0px;}
}

@-webkit-keyframes mythird /* Safari and Chrome */
{
0%   {right:-3000px; top:0px;}

60% {right:0px; top:0px;}
}






.services_data{
	font-family: Verdana;
	font-size: 11px;
	color: #fff;
	line-height: 14px;
	float: left;
	width: 207px;
	margin-top: 120px;
	margin-left: 25px;
	text-align: justify;
}

.services_read_more{
	font-family: Verdana;
	font-size: 12px;
	color: #FFF;
	text-decoration: none;
	background-image: url(../images/bg_more.png);
	text-align: center;
	float: left;
	height: 20px;
	width: 157px;
	margin-top: 20px;
	margin-left: 50px;
	padding-top: 9px;
}

.services_read_more a{
	font-family: Verdana;
	font-size: 12px;
	color: #FFF;
	text-decoration: none;
}

.services_read_more a:hover{
	font-family: Verdana;
	font-size: 12px;
	color: #0A1A5D;
	text-decoration: none;
}
