/* PURPLE: #E625D6, BLUE: #65D5E4
/* LAYOUT CSSizzle
***********************************************************************************************************/
* { margin: 0px; padding: 0px; }
html { height: 100%; margin-bottom: 1px; }	
body { font-family: helvetica, verdana, serif; font-size: 12px; color: #4D4D4D; background: #F5F3F3; background: url('../images/bg.gif'); text-align: left; }

.container { width: 960px; text-align: left;  margin: 0 auto; background: #fff; box-shadow: 0 0 15px 2px #222; }
#header {}
#content { clear: both; margin-top: 15px; padding-top: 20px; padding-bottom: 20px; }
#footer { text-align: center; }

div.split_column { display: inline-block; vertical-align: top; zoom: 1; *display: inline; _height: 30px; }
div.split_column.left { margin-right: 10px; zoom: 1; width: 565px; }
div.split_column.right { margin-left: 10px; zoom: 1; width: 300px; }

.padded_content { padding: 15px 35px; }


/* GENERIC
***********************************************************************************************************/
img { border: 0; vertical-align: middle; }

p { margin: 5px 0px; }
p.error { color: red !important; font-weight: bold; text-align: center !important; }
p.success { color: #16b6cf !important; font-weight: bold; }
p.emphesis { font-size: 110%; }

h1 {}
h2 { font-size: 28px; color: #167bb0; font-weight: bold; }
h3 {}

a { color: #000; cursor: pointer; }

ul { list-style-position: inside; }

.b { font-weight: bold; }
.c { text-align: center; }
.rt { text-align: right; }
.lt { text-align: left; }
.l { float: left; }
.r { float: right; }
.caps { text-transform: uppercase; }
.clear { clear: both; }

.button { font-weight: bold; color: white; border: 3px solid white; padding: 5px 10px; border-radius: 7px; text-decoration: none; background: #4AD5E5;
	/* IE10 */ background-image: -ms-linear-gradient(top, #4AD5E5 0%, #00B1CC 100%);
	/* Mozilla Firefox */ background-image: -moz-linear-gradient(top, #4AD5E5 0%, #00B1CC 100%);
	/* Opera */ background-image: -o-linear-gradient(top, #4AD5E5 0%, #00B1CC 100%);
	/* Webkit (Safari/Chrome 10) */	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #4AD5E5), color-stop(1, #00B1CC));
	/* Webkit (Chrome 11+) */ background-image: -webkit-linear-gradient(top, #4AD5E5 0%, #00B1CC 100%);
	/* Proposed W3C Markup */ background-image: linear-gradient(top, #4AD5E5 0%, #00B1CC 100%); 
	box-shadow: 0px 0px 3px 3px #eee; cursor: pointer; }
	
.button:hover { background: #00B1CC; }
	
.button.purple { background: #E625D6;
	/* IE10 */ background-image: -ms-linear-gradient(top, #E625D6 0%, #9E007B 100%);
	/* Mozilla Firefox */ background-image: -moz-linear-gradient(top, #E625D6 0%, #9E007B 100%);
	/* Opera */ background-image: -o-linear-gradient(top, #E625D6 0%, #9E007B 100%);
	/* Webkit (Safari/Chrome 10) */ background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #E625D6), color-stop(1, #9E007B));
	/* Webkit (Chrome 11+) */ background-image: -webkit-linear-gradient(top, #E625D6 0%, #9E007B 100%);
	/* Proposed W3C Markup */ background-image: linear-gradient(top, #E625D6 0%, #9E007B 100%); }

.button.purple:hover { background: #9E007B; }

.button.grey { background: #DEDDE1;
	/* IE10 */ background-image: -ms-linear-gradient(top, #DEDDE1 0%, #AEADB2 100%);
	/* Mozilla Firefox */ background-image: -moz-linear-gradient(top, #DEDDE1 0%, #AEADB2 100%);
	/* Opera */ background-image: -o-linear-gradient(top, #DEDDE1 0%, #AEADB2 100%);
	/* Webkit (Safari/Chrome 10) */ background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #DEDDE1), color-stop(1, #AEADB2));
	/* Webkit (Chrome 11+) */ background-image: -webkit-linear-gradient(top, #DEDDE1 0%, #AEADB2 100%);
	/* Proposed W3C Markup */ background-image: linear-gradient(top, #DEDDE1 0%, #AEADB2 100%); }
	
.button.grey:hover { background: #AEADB2; }

.button.large { font-size: 18px; padding: 8px 16px; border-radius: 10px; }
.button.cancel { background: grey; cursor: default; }

.blue_border { border: 5px solid #4AD5E5; border-radius: 10px; }
.grey_border { border: 5px solid #ccc; border-radius: 10px; }

strong { font-weight: bold; }
textarea { vertical-align: top; }


/* HEADER
***********************************************************************************************************/
#header .header_left_div { float: left; width: 700px; }
#header .big { font-size: 24px; font-weight: bold; color: #1BB5D0; }

ul.menu {  text-align: center; list-style:none; background: #167bb0; font-size: 14px; height: 30px; margin: 25px 0 -15px; color: white; }

ul.menu li { display: inline-block; width: 115px; margin: 0 5px; padding: 12px 0; border-radius: 5px; text-decoration: none; font-weight : bold; background: #006699; 
	/* IE10 */ background-image: -ms-linear-gradient(top, #167bb0 0%, #0b8fd4 100%);
	/* Mozilla Firefox */ background-image: -moz-linear-gradient(top, #167bb0 0%, #0b8fd4 100%);
	/* Opera */ background-image: -o-linear-gradient(top, #167bb0 0%, #0b8fd4 100%);
	/* Webkit (Safari/Chrome 10) */	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #167bb0), color-stop(1, #0b8fd4));
	/* Webkit (Chrome 11+) */ background-image: -webkit-linear-gradient(top, #167bb0 0%, #0b8fd4 100%);
	/* Proposed W3C Markup */ background-image: linear-gradient(top, #167bb0 0%, #0b8fd4 100%); 
	box-shadow: 0 8px 6px -6px #333; position: relative; top: -24px; 
	zoom: 1; *display: inline; _height: 30px; }

ul.menu li:hover { background: #9E007B; }

ul.menu li.purple {	background: #E625D6;
	/* IE10 */ background-image: -ms-linear-gradient(top, #E625D6 0%, #9E007B 100%);
	/* Mozilla Firefox */ background-image: -moz-linear-gradient(top, #E625D6 0%, #9E007B 100%);
	/* Opera */ background-image: -o-linear-gradient(top, #E625D6 0%, #9E007B 100%);
	/* Webkit (Safari/Chrome 10) */ background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #E625D6), color-stop(1, #9E007B));
	/* Webkit (Chrome 11+) */ background-image: -webkit-linear-gradient(top, #E625D6 0%, #9E007B 100%);
	/* Proposed W3C Markup */ background-image: linear-gradient(top, #E625D6 0%, #9E007B 100%); }
	
ul.menu li.purple:hover { background: #9E007B; }
					
ul.menu li.darkgrey {background: #A9A9A9;
	/* IE10 */ background-image: -ms-linear-gradient(top, #A9A9A9 0%, #777777 100%);
	/* Mozilla Firefox */ background-image: -moz-linear-gradient(top, #A9A9A9 0%, #777777 100%);
	/* Opera */ background-image: -o-linear-gradient(top, #A9A9A9 0%, #777777 100%);
	/* Webkit (Safari/Chrome 10) */ background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #A9A9A9), color-stop(1, #777777));
	/* Webkit (Chrome 11+) */ background-image: -webkit-linear-gradient(top, #A9A9A9 0%, #777777 100%);
	/* Proposed W3C Markup */ background-image: linear-gradient(top, #A9A9A9 0%, #777777 100%); }

ul.menu li.darkgrey:hover { background: #777777; }

#index ul.menu li#menu_item_quote { background: #9E007B; }
#step1 ul.menu li#menu_item_quote { background: #9E007B; }
#step2 ul.menu li#menu_item_quote { background: #9E007B; }
#step3 ul.menu li#menu_item_quote { background: #9E007B; }
#about ul.menu li#menu_item_about { background: #9E007B; }
#faqs ul.menu li#menu_item_faqs { background: #9E007B; } /* #00B1CC; */
#claims ul.menu li#menu_item_faqs { background: #9E007B; }
#support ul.menu li#menu_item_support { background: #9E007B; }
#claims ul.menu li#menu_item_claims { background: #9E007B; }
#contact ul.menu li#menu_item_contact { background: #9E007B; }
#login ul.menu li#menu_item_login { background: #9E007B; } /* #777; */

.menu a { text-decoration: none; color: #fff; }


/* STEPS
***********************************************************************************************************/
#step1 .split_column.left, #step2 .split_column.left, #step3 .split_column.left, #step4 .split_column.left, #complete .split_column.left { margin-right: 5px; width: 410px; zoom: 1; }
#step1 .split_column.right, #step2 .split_column.right, #step3 .split_column.right, #step4 .split_column.right, #complete .split_column.right { margin-left: 20px; width: 450px; zoom: 1; }

.interation_div { padding: 10px 20px; margin: 0 0 15px 0; border-radius: 10px; background: #eee; }
.interation_div.attention { border: 2px solid #E625D6; }
.interation_div img.logo { width: 100px; }

.payment_div { padding: 20px; text-align: center; font-size: 1.2em; }
.payment_div.annual { margin-top: 35px; }
.payment_div .star_container_div { position: absolute; }
.payment_div .star_container_div .star { position: relative; top: -55px; left: -55px; }
.payment_div .quote_p { color: #0092c0; font-size: 25px; font-weight: bold; background: url('../images/dd_small.png') no-repeat 245px 0; }

#upgrade_div { font-weight: bold; }
#upgrade_div p.l { width: 50%; }
#upgrade_div p.r { margin-top: 4px; }

.policy_details_div { border: 2px solid #eee; border-radius: 10px; margin-bottom: 10px; }
.policy_details_div h4 { font-size: 13px; color: #4D4D4D/*#2b2c5a*/; padding: 5px 8px; background: #eee; }
.policy_details_div label { display: inline-block; width: 125px; font-weight: bold; }
.policy_details_div .display, .policy_details_div .edit { padding: 0 10px; }

.edit_link { text-align: right; margin-bottom: 15px; }

.address_span { display: inline-block; vertical-align: top; }

.wording { clear: both; }
.wording > div { clear: both; margin-top: 20px; }
.wording h3 { color: #00B1CC; margin: 10px 0; font-size: 16px; font-weight: bold; }
.wording p, ul { margin: 15px 0; }
.wording ul { list-style: outside url('../images/pink_tick.png'); margin-left: 20px; padding-left: 5px; }
.wording li { margin: 5px 0 3px 20px; }


/* STD PAGE LEFT & RIGHT
***********************************************************************************************************/
#quotebox {	background: url('../images/phone_brolly_icon.png') right top no-repeat; padding-top: 15px; }
#quotebox h2 { margin: 20px 0 16px; }
#quotebox label { width: 105px; }
#quotebox select, #quotebox input[type=text] { width: 135px; }

.slogan { font-size: 22px; margin-bottom: -20px; }
.slogan .big { font-weight: bold; font-size: 30px; }
.slogan .big.purple { color: #E625D6; }
.slogan .second_line { position: relative; top: -13px; }

.left .slogan { float: right; width: 285px; margin-bottom: 0; }
.left h2 { margin-bottom: 25px; } 
.left > p { clear: both; }

.title { font-weight: bold; font-size: 18px; color: #00B1CC; }
.title.attention { color: #E625D6; font-size: 24px; }
.wording { margin-bottom: 25px; }

#contact .left .interation_div { width: 510px; }
#contact .left .interation_div .formContainer { width: 370px; margin: 0 auto; }
#contact .left .formElement input[type=text] { width: 200px; }
#contact .left .formElement label.stdLabel { width: 150px; }

.contactbox { margin: 20px 0 0 0; padding: 0 0 20px 0; width: 550px; }
.contactbox.spottybottom { border-bottom: dotted 2px #adb1b2; }
.contactbox .cbl { width: 250px; font-size: 110%; }
.contactbox .cbl span { font-weight: bold; }
.contactbox .cbr { float: right; width: 265px; }
.contactbox .cbr span { color: #1bb5d0; font-size: 130%; font-weight: bold; }

div.modalpop { margin: 10px; }
div.modalpop h3 { margin: 15px 0 10px; }
div.modalpop h4 { margin: 10px 0 5px; }


/* STEP1
***********************************************************************************************************/
#quote { font-weight: bold; font-size: 30px; color: #E625D6; }
#quote:before { content: "£"; }

#step1 .interation_div { }
#step1 .interation_div .formElement { margin: 10px 20px; }
#step1 .interation_div label { text-align: left; width: 140px; display: inline-block; }
#step1 .interation_div .split { margin-top: 10px; padding-top: 10px; border-top: 1px dotted #fefefe; }

#step1 #step1form { background: url('../images/phone_icon.png') no-repeat right top; zoom: 1; }
#step1 #step1form > p { display: inline-block; padding: 0 70px 15px 10px; background: url('../images/purple_arrow.png') no-repeat right top; font-size: 20px; }

#step1 .interation_div input[type=checkbox] { display: inline; }
#step1 .interation_div input[type=text], #step1 .interation_div select.full { width: 215px; }

#step1 .grey_border { font-size: 22px; text-align: center; background: #999; color: white; padding: 5px; }

#step1 .left .slogan { float: none; width: 100%; margin-bottom: -20px; }
#step1 .interation_div .button { margin-right: 20px; }

/* STEP 2
***********************************************************************************************************/
#step2 .interation_div { margin-left: 35px; }
#step2 .split_column.left { margin-right: 5px; }
#step2 .split_column.right { margin-left: 20px; }


/* STEP 3
***********************************************************************************************************/
#step3 .split_column.left { margin-right: 5px; }
#step3 .split_column.right { margin-left: 20px; }
#step3 iframe { width: 100%; height: 630px; }


/* STEP 4
***********************************************************************************************************/
#step4 label { width: 186px; } 

/* COMPLETE
***********************************************************************************************************/
#completion_div .addthis_toolbox { margin: 20px 110px; }
#completion_div h2 { margin-bottom: 15px; }
#completion_div h3 { margin: 15px 0; }
#completion_div p { margin: 15px 0; }

/* FORMS
***********************************************************************************************************/
input.error, select.error { background: pink; }
input.validationError, select.validationError { background: pink; }

.formElement { margin: 10px 0; }
.formElement label.stdLabel { display: inline-block; width: 200px; margin-right: 10px; }
.formElement input[type=checkbox] { margin: 0 10px 0 0; }
.formElement input[type=button] { clear: both; float: right; }


/* FOOTER
***********************************************************************************************************/
div#footer:before { content: "."; color: #4AD5E5; background: #4AD5E5; display: block; border-radius: 5px; margin-bottom: 15px;
	/* IE10 */ background-image: -ms-linear-gradient(top, #4AD5E5 0%, #00B1CC 100%);
	/* Mozilla Firefox */ background-image: -moz-linear-gradient(top, #4AD5E5 0%, #00B1CC 100%);
	/* Opera */ background-image: -o-linear-gradient(top, #4AD5E5 0%, #00B1CC 100%);
	/* Webkit (Safari/Chrome 10) */	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #4AD5E5), color-stop(1, #00B1CC));
	/* Webkit (Chrome 11+) */ background-image: -webkit-linear-gradient(top, #4AD5E5 0%, #00B1CC 100%);
	/* Proposed W3C Markup */ background-image: linear-gradient(top, #4AD5E5 0%, #00B1CC 100%); }

#footer { font-size: 10px; }

#footer .split_column { text-align: left; }
#footer .split_column.left { margin-right: 5px; width: 405px; }
#footer .split_column.right { margin-left: 5px; width: 405px; }

#footer ul { display: inline-block; width: 32%; list-style: none; vertical-align: top; zoom: 1; *display: inline; _height: 30px; }


/* PAYMENT
************************************************************************************************************/
#type { margin-bottom: 10px; text-align: right; }
#type img { width: 100px; }


/* DEBUG
/************************************************************************************************************/
#debug { font-size: 0.8em; border-top: 1px solid red; }


/* PAYMENT TYPE SECTION
/************************************************************************************************************/
#type a.typeIcon { display: inline-block; padding: 5px; border-width: 2px; vertical-align: middle; border-radius: 10px; border: 1px solid #ddd; background: #efefef; }
#type a.typeIcon:nth-of-type(1) { margin-right: 5px; }
#type a.typeIcon:nth-of-type(2) { margin-left: 5px; }
#type a.typeIcon.selected, #type a:hover { border-color: #aaa; box-shadow: -3px 3px 3px #aaa; background: #fff !important; }


/* FORM CONTROL
/************************************************************************************************************/
form div.formElement .errMsg { text-align: center; font-size: 1em; color: red; margin: 5px 0; }
form div.formElement .errMsg p { line-height: 20px; }

input[type=text].small { width: 30px; }

#cc img#cv2 { margin-left: 10px; }

#dd div.ddInfo { padding: 3px; margin: 5px; border: 1px solid #eee; font-size: 1em; }
#dd div.ddInfo h3 { font-size: 1.2em; margin: 5px; font-weight: bold; }
#dd div.ddInfo p { margin: 10px 5px; }


/* DIRECT DEBIT GUARANTEE
/************************************************************************************************************/
#ddGuarantee {}
#ddGuarantee img { float: right; margin: 10px 10px 10px 0; }
#ddGuarantee h3 { clear: both; text-align: center; font-size: 1.3em; font-weight: bold; margin: 10px 0; }
#ddGuarantee ul { clear: both; list-style: disc; list-style-position: outside; padding-left: 20px; }
#ddGuarantee ul li { padding: 5px; }


/* DIRECT DEBIT PRINTOUT
/************************************************************************************************************/
@media screen {
	.screenOnly { display: block; text-align: center; }
  	.screenOnly input { font-size: 2em; padding: 10px; }
  	.page-break  { display: none; }
}

@media print {
	.screenOnly { display: none; } 
  	.page-break  { display: block; page-break-before: always; }
}

body#ddContainer { background: #FFF; }

#ddForm h1 { font-size: 1.8em; font-weight: bold; }
#ddForm super { position: relative; top: 0; left: 0; font-size: 0.8em; color: grey; }
#ddForm ul { list-style: none; padding: 0; margin: 0; }
#ddForm p { pading: 0; margin: 0; }

#ddForm .big { font-size: 1.8em; font-weight: bold; margin-bottom: 10px; }
#ddForm .column { float: left; width: 48%; margin: 1%;  }

#ddForm .section { margin: 10px 0; }
#ddForm .section table { border: 1px solid black; padding: 2px; box-shadow: -2px 2px 0 black; }

#ddForm .section table.lineData { width: 100%; }

#ddForm .section table tr { height: 25px; }
#ddForm .section table tr.double { height: 50px; }

#ddForm .section table.lineData td { border-bottom: 1px solid black; }
#ddForm .section table.lineData tr:last-child td { border: 0; }

#ddForm .section table.cellData td { text-align: center; vertical-align: center; border-right: 1px solid black; width: 30px; }
#ddForm .section table.cellData td:last-child { border: 0; }

#ddForm .section table td.greyed { background: #ccc; }

#ddForm .redSection { border: 1px solid red; color: red; padding: 5px 10px; }
#ddForm .redSection table { border-color: red; color: red; box-shadow: -2px 2px 0 red; }
#ddForm .redSection table td { border-color: red; }


/* PAYMENT SUMMARY
/************************************************************************************************************/
.pmntInfo { padding: 0 0 10px;
			border: 2px solid #EEE;
			border-radius: 10px;
			margin-bottom: 10px;
}
.pmntInfo p { padding: 5px 10px 0; }
.pmntInfo p.big { font-size: 1.2em; font-weight: bold; text-align: center; }


#login .stdLabel { width: 90px; }




/* REPORTING STYLE SUMMARY
/************************************************************************************************************/

#report_table 
{
    padding: 0;
    border: 1px solid #999999;
}

#report_table tr
{
    padding: 0;
    border: 0;
}

#report_table thead {
    background: #c9c9c9;
    border: 0;
    padding: 0;
}

#report_table td.large
{
    width: 150px;
}

#report_table td.small
{
    width: 75px;
}

#LoggedIn
{
    width: 99%;
    font-weight: bold;
    margin-bottom: 15px;
    border: 1px dashed #999999;
    padding: 5px;
}

.logout
{
    float: right;
}

#Form_Login
{
    visibility: visible;
}

#report_dates
{
    margin-top: 15px;
}