html {
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust:100;
}

html,  body,  div,  span,  object,  iframe, blockquote, pre, abbr,
address, cite, code, del, dfn, em, ins, kbd, q, samp, small, /* strong, */ sub, sup, var,
b, i, dl, dt, dd, fieldset, form, label, legend, article, aside,
canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, 
section, summary, time, mark, audio, video, input, select, textarea {
	margin:0;
	padding:0;
	border:0;
	font-size: 15px;
	vertical-align: baseline;
	font-family: Open Sans, Arial, helvetica, sans-serif;
	color: #58585b;
}

article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section {
	display:block
}

/*******************************************************************************************************************************************************/
/************** general styles *************************************************************************************************************************/
/*******************************************************************************************************************************************************/

p, ol, ul, div.paragraghBorder {
	margin-top: 0px;
	margin-bottom: 16px;
}

table.fileUploader {margin-bottom: 16px;}

p.tiny {font-size: 12px;}
p.small, li.small {font-size: 14px;}
p.larger {font-size: 18px;}
p.veryLarge {font-size: 24px;}

p.noBorder {margin-bottom: 0px;}

ul, ol {
	margin-left: 1.0em;
	padding-left: 0.2em;
	line-height:normal;
}

ul {list-style-type: square;}
ol {list-style-type: decimal;}

a:link, p a:link, ul a:link, ol a:link {color: #1f59aa; text-decoration: underline}
a:visited, p a:visited, ul a:visited, ol a:visited {color: #1f59aa; text-decoration: underline}
a:active, p a:active, ul a:active, ol a:active {color: #1f59aa; text-decoration: none}
a:hover, p a:hover, ul a:hover, ol a:hover {color: #1f59aa; text-decoration: none}

h1, h1 p {
	font-size: 26px;
	color: #1f59aa;
	font-weight: bold;
	margin-top: 0px;
	margin-bottom: 12px;
}

h2 {font-size: 22px; color: #1f59aa; font-weight: bold; margin-top: 0px; margin-bottom: 10px;}
h3 {font-size: 18px; color: #1f59aa; font-weight: bold; margin-top: 0px; margin-bottom: 10px;}

/* By default IE8+ centre aligns headers */
th { text-align: left; }

.warning, .red, td.warning .tooltipLink {color: #EA2227;}
.greyText {color: #58585b;}
.darkGrey {color: #ababab;}
.midGrey {color: #dddddd;}
.lightGrey {color: #efefef;}
.veryLightGrey {color: #f8f8f8;}
.Blue {color: #1f59aa;}
.harmonyBlue {color: #143a6f;}

span.colourHighlight{ /* Used in grid on claim screen */
    display: inline-block; *zoom: 1; *display: inline; /* IE7 */
    -webkit-border-radius: 8px; /* For older versions of Safari and Chrome */
    -moz-border-radius: 8px; /* For older versions of Firefox */
	border-radius: 8px;
	margin: 0px;
	padding: 0px 6px 0px 6px;
	font-weight: bold;
	background-color: #000000;
	color:#ffffff;

    -webkit-box-sizing: border-box;
  	-moz-box-sizing: border-box;
  	box-sizing: border-box;
}

/*******************************************************************************************************************************************************/
/************** MAIN LAYOUT DIV STYLES *****************************************************************************************************************/
/*******************************************************************************************************************************************************/

div.outerContaner {
	width: 100%;
	min-width:320px;
	border-top: 10px solid #1f59aa;
}

div.container,
div.container-logo-overlay,
div.container-header,
div.container-header-spacer,
div.container-title-banner,
div.container-banner-wide,
div.container-banner-small,
div.container-mobile-nav,
div.container-footer,
div.container-company {
	width: 100%;
	clear: both;
}

div.container-logo-overlay {
	position: -webkit-sticky; /* Safari */
	position: sticky;
	height: 0px;
	top: -40px;
	pointer-events: none;  /* So links underneath work */
}

div.container-header-spacer div.containerInside div.containerInsideTwo {
	height: 40px;
}

div.container-title-banner {}
div.container-mobile-nav {display: none;}
div.container-banner-small {display: none;}

div.container div.containerInside div.containerInsideTwo div.containerInsideContent {padding-top: 25px;}

div.containerInside {
	width: 1250px; 			/* For ie8 - reset in media stuff below */
	max-width: 1250px;
	margin-left: auto; 		/*** USED TO CENTRE CONTENT ***/
	margin-right: auto; 	/*** USED TO CENTRE CONTENT ***/
	clear: both;
}

div.containerInsideTwo, div.containerInsideTwoMobileNav, div.containerInsideTwoTitleBanner {
	padding: 0px 30px 0px 30px; /* Included here for ie8, also declared in media stuff below */
	
}

div.containerInsideTwoTitleBanner {
	background-color: #dddddd;
}

div.containerInsideTwoTitleBanner, div.containerInsideTwoBanner {
	border-top: 1px solid #ababab;
}

div.containerInsideTwoTitleBanner {
	border-bottom: 1px solid #ababab;
}

div.containerInsideTwo, div.containerInsideTwoMobileNav, div.containerInsideTwoTitleBanner, div.containerInsideTwoBanner {
	border-left: 1px solid #dddddd;
	border-right: 1px solid #dddddd;
}

div.containerInsideContent, div.containerInsideContentBanner, div.containerInsideContentSales {
	width: 100%;
	overflow: hidden;
	clear: both;
}

div.containerInsideContent {max-width: 1190px;}
div.containerInsideContentBanner { background-color: #000000}

div.container-footer div.containerInside div.containerInsideTwo {
	background-color: #121214; /* Matches website #121214 */
}

div.container-company div.containerInside div.containerInsideTwo {
	background-color: #000000; /* Matches website */
}

div.container div.containerInside div.containerInsideTwo div.containerInsideContent {
	padding-bottom: 15px; /* Improves spacing in main content area */
}

div.containerInsideContentSales {
	margin-bottom: 0px;
}

div.containerInsideContentSalesExtraTopMargin {
	padding-top: 10px;
}

div.titleBanner {
	float: left;
	color: #58585b;
	font-size: 24px;
	font-weight: light;
	padding: 20px 0px 20px 0px;
}

div.footer-main {
	padding: 15px 0px 15px 0px;
	color: #efefef;
}

div.footer-main div.twoColumnContentFooter h2, div.footer-main div.twoColumnContentFooter p {color: #efefef;}

div.footer-main div.twoColumnContentFooter p a:link,
div.footer-main div.twoColumnContentFooter p a:visited,
div.footer-main div.twoColumnContentFooter p a:active,
div.footer-main div.twoColumnContentFooter p a:hover {
	color: #efefef;
	text-decoration: underline;
}

div.footer-company {
	padding: 15px 0px 25px 0px;
	text-align: center;
	color: #efefef;
}

div.footer-company p a:link, div.footer-company p a:visited,
div.footer-company p a:active, div.footer-company p a:hover {
	color: #efefef;
	text-decoration: underline;
}

/*******************************************************************************************************************************************************/
/************** Details stuff **************************************************************************************************************************/
/*******************************************************************************************************************************************************/

summary {
	list-style: none;
}

/*
summary::-webkit-details-marker {
	display: none;
}
*/

summary {
	cursor: pointer;
	position: relative;
	padding-left: calc(1.2rem + .75rem);
	border-bottom: 1px solid #58585b;
}

summary.first {
	border-top: 1px solid #58585b;
}

summary:before {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	left: 0rem;
	content: ">";
	width: 1.2rem;
	height: 1.2rem;
	background-color: #ffffff;
	color: #EA2227;
	display: inline-flex;
	justify-content: center;
	align-items: center;
	flex-shrink: 0;
	font-weight: 900;
}

summary, summary:before {
	margin-bottom: 0px;
	padding-top: 5px;
	padding-bottom: 5px;
}

details div {
	padding: 13px 10px 0px 10px;
	border-bottom: 1px solid #58585b;
}

div.faqContainer {
	margin-bottom: 13px;
}

details[open] summary:before {
	content: "v";
	font-weight: 700;
}

/*******************************************************************************************************************************************************/
/************** HEADER STYLES **************************************************************************************************************************/
/*******************************************************************************************************************************************************/

div.header-main {
	float: left;
	width: 100%;
	height: 100px;
}

div.header-main-left {
	float: left;
	padding-top: 0px;
}

div.header-main-right {
	float: right;
	padding-top: 0px;
	text-align: right;
}

span.header-top-button-menu {display: none;}

/*******************************************************************************************************************************************************/
/************** main nav STYLES ************************************************************************************************************************/
/*******************************************************************************************************************************************************/

div.topAnimation {
	float: left;
	height: 50px;
	padding-right: 5px; /* Matches border on buttons */
	width: 100%;
	clear: both;
}

div.topNavigation {
	font-weight: bold;
	float: left;
	height: 40px;
	padding-right: 5px; /* Matches border on buttons */
}

div.mobleNavigation {
	float: left;
	width: 100%;
	clear: both;
}

ul.topNavigation, ul.mobileNavigation {
	list-style-type: none;
	margin: 0px auto;
	padding:0;
	width: 100%;
}

/* topNavigation same as buttonStandard + top-button below */

li.topNavigationOn, li.topNavigationOff,
li.mobileNavigationOn, li.mobileNavigationOff {
    display: inline;
	font-weight: bold;
    line-height: 16px;
    font-size: 16px;
}

li.topNavigationOn a, li.topNavigationOff a, 
li.mobileNavigationOn a, li.mobileNavigationOff a {
    display: inline-block; *zoom: 1; *display: inline; /* IE7 */
    -webkit-transition: all 0.25s ease-in-out;
    -moz-transition: all 0.25s ease-in-out;
    -o-transition: all 0.25s ease-in-out;
    -ms-transition: all 0.25s ease-in-out;
    transition: all 0.25s ease-in-out;
}

li.topNavigationOn a, li.topNavigationOff a {
    -webkit-border-radius: 11px; /* For older versions of Safari and Chrome */
    -moz-border-radius: 11px; /* For older versions of Firefox */
	border-radius: 11px;
	border: 1px solid #58585b;
	margin: 0px 0px 0px 5px;
	padding: 10px 10px 10px 10px;
	background-color: #ffffff;
}

li.mobileNavigationOn a, li.mobileNavigationOff a {
	float: left;
	margin: 0px;
	padding: 8px 10px 8px 10px;
	width: 100%;
	border-top: 3px solid #ffffff;
}

li.topNavigationOn a {background-color: #efefef;}

li.topNavigationOn a:link {color: #1f59aa; text-decoration: none;}
li.topNavigationOn a:visited {color: #1f59aa; text-decoration: none;}
li.topNavigationOn a:active {color: #1f59aa; text-decoration: none;}
li.topNavigationOn a:hover {color: #1f59aa; text-decoration: none;}

li.topNavigationOff a:link {color:#ffffff; text-decoration: none; background-color: #1f59aa;}
li.topNavigationOff a:visited {color:#ffffff; text-decoration: none; background-color: #1f59aa;}
li.topNavigationOff a:active {color:#ffffff; text-decoration: none; background-color: #143a6f;} 
li.topNavigationOff a:hover {color:#ffffff; text-decoration: none; background-color: #143a6f;}


/*

li.topNavigationOn a {background-color: #1f59aa;}

li.topNavigationOn a:link {color: #ffffff; text-decoration: none;}
li.topNavigationOn a:visited {color: #ffffff; text-decoration: none;}
li.topNavigationOn a:active {color: #ffffff; text-decoration: none;}
li.topNavigationOn a:hover {color: #ffffff; text-decoration: none;}

li.topNavigationOff a:link {color:#1f59aa; text-decoration: none; background-color: #efefef;}
li.topNavigationOff a:visited {color:#1f59aa; text-decoration: none; background-color: #efefef;}
li.topNavigationOff a:active {color:#ffffff; text-decoration: none; background-color: #1f59aa;} 
li.topNavigationOff a:hover {color:#ffffff; text-decoration: none; background-color: #1f59aa;}

*/

li.mobileNavigationOn a, li.mobileNavigationOff a {background-color: #000000;}

li.mobileNavigationOn a:link {color: #ffffff; text-decoration: none;}
li.mobileNavigationOn a:visited {color: #ffffff; text-decoration: none;}
li.mobileNavigationOn a:active {color: #ffffff; text-decoration: none;}
li.mobileNavigationOn a:hover {color: #ffffff; text-decoration: none;}

li.mobileNavigationOff a:link {color:#ffffff; text-decoration: none;}
li.mobileNavigationOff a:visited {color:#ffffff; text-decoration: none;}
li.mobileNavigationOff a:active {color:#ffffff; text-decoration: none; background-color: #58585b;} 
li.mobileNavigationOff a:hover {color:#ffffff; text-decoration: none; background-color: #58585b;}

/*******************************************************************************************************************************************************/
/************** COLUMN STYLES **************************************************************************************************************************/
/*******************************************************************************************************************************************************/

/******************************/
/* main columns ***************/
/******************************/

div.twoColumnContentFooter, 
div.leftColumnContent, div.rightColumnContent {
	float: left;
	padding: 0px;
	margin: 0px;
	overflow: hidden;
}

div.leftColumnContent {
	margin-bottom: 8px; /* Improves spacing */
}

div.rightColumnContent {
	margin-bottom: 16px; /* Improves spacing */
}

div.twoColumnContentFooter {width: 49%;}
div.leftColumnContent {width: 27%;}
div.rightColumnContent {width: 70%;}

div.twoColumnContentSpacer, 
div.twoColumnContentSpacerFooter {
	float: left;
	padding: 0px;
	margin: 0px;
}

div.twoColumnContentSpacer {width: 3%;}
div.twoColumnContentSpacerFooter {width: 2%;}

/******************************/
/* Left content divs **********/
/******************************/

div.leftColumnContentInside {
	float: left;
	padding: 0px;
	margin: 0px 0px 8px 0px; /* Ensures 16px same as <p> */
	overflow: hidden;
	width: 100%;
	clear: both;
}

div.leftColumnContentInsideOne, div.leftColumnContentInsideTwo {
	float: left;
	padding: 0px;
	margin: 0px;
	width: 100%;
	overflow: hidden;
}

div.leftColumnContentInsideSpacer {
	float: left;
	padding: 0px;
	margin: 0px;
	width: 2%;
	display: none;
}

/******************************/
/* Right content divs **********/
/******************************/

div.rightColumnContentInside {
	float: left;
	padding: 0px;
	margin: 0px 0px 0px 0px;
	overflow: hidden;
	width: 100%;
	clear: both;
}

div.rightColumnContentInsideOne, div.rightColumnContentInsideTwo {
	float: left;
	padding: 0px;
	margin: 0px;
	width: 49%;
	overflow: hidden;
}

div.rightColumnContentInsideSpacer {
	float: left;
	padding: 0px;
	margin: 0px;
	width: 2%;
}

div.desktopNewClaimHelp, div.mobileNewClaimHelp {
	float: left;
	padding: 0px;
	margin: 0px;
	width: 100%;
}

div.mobileNewClaimHelp {display:none;}
h1.mobileNewClaimHelpHeading {display:none;}

/******************************/
/*  Content spacing panel *****/
/******************************/

div.contentSpacing {
	float: left;
	padding: 0px;
	width: 100%;
	margin: 0px 0px 8px 0px;
}

/*******************************************************************************************************************************************************/
/************** Form stuff *****************************************************************************************************************************/
/*******************************************************************************************************************************************************/

/******************************/
/* form columns ***************/
/******************************/

div.standardForm, div.standardFormCloser {
	float: left;
	width: 100%;
	clear: both;
}

div.standardForm, div.standardFormDashedLine {margin-bottom: 0px;} /* 20px (required) - 8px (par_formspacing) */

div.standardFormDashedLine {
	border-top: 1px dashed #58585b;
}

div.standardFormLeftColumn,
div.standardFormRightColumn {
	float: left;
	width: 48%;
}

div.standardFormSpacer {
	float: left;
	width: 4%;
}

/******************************/
/* p styles *******************/
/******************************/

.par_formspacing, .par_formspacingButtons, .par_formspacingRed, div.claim_info { 
	margin-top: 0px;											
	margin-bottom: 8px;
	line-height:normal;
}

.par_formspacingButtons {padding-top: 8px; clear: both;}									

p.par_no_spacing {
	margin-bottom: 0px;
	
}

p.par_nomargin {
	margin-top: 0px;
	margin-bottom: 0px;
	line-height:normal;
}

p.par_topSpacing {
	margin-top: 16px;
	margin-bottom: 16px;
	line-height:normal;
}

/******************************/
/* form fields ****************/
/******************************/

input, select, textarea, div.claim_info {
	-webkit-box-sizing: border-box;
  	-moz-box-sizing: border-box;
  	box-sizing: border-box;
	background: #ffffff;
	color: #000000;
	border: 1px solid #bbbbbb;
	padding: 4px;
}

input, select, textarea {margin: 0px;}

.input_halfsize, .select_halfsize {width: 100%;}
.input_postcode {width: 50%;}
.input_telephonenumber {width: 65%;}
.select_telephonetype {width: 33%;}
.input_dd {width: 23%;}
.input_mm {width: 23%;}
.input_yyyy {width: 50%;}

input:focus {background: #ffffff;}

span.noborder span input, span.noborder input {
	border: 0px;
	background-color: transparent;
	margin: 0px 5px 0px 10px;
}

div.claim_info, /* Used on claim page to look like a form */
.input_popupLong, /* Used when editing repair status */
.input_searchForm, .select_searchForm,
.input_login, .select_login {
	width: 100%;	
}

.input_halfsizeWithDatePicker, /* Used when editing repair status */
.input_searchFormWithDatePicker {
	width: 80%;
	margin: 0px;
}

/******************************/
/* fake form fields ***********/
/******************************/

div.input_halfsize_fake {
	-webkit-box-sizing: border-box;
  	-moz-box-sizing: border-box;
  	box-sizing: border-box;
	color: #4D4D4F;
	border: 1px solid #929EAC;
	padding: 3px 2px 3px 2px;
	margin-top: 0px;
	margin-bottom: 8px;
	width: 100%;
	background: #ffffff url('./Images/spacers_etc/lock.gif') top right no-repeat;
}

/******************************/
/* inputs / buttons ***********/
/******************************/

div.buttonStandard, div.buttonSecondary, div.buttonHighlight { /* Used for logout and menu */
    display: inline;
}

.input_button_main, .input_button_secondary, .input_button_highlight {
	margin: 0px;
}

div.buttonStandard a, div.buttonSecondary a, div.buttonHighlight a,
.input_button_main, .input_button_secondary, .input_button_highlight {
    display: inline-block;
    -webkit-border-radius: 11px; /* For older versions of Safari and Chrome */
    -moz-border-radius: 11px; /* For older versions of Firefox */
	border-radius: 11px;
	border: 1px solid #58585b;
	
	padding: 4px 10px 4px 10px;
    font-size: 16px;
    line-height: 16px;
    font-weight: bold;
    
    -webkit-transition: all 0.25s ease-in-out;
    -moz-transition: all 0.25s ease-in-out;
    -o-transition: all 0.25s ease-in-out;
    -ms-transition: all 0.25s ease-in-out;
    transition: all 0.25s ease-in-out;
}

div.top-button a {padding: 10px 10px 10px 10px;}
	
div.buttonStandard a, .input_button_main {background-color: #1f59aa;}
div.buttonSecondary a, .input_button_secondary {background-color: #dddddd; border: 1px solid #58585b}
div.buttonHighlight a, .input_button_highlight {background-color: #1faa70;}

div.buttonStandard a:link, div.buttonStandard a:visited, .input_button_main {
	color: #ffffff; 
	text-decoration: none;
    cursor: pointer;
}

div.buttonStandard a:active,  div.buttonStandard a:hover, 
.input_button_main:hover, .input_button_main:focus { 
	color: #ffffff;
	text-decoration: none;
	background-color: #143a6f;
}

div.buttonSecondary a:link, div.buttonSecondary a:visited, .input_button_secondary {
	color: #58585b;
	text-decoration: none;
    cursor: pointer;
}

div.buttonSecondary a:active, div.buttonSecondary a:hover, 
.input_button_secondary:hover, .input_button_secondary:focus {
	text-decoration: none;
	background-color: #ffffff;
}

div.buttonHighlight a:link, div.buttonHighlight a:visited, .input_button_highlight {
	color: #ffffff;
	text-decoration: none;
    cursor: pointer;
}

div.buttonHighlight a:active, div.buttonHighlight a:hover,
.input_button_highlight:hover , .input_button_highlight:focus {
	COLOR: #ffffff;
	text-decoration: none;
	background-color: #198d5d;
}

/*******************************************************************************************************************************************************/
/************** Highlight box **************************************************************************************************************************/
/*******************************************************************************************************************************************************/

div.box {
	float:left;
	-webkit-border-radius: 13px; /* For older versions of Safari and Chrome */
    -moz-border-radius: 13px; /* For older versions of Firefox */
	border-radius: 13px;
	
	-webkit-box-sizing: border-box;
  	-moz-box-sizing: border-box;
  	box-sizing: border-box;
    width: 100%;
    background-color: #efefef; 
    padding: 20px 20px 0px 20px;
    border: 1px solid #bbbbbb;
	margin-bottom: 20px;
}

/*******************************************************************************************************************************************************/
/************** Tooltip box ****************************************************************************************************************************/
/*******************************************************************************************************************************************************/

.tooltipBody, .tooltipBodyFixedWidth {
    border: #ababab 1px solid;
    background-color: #e3e3e3;
    padding: 10px;
} 

.tooltipBodyFixedWidth {width: 300px;}

.tooltipLink {
	cursor: pointer;
	text-decoration: underline;
}

/*******************************************************************************************************************************************************/
/************** Main grid ******************************************************************************************************************************/
/*******************************************************************************************************************************************************/

table.standardGrid {
	margin-bottom: 20px;
	border-collapse:collapse;
}

tr.standardGridHeading th, th.standardGridHeadingLAST,
tr.standardGridHeading td, td.standardGridHeadingLAST{
	background: -webkit-linear-gradient(#ffffff, #c8cacc); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#ffffff, #c8cacc); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#ffffff, #c8cacc); /* For Firefox 3.6 to 15 */
    background: linear-gradient(#ffffff, #c8cacc); /* Standard syntax (must be last) */
    border-top: 1px solid #bbbbbb;
	font-weight: bold;
}

tr.standardGridHeading th, tr.standardGridHeading td, tr.standardGridSubHeading td,
tr.standardGridRow1 td, tr.standardGridRow2 td {
	border-bottom: 1px solid #bbbbbb;
	padding: 7px 0px 7px 10px;
	vertical-align: middle;
}

tr.standardGridHeading th.standardGridHeadingLAST,
tr.standardGridHeading td.standardGridHeadingLAST,
tr.standardGridRow1 td.standardGridRow1LAST,
tr.standardGridRow2 td.standardGridRow2LAST {
	padding-right: 10px;
}

tr.standardGridRow1 td, td.standardGridRow1LAST {
	background: #ffffff;
}

tr.standardGridRow2 td, td.standardGridRow2LAST {
	background: #f1f1f1;
}

tr.standardGridRow1 td.standardGridLastWithButton,
tr.standardGridRow2 td.standardGridLastWithButton {
	padding:  0px 0px 0px 10px;
	text-align: right;
	width: 1px;
}

.hideColumn {display: none;}

/******************************/
/* grid heading ***************/
/******************************/

div.gridHeading {
	font-weight: bold;
	text-align: left;
	clear: both;
}

ul.gridHeading {
	list-style-type: none;
	margin-bottom: 6px; /* matches bottom border in li.gridHeadingOn padding */
	padding:0;
	width: 100%;
}

li.gridHeadingOn, li.gridHeadingOff {
    display: inline;
    -webkit-border-radius: 11px 11px 0px 0px; /* For older versions of Safari and Chrome */
    -moz-border-radius: 11px 11px 0px 0px; /* For older versions of Firefox */
	border-radius: 11px 11px 0px 0px;
    font-size: 14px;
    margin: 0px 8px 0px 0px;
	padding: 8px 10px 6px 10px; /* bottom marches margin of ul.gridHeading */
    border-top: 1px solid #bbbbbb;
    border-left: 1px solid #bbbbbb;
    border-right: 1px solid #bbbbbb;
}

li.gridHeadingOn {background-color: #1f59aa; color: #ffffff}
li.gridHeadingOff {background-color: #1f59aa; color: #ffffff}

li.gridHeadingOn a:link {color: #ffffff; text-decoration: none;}
li.gridHeadingOn a:visited {color: #ffffff; text-decoration: none;}
li.gridHeadingOn a:active {color: #ffffff; text-decoration: underline;}
li.gridHeadingOn a:hover {color: #ffffff; text-decoration: underline;}

li.gridHeadingOff a:link {color:#ffffff; text-decoration: underline;}
li.gridHeadingOff a:visited {color:#ffffff; text-decoration: underline;}
li.gridHeadingOff a:active {color:#ffffff; text-decoration: none;} 
li.gridHeadingOff a:hover {color:#ffffff; text-decoration: none;}

/*******************************************************************************************************************************************************/
/************** Screen specific stuff ******************************************************************************************************************/
/*******************************************************************************************************************************************************/

/* Biggest size */
@media only screen and (min-width: 1020px)
{
	/* Reset from value above which is required for ie8 */
	div.containerInside {width: 100%;}

	/* Also declared above for ie8 */
	div.containerInsideTwo, div.containerInsideTwoMobileNav, div.containerInsideTwoTitleBanner {padding: 0px 30px 0px 30px;}
	
	/************** other *******************************************************/
	
	.bottomBackButton {display: none;}
	.searchAgain {display: none;}
	
	/************** grids *****************************************************/

	th.PolicyholderName, td.PolicyholderName {display: none;} /* Probably not enough room for it */
}

/* Anything less than 1019px (Medium size) */
@media only screen and (max-width: 1019px) 
{
	div.containerInside {width: 100%; max-width: 960px} /* 940px plus 10px border search side */
	div.containerInsideTwo, div.containerInsideTwoMobileNav, div.containerInsideTwoTitleBanner {padding: 0px 10px 0px 10px;} /* Gives a bit of a border */
	
	/************** columns *****************************************************/
		
	div.twoColumnContentSpacerFooter {display:none;}
	div.twoColumnContentFooter {width: 100%;}
	
	div.twoColumnContentSpacer {display: none;}
	div.leftColumnContent, div.rightColumnContent {width: 100%;}
	div.leftColumnContent {margin-bottom: 0px;}
	
	div.leftColumnContentInsideOne, div.leftColumnContentInsideTwo {width: 49%; margin-bottom: 12px;}
	div.leftColumnContentInsideSpacer {display: inline;}
	
	div.desktopNewClaimHelp {display:none;}
	div.mobileNewClaimHelp {display:inline;}
	h1.desktopNewClaimHelpHeading {display:none;}
	h1.mobileNewClaimHelpHeading {display:block;}
	
	/************** other *******************************************************/
	
	h1, h1 p, p.veryLarge {font-size: 22px;}
	
	li.topNavigationOn, li.topNavigationOff,
	li.mobileNavigationOn, li.mobileNavigationOff,
	div.top-button a {
		font-size: 14px;
		line-height: 14px;
	}

	li.topNavigationOn a, li.topNavigationOff a {padding: 8px 8px 8px 8px;}
	div.top-button a {padding: 8px 8px 8px 8px;}
		
	div.leftColumnContentInside {margin: 0px;} /* Improves spacing when button hidden */
	.leftBackButton {display: none;}
	.bottomBackButton {display: inline;}
	
	.searchAgain {display: inline;}
	
	/************** grids *****************************************************/
	
	th.RepairStatusSetBy, td.RepairStatusSetBy {display: none;}
	th.PolicyholderName, td.PolicyholderName {display: none;} /* Probably not enough room for it */
}

/* Anything less than 767px (Small size) */
@media only screen and (max-width: 767px)
{
	/************** border stuff ************************************************/
	
	div.containerInsideTwo, div.containerInsideTwoMobileNav, div.containerInsideTwoTitleBanner, div.containerInsideTwoBanner {
		border-left: 0px;
		border-right: 0px;
	}
	
	/************** header stuff ************************************************/

	span.header-top-button-menu {display: inline;}
	div.topNavigation {display: none;}
	div.container-mobile-nav {display: block;}
	div.container-banner-small {display: block;}
	div.container-banner-wide {display: none;}
	div.containerInsideTwoMobileNav {padding: 0px 0px 0px 0px;}

	/************** grids *****************************************************/
	
	th.RepairStatusDateSet, td.RepairStatusDateSet {display: block;}
	th.IncidentDate, td.IncidentDate {display: none;}
	th.PolicyNumber, td.PolicyNumber {display: none;}
	
	/************** columns *****************************************************/
	div.standardFormSpacer {display:none;}
	div.standardFormLeftColumn, div.standardFormRightColumn {width: 100%;}

}

/* Anything less than 667px (Used for grids only) */
@media only screen and (max-width:667px)
{
	/************** grids *****************************************************/
	
	th.ClaimReference, td.ClaimReference {display: none;}
}

/* Smaller than iPhone 5s width */
@media only screen and (max-width: 567px)
{	
	/************** columns *****************************************************/
	
	div.leftColumnContentInsideOne {width: 100%; margin-bottom: 0px;}
	div.leftColumnContentInsideTwo {width: 100%;}
	div.leftColumnContentInsideSpacer {display: none;}
	
	div.rightColumnContentInsideOne, div.rightColumnContentInsideTwo {width: 100%;}
	
	div.rightColumnContentInsideSpacer {display: none;}

	/************** grids *****************************************************/
	
	th.RepairStatusDateSet, td.RepairStatusDateSet {display: none;}
	th.ActionSLA, td.ActionSLA {display: none;}
	
	/************** forms *****************************************************/

	.input_telephonenumber {width: 100%; margin-bottom: 5px;}
	.select_telephonetype {width: 100%;}
}

/* Anything less than 399px (Tiny size) */
@media only screen and (max-width: 399px)
{	
}