﻿/*
######################################################################################
######                                                                        #######
######     STANDARD/MARKUP STYLES                                            #######
######                                                                      #######
##################################################################################
*/

/********************************************************************************/
/***** MARKUP STYLES ***********************************************************/
/******************************************************************************/

body
{
	background-color: #fbfbfb;
	font: normal 62.5% Arial, Helvetica, sans-serif;
}

a
{
	text-decoration: none;
	color: #65bb10;
}
a:hover
{
	text-decoration: underline;
}
hr
{
	display: none;
}
p
{
	font: 1.2em Verdana, Arial, Helvetica, sans-serif;
	color: #666666;
	margin-bottom: 14px;
}


/********************************************************************************/
/***** HEADER STYLES ***********************************************************/
/******************************************************************************/

h1
{
	margin-bottom:10px;
}
h2
{
	font: bold 1.2em Verdana, Arial, Helvetica, sans-serif;
	color: #666666;
	margin-bottom:16px;
}
h3
{
	font: bold 1.6em Arial, Helvetica, sans-serif;
	color: #00a8b5;
	visibility: hidden;
}
h4
{
	margin: 0 0 4px 0;
	padding: 0;
	font: bold 1em Arial, Helvetica, sans-serif;
}
h5
{
	margin: 0;
	padding: 0;
	font: bold 1.1em Arial, Helvetica, sans-serif;
}
h6
{
	margin: 0;
	padding: 0;
	font: bold 1em Arial, Helvetica, sans-serif;
	font-style: italic;
}

h1.sony-ericsson
{
	width:151px;
	height:19px;
	background:transparent url(../../images/page-specific/sony-ericsson-logo.png) no-repeat;
	text-indent:-9999px;
}

h1.apptitude-lab
{
	width:435px;
	height:55px;
	background:transparent url(../../images/page-specific/apptitude-lab-logo.png) no-repeat;
	margin-bottom:35px;
	text-indent:-9999px;
}

/********************************************************************************/
/***** MEDIA STYLES ************************************************************/
/******************************************************************************/

.notforscreen
{
	display: none;
}
/* Everything except for screen */
.notforprint
{
}
/* Everything except for print */
.notforhandheld
{
}
/* Everything except for handheld */

.screenonly
{
}
/* Only for screen */
.printonly
{
	display: none;
}
/* Only for print */
.handheldonly
{
	display: none;
}
/* Only for handheld */


/********************************************************************************/
/***** MISC STYLES *************************************************************/
/******************************************************************************/

/***** CLEAR *****/

.clear
{
	height: 0;
	overflow: hidden;
	clear: both;
}
/* for clearing break tags */
.clear_l
{
	clear: left;
}
.clear_r
{
	clear: right;
}
.clear_n
{
	clear: none;
}
.clear_b
{
	clear: both;
}

/***** FLOAT *****/

.float_l
{
	float: left;
}
img.float_l
{
	margin-right: 10px;
	margin-bottom: 10px;
}
.float_r
{
	float: right;
}
img.float_r
{
	margin-right: 10px;
	margin-bottom: 10px;
	clear: right;
}
.float_n
{
	float: none;
}

.small
{
	font-size: 0.9em;
}

/********************************************************************************/
/***** LINK STYLES *************************************************************/
/******************************************************************************/



/********************************************************************************/
/***** MISC STYLES *************************************************************/
/******************************************************************************/

#body-bg
{
	background: url(../../images/generic/body_bg.jpg) no-repeat center;
	overflow:hidden;
}

/**** Panel ****/

.panel-wrap
{
	width: 980px;
	margin: auto;
	background:transparent url(../../images/generic/panel-top.png) 0 0 no-repeat;
	padding-top:30px;
	margin-bottom:30px;
}

.intro-box
{
}

.panel-bottom
{
	background:transparent url(../../images/generic/panel-bottom.png) 0 bottom no-repeat;
	width:898px;
	margin-top:auto;
	min-height:400px;
	padding: 0 41px 30px;
}

.twitter-logo
{
	background-image: url(../../images/generic/logo_twitter.gif);
	width:90px;
	height:19px;
	float:right;
	margin-bottom:20px;
	text-indent:-9999px;
}

.panel-shadow
{
	background: url(../../images/generic/columns-shadow.png) 0 0 repeat-y;
	margin: 0 7px 0 6px;
}

.panel-gradient
{
	background: #fff url(../../images/generic/columns_gradient.gif) bottom center repeat-x;
	padding: 12px 18px 0 18px;
	min-height: 218px;
	overflow: hidden;
}

.column-right .column-gradient
{
	position: relative;
}
.details-box .column-gradient
{
	min-height: 665px;
}

.details-box .cta
{
	margin: 37px 0 0;
}

#column-shell .column-left
{
	float: left;
	width: 490px;
	height: auto !important;
	min-height: 670px;
	height: 670px;
	position: relative;
}
#column-shell .column-left .logo-twitter
{
	position: absolute;
	left: 370px;
	top: 25px;
}

#column-shell .column-right
{
	float: left;
	width: 490px;
	height: auto !important;
	min-height: 670px;
	height: 670px;
}


/**** Birds ****/

.bird1, .bird2, .bird3
{
	position: absolute;
	background-repeat: no-repeat;
}
.bird1
{
	bottom: 6px;
	left: 377px;
	background-image: url(../../images/generic/bird3.gif);
	width: 83px;
	height: 48px;
}
.bird2
{
	top: 12px;
	right: 27px;
	background-image: url(../../images/generic/bird2.gif);
	width: 62px;
	height: 35px;
}
.bird3
{
	bottom: 6px;
	right: 27px;
	background-image: url(../../images/generic/bird1.gif);
	width: 85px;
	height: 48px;
}

/***** UPPER LOGOS *****/

.upper-logos
{
	display: block;
	margin: 0 auto;
	padding: 5px 0 0 0;
	width: 980px;
	height: 64px;
}
.upper-logos .sony-ericsson
{
	float: right;
	margin-right: 20px;
}
.upper-logos .three
{
	float: right;
	margin: 10px 6px 0 0;
}

/********************************************************************************/
/****** POPUP STYLES ***********************************************************/
/******************************************************************************/

.popup
{
	position: absolute;
	top: 65px;
	left: 0;
	z-index: 100;
}
.popup #fade
{
	position: absolute;
	top: 0;
	left: 0;
	background-color: black;
	filter: alpha(opacity=80);
	opacity: 0.8;
	-moz-opacity: 0.8;
}
.popup #container
{
	position: absolute;
	top: 0;
	left: 0;
	overflow: hidden;
	z-index: 2000200;
}


/***** POPUP TOP, BOTTOM AND MIDDLE *****/

.popup .bg_top, .popup .bg_bottom
{
	width: 737px;
	height: 8px;
	background-repeat: no-repeat;
	font-size: 0.4em;
}
.popup .bg_top
{
	background-image: url(../../images/generic/overlay-top.gif);
}
.popup .bg_bottom
{
	background-image: url(../../images/generic/overlay-bottom.gif);
}

.popup .bg_middle
{
	position: relative;
	width: 737px;
	clear: both;
	background-image: url(../../images/generic/overlay-bg.gif);
}


/***** OVERLAY STYLES *****/

.popup .overlay
{
	font-size: 0.9em;
	width: 689px;
	height: auto !important;
	min-height: 235px;
	height: 235px;
	font-size: 1.3em;
	padding: 12px 24px;
	background-image: url(../../images/generic/overlay-gradient.gif);
	background-position: left bottom;
	background-repeat: no-repeat;
}
.popup .overlay .jScrollPaneContainer
{
	margin: 0;
	margin-bottom: 25px;
}
.popup .overlay #terms_scroller
{
	width: 689px;
	height: 310px;
}
.popup .overlay #terms_scroller li
{
	margin-bottom: 7px;
}

/********************************************************************************/
/****** BUTTON STYLES **********************************************************/
/******************************************************************************/

.btn
{
	display: block;
	text-indent: -6767px;
	overflow: hidden;
	background-position: 0 0;
	background-repeat: no-repeat;
	height: 36px;
}
.btn:hover
{
	background-position: 0 -36px;
}
.close
{
	width: 110px;
	background-image: url(../../images/generic/btn_close.gif);
}

/********************************************************************************/
/***** FOOTER STYLES ***********************************************************/
/******************************************************************************/

/***** BOTTOM *****/

.bottom
{
	background-image: url(../../images/generic/bottom-bg.gif);
	background-repeat: repeat-x;
}

/***** FOOTER *****/

.bottom #footer
{
	width: 972px;
	height: 100px;
	margin: auto;
	padding-top: 23px;
	font-size: 1.1em;
}
.bottom #footer .logo
{
	float: right;
}

/** Links **/

.bottom #footer .links
{
	display: block;
	width: 700px;
	overflow: hidden;
	margin: 0 0 6px 0;
	padding: 0;
	list-style: none;
}
.bottom #footer .links li
{
	float: left;
	margin: 0;
	padding: 0 8px;
	background-image: url(../../images/generic/footer-seperator.gif);
	background-position: right top;
	background-repeat: no-repeat;
}
.bottom #footer .links li.first
{
	padding-left: 0;
}
.bottom #footer .links li.last
{
	background-image: none;
}
.bottom #footer .links li a
{
	color: #00a8b5;
	float: left;
	line-height: 14px;
	padding-right: 14px;
	background-image: url(../../images/generic/footer-link.gif);
	background-repeat: no-repeat;
	background-position: top right;
}

/*
######################################################################################
######                                                                        #######
######     GENERIC COMPONENT STYLES                                          #######
######                                                                      #######
##################################################################################
*/

/********************************************************************************/
/***** SCROLLER STYLES *********************************************************/
/******************************************************************************/

/***** CONTAINER *****/

.jScrollPaneContainer
{
	position: relative;
	overflow: hidden;
	margin-left: 0px;
	z-index: 1;
}

/***** SLIDER TRACK *****/

/** The Track **/
.jScrollPaneTrack
{
	position: absolute;
	cursor: pointer;
	right: 0;
	top: 0;
	height: 100%;
	background-image: url(../../images/generic/scroller-track.gif);
}

/** The slider itself **/
.jScrollPaneDrag
{
	position: absolute;
	cursor: pointer;
	overflow: hidden;
	background-image: url(../../images/generic/scroller-slider.gif);
	background-position: left top;
	background-repeat: repeat-y;
}

/** Top of the drag track **/
.jScrollPaneDragTop
{
	position: absolute;
	top: 0;
	left: 0;
	overflow: hidden;
}

/** Bottom of the drag track **/
.jScrollPaneDragBottom
{
	position: absolute;
	bottom: 0;
	left: 0;
	overflow: hidden;
}

/***** UP AND DOWN ARROWS *****/

a.jScrollArrowUp, a.jScrollArrowDown
{
	position: absolute;
	z-index: 1;
	right: 0;
	text-indent: -2000px;
	overflow: hidden;
	height: 23px;
	background-repeat: no-repeat;
	background-position: 0 0;
}
a.jScrollArrowUp:hover, a.jScrollArrowDown:hover, a.jScrollActiveArrowButton, a.jScrollActiveArrowButton:hover
{
	background-position: -24px 0;
}

/** Up **/
a.jScrollArrowUp
{
	top: 0;
	background-image: url(../../images/generic/scroller-top-link.gif);
}

/** Down **/
a.jScrollArrowDown
{
	bottom: 0;
	background-image: url(../../images/generic/scroller-bottom-link.gif);
}
a.jScrollArrowDown:hover
{
	background-color: #f60;
}
