﻿/***
	O2 blueroom v4
	CustomerRecognition
	www.aislondon.com (2009)

	:: Last update: MF 23/11/2009

	-[Inherits]------------------------
	Base.css > Generic.css
	-----------------------------------

	-[Contents]------------------------
	1. Overides
	2. New Classes
	3. Taken from previous style sheets
	-----------------------------------
***/

/**
	1. Overrides (from inherited styles required for this page)
*/



html .panel p {
	margin-left: 0;
}

html body .nopad {
	margin-bottom: 0;
}



.form-element.chkLink {
	margin: 0 0 0 100px;
}

html .outer-content h2 {
	font-size: 1.3em;
	font-weight: bold;
}

html .outer-content p {
	margin: 0 0 0.8em 5px;
}

html .outer-content .panel p {
	margin: 0 0 0.8em 0;
}

html .inner-content h2 {
	margin: 0.5em 0 0.8em 5px;
}

html .panel h2 {
	margin: 1em 0 0.8em 0;
}

html .form-element.txt .inputContainer input {
	width: 220px;
}

html .form-element.txt label {
	width: 90px;
	padding-top: 2px;
}

/*.inline-button .form-row {
float:left;
width:390px;
}*/

.inline-button .request {
	clear: left;
	margin-left: 155px;
}

.inline-button .button {
	margin: 0;
}

html .outer-content p.tagline {
	width: 600px;
}

html .outer-content p.tagline.success{
    color: #0aabab;
    line-height: 20px;
    height: 20px;
}

html .outer-content p.tagline.success span.tick{
    margin: 0 2px 0;
    display: inline-block;
    width: 16px;
    height: 20px;
    background: url(../Images/success-tick.gif) 0 4px no-repeat;
}

.container-form-form .datacapture {
	padding: 0 15px 0 15px;
	width: 429px;
}



.form-row.single {
	margin: 0.3em 0 1.5em;
}

/**
	2. New Classes
*/

#fields .span-under {
	margin-bottom: 1px;
}

.container {
	overflow: hidden;
	margin: 10px 0 28px 0;
}

.container.copy {
	margin: 0 0 28px 0;
}

html .outer-content .panel .helpLink { margin:0; }

.container .forgot {
	float: right;
}

.container .trouble {
	float: left;
}

.container #sign-in {
	float: right;
}

.container #save-password {
	float: right;
}

.container #register {
	float: right;
}

.container #Div2 {
	float: right;
}

.container #Div1 {
	float: right;
}

.container #SendCode {
	float: right;
}


.container #save {
	float: right;
}

.container #Continue {
	float: right;
}
.container #change-password {
	float: right;
}
.container .title {
	padding: 5px 0 10px 0;
}

.outer-content .container h2 {
	float: left;
	display: inline;
}

.container-form {
	overflow: hidden;
}

.container-form-copy {
	float: left;
	width: 459px;
}

.container-form-copy p {
	margin-left: 5px;
}

.container-form-copy .last {
	margin: 10px 0 15px 5px;
}

/* .container-form-copy h2 {
    margin:5px 0 0.8em 5px;}    */

.container-form-form {
	float: right;
	width: 459px;
}

.container-movie {
	overflow: hidden;
}

.container-movie-movie {
	float: left;
	width: 459px;
}

.container-movie-copy {
	float: right;
	width: 459px;
}

/* .container-movie-copy h2 {
    margin:10px 0 10px 7px;} */

/* html .container-movie-copy .panel h2 {
    margin-bottom:0.8em;
    margin-right:0;
    margin-top:0;} */

.container-movie-copy p {
	margin: 0 0 10px 7px;
}

#video {
	margin: 0 0 4px 0;
	padding: 6px;
}

.businessThanks{float: left;}

.eventDetail #imageholder {
	width: 447px;
	height: 324px;
	overflow: hidden;
	float: left;
	margin: 0 0 7px 0;
}

#imageholder {
	width: 189px;
	height: 84px;
	overflow: hidden;
	float: left;
	margin: 0 10px 7px 0;
}

/* to accomodate larger amount of copy in reg steps left panel */
html .outer-content .panel .regTextPadding{
    margin-left: 200px;
}

#not-o2 {
	float: right;
	font-size: 1.2em;
	margin: 10px 5px 15px 0px;
}

/*#priority {
    width: 936px;
    font-size:1.2em;
    color: #ffffff;
    font-weight: bold;

    font-size:1.2em;
    height: 34px;
    background: url('../Images/register.gif') no-repeat top left;
    display: block;
    padding: 19px 0 0 190px;
    color: #fff;
    font-weight: bold;
    margin: 2px 0 5px 0;

}
    
#priority span {
 display: none;}*/

html .form-element.txt .wide-label {
	width: 300px;
}

html .form-element.txt .mid-label {
	width: 140px;
}

.info {
	margin-left: 160px;
}

.updateprogress {
	float: right;
	width: 16px;
	height: 16px;
	padding: 5px 8px 0 0;
}

.error {
	color: #D7070D;
}

/**
	3. Taken from previous style sheets
*/

#fields input:focus, #fields textarea:focus {
	-moz-background-clip: border;
	-moz-background-inline-policy: continuous;
	-moz-background-origin: padding; /* background:#F0F0F0 none repeat scroll 0 0; */
}

/** Progress Bar */

ul.preferences-steps {
	overflow: hidden;
	list-style-type: none;
	margin: 10px 3px;
}

ul.preferences-steps li {
	background-color: #cecece;
	background-image: url( '../Images/step-grad.jpg' );
	background-repeat: no-repeat;
	background-position: left top;
	float: left;
	font-size: 1em;
	margin-right: 2px;
	position: relative;
	width: 182px;
}

ul.preferences-steps li#priority {
	background-image: url( '../Images/step-grad-priority.jpg' );
}

ul.preferences-steps li#priority span {
	line-height: 1.2em;
}

ul.preferences-steps li#priority.selected {
	background-image: url( '../Images/step-grad-selected-priority.jpg' );
}

ul.preferences-steps li.selected {
	background-color: #07326a; /*border: 1px solid #4ca3db;*/
	background-image: url( '../Images/step-grad-selected.jpg' );
	width: 185px;
	margin-right: 1px;
}



ul.preferences-steps li.step1 {
	z-index: 5;
}

ul.preferences-steps li.step2 {
	z-index: 4;
}

ul.preferences-steps li.step3 {
	z-index: 3;
}

ul.preferences-steps li.step4 {
	z-index: 2;
}

ul.preferences-steps li.step5 {
	z-index: 1;
	margin-right: 0;
}

ul.preferences-steps li p {
	min-height: 4.4em; /* Page specific styles will determine step widths */ /* IE6 height: 8.1em */
}

ul.preferences-steps li.selected p {
	min-height: 4.5em; /* Page specific styles will determine step widths */ /* IE6 height: 8.1em */
}

ul.preferences-steps li p {
	background-image: url( '../Images/step-bottom.jpg' );
	background-repeat: no-repeat;
	background-position: left bottom;
	font-size: 1.4em;
	color: #535353;
	padding: 0 0 0 16px;
}

ul.preferences-steps li.selected p {
	background-image: url( '../Images/step-bottom-selected.jpg' );
	background-repeat: no-repeat;
	background-position: left bottom;
	color: #ffffff;
}

ul.preferences-steps p span {
	display: block;
	padding: 0.3em 60px 1.6em 15px;
	line-height: 1.5em;
}



ul.preferences-steps span.step-title {
	display: block; /* color: #065ba6; */
	padding: 1em 15px 0.3em 0;
	line-height: 1em;
	font-weight: bold;
}



ul.preferences-steps li .step-image {
	background-image: url( '../Images/step-arrow.gif' );
	background-repeat: no-repeat;
	background-position: 60px 3px;
	position: absolute;
	right: -13px;
	top: 16px;
	height: 50px;
	width: 79px;
	z-index: 5;
}

ul.preferences-steps li.selected .step-image {
	background-image: url( '../Images/step-arrow-selected.gif' );
	background-position: 59px 3px;
}

ul.preferences-steps li#step3 .step-image {
	background-image: none;
}

ul.preferences-steps li .step-image span {
	/*AJM: need an extra, relatively positioned span here to fix ie 6+ 7 layering issue */
	display: block;
	position: relative;
	z-index: 4;
	width: 70px;
	height: 50px;
	background-repeat: no-repeat;
}

/**
	Background selected states
*/

ul.preferences-steps li#step1 .step-image span {
	background-image: url( '../Images/step1.png' );
	background-position: 3px 2px;
}

ul.preferences-steps li#step1.selected .step-image span {
	background-image: url( '../Images/step1-selected.png' );
}

ul.preferences-steps li#step2 .step-image span {
	background-image: url( '../Images/step2.png' );
	background-position: 12px 0px;
}

ul.preferences-steps li#step2.selected .step-image span {
	background-image: url( '../Images/step2-selected.png' );
}

ul.preferences-steps li#step3 .step-image span {
	background-image: url( '../Images/step3.png' );
}

ul.preferences-steps li#step3.selected .step-image span {
	background-image: url( '../Images/step3-selected.png' );
}

/** Button & Remember me checkbox */

div#login #login-form fieldset .form-row .form-element.button {
	margin: 14px 0 7px; /* ie7 > *margin-top: 11px; */
}
div#login #login-form fieldset .form-element.chkLink {
	color: #5cbaf1;
	margin: -10px 0 0 53px;
	margin-top: -6px;
}
div#login #login-form fieldset .form-element.chkLink .labelContainer {
	font-size: 1.1em;
	margin: 3px 0em 0 0; /* ie6/7 > *margin-top: 6px; */
}

.priority-footer-top {
	width: 936px;
	height: 21px;
	margin: 0;
	padding: 0;
	background-image: url( '../Images/priority-footer-top.jpg' );
}

.priority-footer-mid {
	width: 896px;
	min-height: 26px;
	margin: 0;
	padding: 0 20px 0 20px;
	background-image: url( '../Images/priority-footer-mid.jpg' );
	overflow: hidden;
}

.priority-footer-bottom {
	width: 936px;
	height: 4px;
	margin: 0 0 6px 0;
	padding: 0;
	background: url( '../Images/priority-footer-bottom.jpg' ) no-repeat;
	overflow: hidden;
}

.container-form-form.wide {
	float: left;
	width: 894px;
}

.mid .form-element label.labelContainer {
	width: 140px;
}

.mid .form-element.chkLink .feedback-message {
line-height:1em;
margin-left:5px;
}

.mid .form-element .errorMsg {
	margin-left:152px;
	width:278px;
}

.mid .chkLink.form-element .errorMsg {
	margin-left:5px;
}

.mid .form-element .feedback-message {
	margin-left:152px;
	width:278px;
}

.mid .chkLink.form-element .feedback-message {
	margin-left:5px;
}

.mid.userDetails .chkLink {
	margin-left: 147px;
}

.container-form-form.wide .panel.data-capture {
	width: 894px;
}

.preferences-bottom .preferences-section {
	width: 894px;
	padding: 0 15px 15px 15px;
}

.preferences-section.panel.music ul {
	overflow: hidden;
	width: 400px;
}

.preferences-section.panel.music ul li {
	float: left;
	width: 200px;
}

.preferences-section.panel ul {
	list-style-type: none;
	margin: 0;
}

.preferences-section.panel ul li input {
	margin: 0 5px 0 0;
}

.container-form-form.wide h2 {
	width: 918px;
}

.preferences-section.panel h3 {
	font-size: 1.3em;
	font-weight: bold;
	padding: 15px 0 0 0;
}

.container-form-form.wide .container, .container-form-form.wide .preferences-bottom {
	float: left;
}

.container-form-form.wide .form-element.button {
	float: right;
}

#media {
	float: left;
	width: 446px;
}

#flashcontent {float:left;}

#data-capture.high {
	position: relative;
	padding: 15px;
	padding-bottom: 70px;
}

#data-capture.high .buttons {
	position: absolute;
	bottom: 10px;
	right: 15px;
	width: 200px;
}

#data-capture.high .buttons .button {
	float: right;
}
.right { float:right; }
.left { float:left; }
.registered h2 {
	width: 300px;
}

.registered h2 {
	float: left;
}

.registered .button {
	float: right;
	margin: 10px 0 10px 0;
}

.form-element.chkLink .form-row input {
	margin: 0;
}

.validationBorder {
	margin: 0.3em 0.6em 0;
	float: left;
	overflow: hidden;
	display:inline;
}
.forgotpass {
	margin: 0.3em 0 2.2em 0;
	float: right;
	overflow: hidden;
	display:inline;
	font-size:1.2em;
}
.chkLink.feedback .validationBorder {
	border: 1px solid #D7070D;
}

fieldset.column {
	width: 380px;
}

fieldset.mid.column {
	width: 430px;
}



#hat .global-sub-nav {
	float: left;
}

#hat .global-sub-nav li a {
	background: none;
	padding: 0;
}

.inner-content div.column {
	float: right;
	width: 447px;
}

#hat .global-sub-nav li .selected {
	font-weight: bold;
}



#change-password {
	margin:0 0 10px 0;	
}

.userDetails .form-element.txt .inputContainer span.spanData, .userDetails .form-element.num .inputContainer span.spanData {
width:264px;
}

#divSignUp {height:124px;}

.inner-content .data-capture {
	padding:12px 0 0 15px;
}

html .inner-content .data-capture h2 {
	margin: 0 0 0.8em 0;
}

.registered {padding:0 14px 0 15px;}

.registered h2.title {margin:15px 0 0 0;}

/*** new addition gender control ***/

.radioGender{
    padding: 0;
}

.userDetails .radioGender .form-row{
    margin-left:152px;
}

.radioGender .form-row span{
    float: left;
    line-height: 18px;
    height: 18px;
    margin: 4px 0 0 0;
    padding: 0 6px 0 0;
    font-size: 1.2em;
    display: block;
}

.radioGender .form-row .validationBorder input{
    height: 14px;
    margin: 2px 2px 0 0;
    padding: 3px 0px;
    display: block;
}
.radioGender .form-row .validationBorder label{
    line-height: 16px;
    width: 50px;
    display: block;
}

.radioGender .feedback-message{
    color: #d7070d !important;
    clear: left;
}


