/* General */

.purpleBack {
  background: #35105e;
}

/* Header */

#noBrainHeader #headerContent, 
#noBrainHeader #joinUsOffer {
  height: 60px;
  padding: 15px;
}
#headerContent #offerText {
  width: 460px;
  color: #fff;
  font-size: 11px;
  padding: 0 5px 0 5px;
  position: relative;
  left: 425px;
  top: -68px;
}
#joinUsOffer #offerText {
  width: 460px;
  color: #fff;
  font-size: 11px;
  padding: 0 5px 0 5px;
  position: relative;
  left: 270px;
  top: -68px;
}

/* Main Containers */

#noBrainerContainer .greyBorder {
  border: 14px solid #acaaaf;
}
#noBrainerContainer #mainContentHome {
  height: 475px;
}
#noBrainerContainer #mainContent {
  height: 382px;
  color: #fff;
}
#mainContent #brainIndex {
  position: absolute;
  top: 124px;
}
#mainContent h3  {
	color: #3F2470;
}
#mainContent p {
  color: #35105E;
}

#noBrainerContainer #backgroundSteps { 
  height: 382px;
  background: url('/images/nobrainer/joinUs_index.jpg') no-repeat;
}

#noBrainerContainer #conditions {
  height: 100%;
  background: url('/images/nobrainer/conditions_base_bg.jpg') repeat;
}
#conditions p,
#conditions h3,
#conditions ol li {
  color: #fff;
}
#conditions ol {
  margin-left: 40px;
}
#conditions li.noNumber {
  list-style: none;
}
#conditions li.noNumber span {
  position: relative;
  right: 20px;
}
#conditions #topSection {
  height: 21px;
  margin-top: 10px;
  background: url('/images/nobrainer/conditions_head.jpg') no-repeat;
}
#conditions #middleSection {
  width: 719px;
  padding: 0 20px 0 75px;
  background: url('/images/nobrainer/conditions_bg.jpg') repeat-y;
}
#conditions #bottomSection {
  height: 32px;
  background: url('/images/nobrainer/conditions_bottom.jpg') no-repeat;
}

/* Friend Get Friend */

#noBrainerContainer #friend { 
  height: 382px;
  background: url('/images/nobrainer/friend_bg.jpg') no-repeat;
}
#brainThumb {
	position: relative;
	top: -92px;
	left: 854px;
}
#friendText {
  color: #fff;
  width: 237px;
  height: 165px;
  position: relative;
  top: 130px;
  left: 72px;
  font-size: 13px;
  line-height: 14px;
  letter-spacing: normal;
}
#friend .heading {
  font-weight: bold;
  text-transform: uppercase;
  font-size: 13px;
  padding-bottom: 5px;
}
#friend #stepOne {
  color: #35105f;  
  width: 290px;
  position: relative;	
  top: 0px;
  left: 380px;
  font-size: 11px;
}
#friend #stepTwo {
  color: #35105f;  
  width: 300px;
  position: relative;
  top: -5px;
  left: 380px;
}
#friend #submitButton {
  position: relative;
  left: 195px;
  top: 5px;
}

#accNum {
	padding-top: 15px
}
#accNum label {
  color: #35105f;
  font-weight: bold;
  font-size: 13px;
}
#accNum input {
  background: url('/images/nobrainer/friend_input.gif') no-repeat scroll 0 0;
  width: 134px;
  height: 23px;
  padding: 4px 21px 3px 8px;
  margin-left: 5px;
  outline-style: none;
  border: 0 solid #fff;
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 1.1em;
  display: inline;
  color: #35105f;
}

/* Join Us Steps */

#backgroundSteps .step, 
#backgroundSteps .purpleStep { 
  height: 90px;  
  padding: 12px; 
  margin: 0;
}
#backgroundSteps .purpleStep a, 
#backgroundSteps .purpleStep .bold,
#backgroundSteps .purpleStep h2 {
  color: #FFF;
}
#backgroundSteps .purpleStep p {
  color: #C77FDC;
  padding-top: 5px;
}
#backgroundSteps .step .bold {
  color: #381262;
}
#backgroundSteps .step p {
  color: #5F5F5F;
  padding-top: 5px;
}
#backgroundSteps h2 {
  font-size: 16px;
  margin: 0;
  padding: 0;
}

#backgroundSteps #step1 {
  width: 260px;
  position: relative;
  top: 130px;
  left: 78px;
}
#backgroundSteps #step1 label {
  color: #FFF;
}
#backgroundSteps #step1 #phonenumber { 
  color: #000; 
  width: 160px; 
  padding: 4px; 
  margin: 0 5px; 
  background: transparent url('/images/adwords/purple_number_bg.gif') no-repeat 0 2px;
}
#backgroundSteps #step2 {
  width: 187px;
  position: relative;
  top: 16px;
  left: 368px;
}
#backgroundSteps #step3 {
  width: 187px;
  position: relative;
  top: -98px;
  left: 587px;
}

/* Overlay content */

#screenOverlay {
  width: 932px;
	height: 382px;
	padding: 0 24px 0 24px;
	position: absolute;
	top: 119px;
}
#screenOverlay p {
  margin: 5px;
  color: #fff;
  line-height: 13px;
  text-transform: none;
  font-weight: normal;
  font-size: 11px;
}
#screenOverlay a {
  color: #fff;
  font-weight: bold;  
}
#screenOverlay a:hover {
  text-decoration: underline;
}
#screenOverlay ol.list {
  margin-left: 22px;
}
#screenOverlay ol.list li {
  color: #fff;
  margin: 0;
}
#screenOverlay .topBox {
  height: 100%;
	z-index: 1000;
}
#screenOverlay .closeOverlay {
  float: right;
  margin: 6px 10px 0 0;
}

#screenOverlay #contract {
  background: url('/images/nobrainer/contact_bg.jpg') no-repeat;
}
#screenOverlay #plans {
  background: url('/images/nobrainer/plans_bg.jpg') no-repeat;
}
#screenOverlay #switching {
  background: url('/images/nobrainer/switching_bg.jpg') no-repeat;
}
#screenOverlay #difference {
  background: url('/images/nobrainer/difference_bg.jpg') no-repeat;
  margin-top: 5px;
}
#screenOverlay #specialOffer {
  background: url('/images/nobrainer/offer_bg.jpg') no-repeat;
}

#contract #contractText {
  width: 405px;
  position: relative;
  top: 48px;
  left: 205px;
}
#contract #phoneNumbers {
  color: #5b4b7a;
  position: relative;
  width: 140px;
  top: 130px;
  left: 745px;
}
#contract .contactMe {
  width: 388px;
  position: relative;
  top: 34px;
  left: 300px;
}
#contract #calIcon {
  position: absolute;
  top: 81px;
  right: 85px;
}
#contract #submitButton {
  position: relative;
  top: -28px;
  left: 310px;
}
#contract #contractThanks {
  color: #5b4b7a;
  font-size: 16px;
  font-weight: bold;
}
#switching #switchText {
  width: 280px;
  position: relative;
  top: 57px;
  left: 254px;
}
#switching #switchingSwf {
	width: 284px;
	height: 284px;
	position: absolute;
	top: 55px;
	left: 612px;
}
#plans #plansText {
  width: 296px;
  position: relative;
  top: 48px;
  left: 235px;
}
#plans .planAvailability {
  width: 300px;
  position: relative;
  top: 123px;
  left: 295px;
}
#plans #phone {
  width: 160px;
  background: url('/images/nobrainer/input_ph_num.png') no-repeat;
}
#plans #checkButton {
  width: 78px;
  position: relative;
  left: 8px;
  top: 10px;
}
#plans #allPlans {
  position: relative;
  top: -4px;
}
#plans #viewButton {
  width: 78px;
  position: relative;
  top: 8px;
}
#difference #differenceText {
  width: 295px;
  position: relative;
  top: 54px;
  left: 230px;
}
#difference #differenceSwf {
	width: 284px;
	height: 284px;
	position: absolute;
	top: 53px;
	left: 612px;
}
#specialOffer #offerText {
  width: 400px;
  position: relative;
  top: 28px;
  left: 240px;
}

/* Forms */

.form .maroon {
  color: #7c3672 !important;
}
.form .purple {
  color: #5b4b7a !important;
}
.form .grey,
.form .grey a {
  color: #8e8e8e !important;
}
.form h3 {
  color: #5b4b7a;
  display: inline;
  font-size: 13px;
  text-transform: none;
  margin: 0;
}
.form ol, ul {
	margin: 0;
	padding: 0;
}	
.form label {
  width: 105px;
  color: #5b4b7a;
  font-size: 1.2em;
	line-height: 1.2;
	font-weight: bold;
	display: inline-block;
	margin-right: 5px;
}
.form label.short {
  width: 20px;
  margin-right: 10px;
}
.form li {
	list-style: none;
	clear: both;
	padding: 0;
	margin: 0;
}

.form input {
  width: 176px;
  height: 20px;
  padding: 4px 8px 3px 8px;
  outline-style: none;
  border: 0 solid #fff;
  background: url('/images/nobrainer/input.png') no-repeat scroll 0 0;
  font-family: Verdana,Arial,Helvetica,sans-serif;
  font-size: 1.1em;
}
form input.button {
  width: auto;
  height: auto;
  background: none;
  border: 0 solid #fff;
  padding: 0;
}
.form #callDate {
  width: 163px;
  background: url('/images/nobrainer/input_call_date.png') no-repeat scroll 0 0;
}
.form input.check {
  border: none;
  position: relative;
  top: 3px;
}
.form input.radio {
  border: none;
  margin-right: 10px;
  position: relative;
  top: 4px;
}
.form em {
	font-weight: bold;
	font-style: normal;
	color: #f00;
}

/* Footer */

#noBrainerFooter #joinUs { 
  height: 52px;
  padding: 10px; 
}
#noBrainerFooter #footerText {
  color: #fff;
  padding: 10px 0 0 10px;
}
#noBrainerFooter #footerText a {
	color: #fff;
}
#noBrainerFooter #switchLink {
  margin-left: 10px;
}
#TB_window {
	border: 7px solid #35105f;
}
#TB_title {
	background: #35105f;
}
#TB_closeAjaxWindow {
	color: #ccc !important;
}
#TB_closeWindowButton {
	color: #fff !important;
}

/* Calendar */

#calendarDiv {
	position:absolute;
	width:205px;
	border:1px solid #317082;
	padding:1px;
	background-color: #FFF;
	font-family:arial;
	font-size:10px;
	padding-bottom:20px;
	visibility:hidden;
}
#calendarDiv span,
#calendarDiv img {
	float:left;
}
#calendarDiv .selectBox,
#calendarDiv .selectBoxOver {
	line-height:12px;
	padding:1px;
	cursor:pointer;
	padding-left:2px;
}
#calendarDiv .selectBoxTime,
#calendarDiv .selectBoxTimeOver {	
	line-height:12px;
	padding:1px;
	cursor:pointer;
	padding-left:2px;
}

#calendarDiv tr.calendar_week_row {
  background:#ccc;
}
#calendarDiv td {
	padding:3px;
	margin:0px;
	font-size:10px;
	text-align:right;
	cursor:pointer;
}
#calendarDiv td:hover {
  color: #fff;
	background: #8B067B;
}

#calendarDiv .selectBox {
	border:1px solid #E2EBED;		
	color: #E2EBED;
	position:relative;
}
#calendarDiv .selectBoxOver {
	border:1px solid #FFF;
	background-color: #8B067B;
	color: #FFF;
	position:relative;
}
#calendarDiv .selectBoxTime {
	border:1px solid #317082;		
	color: #317082;
	position:relative;
}
#calendarDiv .selectBoxTimeOver {
	border:1px solid #216072;	
	color: #216072;
	position:relative;
}

#calendarDiv .topBar {
	height:16px;
	padding:2px;
	background-color: #35105E;
}
#calendarDiv .topBar img {
	cursor:pointer;
}
#calendarDiv .topBar div {
	float:left;
	margin-right:1px;
}

#calendarDiv .activeDay {	/* Active day in the calendar */
	color:#fff;
	background:#8B067B; 
}
#calendarDiv .todaysDate {
	height:17px;
	line-height:17px;
	padding:2px;
	background-color: #ccc;
	text-align:center;
	position:absolute;
	bottom:0px;
	width:201px;
}
#calendarDiv .todaysDate div {
	float:left;
}
	
#calendarDiv .timeBar {
	height:17px;
	line-height:17px;
	background-color: #E2EBED;
	width:72px;
	color:#FFF;
	position:absolute;
	right:0px;
}
#calendarDiv .timeBar div{
	float:left;
	margin-right:1px;
}

#calendarDiv .monthYearPicker {
	background-color: #E2EBED;
	border:1px solid #AAAAAA;
	position:absolute;
	color: #35105E;
	left:0px;
	top:15px;
	z-index:1000;
	display:none;
}
#calendarDiv #monthSelect {
	width:70px;
}
#calendarDiv .monthYearPicker div {
	float:none;
	clear:both;	
	padding:1px;
	margin:1px;	
	cursor:pointer;
}
#calendarDiv .monthYearActive {
	background-color: #8B067B;
	color: #E2EBED;
}

/* "Fixes"
-----------------------------------------------------------------------------*/		
	.clearfix:after
	{content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;}
	
	.clearfix {display: inline-block;}
	
	/* Hides from IE-mac \*/
	* html .clearfix {height: 1%;}
	.clearfix {display: block;}
	/* End hide from IE-mac */