/* Table of Contents

		1 Defaults
		2 Font
		3 Lists (includes mainNavList, mobileNavList, .subNav, .content-section ul, .content ul)
      3.1 Top Bar Nav
    4 Misc (.clear, .clearfix, .divider, #bodyTitle, #footer, .warning, .success, .avenirHeavy, #ajaxLoad)
    5 Slider
    6 Page Content
    7 Forms
      7.1 Form tables
      7.2 Buttons
    8 Mobile Optimisations
      8.1 Over 1000px
      8.2 Under 1000px
        8.2.1 Forms
    9 Portal Sections
    10 Tables
    11 jQueryUI Overwrites
    12 Splash Screen
      12.1 Splash Screen Mobile Optimisations
    13 Claims tracking table / edit user section
    14 Asset Register
    15 Claim form
		16 Book a Repair

    Notes:
    *** Default site colours
    Light blue: #258bc2 | rgb(39, 140, 194)
    Divider Grey: #ccc
    Dark grey: (for bigger elements, better than just black): #171717
*/

/*
01 Defaults
---------------------------------------------------------------------------------------------------- */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
input, menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	border: 0;
	margin: 0;
	padding: 0;
	vertical-align: baseline;
}

html
{
  font-family: 'Avenir-Roman', Arial, sans-serif;
	font-size: 14px;
  height:100%;
  background: #f6f6f6;
}

body
{
 height:100%; 
}

.counter {
  color: darkgrey;
  text-align: right;
}

.restrictPageWidth, .content-section, #footer, portalSection, .threeColPageContent, .oneColPageContent, #portalHeaderTable
{
  max-width:1050px;
  margin: 0 auto;
}

.restrictToHalfPageWidth
{
  max-width:500px;
}

.inlineDisplay *
{
 display:inline; 
}

a
{
 text-decoration:none;
 color:Black;
 cursor:pointer; 
}

a:hover
{
  color: #258bc2;
}

h1
{
  font-family: 'Avenir-Heavy', Arial, sans-serif;
  font-size:44px;
}

h1.Noh2
{
  margin-bottom:25px; 
}

h2
{
  font-family: 'Avenir-Heavy', Arial, sans-serif;
  font-size: 21px;
  margin-bottom: 15px;
  margin-top:25px;
}

/* Force box sizing so width of element includes padding/margins. Otherwise when in mobile view, if items that are 100% width have any padding/margins they are added on top of the width so pushes off screen. */
*
{
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}

hr { 
  border: 0; 
  height: 1px; 
  background-image: -webkit-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
  background-image: -moz-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
  background-image: -ms-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
  background-image: -o-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0); 
}

.defaultGradientBackground, .portalSection, .divider, div.accordionSection > h3, .accordionSection2 > h3
{
  background: #2b2171; /* Old browsers */
  background: -moz-linear-gradient(left, #2b2171 0%, #0f7087 50%, #00b189 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(left, #2b2171 0%,#0f7087 50%,#00b189 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to right, #2b2171 0%,#0f7087 50%,#00b189 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2b2171', endColorstr='#00b189',GradientType=1 ); /* IE6-9 */ 
}

/*
02 Font
---------------------------------------------------------------------------------------------------- */

@font-face {
  font-family: 'Gotham-Light';
  src: url('MLiProtectCombinedResources/font/GothamLight/Gotham-Light.eot?#iefix') format('embedded-opentype'), 
       url('MLiProtectCombinedResources/font/GothamLight/Gotham-Light.otf')  format('opentype'),
	     url('MLiProtectCombinedResources/font/GothamLight/Gotham-Light.woff') format('woff'),
	     url('MLiProtectCombinedResources/font/GothamLight/Gotham-Light.ttf')  format('truetype'),
	     url('MLiProtectCombinedResources/font/GothamLight/Gotham-Light.svg#Gotham-Light') format('svg');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'Avenir-Black';
  src: url('MLiProtectCombinedResources/font/Avenir/Avenir-Black.eot');
  src: url('MLiProtectCombinedResources/font/Avenir/Avenir-Black.woff2') format('woff2'),
       url('MLiProtectCombinedResources/font/Avenir/Avenir-Black.woff') format('woff'),
       url('MLiProtectCombinedResources/font/Avenir/Avenir-Black.ttf') format('truetype'),
       url('MLiProtectCombinedResources/font/Avenir/Avenir-Black.svg#Avenir-Black') format('svg'),
       url('MLiProtectCombinedResources/font/Avenir/Avenir-Black.eot?#iefix') format('embedded-opentype');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'Avenir-Roman';
  src: url('MLiProtectCombinedResources/font/Avenir/Avenir-Roman.eot');
  src: url('MLiProtectCombinedResources/font/Avenir/Avenir-Roman.woff2') format('woff2'),
       url('MLiProtectCombinedResources/font/Avenir/Avenir-Roman.woff') format('woff'),
       url('MLiProtectCombinedResources/font/Avenir/Avenir-Roman.ttf') format('truetype'),
       url('MLiProtectCombinedResources/font/Avenir/Avenir-Roman.svg#Avenir-Roman') format('svg'),
       url('MLiProtectCombinedResources/font/Avenir/Avenir-Roman.eot?#iefix') format('embedded-opentype');
  font-weight: normal;
  font-style: normal;
}

@font-face 
{
  font-family: 'Avenir-Heavy';
  src: url('MLiProtectCombinedResources/font/Avenir/Avenir-Heavy.eot');
  src: url('MLiProtectCombinedResources/font/Avenir/Avenir-Heavy.woff2') format('woff2'),
       url('MLiProtectCombinedResources/font/Avenir/Avenir-Heavy.woff') format('woff'),
       url('MLiProtectCombinedResources/font/Avenir/Avenir-Heavy.ttf') format('truetype'),
       url('MLiProtectCombinedResources/font/Avenir/Avenir-Heavy.svg#Avenir-Roman') format('svg'),
       url('MLiProtectCombinedResources/font/Avenir/Avenir-Heavy.eot?#iefix') format('embedded-opentype');
  font-weight: normal;
  font-style: normal;
}

/*
03 Lists
---------------------------------------------------------------------------------------------------- */

.horizontalLayoutList, .mainNavList
{
 list-style-type:none; 
}

.horizontalLayoutList li, .mainNavList li
{
 display:inline-block;
 vertical-align:middle;
}

.mainNavList li a
{
  padding: 10px 20px;
  display:block;
  border-bottom:3px solid rgba(0, 0, 0, 0);
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
}

.mainNavList li a:hover
{
  border-bottom:3px solid #258bc2;
  color:#fff !important;
  background-color: #258bc2;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
}

.navSelected
{
  border-bottom:3px solid #258bc2 !important;
}

ul.mobileNavList 
{
  margin-left:5px;
}

.mobileNavList li 
{
  line-height:2.5em;
  cursor: pointer;
}

.mobileNavList li a 
{
 font-size:14px;
}

ul.mobileNavList > li > a:before
{
  content: "";
  position: absolute;
  width: 32px;
  height: 32px;
  z-index: -1;
  background: url(MLiProtectCombinedResources/next-page_icon.png) 0 0 no-repeat;
  right: 0px;
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  -ms-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s;
  background-size: 32px;
}

.mobileNavList-icon-animation:before {
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  transform: rotate(90deg);
}

a.hide-nav-background:before
{
  background-image: none !important;
}

a.mobileNavRemoveBgImageOverride:before
{
  background-image: none !important;
}

.mobileNavList a
{
   padding: 5px 0;
   display:block;
   border-bottom: 1px solid #ccc;
   background-repeat:no-repeat;
   background-position:right;
   background-size:40px;
}

.mobileNavList li ul li
{
  font-weight:normal;
  padding-left:10px; 
}

ul.subNav
{
 float:right;
 margin-left:10px;
}

ul.subNav li a
{
 text-decoration:none !important;
 display:block;
}

ul.subNav li 
{
  border-bottom:1px solid #ccc;
  padding: 10px 10px 10px 25px;
  margin: 0;
}

ul.subNav:first-child
{
  border-top:1px solid #ccc;
}

li.subNavSelected
{
  background: rgba(39, 140, 194, 0.2);
}

li.subNavSelected a
{
  color:#000;
}

.content-section ul
{
  margin-bottom:10px;
  list-style: none;
}

.content-section li{
    padding-left: 25px;
    margin: 10px 0;
    line-height: 1em;
}

.content-section li:before, .subNav li:before {
    content: "";
    border-style: solid;
    border-width: 4px 0 4px 6px;
    border-color: transparent transparent transparent #258bc2;
    width: 0;
    height: 0;
    display: block;
    float: left;
    margin-left: -12px;
    margin-top: 4px;
}

.content ul 
{
 margin-left:15px;
 margin-bottom:18px;
}

/*
3.1 Top Bar Nav
---------------------------------------------------------------------------------------------------- */

#topBarNavHolder
{
 float:left;
 margin-bottom: 20px;
 height:155px;
}

#siteLogoHolder 
{
  float:left; 
}

#topNavTable 
{
  float:left;
  margin-top: 72px;
}

#topNavTable td 
{
  vertical-align:middle;
  padding-left:31px;
}

#topNavTable td:last-child 
{
  padding-right:0; 
}

#topNavTable td a
{
  color: #777777;
  cursor: pointer;
  text-transform: uppercase;
  font-family: 'Avenir-Black', Arial, sans-serif;
  font-size:13px;
}


#topNavTable td:hover a {
  background: #2b2171; /* Old browsers */
  background: -moz-linear-gradient(left, #2b2171 0%, #0f7087 50%, #00b189 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(left, #2b2171 0%,#0f7087 50%,#00b189 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to right, #2b2171 0%,#0f7087 50%,#00b189 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2b2171', endColorstr='#00b189',GradientType=1 ); /* IE6-9 */

  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  display:inline; /* Needed for Safari */


  /* Temp fix for IE */
  color:white;
}

#topBarLoginHolder
{
  float:right; 
}

#topBarLoginTable td 
{
 padding-bottom:3px; 
}

#topBarLoginTable a
{
  font-size:11px;
  color:#087af7;
  font-weight:bold;
  text-decoration:none;
}

#topImage
{
 margin-bottom:20px; 
}

#topImage img
{
 max-width:1050px; 
}

#loggedInDetailsTable 
{
 border-right: 2px solid;
 border-image: url(MLiProtectCombinedResources/siteContentDivider.png) 30 round;
 font-size:14px;
 margin-top:-3px;
}

#loggedInDetailsTable td 
{
 padding:8px;
 text-align:right; 
}


/*
04 Misc
---------------------------------------------------------------------------------------------------- */

.clear
{
 clear: both; 
}


/* Hack to apply a clear after each first level child. Saves having to use a seperate div */
.clearfix:after {
  content: "";
  display: table;
  clear: both;
}

.divider
{
 height:2px;
}

#footer
{
  padding: 10px 10px;
  margin-top: 20px !important;
  border-top:1px solid #ccc;
}

#footer p
{
 font-size:11px;
 text-align:center;
 margin-bottom:10px; 
}

#footer a,
.content-section a,
.defaultLinkStyle
{
  text-decoration: underline; 
  color: #258bc2;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
}

#footer a:hover,
.content-section a:hover,
.defaultLinkStyle:hover
{
  color: #000;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
}

#regulatory-status
{
  font-size:11px;
}

.warning
{
  font-size:14px;
  color:Red; 
}

.success 
{
  font-size:14px;
  color:#258bc2;
}

/* Removes width from captcha element as on form pages (e.g. school signup) it was pushing the third column of fields down a level. Changing container width does not affect view of maps element */
.g-recaptcha div
{
 max-width:1px !important; 
}

.avenirHeavy 
{
  font-family: 'Avenir-Heavy', Arial, sans-serif;
}

.siteIcon 
{
 height:60px;
 cursor:pointer;
}

.claimFormTable tr td:first-child 
{
 max-width:230px; 
}

.accountMangementOptionHolder button 
{
 margin-bottom:10px; 
}

#ajaxLoad
{
  display:none;
  position:fixed;
  top:0px;
  right:0px;
  height:100%;
  width:100%;
  background-image:url('MLiProtectCombinedResources/imagesV3/loading2.gif');
  background-repeat:no-repeat;
  background-position:center;
  background-size: 100px;
  z-index:10000000;
}

/*
05 Slider
---------------------------------------------------------------------------------------------------- */

/* usual player with images */

.player-container {
    height: 28px;
    white-space: nowrap;
}

.player-pause, .player-play, .player-forward, .player-back {
    /* this displays element as inline-block; zoom and *display is a hack for ie7 which does not support inline-block */
    display: inline-block;
    zoom: 1;
    cursor: pointer;
    margin-left: 5px;
    height: 28px;
    width: 33px;
    background-image: url(scripts/sliderImg/player.png);
}

.player-pause {
    background-position: -199px 0;
    width: 28px;
}

.player-pause:hover {
    background-position: -161px 0;
}

.player-play {
    background-position: -356px 0;
    width: 28px;
}

.player-play:hover {
    background-position: -319px 0;
}

.player-back {
    background-position: -275px 0;
}

.player-back:hover {
    background-position: -234px 0;
}

.player-forward {
    background-position: -434px 0;
}

.player-forward:hover {
    background-position: -393px 0;
}     

/* usual control elements over slider */
.control-container-over {
    /* fixes it on the top in the 3d world (the effects area of a slider has 100 by default) */
    position: relative;
    top: -227px;
    left: 878px;
    z-index: 101;
    
    background-color: rgba(39, 140, 194,0.6);
    padding: 3px 5px;
    
    /* change width to your value */
    width: 100px;
}

.control-element-over, .control-element-active-over {
    /* this displays element as inline-block; zoom and *display is a hack for ie7 which does not support inline-block */
    display: inline-block;
    zoom: 1;
    display: inline;
    
    /* change this to the values you need */
    width: 10px;
    height: 10px;
    border-radius: 5px 5px 5px 5px;
    background: white;
    margin: 0 5px;
    cursor: pointer;
}

.control-element-active-over {
    background: #424242;
}     

/*
06 Page Content
---------------------------------------------------------------------------------------------------- */

.content-section
{
  padding: 0 0px;
  margin-top:15px;
}

.content-section h2
{
  /*padding-top:15px;*/
}

.content-section p
{
  margin-bottom: 10px;
  line-height:1.5em;
}

#leftCol 
{
 padding-left:3px; 
}

#leftCol, #midCol 
{
 width:44%;
 float:left;
}

#rightCol 
{
 width:12%;
 float:left;
}

#midCol, #rightCol 
{
 padding-left:15px; 
}

.content p
{
  margin-bottom:20px;
}

.content a 
{
  text-decoration:underline;
  color: #087af7;
}

#contentDownArrow 
{
  position: fixed;
  bottom:20px;
}

#ExtraInfoPane
{
  height: 45px;
  width: 100%;
  color: White;
  font-size: 17px;
  padding: 12px 10px 0 10px;
  cursor: pointer;
}

.moreInfoIframeHolder
{
  position:relative;
}

#morInfoIframe
{
  width:100%;
  position: absolute;
  bottom:0;
  display:none;
}

#leftColImages 
{
 display:none;
 position:fixed;
 top:0; 
}

/*
07 Forms
---------------------------------------------------------------------------------------------------- */

table.webFormTable
{
  width:100%;
}

table.webFormTable tr td 
{
 vertical-align: middle;
 padding-bottom: 20px;
}

input[type=text],
input[type=password],
input[type=date],
textarea,
select {
	border: 1px solid #b1b1b3;
  border-radius: 20px;
  padding: 5px 5px;
}


input,
textarea
{
  padding: 8px 15px;
  font-family: 'Avenir-Roman', Arial, sans-serif;
	font-size: 14px;
}

select
{
  height: 22px;
  background: #b1b1b3;
  padding: 0px 6px;
}

input[type=date]
{
  padding: 5px 11px;
}

#PasswordInput, #UsernameInput
{
  background-repeat: no-repeat;
  background-size: contain;
  background-position: -1px 0;
  padding: 5px 5px 5px 32px;
}

#PasswordInput
{
  background-image: url("MLiProtectCombinedResources/fieldBGpassword.png");
}

#UsernameInput
{
  background-image: url("MLiProtectCombinedResources/fieldBGusername.png");
}



.topBarLogin input 
{
  padding: 5px;
  width:175px;
}

/*
07.1 Form tables
---------------------------------------------------------------------------------------------------- */

table.inputForm
{
 float:left;
 margin-right:30px;
}

table.inputForm td
{
  padding:5px;
}

/*
07.2 Buttons
---------------------------------------------------------------------------------------------------- */

/*.btn-med:hover {
	background-position: 0 0px !important;
	background-color: transparent !important;
	border: 0 !important;
	color: #444 !important;
	text-decoration: none;
	text-shadow: 1px 1px 2px rgba(150, 150, 150, 1);
}

.btn-med {
	color: #FFF !important;
	padding: 0;
	border: 0;
	font-family: OpenSans, Arial, Helvetica, sans-serif;
	font-size:105%;
	height: 36px;
	cursor: pointer;
	text-decoration:none;
	font-weight:bold;
	text-shadow: 3px 3px 0px rgba(150, 150, 150, 1);

  width: 162px !important;
	background: url('imagesV3/button_long_and_hover.png') no-repeat !important;
	background-position: 0 -36px !important;
	text-shadow: 1px 1px 2px rgba(150, 150, 150, 1);
}*/

.btn-med-green:hover {
	background-position: 0 0px !important;
	background-color: transparent !important;
	border: 0 !important;
	text-decoration: none;
	text-shadow: 1px 1px 2px rgba(150, 150, 150, 1);
}

.btn-med-green
{
  background: url('MLiProtectCombinedResources/green_btn_finalV2.png') no-repeat !important;
  background-position: 0 -31px !important;
}

button, input[type="submit"]
{
  height: 29px;
	width:110px;
  background: #097bf7 !important;
  border:none;
  padding: 7px 18px;
  color:White;
  border-radius:20px;
  font-family: 'Avenir-Heavy', Arial, sans-serif;
  font-size:12px;
  cursor:pointer;
}

button:hover
{
 opacity:0.9; 
}

button:disabled,
input[type="submit"]:disabled {
	background-color: #444444 !important;
}

.btn-extra-small {
	width: 78px;
}

.btn-med
{
  width:115px !important;
  white-space: nowrap;
}

.default_med_button 
{
  width:175px !important;
  white-space: nowrap;
}

.default_lrg_button 
{
  width:200px !important;
  white-space: nowrap;
}

.default_xlrg_button 
{
  width:260px !important;
  white-space: nowrap;
}

#genieButton
{
  position: relative;
  overflow: hidden;
  background-repeat: no-repeat;
  background-size: contain;
  height:70px;
  width:70px;
  display: inline-block;
  cursor:pointer;
  background-image: url("MLiProtectCombinedResources/GenieButton.png"); 
}

.PDFbutton, .PDFbuttonNoMargin
{
  background-image: url("MLiProtectCombinedResources/PDFbutton.png");
  background-repeat: no-repeat;
  background-size: 100% 100%;
  display: inline-block;
  text-align: center;
  color:White !important;
  text-decoration:none;
  padding: 0.5vh 0;
  width: 45%;
  text-decoration:none !important;
  max-width: 235px;
}

.PDFbutton 
{
  margin-bottom:2vh;
}

.PDFbuttonNoMargin 
{
  margin-bottom:0vh;
}

/*
08 Mobile Optimisations
---------------------------------------------------------------------------------------------------- */

/*
08.1 Over 1000px
---------------------------------------------------------------------------------------------------- */

/* Reset when screen size stretches to alrger than mobile */
	@media screen and (min-width: 1000px) 
	{
	  .hide-when-not-mobile
	  {
	   display:none !important; 
	  }
	}

/*
08.2 Under 1000px
---------------------------------------------------------------------------------------------------- */

/* Update layout if screen shrinks to mobile size */
@media screen and (max-width: 999px) 
{
  
  html
  {
   overflow-x:hidden; 
  }
  
  .hide-on-mobile, #contentDownArrow, .leftColImages
  {
   display:none !important; 
  }
  
  h1
  {
   margin-top:0 !important;
   text-indent:0 !important; 
  }
  
  h2 
  {
    margin-top: 15px; 
  }
  
  #leftCol, #midCol, #rightCol
  {
    float: none;
    width: 100% !important;
    padding: 0 5px;
  }
  
  h1 
  {
    padding-left:0 !important; 
  }

  .registerButton {
    width: 100%!important;
    margin-left:0px!important;
  }


  /*
  08.1.1 Forms (NOTE: @media screen and (max-width: 999px) above is still open at this point)
  ---------------------------------------------------------------------------------------------------- */

  
  table.inputForm
  {
   margin:0;
   float:none;
   width:100%; 
   margin-bottom:10px;
  }
  
  td.inputFormLabel
  {
    display:none;
  }
  
  td.overideHideOnMobile
  {
    display:block !important;
  }
  
  .webFormTable td 
  {
   width:100%; 
  }
  
  input,
  textarea,
  select 
  {
    width:100% !important;
  }
  
  div#selectSchoolPageLeftBox 
  {
    border-right:none !important;
    border-bottom:1px solid #ccc;
    max-width:none !important;
    width:100%;
    padding-bottom:30px !important;
    float:none !important;
  }
  
  div#selectSchoolPageRightBox 
  {
    text-align:left !important;
    float:none !important;
    border:none !important;
    max-width:none !important;
    width:100%;
    margin-top:30px !important;
  }
  
}


/*
9 Portal Sections
---------------------------------------------------------------------------------------------------- */

#portalHeaderTable 
{
 margin-bottom:15px;
 width:100%;
}

#portalHeaderTable td 
{
 width:33%;
 vertical-align:bottom;
 text-align: right;
 padding-right: 30px;
}

#portalHeaderTable td:first-child 
{
  text-align:left;
}

#portalHeaderTable td img 
{
 max-width: 100%;
 max-height:130px;
}

.portalSection
{
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  margin-bottom:20px;
}

.portalSectionSelected 
{

}

.portalSectionBTN
{
  width:100%;
  font-size: 21px;
  color: white;
  padding: 6px 10px 6px 24px; 
}

.portalSectionBTN:hover
{
 cursor:pointer;
 color:#258bc2;
}

.portalSectionBTN p
{
  margin:0;
}

.portalSectionContent
{
  padding: 10px;
  background-image: url("MLiProtectCombinedResources/BubbleBackground_Resized.jpg");
	background-size: 1050px auto;

  border-bottom-left-radius: 9px;
  border-bottom-right-radius: 9px;
  
  -webkit-border-bottom-left-radius: 9px;
  -webkit-border-bottom-right-radius: 9px;
  
  -moz-border-bottom-left-radius: 9px;
  -moz-border-bottom-right-radius: 9px;
}

.portalSection_ExpandIcon
{
 display:inline-block;
 width:30px; 
}

.inidividualOfferDisplay:hover
{
  -webkit-box-shadow: 0px 0px 5px 2px rgba(37,139,194,1);
  -moz-box-shadow: 0px 0px 5px 2px rgba(37,139,194,1);
  box-shadow: 0px 0px 5px 2px rgba(37,139,194,1);
  -webkit-transition: all 0.2s ease;
  -moz-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
  transition: all 0.2s ease;
  cursor:pointer;
}


.portalSectionNotComplete, .portalSectionComplete 
{
  height:30px;
  width:30px;
  padding: 2px;
  background-size: 25px 25px;
  background-repeat: no-repeat;
  background-position: center;
}

.portalSectionNotComplete
{
  color:transparent;
  background-image: url("MLiProtectCombinedResources/PortalCross.png");
}

.portalSectionComplete
{
  color:transparent;
  background-image: url("MLiProtectCombinedResources/PortalTick.png");
}

@keyframes slidy {
0% { left: 0%; }
30% { left: -0%; }
33% { left: -100%; }
60% { left: -100%; }
63% { left: -200%; }
98% { left: -200%; }
100% { left: -300%; }
}

@-webkit-keyframes slidy {
0% { left: 0%; }
30% { left: -0%; }
33% { left: -100%; }
60% { left: -100%; }
63% { left: -200%; }
98% { left: -200%; }
100% { left: -300%; }
}

div#slider 
{
  height:278px;
  overflow: hidden;
}


div#slider figure img { width: 20%; float: left; }
div#slider figure { 
  position: relative;
  width: 500%;
  margin: 0;
  left: 0;
  text-align: left;
  font-size: 0;
  animation: 20s slidy infinite; 
  -webkit-animation: 20s slidy infinite;
}

/*
10 Tables
---------------------------------------------------------------------------------------------------- */

.tableAlignLeft th,
.tableAlignLeft td 
{
  text-align:left;
}

.tableAlignCenter th,
.tableAlignCenter td 
{
  text-align:center;
}

.tableAlignRight th,
.tableAlignRight td 
{
  text-align:right;
}

.tableValignTop th,
.tableValignTop td 
{
  vertical-align:top;
}

.tableValignMiddle th,
.tableValignMiddle td 
{
  vertical-align:middle;
}

.tableValignBottom th,
.tableValignBottom td 
{
  vertical-align:bottom;
}


table.tableStyle1
{
  border-collapse: collapse;
}


.tableStyle1 th,
.tableStyle1 td 
{
  padding:10px;
}

/*
11 jQueryUI Overwrites
---------------------------------------------------------------------------------------------------- */

.accordionSection, .accordionSection2
{
  font-family: 'Avenir-Roman', Arial, sans-serif !important;
}

div.accordionSection > h3, div.accordionSection2 > h3 {
    color:#FFF !important;
    font-family: 'Avenir-Roman', Arial, sans-serif !important;
    font-size:14px;
}

.ui-accordion .ui-accordion-header
{
  padding: .7em .5em .5em 1.9em !important;
}

.ui-widget-content 
{
  background-image: url("MLiProtectCombinedResources/BubbleBackground_Resized.jpg") !important;
  background-size: cover !important;
  
  border:none !important;
  border-bottom-left-radius: 9px !important;
  border-bottom-right-radius: 9px !important;
  
  -webkit-border-bottom-left-radius: 9px !important;
  -webkit-border-bottom-right-radius: 9px !important;
  
  -moz-border-bottom-left-radius: 9px !important;
  -moz-border-bottom-right-radius: 9px !important;
}

.ui-widget button 
{
  font-family: 'Avenir-Roman', Arial, sans-serif !important;
  font-size: 12px !important;
}

.ui-helper-reset 
{
  font-size: 14px !important;
}

/*
12 Splash Screen
---------------------------------------------------------------------------------------------------- */

.splashScreenContainer
{
  background:#b5b5b5;
  min-height:100%;
}

.splashScreenHolder
{
  width:100%;
  text-align:center;
}

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

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

.splashSreenTable
{
 margin: 0 auto;
 border-collapse: collapse;
 background:#fcfcfc;
}

table.splashSreenTable td
{
  vertical-align:top;
}

.splashScreenInputForm ::-webkit-input-placeholder
  {
    color:#9c9c9c;
  }
  
.splashScreenInputForm :-moz-placeholder
  { /* Firefox 18- */
     color:#9c9c9c;
  }

.splashScreenInputForm ::-moz-placeholder
  {  /* Firefox 19+ */
     color:#9c9c9c; 
  }

.splashScreenInputForm :-ms-input-placeholder
  {  
     color:#9c9c9c;
  }
  
  table.splashScreenInputForm
  {
   margin-bottom:10px;
  }
  
  .splashScreenInputForm td 
  {
    text-align:left;
  }
  
  .splashScreenInputForm td.inputFormLabel
  {
    display:none;
  }
  
  
  
/*
12.1 Splash Screen Mobile Optimisations
---------------------------------------------------------------------------------------------------- */

/* Update layout if screen shrinks to mobile size */
@media screen and (max-width: 999px) 
{
  .splashScreenInputForm td input
  {
   margin-left:0; 
  }
  
  #splashLeftImage
  {
   display:none; 
  }
}


/*
13 Claims tracking table / edit user section / policy doc section
---------------------------------------------------------------------------------------------------- */

.claimTrackingSection, .editUserSection, .policyDocDisplaySection
{
  display:none;
  border: 1px solid;
  border-radius: 12px;
  background: white;
  padding: 10px;
  z-index: 9999;
  position: absolute;
}

.policyDocDisplaySection 
{
 margin-left:10px; 
}

.claimTrackingSection p
{
  text-align:left;
}

.claimTackTable td
{
  text-align:left;
  padding:2px 5px;
}

.editUserSection 
{
 display:none;
}

/* 14 Asset Register
---------------------------------------------------------------------------------------------------- */

#assetRegSearchHolder
{
  display:none; 
}

#assetRegResultsHeader 
{
  color:White;
  padding:8px;
  font-size:15px;
  border-radius:5px;
  border:1px solid #d3d3d3; 
}

#assetRegSearchResults 
{
  background-image: url(MLiProtectCombinedResources/BubbleBackground_Resized.jpg) !important;
  background-size: cover !important;
  border: none !important;
  border-bottom-left-radius: 9px !important;
  border-bottom-right-radius: 9px !important;
  -webkit-border-bottom-left-radius: 9px !important;
  -webkit-border-bottom-right-radius: 9px !important;
  padding: 5px;
}

/* 15 Claim form
---------------------------------------------------------------------------------------------------- */

.claimFormIframe 
{
  width:100%;
  height:100%;
}

.claimIframeFrame
{
  /*height: 45vh;*/
  height:3000px;
}



/* Form Styles, remove TD's */
table.webFormTable, table.webFormTableV2, table.splashScreenInputForm {
	width: 100%;
}

	table.webFormTable tr td, table.splashScreenInputForm tr, td {
		vertical-align: middle;
		padding: 15px,30px;
	}

		table.webFormTable tr td:nth-child(2), table.webFormTable tr td:nth-child(2) *, table.splashScreenInputForm tr td:nth-child(2) {
			width: 65%;
		}

	table.webFormTableV2 tr td:nth-child(2) {
		padding-bottom: 20px !important;
	}

	table.splashScreenInputForm tr td:nth-child(2) {
		padding-bottom: 5px !important;
	}

		table.webFormTableV2 tr td:nth-child(2), table.splashScreenInputForm tr td:nth-child(2) {
			width: 100%;
		}

  /* Protects nested tables from the rule above */
		table.webFormTableV2 tr td table tr td:nth-child(2), table.splashScreenInputForm tr td:nth-child(2) {
			width: auto;
		}

		table.webFormTableV2 tr td:nth-child(1), table.splashScreenInputForm tr td:nth-child(1) {
			display: none;
		}

  /* Protects nested tables from the rule above */
		table.webFormTableV2 tr td table tr td:nth-child(1), table.splashScreenInputForm tr td table tr td:nth-child(1) {
			display: block;
		}



	table.webFormTableV2 input[type=text],
	table.webFormTableV2 input[type=password],
	table.webFormTableV2 input[type=date],
	table.webFormTableV2 input[type=submit],
	table.webFormTableV2 select,
	table.webFormTableV2 button,
	table.webFormTableV2 textarea,
	table.splashScreenInputForm input[type=text],
	table.splashScreenInputForm input[type=password],
	table.splashScreenInputForm input[type=date],
	table.splashScreenInputForm input[type=submit],
	table.splashScreenInputForm select,
	table.splashScreenInputForm button,
	table.splashScreenInputForm textarea {
		border: 1px solid #b1b1b3;
		border-radius: 8px;
		padding: 5px 10px;
		height: 45px;
		font-size: 1.1rem;
		width: 100% !important;
	}

    table.webFormTableV2 textarea {
    height: 130px;
    }

    table.webFormTableV2 select {
      background-color: #ffffff;
    }
  table.webFormTableV2 textarea,
  -webkit-input-placeholder,
  -ms-input-placeholder,
  -moz-placeholder {
    color: #888;
  }


.registerButton
{
  float: left;
  margin-left: 10px;
  margin-top: 5px;
  width: 31%;
  height: 45px;
}
  .registerButton button {
  height:45px;
  width:100%;
  border-radius:8px;
  }

/*
16 Book a Repair
---------------------------------------------------------------------------------------------------- */

#bookARepairHolder {
	height: 1500px;
}

.bookARepairIframe {
	width: 100%;
	height: 100%;
}

/*
  28 Estate Inventory Manager
---------------------------------------------------------------------------------------------------- */

.inventorySearchOptions {
	display: none;
	position: fixed;
	z-index: 9999;
	background: #fff;
	border: 2px solid;
	border-radius: 5px;
	list-style-type: none;
	margin: 0 !important;
	padding: 10px !important;
	overflow: hidden;
}

	.inventorySearchOptions li {
		float: left;
		margin-right: 20px;
	}

#inventorySearchContainer {
	max-height: 400px;
	background: white;
	border: 2px solid;
	border-radius: 10px;
	width: 100%;
	overflow-x: hidden;
	overflow-y: auto;
	display: none;
}

#estateInventoryContentContainer input[type=text],
#estateInventoryContentContainer input[type=password],
#estateInventoryContentContainer input[type=date],
#estateInventoryContentContainer input[type=submit],
#estateInventoryContentContainer select,
#estateInventoryContentContainer button,
#estateInventoryContentContainer textarea {
	border: 1px solid #b1b1b3;
	border-radius: 8px;
	padding: 5px 10px;
	height: 45px;
	width: 100% !important;
}

#estateInventoryContentContainer td {
	padding:15px;
}

#inventorySearchContainer::-webkit-scrollbar {
	margin-right: 5px;
}

	#inventorySearchContainer::-webkit-scrollbar-track {
		background: #f1f1f1;
		border-radius: 10px;
	}

	#inventorySearchContainer::-webkit-scrollbar-thumb {
		background-color: darkgrey;
		border-radius: 10px;
	}
	estateInventoryContentContainer
#inventorySearchTable, .accountSectionTable {
	border-spacing: 0;
	width: 100%;
}

.accountSectionTable {
	border: 2px solid #000;
	border-radius: 10px;
}

	#inventorySearchTable thead tr,
	.accountSectionTable thead tr {
		background-color: #d4d4d4;
	}

	#inventorySearchTable th,
	.accountSectionTable th {
		cursor: pointer;
		text-align: left;
	}

	#inventorySearchTable tbody tr:hover,
	.accountSectionTable tbody tr:hover,
	.inventorySearchRowSelected {
		background-color: #FCCB6F !important;
		cursor: pointer;
	}

.inventorySearchRowSelected {
	border-top: 2px solid #000;
	border-bottom: 2px solid #000;
}

#inventorySearchTable tr:nth-child(even),
.accountSectionTable tr:nth-child(even) {
	background-color: #f2f2f2;
}

.sortArrow {
	float: right;
}

#bookARepairHolder {
	height: 1500px;
}

.bookARepairIframe {
	width: 100%;
	height: 100%;
}

.highlightElement, .highlightElementWarning {
	font-weight: bold;
	border: 1px solid;
	padding: 5px;
	border-radius: 10px;
	-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
	box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
}

.highlightElementWarning {
	color: Red;
}

.closeBTN {
	font-weight: bold;
	float: right;
	cursor: pointer;
}

.closeBTNx {
	font-weight: bold;
	float: right;
	cursor: pointer;
	font-size: 1.1rem !important;
	margin-left: 10px;
}

	.closeBTNx:hover {
		text-decoration: underline;
	}
/*
  Searchbox in header
  */
/*.searchBox {
  margin-left: 6%;
  margin-top: 13px;
  background-color: transparent;
  border: none;
  border-radius: 3px;
  box-shadow: none;
  background-image: url(images/magnifyingGlass.svg);
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-size: 30px 30px;
  width: 39px;
  transition: all 1s ease;
}

  .searchBox:focus {
  outline:none;
    border: 1px solid #ddd!important;
    border-radius: 3px;
    box-shadow: 0 0 5px #ddd inset!important;
    background-image: none;
    width: 200px;
  }

.searchBox:active {
  background: #2b2171; /* Old browsers */
/* background: -moz-linear-gradient(left, #2b2171 0%, #0f7087 50%, #00b189 100%); /* FF3.6-15 */
/* background: -webkit-linear-gradient(left, #2b2171 0%,#0f7087 50%,#00b189 100%); /* Chrome10-25,Safari5.1-6 */
/* background: linear-gradient(to right, #2b2171 0%,#0f7087 50%,#00b189 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
/* filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2b2171', endColorstr='#00b189',GradientType=1 ); /* IE6-9 */
/*}

/*
New search CSS
*/
.search {
	top: 6px;
	height: 48px;
	background: none;
	position: absolute;
	width: 217px;
	margin: 0% 0% 0.5% 25%;
	border-radius: 8px;
	background-position: 0% 50%;
	background-repeat: no-repeat;
	box-shadow: 0 4px 16px -1px rgba(18, 22, 33, 0.3);
	-webkit-transition: background 0.1s ease, padding 0.5s ease 0.1s, -webkit-transform 0.1s ease;
	transition: background 0.1s ease, padding 0.5s ease 0.1s, -webkit-transform 0.1s ease;
	transition: background 0.1s ease, transform 0.1s ease, padding 0.5s ease 0.1s;
	transition: background 0.1s ease, transform 0.1s ease, padding 0.5s ease 0.1s, -webkit-transform 0.1s ease;
}


	.search .bar {
		position: absolute;
		left: 16px;
		top: 0px;
		width: 100%;
		height: 48px;
		overflow: hidden;
	}

		.search .bar span {
			display: block;
			color: #fff;
			position: absolute;
			left: 12px;
			top: 0;
			line-height: 32px;
			font-weight: 500;
			font-size: 16px;
			opacity: 0;
			right: 16px;
			overflow: hidden;
			white-space: nowrap;
		}

		.search .bar:before {
			content: "";
			position: absolute;
			display: block;
			left: 0;
			top: 0;
			bottom: 0;
			right: 16px;
			border-radius: 16px;
			background: -webkit-linear-gradient(left, #2b2171 0%, #0f7087 50%, #00b189 100%);
			opacity: 0;
		}





	.search form {
		display: block;
		padding: 0;
		margin: -2px;
		margin-left: 17px;
	}

		.search form input,
		.search form span {
			white-space: pre;
			font-size: 16px;
			font-family: inherit;
			padding: 8px 16px 8px 12px;
			display: block;
			line-height: 22px;
			font-weight: 500;
		}

		.search form input {
			color: #00b189;
			caret-color: #00b189;
			border: 0;
			background: 0;
			outline: none;
			-webkit-transition: color 0.1s ease;
			transition: color 0.1s ease;
			box-shadow: none;
			margin: 0px 0px 0px 23px;
			width: 197px;
			padding: 26px;
			padding-left: 0px;
		}

		.search form span {
			display: none;
		}

	.search .close {
		border-radius: 50%;
		position: absolute;
		right: 16px;
		width: 24px;
		height: 24px;
		background: #fff;
		top: 19px;
		cursor: pointer;
		opacity: 0;
		visibility: hidden;
		-webkit-transform: translate(-8px, 0);
		transform: translate(-8px, 0);
		-webkit-transition: opacity 0.3s ease 0s, visibility 0.3s ease 0s, -webkit-transform 0.3s ease 0s;
		transition: opacity 0.3s ease 0s, visibility 0.3s ease 0s, -webkit-transform 0.3s ease 0s;
		transition: transform 0.3s ease 0s, opacity 0.3s ease 0s, visibility 0.3s ease 0s;
		transition: transform 0.3s ease 0s, opacity 0.3s ease 0s, visibility 0.3s ease 0s, -webkit-transform 0.3s ease 0s;
	}

		.search .close:before, .search .close:after {
			content: "";
			position: absolute;
			width: 2px;
			border-radius: 1px;
			height: 10px;
			background: #fff;
			display: block;
			left: 50%;
			top: 50%;
			-webkit-transition: background 0.3s ease;
			transition: background 0.3s ease;
		}

		.search .close:before {
			-webkit-transform: translate(-50%, -50%) rotate(45deg);
			transform: translate(-50%, -50%) rotate(45deg);
		}

		.search .close:after {
			-webkit-transform: translate(-50%, -50%) rotate(-45deg);
			transform: translate(-50%, -50%) rotate(-45deg);
		}

	.search ul {
		overflow: hidden;
		margin: 0;
		padding: 8px 0 24px 0;
		list-style: none;
		position: absolute;
		left: 16px;
		top: 62px;
		white-space: nowrap;
	}

		.search ul.show li {
			opacity: 1;
			visibility: visible;
			-webkit-transform: translate(0, 0);
			transform: translate(0, 0);
		}

			.search ul.show li:nth-child(1) {
				-webkit-transition-delay: 0s;
				transition-delay: 0s;
			}

			.search ul.show li:nth-child(2) {
				-webkit-transition-delay: 0.3s;
				transition-delay: 0.3s;
			}

		.search ul li {
			margin: 0 0 20px 0;
			opacity: 0;
			visibility: hidden;
			-webkit-transition: all 0.3s ease;
			transition: all 0.3s ease;
			-webkit-transform: translate(0, -6px);
			transform: translate(0, -6px);
		}

			.search ul li:last-child {
				margin-bottom: 0;
			}

			.search ul li a {
				display: block;
				font-size: 12px;
				text-decoration: none;
				padding-left: 36px;
				padding-right: 24px;
				position: relative;
			}

				.search ul li a img {
					display: block;
					left: 0;
					width: 20px;
					top: 50%;
					position: absolute;
					-webkit-transform: translate(0, -50%);
					transform: translate(0, -50%);
				}

					.search ul li a img.queble {
						width: 24px;
					}

				.search ul li a h5 {
					margin: 0;
					color: #151924;
					font-size: 12px;
				}

				.search ul li a p {
					margin: 4px 0;
					color: #6c7486;
				}

				.search ul li a span {
					display: block;
					font-size: 10px;
					color: #6c7486;
					opacity: 0.6;
					font-style: italic;
				}

			.search ul li:nth-child(1) {
				-webkit-transition-delay: 0.3s;
				transition-delay: 0.3s;
			}

			.search ul li:nth-child(2) {
				-webkit-transition-delay: 0s;
				transition-delay: 0s;
			}

			.search ul li:hover {
				-webkit-transition: -webkit-transform 0.3s ease 0s;
				transition: -webkit-transform 0.3s ease 0s;
				transition: transform 0.3s ease 0s;
				transition: transform 0.3s ease 0s, -webkit-transform 0.3s ease 0s;
				-webkit-transform: translate(0, -2px);
				transform: translate(0, -2px);
			}

	.search.submit {
		background: -webkit-linear-gradient(left, #2b2171 0%, #0f7087 50%, #00b189 100%);
		-webkit-transform: scale(0.92);
		transform: scale(0.92);
	}



		.search.submit form input {
			color: #fff;
		}

	.search.prepare .bar:before {
		opacity: 1;
		-webkit-transition: opacity 0s ease 1.25s;
		transition: opacity 0s ease 1.25s;
	}



	.search.animate .bar span {
		opacity: 1;
	}

	.search.done {
		padding-right: 56px;
		-webkit-transition: padding 0.4s ease;
		transition: padding 0.4s ease;
		background: #fff;
		z-index: 4;
	}

		.search.done .close {
			opacity: 1;
			background: -webkit-linear-gradient(left, #2b2171 0%,#0f7087 50%,#00b189 100%);
			visibility: visible;
			-webkit-transform: translate(0, 0);
			transform: translate(0, 0);
			-webkit-transition: opacity 0.4s ease 0.5s, visibility 0.4s ease 0.5s, -webkit-transform 0.4s ease 0.5s;
			transition: opacity 0.4s ease 0.5s, visibility 0.4s ease 0.5s, -webkit-transform 0.4s ease 0.5s;
			transition: transform 0.4s ease 0.5s, opacity 0.4s ease 0.5s, visibility 0.4s ease 0.5s;
			transition: transform 0.4s ease 0.5s, opacity 0.4s ease 0.5s, visibility 0.4s ease 0.5s, -webkit-transform 0.4s ease 0.5s;
		}

			.search.done .close:hover {
				background: #00b189;
				-webkit-transition: background 0.3s ease;
				transition: background 0.3s ease;
			}

				.search.done .close:hover:before, .search.done .close:hover:after {
					background: #fff;
				}

	.search.reset .bar:before {
		opacity: 0;
		-webkit-transition: opacity 0s ease 0.4s;
		transition: opacity 0s ease 0.4s;
	}

.searchResults {
	font-size: 12px;
	top: 51px;
	left: 353px;
	max-height: 500px;
	overflow: scroll;
	max-width: 71vw;
	background: white;
	position: absolute;
	padding: 10px;
	z-index: 1;
	display: none;
}

#searchInput {
	width: 37%;
	max-width: 202px;
	z-index: 2;
	margin: 10px;
}


.contentCreator {
	width: 100%;
}

.templatesRight {
	width: 50%;
	right: 0%;
	top: 172px;
	position: fixed;
}