body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #666;
	background: #fff url(../images/body-bg.jpg) repeat-x left top;
}

a{
	color: #3960dc;
	text-decoration: underline;
}
a:hover {
	color: #f00;
}

.clear {
	clear: both;
	height: 0;
}


#header{
	height: 100px;
	background: url(../images/header-gradient.png) no-repeat center bottom;
	border-bottom: 2px solid #faecec;
	margin-bottom: 18px;
}
	#header .inner{
		width: 940px;
		height: 100px;
		margin: 0 auto;
		position: relative;
	}
	#header img{
		position: absolute;
		left: -2px;
		top: 24px;
	}
	#header .service{
		font: normal 18px "Trebuchet MS", Arial, Helvetica, sans-serif;
		color: #fff;
		text-align: right;
		position: absolute;
		right: 0;
		top: 40px;
	}

#content{
	width: 940px;
	margin: 0 auto;
	position: relative;
}

	#content #frame {
		width: 940px;
		height: 250px;
		display: none;
		border-top: 1px dotted #cacaca;
		border-bottom: 1px dotted #cacaca;
		margin: 20px 0;
	}
	
		#content #frame .frame-slide {
			background: transparent !important;
			width: 940px;
			height: 250px;
		}
		
			#content #frame .frame-slide img {
				display: block;
				position: absolute;
				left: 115px;
				top: 0;
			}
			
			#content #frame .frame-slide a.play-btn {
				display: block;
				width: 97px;
				height: 99px;
				position: absolute;
				left: 220px;
				top: 60px;
				z-index: 100;
				background: url(../images/buttons/play-btn.png) no-repeat left top; 
			}
			
			#content #frame .frame-slide a.upgrade-now {
				display: block;
				width: 103px;
				height: 32px;
				margin: 10px 40px 0 0;
				float: right;
				background: url(../images/buttons/upgrade-now-btn.png) no-repeat left top; 
			}
			
			#content #frame .frame-slide .txt {
				width: 380px;
				float: right;
				padding: 30px 70px 0 0;
			}
	
				#content #frame .frame-slide .txt h2 {
					font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
					font-size: 22px;
					height: 80px;
					line-height: 60px;
					padding-left: 75px;
					font-weight: bold;
				}
				
				#content #frame .frame-slide .txt h2.one {
					background: url(../images/icons/bookmarks.png) no-repeat left top;
				}
				
				#content #frame .frame-slide .txt h2.two {
					background: url(../images/icons/media-storage.png) no-repeat left top;
				}
				
				#content #frame .frame-slide .txt h2.three {
					background: url(../images/icons/drag-drop.png) no-repeat left top;
				}
				
				#content #frame .frame-slide .txt h2.four {
					background: url(../images/icons/upgrade-account.png) no-repeat left top;
					/*line-height: normal;*/
					padding-left: 85px;
				}
				
				#content #frame .frame-slide .txt h2.five {
					background: url(../images/icons/free-storage.png) no-repeat left top;
					padding-left: 85px;
				}
				
				#content #frame .frame-slide .txt h2.six {
					background: url(../images/icons/video-presentation.png) no-repeat left top;
				}
				
				#content #frame .frame-slide .txt h2.seven {
					background: url(../images/icons/text-saving.png) no-repeat left top;
				}
				
				#content #frame .frame-slide .txt h2.eight {
					background: url(../images/icons/web-app.png) no-repeat left top;
					padding-left: 85px;
				}
				
				#content #frame .frame-slide .txt h2.nine {
					background: url(../images/icons/account-sync.png) no-repeat left top;
				}
				
				#content #frame .frame-slide .txt h2.ten {
					background: url(../images/icons/security.png) no-repeat left top;
				}
				
				#content #frame .frame-slide .txt p {
					line-height: 18px;
					margin-top: 25px;
				}

	
#banner{
	width: 918px;
	margin: 0 auto;
	padding: 15px 10px;
	border: 1px solid #f5f5f5;
	-webkit-box-shadow: inset 0px 0px 25px 0px #f5f5f5;
	-moz-box-shadow: inset 0px 0px 25px 0px #f5f5f5;
	box-shadow: inset 0px 0px 25px 0px #f5f5f5;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	position: relative;
	text-align: justify;
	margin-bottom: 30px;
}

	h1{
		display: inline-block;
		font: normal 36px/43px "Trebuchet MS", Arial, Helvetica, sans-serif;
		color: #666;
		text-align: center;
		vertical-align: middle;
	}
		h1 strong{
			color: #000;
		}
	#banner span{
		display: inline-block;
		font-size: 13px;
		color: #d7d7d7;
		white-space:nowrap;
		padding: 3px 8px;
		border: 1px solid #f1f1f1;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		border-radius: 5px;	
		margin: 10px 5px;
		cursor: default;
		vertical-align: middle;
	}
	#banner span:hover{
		color: #aaa;
	}
#banner img{
	position: absolute;
	bottom: -20px;
	left: 199px;
}
.cta-wrap{
	text-align: center;
	margin-bottom: 20px;
}
	
	.cta-wrap span{
		font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
		color: #666;
	}
	.cta-wrap .size1{
		font-size: 24px;
		font-style: italic;
	}
	.cta-wrap .size2{
		font-size: 28px;
		font-style: italic;
	}
	.cta-wrap .size3{
		font-size: 36px;
		font-style: normal;
		font-weight: bold;
	}
	
#cta{
	display: inline-block;
	background: url(../images/orang-btn.png) no-repeat left top;
	height: 59px;
	text-decoration: none;
	padding-left: 45px;
	margin-right: 20px;
	margin-bottom: 7px;
}
	#cta span{
		display: block;
		background: url(../images/orang-btn.png) no-repeat right top;
		height: 59px;
		line-height: 60px;
		margin-right: -20px;
		padding-right: 20px; 
		
		font-family: Arial, Helvetica, sans-serif;
		font-size: 28px;
		font-weight: bold;
		
		text-shadow: 0 1px 0px #b15808;
		white-space: nowrap;
		color: #fff;
		cursor: pointer;
	}
#cta:hover{
	background-position: left bottom;
}
	#cta:hover span, #cta span:hover{
		background-position: right bottom;
	}
	

h3{
	font: normal 24px "Trebuchet MS", Arial, Helvetica, sans-serif;
	color: #467aa7;
	margin-bottom: 15px;
}
	h3 span{
		display: inline-block;
		width: 24px;
		height: 24px;
		font: bold 12px/24px Arial, Helvetica, sans-serif;
		text-align: center;
		color: #666;
		border: 1px solid #cdcdcd;
		-webkit-border-radius: 12px;
		-moz-border-radius: 12px;
		border-radius: 12px;
		-webkit-box-shadow: inset 0px 1px 5px 1px #ddd;
		-moz-box-shadow: inset 0px 1px 5px 1px #ddd;
		box-shadow: inset 0px 1px 5px 1px #ddd;
		vertical-align: top;
	}
	
#three-col-promos{
	border-top: 1px dotted #cacaca;
	border-bottom: 1px dotted #cacaca;
	padding-top: 40px;
	padding-bottom: 30px;
}
	.three-col-promo{
		width: 140px;
		float: left;
		border: 1px solid #cfcfcf;
		-webkit-box-shadow: inset 0px 0px 25px 0px #cfcfcf;
		-moz-box-shadow: inset 0px 0px 25px 0px #cfcfcf;
		box-shadow: inset 0px 0px 25px 0px #cfcfcf;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		border-radius: 5px;
		padding: 21px 20px 14px 138px;
		position: relative
	}
	.three-col-promo.middle{
		margin-left: 20px;
		margin-right: 20px;
	}
		.three-col-promo p{
			font-style: italic;
		}
		.three-col-promo img{
			position: absolute;
			left: 0;
			bottom: 0;
		}

#footer{
	width: 940px;
	margin: 0 auto;
	font-size: 11px;
	color: #828383;
	padding: 20px 0;
}
	#footer .footer-col{
		float: left;
	}
	#footer .col1{
		width: 160px;
	}
	#footer .col2{
		width: 380px;
	}
		#footer .col2 a{
			color: #828383;
			text-decoration: none;
			margin-right: 14px;
		}
		#footer .col2 a:hover{
			color: #777;
			text-decoration: underline;
		}
		#footer .col2 p{
			margin-top: 5px;
		}
	#footer .col3{
		width: 185px;
		padding-right: 35px;
	}
		#footer .col3 p{
			border-left: 1px solid #cacaca;
			padding-left: 20px;
		}
	#footer .col4{
		width: 180px;
	}