﻿@charset "utf-8";
/* 

Splash Page StyleSheet for MyHomepage
Created On: 04-02-2010
Last Edited: 04-02-2010
Created by: Andre P Figueira

*/

/*Start Default Tag Styling*/

html { margin:0; padding:0;}

body {
	font-family:Arial, sans-serif;
	font-size:14px;
	color:#404040;
	background:#FFF;
	margin:0;
	padding:0;
}

a {color:#369;}

h1 {
	font-weight:normal;
	margin:0;
	padding:0;
}

h2 {
	font-weight:normal;
	margin:0;
	padding:0;
}

h3 {
	font-weight:normal;
	margin:0;
	padding:0;
}

h4 {
	font-weight:normal;
	margin:0;
	padding:0;
}

h5 {
	font-weight:normal;
	margin:0;
	padding:0;
}

a { text-decoration:none; outline:none;}

/*End Default Tag Styling*/

/*Start Layout Classes*/

.clear { clear:both;}


.navigation {
	width:960px;
	height:34px;
	background:url(/images/layout/splash-navigation-background.png) no-repeat;
}

.navigation a {
	float:right;
	color:#FFF;
	margin:8px 30px 0 0;
	text-shadow:#333 0 1px 1px;
}

.navigation a:hover { color:#FF9000;}

.navigation a.orangelink { float:right; color:#FF9000;}

.navigation a:hover.orangelink { color:#FFF;}

a.logo {
	display:block;
	background:url(/images/private/logo_beta_small.png) no-repeat;
	width:274px;
	height:55px;
	margin:20px 0 0 20px;
	float:left;
}

.loginarea {
	float:right;
	margin:32px 0 0 0;
}
.loginarea .loginform {
	margin:0;
	padding:0;
	float:none;
	width:475px;
	*float:right;/*IE quirk to force the form to 
	float to the right as IE does not pick up the float of the 
	div it is sitting in.*/
}

.loginform label {
	display:block;
	float:left;
}

.input {
	width:185px;
	height:30px;
	background:url(/images/layout/formelements/input.png) no-repeat;
	float:left;
	margin:0 5px 0 0;
}

.loginarea .loginform input {
	margin:0;
	padding:5px;
	width:172px;
	background:none;
	border:none;
	font-size:14px;
	color:#666;
	overflow:hidden;
	font-family:Arial, Helvetica, sans-serif;
}

.loginarea .loginform input.submit {
	margin:0;
	padding:5px 10px;
	*padding:3px 10px;
	width:92px;
	background:url(/images/layout/formelements/submit.png) no-repeat;
	color:#FFF;
	cursor:pointer;
	text-shadow:#333 0 1px 1px;
}

.checkbox {
	width:150px;
	float:right
}

.links {
	float:left;
	width:100px;
	margin:2px 0 0 190px;
	*margin:2px 0 0 256px;
	overflow:hidden;
}

.checkbox input {
	width:14px; /* -- Resets the above decaration -- */
	float:right;
	margin:3px 0 0 5px;
	*margin:0 0 0 5px;
	padding:0;
}

.checkbox label {
	cursor:pointer;
	float:right;
	font-size:11px;
	color:#666;
	padding:3px 0 0 0;
}

a.forgot-password {
	font-size:11px;
	display:block;
	float:left;
	width:150px;
	color:#666;
}
a.forgot-password:hover { color:#369;}

.loginarea a.register-now {
	font-size:11px;
	color:#F90;
	display:block;
	float:right;
}

.loginarea a.register-now:hover { color:#369; }


@media screen and (-webkit-min-device-pixel-ratio:0){
/*Safari/GoogleChrome quirk to force safari and chrome to use the css class 
(input.submit) stated below instead of the css class (input.submit) stated above
so that the correct amount of padding is added to the button.
*/

	.loginarea .loginform input.submit {
		margin:0;
		padding:0;
		width:92px;
		height:26px;
		background:url(/images/layout/formelements/submit.png) no-repeat;
		color:#FFF;
		cursor:pointer;
		text-shadow:#333 0 1px 1px;
	}

}

.loginform label { font-size:12px; color:#666; }

.loginarea .loginform input:focus.submit, .loginarea .loginform input:active.submit  {outline:none;}

.banner {
	width:960px;
	height:370px;
	margin:20px 0 0 0;
	text-shadow:#333 0 1px 1px;
}

#banner-bottom {
	width:960px;
	height:9px;
	margin:0;
	background:url(../images/layout/banners/default-bottom.png) no-repeat top;
}

/*Start Banners*/

#default-banner { background:url(/images/layout/banners/default.png) no-repeat;}

/*End Banners*/

.banner-content-left {
	width:540px;
	float:left;
}

.banner-content-right {
	width:400px;
	float:right
}

.banner-content-left h1 {
	font-size:32px;
	color:#FFF;
	margin:30px 0 0 28px;
}

.banner-content-left h2 {
	font-size:16px;
	color:#FFF;	
	margin:32px 0 0 28px;
}

.banner-content-left p {
	font-size:16px;
	color:#FFF;	
	font-weight:bold;
	margin:32px 0 0 28px;
}

span.highlighted { color:#EEE116;}

a.banner-orange-button {
	height:53px;
	background:url(../images/layout/buttons/large-orange-banner-button-2.png) no-repeat left;
	font-size:32px;
	float:left;
	padding:10px 17px 0 20px;
	display:block;
	color:#333;
	text-shadow:#FFAE40 0 1px 0;
	text-align:center;
	line-height:42px;
	/* -- Old styles --
	background:url(../images/layout/buttons/large-orange-banner-button.png) no-repeat;
	width:304px;
	*/
}

span.sign-up-button {
	display:block;
	float:left;
	margin:-110px 0 0 390px;
}
span.sign-up-button span {
	width:3px;
	height:63px;
	background:url(../images/layout/buttons/large-orange-banner-button-end.png);
	float:right;
	display:block;
	*float:none;
}


a.banner-orange-button:hover {color:#333; text-shadow:0 1px 1px #FFAE40; }


.home-content {
}

.home-column {
	width:300px;
	float:left;
	margin:30px 30px 0 0;
}

.home-column-last {
	width:300px;
	float:left;
	margin:30px 0 0 0;
}
	
.home-column h3, .home-column-last h3 {
	color:#315B9A;
	font-size:16px;
	padding:5px 0 0 60px;
	min-height:50px;
}	

h3.star {
	display:block;
	background:url(../images/icons/favourites-star.png) no-repeat;
}

h3.auto-login {
	display:block;
	background:url(../images/icons/password-vault-large.png) no-repeat;
}

h3.folder {
	display:block;
	background:url(../images/icons/auto-login.png) no-repeat;
}

p.home-column {
	display:block;
	font-size:12px;
	color:#404040;
	margin:5px 0 0 0;
	line-height:20px;
}

.footer {
	background:url(/images/layout/splash-footer.png) no-repeat;
	width:960px;
	height:67px;
	margin:40px 0 0 0;
	font-size:14px;
	color:#FFF;
	text-shadow:#333 0 1px 1px;
}

.footer-column {
	float:left;
	width:475px;
	padding:20px 0 0 0;
}


.footer-column.left { width:360px; }
.footer-column.right { width:600px; float:right; }


.footer-column span {
	display:block;
	margin:0 0 0 30px;
}

span.patenttext {
	color:#C7C7C7;
	font-size:11px;
}

.footer-column ul, .footer-column li {
	list-style:none;
	margin:0 15px 0 0;
	padding:0;
	display:inline;
}

.footer-column ul { 
	float:right; 
	margin:5px 0 0 0;
	display:block;
}

.footer-column ul li a {
	color:#FFF;
	text-decoration:none;
}

.footer-column ul li a:hover {
	color:#FF9000;
}

a.orange-link { color:#FF9000!important;}

a:hover.orange-link { color:#FFF!important;}

.subfooter {
	 width:960px;
	 margin:20px 0 0 0;
}
/*
.subfooter img {
	float:right;
	margin:0 15px 0 0;
}
*/
/*End Layout Classes*/



/*End Layout Classes*/



/* ================================================================================= */
/* ================================================================================= */
/* ================================================================================= */

#video { 
	padding:0;
	display: inline;
	position: relative;
}



/* dimensios for both splash image and the player wrapper */


a.flowplayer {
	width:381px;
	height:300px;
	border:0px;	
	margin:24px 15px 0 0;
	float:right;
	background:url(/images/misc/video-overlay.png) no-repeat;
}

span.play-button-homepage {
	display:block;
	width:154px;
	height:30px;
	background:url(/images/layout/buttons/large-play-button.png) 0 0 no-repeat;
	margin:125px 0 0 158px;
	color:#FFF;
	font-size:18px;
	text-align:center;
	padding:70px 0 0 0;
}

span.play-button-homepage:hover {
	background:url(/images/layout/buttons/large-play-button.png) 0 -100px no-repeat;
}

/* play button on top of splash screenn */
div.playButton {
	background:url(images/misc/play.png) no-repeat;
	width:50px;
	height:50px;
	position:relative;
	top:-140px;
	left:125px;	
	opacity:0.9;
	margin-bottom:-50px;
}

/* play button upon mouseover */
div.playButton:hover {
	opacity:1.0;		
}


.subfooter ul
{
    display:block;
    float:right;
    margin-top:0;
}
.subfooter ul li
{
    display:inline;
    padding-right:10px;
}
.subfooter ul li table
{
    display:inline;
}


.international {
	float:left;
}

	.international a {
		color:#336699;
		padding:0 10px 0 0;
}

	.international a:hover {
		text-decoration:underline;
}

.new {
	color:#F90;
	font-family:"Palatino Linotype", "Book Antiqua", Palatino, serif;
	font-style:italic;
}


/* -- 11-06-2010 --*/



.footer-column.right a.facebook-link {
	font-size:12px;
	color:#FFF;
	padding:1px 0 1px 18px;
	background:url(../images/misc/facebook.png) no-repeat left center;
	float:right;
	clear:both;
	margin:5px 15px 0 10px;
}

.footer-column.right a.twitter-link {
	font-size:12px;
	color:#FFF;
	padding:1px 0 1px 18px;
	background:url(../images/misc/twitter.png) no-repeat left center;
	margin:5px 0 0 0;
	float:right;
}

.demo-link {
	width:375px;
	display:block;
	height:260px;
	margin:30px 0 0 0;
	background:url(../images/misc/demo-image.png) no-repeat center;
}

.demo-link p {
		color:#FF9900;
		width:355px;
		clear:both;
		float:left;
		margin:246px 0 0 8px;
}
