*{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;}

/* base / reset styles */
:root {
    accentColor: red;
}


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,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline;}

.vertical-top {
    vertical-align: top !important;
}

.vertical-middle {
    vertical-align: middle !important;
}

.vertical-bottom {
    vertical-align: bottom !important;
}

.vertical-baseline {
    vertical-align: baseline !important;
}

/* HTML5 display-role reset for older browsers */

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {display: block;}
body {line-height: 1;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before,
blockquote:after,
q:before,
q:after {content: ''; content: none;}
table {border-collapse: collapse; border-spacing: 0;}
a {text-decoration: none; color: #1b1918;}
.yellow-aa {border-bottom: 2px solid #fc0; font-weight: 700; padding-bottom: 3px; font-size: 16px;}
a.underlined {text-decoration: underline;}
a.whiteC {color: #fff; background: transparent;}
a:hover {text-decoration: underline;}
.clear {clear: both;}
.fRight {float: right;}
.fLeft {float: left;}
.nowrap {white-space: nowrap;}
.bold {font-weight: bold;}
.center {text-align: center;}
.autoCenter {margin: 0 auto;}
.default-hide,
.dNone {display: none;}
.relative {position: relative;}
b {font-weight: bold;}
a, object, input, :active, :focus {outline:none;}
input[type='submit']::-moz-focus-inner,
input[type='button']::-moz-focus-inner,
button[type='submit']::-moz-focus-inner,
button[type='button']::-moz-focus-inner {border:0;}

/* cake */
pre, code {clear:both; font-family:monospace,serif; font-size:1em;}
.cake-debug-output, pre {padding:0 20px; margin:0; white-space:pre; white-space:pre-wrap; background-color:#ffe68d;}
pre {padding:20px; border-bottom:1px solid #3e330d; position:relative; z-index:5;}
pre.transparent {background: transparent; border: none;}
.logTable td {padding:5px 10px; background-color:#ffe68d;}
.logTable td.i {background:none; font-weight:bold;}
.logTable td.i.plus {padding-right:25px; font:15px Lato,Arial,sans-serif; border-left:4px solid #e24e34;}

/* cake log */
.cake-sql-log{width:100%;background-color:#fff;color:#666;}
.cake-sql-log caption{background-color:#f1f5fa;border:1px solid #a6a8ad;padding:6px;}
.cake-sql-log td,.cake-sql-log th{border-bottom:1px solid #c1c1c1;padding:6px;font-weight:normal;}
.cake-sql-log th{background-color:#eee;}
.cake-sql-log tr:hover{background-color:#ebf2fa;}

/**
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *  contenteditable attribute is included anywhere else in the document.
 *  Otherwise it causes space to appear at the top and bottom of elements
 *  that are clearfixed.
 * 2. The use of `table` rather than `block` is only necessary if using
 *  `:before` to contain the top-margins of child elements.
 */
.cf:before, .cf:after {content: ' ';/* 1 */ display: table; /* 2 */;}
.cf:after {clear: both;}

/**
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */
.cf {*zoom: 1;}

/* content styles */

body {min-width: 320px; background: #dadada url('../img/system-background.jpg') 50% 72px no-repeat; color: #000000; font-size: 14px; font-family: 'Lato', 'Arial', 'Helvetica', 'open-sans'; text-align: left;}

.userArea .userAreaWide,
.mobileNavi,
.container,
.topBarContent {width: 1146px; padding: 0px 27px; margin: 0 auto;}

.halfSize {width: 515px;}
.leftHalfSize {float: left; margin-right: 62px;}
.rightHalfSize {float: left;}
.container.halfSize {padding-left: 0; padding-right: 0;}

ul.topMenu li a:before,
.button.add span:before,
button.add:before,
.button.search span:before,
button.search:before,
.button.save span:before,
a.button.save:before,
button.save:before,
.button.checked span:before,
a.button.checked:before,
button.checked:before,
.button.delete span:before,
a.button.delete:before,
button.delete:before,
.tableThead .tableTd,
.tableThead .tableTd .order.desc:after,
.tableThead .tableTd .order.asc:after,
.mobileSortLinks .tableTd .order.desc a:before,
.mobileSortLinks .tableTd .order.asc a:before,
.pager span.next a:after,
.pager span.prev a:before,
.tableTr .tableTd.yes span:before,
.tableTr .tableTd.no span:before,
.closeNotesMessage,
.rating span,
.dropdown .carat:before,
.form h2:before,
.ui-widget-header .ui-datepicker-prev .ui-icon,
.ui-widget-header .ui-datepicker-next .ui-icon,
.datetime .calenderIcon,
.button.callback:before,
.button.timeline:before,
.loginForm .email:after,
.loginForm .password:after,
#notesList .noteRow:before,
#filesList .noteRow:before,
#uploadedFilesList .noteRow:before,
.filesUploadContainer .noteRow:before,
.error-message:before,
.prettyCheckbox.checked .check,
.header.steps .step:after,
.header.steps a.step span:before,
.header.steps a.laststep span:before,
.header.steps h1.step span:before,
.header.steps h1.laststep span:before,
.header.steps .h1duplicate span:before,
.singleProduct .productName,
.singleProduct .productName:before,
.singleProduct .description:before,
.tableTr .tableTd.firstTd:before,
.singleProduct .periods label.selected:before,
ul.topMenu li.showSubmenu:after,
ul.topMenu li .submenu a span:before,
.searchForm .additionalSearchButton:before,
.topBarContent .phone:before,
.policyTimeline:before,
.singleProduct .motservice .motserviceLabel,
.singleProduct .motservice .motserviceLabel:before,
.singleProduct .motservice .motserviceLabel:after,
.toggleButton,
.singleProduct .periods .periodsLabel,
.singleProduct .periods .periodsLabel:before,
.singleProduct .periods .periodsLabel:after,
.reveal-modal.mot-service-popup h3:after,
.singleProduct .addOns .addonsStaticExtension:before,
.fileDownload:before,
.time span:before {background: url('../img/system-sprite.png?d=20150804') 0 0 no-repeat;}

/* .header {background: url('../img/header-bg.png?d=20140630') 0 0 repeat-x;} */

.mobileNaviButton {background: url('../img/mobile-icons.png?d=20140630') 0 0 no-repeat;}

/*.content .scrollLeft,
.content .scrollRight {background: url('../img/scroll-table.png?d=20140710') 0 0 repeat-y;}*/

/*.dropdown,
.dropdown div,
.dropdown li,
.dropdown div::after {-webkit-transition: all 150ms ease-in-out; -moz-transition: all 150ms ease-in-out; -ms-transition: all 150ms ease-in-out; transition: all 150ms ease-in-out;}*/

.dropdown .selected::after,
.dropdown.scrollable div::after {-webkit-pointer-events: none; -moz-pointer-events: none; -ms-pointer-events: none; pointer-events: none;}
.dropdown {position: relative; width: 250px; border: 2px solid #9a9c9a; cursor: pointer; background: #fff; -webkit-user-select: none; -moz-user-select: none; user-select: none; font-size: 16px;}
.dropdown.open {z-index: 10000;}
.dropdown .carat {position: absolute; top: 0; right: 0; width: 32px; height: 100%;}
.dropdown .carat:before {content: ''; position: absolute; right: 10px; top: 12px; width: 11px; height: 6px; background-position: -47px -170px; filter: brightness(0);}
.dropdown.open .carat:before {background-position: -47px -162px; top: 11px;}
.dropdown.disabled .carat {border-top-color: #999;}
.dropdown .old {position: absolute; left: 0; top: 0; height: 0; width: 0; overflow: hidden;}
.dropdown select {position: absolute; left: 0px; top: 0px;}
.dropdown.touch .old {width: 100%; height: 100%;}
.dropdown.touch select {width: 100%; height: 100%; opacity: 0;}
.dropdown .selected,
.dropdown li {display: block; line-height: 1.5; color: #000; padding: 6px 7px 7px; overflow: hidden;}
.dropdown .selected {white-space: nowrap;}
.dropdown.disabled .selected {color: #999;}
.dropdown .selected::after {content: ''; position: absolute; right: 0; top: 0; bottom: 0; /*width: 60px; box-shadow: inset -60px 0 15px -15px #fff;*/ width: 31px; background-color: #fff;}
.dropdown div, .tt-dataset-postcode-lookup {position: absolute; height: 0; left: -1px; right: -1px; top: 100%; margin-top: 1px; background: #fff; border: 1px solid #ccc; border-top: 1px solid #eee; border-radius: 0 0 3px 3px; overflow: hidden; opacity: 0;}
.tt-dropdown-menu {width: 100%; height: 0;}
.tt-dataset-postcode-lookup {left: 0; right: 0; margin-top: 0; height: 300px; width: 100%; opacity: 1; box-shadow: 0 0 5px #999; overflow-y: auto;}
.dropdown.open div {opacity: 1; z-index: 10000;}
.dropdown.scrollable div::after {content: ''; display: none;}
.dropdown.scrollable.bottom div::after {opacity: 0;}
.dropdown ul {position: absolute; left: 0; top: 0; height: 100%; width: 100%; list-style: none; overflow: hidden;}
.dropdown.scrollable.open ul {overflow-y: auto;}
.dropdown li, .tt-suggestion {list-style: none; padding: 5px 7px 7px;}
.dropdown li.active,
.dropdown li.focus, .tt-suggestion:hover {background-color: #fc0; transition: background-color .15s; font-weight: bold;}
.dropdown li.focus, .tt-suggestion:hover {text-decoration: none; cursor: pointer;}
/*.dropdown li.focus::after {content: ''; position: absolute; right: 0; top: 0; bottom: 0; width: 30px; box-shadow: inset -30px 0 15px -15px #fff;}*/
.dropdown.focus div {box-shadow: 0 0 5px #999;}


.dropdown-large .dropdown {width: 330px;}
#PolicySearchIndexForm .header .dropdown div,
#PolicySearchRenewalsForm .header .dropdown div,
.form .select.long .dropdown div {width: 450px;}

#loadRangesModel .dropdown div,
#addCarQuote .dropdown div,
.form .select.long .dropdown div {width: 100%;}


.header .dropdown {margin-right: 10px;}

.orangeBorderLeft {border-left: 2px solid #ffb540;}
.greenBorderLeft {border-left: 2px solid #a6d04d;}
.redBorderLeft {border-left: 2px solid #ff6961;}
.blueBorderLeft {border-left: 2px solid #4db9ff;}

.container {padding-top: 50px; padding-bottom: 80px;}
.container .marginSeparator {margin-top: 50px;}

.loggedIn {padding-top: 27px;}

.customer-profile {font-size: 1rem; line-height: 1.5; display: flex; flex-direction: column; gap: 15px;}
.customer-profile .icon {width: 30px; padding-right: 10px; padding-top: 3px;}

.userArea {position: absolute; top: 0; left: 0; width: 100%; height: 27px; border-bottom: 2px solid #1b1918; background-color: #DADADA;}
.userArea ul {padding-top: 7px; float: right;}
.userArea ul li {float: left; color: #000000; font-size: 12px; padding: 0 20px 0 10px;}
.userArea ul li.userName {white-space: nowrap;}
.userArea ul li a {color: #1b1918; font-weight: bold;}
.userArea ul li span {color: #606060; padding-left: 5px;}

.userHomeFooter {border-top: 1px solid #D3D3D3; padding: 20px 0 0 0; margin-top: 20px;}

.topBar {background-color: #f1f1f1; color: #000000; border-bottom: 2px solid #dadada;}
.topBarContent {height: 89px; position: relative;}

.logo {z-index: 2;}
.logo,
.logo img {height: 90%; margin-top: 0.3em;}

.topBarContent .phone { display: none; height: 20px; position: absolute; left: 122px; top: 60px; font-size: 14px; padding-left: 20px; z-index: 2;}
.topBarContent .phone:before {content: ''; position: absolute; left: 0; top: 0; width: 16px; height: 18px; background-position: -111px -204px;}
.topBarContent .phone a {color: #000; text-decoration: none;}

.topBarContent.onlyLogo {width: 220px; margin: 0 auto;}
.topBarContent.onlyLogo .logo {left: 0;}
.topBarContent.onlyLogo .phone {left: 117px;}

.mobileNavi {margin-top: 5px;}
ul.topMenu {display: table;}
ul.topMenu li {font-size: 14px; position: relative; display: table-cell; width: 1%; white-space: nowrap; font-weight: 400;}
ul.topMenu li a {display: block; position: relative; height: 89px; padding: 15px 3px 0; color: #1b1918; text-align: center;}
ul.topMenu li span.amount {display: block; position: absolute; top: 5px; right: 10px; margin-left: 3px; padding: 1px 4px 2px; line-height: 11px; font-size: 11px; color: #fff; background-color: #1b1918; -webkit-border-radius: 13px; -moz-border-radius: 13px; border-radius: 13px;}

ul.topMenu li a:before {content: ''; width: 50px; height: 40px; display: block; margin: 0 auto 5px; background-position: 0 -194px; background-repeat: repeat-x;}
ul.topMenu li.dealerSales a:before {background-position: -1px -194px;}
ul.topMenu li.newQuote a:before {background: url('/img/icons-aa/service.png') center no-repeat; background-size: contain;}
ul.topMenu li.quotes a:before {background: url('/img/icons-aa/summary.svg') center no-repeat; background-size: contain;}
ul.topMenu li.policies a:before {background: url('/img/icons-aa/archive.png') center no-repeat; background-size: contain;}
ul.topMenu li.renewals a:before {background-position: -154px -235px;}
ul.topMenu li.pendings a:before {background: url('/img/icons-aa/past.png') center no-repeat; background-size: contain;}
ul.topMenu li.leads a:before {background: url('/img/icons-aa/leads.png') center no-repeat; background-size: contain;}
ul.topMenu li.dealers a:before {background: url('/img/icons-aa/dealer.png') center no-repeat; background-size: contain;}
ul.topMenu li.addresses a:before {background: url('/img/icons-aa/address.png') center no-repeat; background-size: contain;}
ul.topMenu li.addUser a:before {background-position: -154px -276px;}
ul.topMenu li.representatives a:before {background: url('/img/icons-aa/support.png') center no-repeat; background-size: contain;}
ul.topMenu li.managers a:before {background: url('/img/icons-aa/manager.png') center no-repeat; background-size: contain;}
ul.topMenu li.customers a:before {background: url('/img/icons-aa/customer.png') center no-repeat; background-size: contain;}
ul.topMenu li.accounts a:before {background-position: -52px -317px;}
ul.topMenu li.reports a:before {background-position: -103px -317px;}
ul.topMenu li.payments a:before {background-position: -1px -358px;}
ul.topMenu li.yourAccount a:before {background-position: -154px -317px; background: url('/img/icons-aa/yourdetails.svg') center no-repeat; background-size: contain;}
ul.topMenu li.home a:before {background-position: -154px -317px; background: url('/img/icons-aa/dealer.png') center no-repeat; background-size: contain;}
ul.topMenu li.messages a:before {background-position: -41px -357px;}
ul.topMenu li.vehicles a:before {background: url('/img/icons-aa/cars.png') center no-repeat; background-size: contain;}

ul.topMenu li.active {border-bottom: 3px solid #fc0;}
ul.topMenu li.active a {color: #1b1918; font-weight: 800;}

ul.topMenu.amount13 li a {padding: 15px 0 0;}
ul.topMenu.amount12 li a {padding: 15px 6px 0;}
ul.topMenu.amount11 li a {padding: 15px 8px 0;}
ul.topMenu.amount10 li a {padding: 15px 11px 0;}
ul.topMenu.amount9 li a {padding: 15px 16px 0;}

ul.topMenu li.showSubmenu:after {content: ''; width: 18px; height: 10px; background-position: -215px -203px; position: absolute; bottom: -11px; left: 50%; margin-left: -9px; z-index: 1002;}

ul.topMenu li .submenu {display: none; width: 108px; position: absolute; top: 99px; right: 0; z-index: 1001; border: 1px solid #D3D3D3; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; background-color: #f0f0f0;}
ul.topMenu li.showSubmenu .submenu {display: block;}
ul.topMenu li .submenu a {padding: 7px 10px 7px; height: auto; border: none; display: block; width: 108px; font-size: 16px; text-align: left; border-bottom: 1px solid #D3D3D3;}
ul.topMenu li .submenu a span:before {content: '-'; text-align: center; display: inline-block; width: 11px; height: 12px; background-position: 11px 12px; margin: 0 7px -1px 0;}
ul.topMenu li .submenu .userIco a span:before {content: ''; background-position: -206px -163px;}
ul.topMenu li .submenu .homeIco a span:before {content: ''; background-position: -131px -192px;}
ul.topMenu li .submenu .logoutIco a span:before {content: ''; background-position: -130px -204px;}
ul.topMenu li .submenu li:last-child a {border-bottom: none;}
ul.topMenu li .submenu a:before {display: none;}

ul.topMenu li:hover {transition: all 0.3s cubic-bezier(.25, .8, .25,1); transform: scale(1.05);}

ul.topMenu li a:hover {text-decoration: none;}

.content {padding-top: 20px; position: relative;}
.content.withoutHeader {margin-top: 0;}
.content.pointer.bright:before {background-position: -27px -178px;}
.content.pointer.space:before {left: 80px;}
.content.pointer.space.systemStaticPage:before {left: 110px;}
.content.padding {padding: 20px;}
.content.paddingTop {padding-top: 40px;}
.content.maxHeightSize{max-height:400px; overflow:auto;}

.homePageInformation {background-color: #fff;}
.homePageInformation p {line-height: 18px; margin-top: 15px;}
.homePageInformation p:first-child {margin-top: 0;}

.table {overflow: auto; position: relative;}
.tableBorder {border: 1px solid #d5d5d5;}
.tableTopBorder {border-top: 1px solid #d5d5d5;}
.tableBottomBorder {border-bottom: 1px solid #d5d5d5;}
.tableLeftBorder {border-left: 1px solid #d5d5d5;}
.tableRightBorder {border-right: 1px solid #d5d5d5;}
.tableRadiusBorder {-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;}
.tableTopLeftRadiusBorder,
.tableTopLeftRadiusBorder div:first-child .tableTd:first-child {-webkit-border-top-left-radius: 5px; -moz-border-radius-topleft: 5px; border-top-left-radius: 3px;}
.tableTopRightRadiusBorder,
.tableTopRightRadiusBorder div:first-child .tableTd:last-child {-webkit-border-top-right-radius: 5px; -moz-border-radius-topright: 5px; border-top-right-radius: 3px;}
.tableBottomLeftRadiusBorder,
.tableBottomLeftRadiusBorder div:last-child .tableTd:first-child {-webkit-border-bottom-left-radius: 5px; -moz-border-radius-bottomleft: 5px; border-bottom-left-radius: 3px;}
.tableBottomRightRadiusBorder,
.tableBottomRightRadiusBorder div:last-child .tableTd:last-child {-webkit-border-bottom-right-radius: 5px; -moz-border-radius-bottomright: 5px; border-bottom-right-radius: 3px;}

.tableThead,
.tableTr {display: table-row;}
.tableTr .tableTd {background-color: #efefef;}
.tableTr.read .tableTd {background-color: #efefef !important;}
.tableTr.unread .tableTd {background-color: #f9f9f9 !important;}

.tableTr .booking {display: inline-block; background-color: #fc0 !important; padding: 5px !important; border-radius: 3px !important; color: #f7f7f7; font-weight: bold; font-size: 0.85rem;}
.tableTr .workshop {display: inline-block; background-color: #fc0 !important; padding: 5px !important; border-radius: 3px !important; color: #f7f7f7; font-weight: bold; font-size: 0.85rem;}
.tableTr .complete {display: inline-block; background-color: #009150 !important; padding: 5px !important; border-radius: 3px !important; color: #f7f7f7; font-weight: bold; font-size: 0.85rem;}
.tableTr .action {display: inline-block; background-color: #e84236 !important; padding: 5px !important; border-radius: 3px !important; color: #f7f7f7; font-weight: bold; font-size: 0.85rem;}
.tableTr .cancelled {display: inline-block; background-color: #e84236 !important; padding: 5px !important; border-radius: 3px !important; color: #f7f7f7; font-weight: bold; font-size: 0.85rem;}
.tableTr .refunded {display: inline-block; background-color: #e84236 !important; padding: 5px !important; border-radius: 3px !important; color: #f7f7f7; font-weight: bold; font-size: 0.85rem;}


.tableCells {display: table;}
.tableCells .tableThead .tableTd,
.tableCells .tableTr .tableTd {display: table-cell;}
.tableTr:nth-child(even) .tableTd {background-color: #f9f9f9;}
.tableTr.read:nth-child(even) .tableTd {background-color: #f9f9f9;}
.tableTd {padding-left: 13px; padding-right: 13px; border-bottom: 1px solid #d5d5d5; display: table-cell;}
.table.reports .tableTd {padding: 0 15px 0 15px;}
.table.reports .tableTd.link a {padding: 20px 15px 20px 10px;}
.tableTd:last-child {border-right: none;}
.tableTr:last-child .tableTd {border-bottom: none;}
.tableTd.w99 {width: 99%;}
.tableTd.w49 {width: 49%;}
.tableTd.w33 {width: 33%;}
.tableTd.w1 {width: 1%;}
.tableTd.minw150 {min-width: 150px;}
.tableTr .tableTd {padding-top: 20px; padding-bottom: 20px;}
.tableTr .tableTd.link {padding: 0;}
.tableTr .tableTd.link a {padding: 20px 13px; display: block;}
.tableTr .tableTd.link.aa a {color: #1b1918; text-decoration: underline; text-decoration-color: #fc0;}
.tableTr .tableTd.link.aa a:hover {text-decoration-color: #0081C5;}
.tableThead .tableTd {color: #606060; height: 36px; line-height: 36px; background-position: 0 -100px; background-repeat: repeat-x; white-space: nowrap;}
.tableThead .tableTd a {color: #606060;}
.tableThead .tableTd strong {color: #000; font-weight: bold;}
.tableThead .tableTd .order.desc:after,
.tableThead .tableTd .order.asc:after {content: ''; height: 11px; width: 7px; display: inline-block; margin: 0 -12px 0 2px;}
.tableThead .tableTd .order.desc:after {background-position: -20px -160px;}
.tableThead .tableTd .order.asc:after {background-position: -11px -160px;}
.tableTr .tableTdLabel {display: none;}
.tableThead .tableTd.lightGrayBg {background: #D5D5D5; color: #000;}
.tableThead .tableTd.whiteBg {background: #fff; color: #000;}

.tableTr .tableTd.greenBg span,
.tableTr .tableTd.redBg span,
.tableTr .tableTd.orangeBg span,
.tableTr .tableTd.yellowBg span,
.tableTr .tableTd.blueBg span,
.tableTr .tableTd.grayBg span,
.tableTr .tableTd.darkBg span,
.tableTr .tableTd.no span,
.tableTr .tableTd.yes span,
.tableTr .tableTd span.greenBg,
.tableTr .tableTd span.redBg,
.tableTr .tableTd span.orangeBg,
.tableTr .tableTd span.yellowBg,
.tableTr .tableTd span.blueBg,
.tableTr .tableTd span.grayBg,
.tableTr .tableTd span.darkBg,
.tableTr .tableTd span.no,
.tableTr .tableTd span.yes {position: relative; padding: 5px 7px 6px 7px; margin: -6px -7px; display: block; text-align: center; color: #fff; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;}
.tableTr .tableTd.not_interestedLeadType span,
.tableTr .tableTd.grayBg span,
.tableTr .tableTd span.grayBg {background-color: #989898;}
.tableTr .tableTd.weakLeadType span,
.tableTr .tableTd.blueBg span,
.tableTr .tableTd span.blueBg {background-color: #4db9ff;}
.tableTr .tableTd.strongLeadType span,
.tableTr .tableTd.greenBg span,
.tableTr .tableTd.yes span,
.tableTr .tableTd span.greenBg {background-color: #009152;}
.tableTr .tableTd.redBg span,
.tableTr .tableTd span.redBg,
.tableTr .tableTd.no span {background-color: #e84236;}
.tableTr .tableTd.orangeBg span {background-color: #ffb540;}
.tableTr .tableTd.yellowBg span {background-color: #ffd400;}
.tableTr .tableTd.darkBg span {background-color: #606060;}

.tableTr.clickable:hover {cursor: pointer;}
.tableTr.clickable:hover .tableTd {background: rgba(77, 185, 255, .2);}

.tableTr .tableTd.greenBg a,
.tableTr .tableTd.redBg a,
.tableTr .tableTd.orangeBg a,
.tableTr .tableTd.yellowBg a,
.tableTr .tableTd.blueBg a,
.tableTr .tableTd.grayBg a,
.tableTr .tableTd.darkBg a,
.tableTr .tableTd.no a,
.tableTr .tableTd.yes a {color: #fff;}

.tableTr .tableTd.yes span,
.tableTr .tableTd span.green,
.tableTr .tableTd.green span {color: #a6d04d;}
.tableTr .tableTd.no span,
.tableTr .tableTd span.red,
.tableTr .tableTd.red span {color: #ff6961;}
.tableTr .tableTd span.blue,
.tableTr .tableTd.blue span {color: #4db9ff;}
.tableTr .tableTd span.gray,
.tableTr .tableTd.gray span {color: #989898;}

.tableTr .tableTd.green a {color: #a6d04d;}
.tableTr .tableTd.red a {color: #ff6961;}
.tableTr .tableTd.blue a {color: #4db9ff;}

.tableTr .tableTd.cursorPointer {cursor: pointer;}

.tableTr .tableTd.no,
.tableTr .tableTd.yes {padding-left: 13px; padding-right: 13px;}
.tableTr .tableTd.no span,
.tableTr .tableTd.yes span {width: 35px; margin-left: auto; margin-right: auto;}

.tableTr .tableTd.yes span:before,
.tableTr .tableTd.no span:before {content: ''; display: block; height: 17px; width: 19px; position: absolute; left: 8px; top: 5px;}
.tableTr .tableTd.yes span:before {background-position: -81px -162px;}
.tableTr .tableTd.no span:before {background-position: -100px -163px; width: 18px;}

.tableTr .tableTd .changeTo {border-top: 1px solid #e1e1e1; border-bottom: 1px solid #e1e1e1; padding: 2px 4px; margin: 10px 0; text-align: center; font-size: 12px; color: #606060;}
.tableCaption {position: relative; height: 55px;}
.tableCaption .tableTd {background-color: #a4a4a4 !important; color: #fff; position: absolute; background: red; width: 100%;}

.content .scrollLeft {display: block; position: absolute; left: 0; top: 0; width: 35px; height: 100%; z-index: 1;}
.content .scrollRight {display: block; position: absolute; right: 0; top: 0; width: 35px; height: 100%; z-index: 1; background-position: -35px 0;}

.tableTr .tableTd .firstTdLabel {display: none;}

.table.resized .tableThead .tableTd {background-image: none; line-height: 12px; height: auto; padding: 10px; white-space: normal;}
.table.resized .tableTr .tableTd {padding-left: 10px; padding-right: 10px;}

.rating span {width: 0; display: block; height: 21px; margin: -5px 0; background-position: -1px -138px;}
.rating.star1 span {width: 22px;}
.rating.star2 span {width: 44px;}
.rating.star3 span {width: 66px;}
.rating.star4 span {width: 88px;}
.rating.star5 span {width: 110px;}

.tableTr .tableTd.rating span {margin: -5px -7px;}

.time {padding-top: 2px;}
.time span {background-color: transparent !important; white-space: nowrap;}
.time span:before {content: ''; width: 16px; height: 16px; display: inline-block; margin: 0 5px -3px 0; background-position: -62px -162px;}

.pager {margin-bottom: 1rem; white-space: nowrap;}
.pager span {display: inline;}
.pager span.current {padding: 2px 8px 3px 7px; border: 2px solid #fc0; -webkit-border-radius: 13px; -moz-border-radius: 13px; border-radius: 13px;}
.pager span a {padding: 2px 6px; color: #0f0f0f;}
.pager span.first a,
.pager span.last a {color: #606060; font-size: 12px;}
.pager span.next a:after,
.pager span.prev a:before {content: ''; width: 8px; height: 13px; margin-bottom: -2px; display: inline-block;}
.pager span.next a:after {background-position: -226px -177px; margin-left: 9px;}
.pager span.prev a:before {background-position: -216px -177px; margin-right: 9px;}

.mobileSort {display: none;}

/* form */
form.inline-form {display: inline-block;}
input, select, textarea {vertical-align: top; font: normal 14px 'Lato', 'Arial', 'sans-serif';}
input[type='text'],
input[type='email'],
input[type='password'],
input[type='number'],
select,
textarea {border: 2px solid #9a9c9a; background-color: #fff; margin: 0; padding: 5px 7px; line-height: 1.5; font-size: 16px;}
select {line-height: 23px; padding: 4px 11px 4px 0px; text-indent: 7px;}
.input.radio input,
.input.checkbox input {vertical-align: top;}
input {width: 250px;}
textarea {width: 250px;}
.label,
label,
legend {vertical-align: top; display: inline-block; width: 210px; padding: 7px 23px 0 0; margin: 0; color: #191919; text-align: right;}
.checkbox label,
.dropdown {display: inline-block;}

.inputWithPrefix {width: 219px;}
.inputWithPrefix.percent {width: 186px;}
.inputWithPrefix.shortInput {width: 109px;}
input[type='checkbox'],
input[type='radio'] {cursor: pointer; width: auto; overflow: visible; border: none; padding: 0; margin: 8px 0 0 0;}

.radio fieldset {margin-left: 210px;}
.radio legend {margin-left: -210px; float: left;}
.radio label {width: auto;}
.radio label {padding-left: 3px; padding-right: 14px;}

.datetime {position: relative;}
.datetime input {padding-right: 39px; cursor: pointer; position: relative;}
.datetime .calender {content: ''; cursor: 'auto'; position: absolute; bottom: 1px; right: 0; width: 32px; height: 98%;}
.datetime .calenderIcon {content: ''; cursor: 'auto'; position: absolute; bottom: 7px; right: 9px; width: 14px; height: 15px; background-position: -151px -164px; filter: brightness(0);}

.form .datetime .calender {right: 34px;}
.form .datetime .calenderIcon {right: 11px;}

.form h2 > div.input {padding-left: 0; margin-bottom: 5px;}

input[type='submit'],
input[type='button'],
button[type='submit'],
button[type='button'],
.button {cursor: pointer; width: auto; overflow: visible; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; border: none; color: #fff; background-color: #1b1918; line-height: 29px; height: 38px; padding: 0 10px; margin: 0; box-shadow: none}
.buttonWhite { color: #337ca6; background-color: #ffffff;}
a.button {display: inline-flex; align-items: center; transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;}
a.button:hover {text-decoration: none; color: #ffcc00;}
.button.buttonMargin {margin: 30px 20px 0;}

.form {padding-bottom: 40px;}
.form .label,
.form label,
.form legend {color: #1b1918; font-size: 18px; font-weight: 700;}
.form div.input {margin-bottom: 20px; position: relative;}
.form h2 {color: #000; clear: both; position: relative; padding: 15px 20px 15px 230px; margin: 0 0 20px; display: block;}
.form h2.firstHeader {-webkit-border-top-right-radius: 5px; -moz-border-radius-topright: 5px; border-top-right-radius: 5px; -webkit-border-top-left-radius: 5px; -moz-border-radius-topleft: 5px; border-top-left-radius: 5px; font-weight: 700; font-size: 18px;}
.form h2.shorty {padding-right: 330px;}

.form.home h2 {padding-left: 20px;}
.form.home h2:before {left: 30px;}
.form.home .preview .formFieldValue .label{width: 0; background: url('../img/system-sprite.png?d=20150804') no-repeat scroll -186px -163px  rgba(0, 0, 0, 0); height: 18px; width: 20px; padding-right: 13px; margin-right: 5px; border:none !important;}
.form.home .preview .formFieldValue .value{width: auto;}


.twoColumnsForm div.formGroup {width: 50%; float: left;}
.twoColumnsForm div.input {width: 480px; float: left; padding-left: 20px;}

.twoColumnsForm div.formGroup div.input {clear: both; padding-left: 20px;}
.twoColumnsForm .formFooter {clear: both; margin-top: 20px; padding: 20px 0 0 0;}
.twoColumnsForm .formFooter.marginBottom {margin-bottom: 20px;}
.twoColumnsForm .formFooter.withoutTopMargin {margin-top: 0;}

.form .formContentButton {padding: 0 10px 20px 0;}
.form .formFieldRightButton {margin-left: 710px;}
.form .formFieldLeftButton {margin-left: 230px; float: left;}
.form .formFieldCenterButton {float: left; left: 50%; position: absolute; margin-top: 1px;}
.form .formFieldCenterButton > .button {position: relative; right: 50%;}
.form .orText {position: absolute; left: -25px; top: 7px;}
.form div.checkbox {width: 250px; margin-left: 210px; padding-left: 20px;}
.form div.checkbox input {float: left;}
.form div.checkbox input {width: auto; margin-right: 10px;}
.form div.checkbox label {width: 80%; text-align: left; padding-right: 0;}

.form div.checkbox,
.form div.radio {margin-bottom: 28px;}

.form .mce-tinymce.error,
.form div.input.error input,
.form div.input.error textarea,
.form div.input.error select {border: 1px solid #ddb8b8;}
.form div.input.error span.selected {outline: 1px solid #ddb8b8;}
.form div.input .error-message {position: relative; border: 1px solid #ddb8b8; background-color: #ecdada; padding: 10px 12px; margin: 15px 0 0 210px; width: 217px;}
.form div.input .error-message:before {content: ''; position: absolute; left: 20px; top: -6px; width: 12px; height: 6px; background-position: -171px -185px;}
.form div.input.checkbox .error-message {margin-left: -3px;}


.form .enterReg.error input {border: 1px solid #ddb8b8;}
.form .enterReg .error-message {position: relative; border: 1px solid #ddb8b8; background-color: #ecdada; padding: 10px 12px; margin: 15px 0 20px 263px; width: 217px;}
.form .enterReg .error-message:before {content: ''; position: absolute; left: 20px; top: -6px; width: 12px; height: 6px; background-position: -171px -185px;}
.form .enterReg .error-message:before {content: ''; position: absolute; left: 20px; top: -6px; width: 12px; height: 6px; background-position: -171px -185px;}
.form .enterReg .registrationLookupLoader {display: none; clear: both; margin: 0 0 20px 230px; color: #009100;}

.form .enterReg2 .error-message {position: relative; top: -18px; border: 1px solid #606060; background-color: #ddd; padding: 10px 12px; margin: 10px 0 0 230px; width: 217px;}
.form .enterReg2 .error-message:before {content: ''; position: absolute; left: 20px; top: -6px; width: 12px; height: 6px; background-position: -45px -162px;}
.form .enterReg2 .registrationLookupLoader {display: none; clear: both; margin: 0px 32px 32px 230px; color: #009100;}

.form .hint {margin: 3px 0 -10px 210px; width: 217px; font-size: 10px; color: #898989;}
.form .help {font-size: 10px; color: #898989; position: absolute; right: 40px; bottom: 10px; text-align: left;}
.form .help.space {right: 74px;}
.form .prefix {display: inline-block; padding: 0 10px; line-height: 37px; background-color: #ddd; color: #606060; text-shadow: #fff 1px 0px 1px;}

.addDiff {font-size: 22px; padding: 5px; cursor: pointer; display: none;}

.formFieldValue .label,
.formFieldValue .value {float: left; margin-bottom: 8px; line-height: 1.5;}
.formFieldValue .value {width: 230px; padding-top: 7px;}
.formFieldValue .value.noPadding {padding-top: 0;}
.formFieldValue .value.noOverflow {overflow-x: visible; overflow-y: visible;}
.formFieldValue .value.withDropDown {overflow: visible;}
.formFieldValue .value.red {color: #ce3535;}
.formFieldValue .value.green {color: #009100;}
.formFieldValue .value .infoRow {border-top: 1px solid #e1e1e1; padding-top: 5px; margin-top: 5px;}
.formFieldValue .value .infoRow:first-child {border-top: none; padding-top: 0; margin-top: 0;}

.preview.html {margin-top: -60px;}
.preview .formFieldValue .label,
.preview .formFieldValue .value {float: left; margin-bottom: 0;}
.preview .formFieldValue .value {padding-top: 0; line-height: 1.5; font-size: 16px;}

.formFieldInfo {clear: both; margin-bottom: 20px; margin-left: 230px; margin-right: 20px;}
.formFieldInfo.red {color: #ce3535;}
.formFieldInfo.black {color: #000;}

.preview .label,
.preview label,
.preview legend {padding-top: 0;}

.preview .formInPreview .label,
.preview .formInPreview label,
.preview .formInPreview legend {padding-top: 7px;}
.preview .formInPreview div.input {margin-top: -7px; margin-bottom: 13px; position: relative;}

.form.preview .table {margin-top: -20px; border-bottom: 1px solid #D5D5D5; border-top: 0; margin-bottom: 40px;}

.preview .formLabelInPreview .label,
.preview .formLabelInPreview label,
.preview .formLabelInPreview legend {padding-top: 7px;}

.form .checkbox.previewCheckbox {margin-bottom: 20px;}
.form .checkbox.previewCheckbox label {margin-left: -164px;}
.form .checkbox.previewCheckbox div.prettyCheckbox {margin-top: -3px;}
.form .checkbox.previewCheckbox input {margin-top: 0px;}

.twoColumnsForm .withButton input {width: 117px;}
.twoColumnsForm div.input.withButton {width: 354px;}
.twoColumnsForm .PolicyAddForm div.input.withButton {width: 354px;}

.twoColumnsForm .enterReg div.input.withButton {width: 480px;}
.twoColumnsForm div.formGroup.enterReg {width: 555px; padding: 2px 0;}
.twoColumnsForm .enterReg {background: url('../img/registration-plate-ie.png') no-repeat scroll 100% 0 rgba(0, 0, 0, 0);}
#PolicyRegistrationLookup, #ServiceRegistrationLookup {text-align: center; background-color: transparent; width: 217px; margin-left: 33px; height: 62px; line-height: 52px; font-size: 24px; font-weight: bold;}
#PolicyRegistrationLookup::-webkit-input-placeholder, #ServiceRegistrationLookup::-webkit-input-placeholder {color: #606060; text-align: center; opacity: 1;}
#PolicyRegistrationLookup:-moz-placeholder, #ServiceRegistrationLookup:-moz-placeholder {color: #606060; text-align: center; opacity: 1;}
#PolicyRegistrationLookup::-moz-placeholder, #ServiceRegistrationLookup::-moz-placeholder {color: #606060; text-align: center; opacity: 1;}
#PolicyRegistrationLookup:-ms-input-placeholder, #ServiceRegistrationLookup:-ms-input-placeholder {color: #606060; text-align: center; opacity: 1;}
#PolicyRegistrationLookup:-moz-placeholder, #ServiceRegistrationLookup:-moz-placeholder {color: #606060; text-align: center; opacity: 1;}
#registrationLookup {width: 59px; height: 63px; margin-left: 14px; background-color: transparent; line-height: 0; font-size: 0; text-indent: -200px;}

.required label:before {content: '*'; font-size: 14px; padding-right: 3px;}

.button.medium,
button.medium {line-height: 32px; height: 32px;}
.button.big,
button.big {line-height: 40px; height: 40px; width: fit-content; font-size: 16px; padding-left: 15px; padding-right: 15px;}
.button.gray,
button.gray {background-color: #9a9c9a;}
.button.darkGray,
button.darkGray {background-color: #3d3e3c;}
.button.green,
button.green {background-color: #a6d04d;}
.button.red,
button.red {background-color: #ce3535;}
.button.orange,
button.orange {background-color: #ffb540;}
.button.orangeRed,
button.orangeRed {background-color: #dc482c;}
.button.save,
button.save {font-weight: bold;}

.button.add span:before,
button.add:before{content: ''; width: 15px; height: 15px; float: left; margin: 7px 10px 0 0; background-position: -118px -162px;}
.button.medium.add span:before,
button.medium.add:before{margin: 9px 10px 0 0;}
.button.search:before,
button.search:before {content: ''; width: 17px; height: 17px; float: left; margin: 6px 9px 0 0; background-position: -133px -162px;}
.button.checked span:before,
a.button.checked:before,
button.checked:before,
.button.save span:before,
a.button.save:before,
button.save:before{width: 19px; height: 18px; float: left; margin: 6px 10px 0 0; background-position: -81px -161px;}
.button.delete span:before,
a.button.delete:before,
button.delete:before{content: ''; width: 15px; height: 15px; float: left; margin: 7px 10px 0 0; background-position: -102px -163px;}
.button.settings,
.button.callback {position: relative; background-color: #fff; min-width: 35px; height: 32px; border: 1px solid #d3d3d3; color: #606060;}
.button.callback:before {content: ''; cursor: 'pointer'; position: absolute; top: 8px; left: 10px; width: 14px; height: 15px; background-position: -151px -164px;}
.button.callback span {display: none;}
.button.callback.forQuote {height: 31px;}
.quoteAdditionalMenu .button.callback {margin-top: -1px; height: 31px;}

.button.timeline {position: relative; background-color: #fff; min-width: 35px; height: 32px; border: 1px solid #d3d3d3; color: #606060;}
.button.timeline:before {content: ''; cursor: 'pointer'; position: absolute; top: 7px; left: 8px; width: 18px; height: 18px; background-position: -214px -281px;}
.button.timeline span {display: none;}
.button.timeline.forQuote {height: 31px;}
.quoteAdditionalMenu .button.timeline {margin-top: -1px; height: 31px;}

.header {position: relative}
.header:after {content: ''; display: block; clear: both;}
.header div.input {margin: 0 14px 3px 0; float: left;}
.header .login {font-weight: 700; font-size: 1.55rem; line-height: 2.75rem;}
.header h1,
.header h2 {padding-right: 45px; font-size: 16px; float: left; line-height: 1.5; font-weight: bold;}
.header h1.withDropdown,
.header h2.withDropdown {padding-right: 10px;}
.header h1.short {width: 400px;}
.header h1.medium {width: 700px;}
.header h1.leftSpace {padding-left: 50px}
.header .dropdown {width: 217px; float: left; margin-top: -6px; margin-bottom: -7px;}
.header .select {margin-top: -7px;}
.header .select label {display: none;}

.header.steps {padding: 0 20px 13px;}
.header.steps h1 {float: none;}
.header.steps .step,
.header.steps .laststep {font-size: 14px; font-weight: bold;}
.header.steps span,
.header.steps a,
.header.steps a:hover {color: #9A9A9A;}
.header.steps a.button {color: #fff;}
.header.steps h1.step,
.header.steps h1.laststep,
.header.steps .h1duplicate {color: #000; display: inline; margin: 0; padding: 0;}
.header.steps .step:after {content: ''; width: 16px; height: 31px; display: inline-block; background-position: -181px -192px; margin: 0 9px -10px 9px;}
.header.steps .step span,
.header.steps .laststep span {color: #000; font-size: 18px; width: 35px; height: 35px; line-height: 30px; margin: 12px 5px 0 0; text-align: center; display: inline-block; border: 2px solid #989898; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px;}
.header.steps a.step span,
.header.steps a.laststep span,
.header.steps h1.step span,
.header.steps h1.laststep span,
.header.steps .h1duplicate span {color: #1b1918; border: 2px solid #fc0; position: relative; font-weight: bold;}
.header.steps a.step span:before,
.header.steps a.laststep span:before {content: ''; margin: 0px 0px -3px 2px; width: 17px; height: 18px; display: inline-block; background-position: -189px -163px;}
.header.steps h1.step span:before,
.header.steps h1.laststep span:before,
.header.steps.visibleMenu .h1duplicate span:before {display: none;}
.header.steps h1.step.blue span:before,
.header.steps h1.laststep.blue span:before {background-color: #0081C5; background-position: -51px -179px;}

.header.servicesteps {padding: 0 0 36px; border: none; border-bottom: 1px solid #e1e3e1; border-radius: 0px;}
.header.servicesteps h1 {float: none;}
.header.servicesteps .step,
.header.servicesteps .laststep {font-size: 14px; font-weight: bold;}
.header.servicesteps span,
.header.servicesteps a,
.header.servicesteps a:hover {color: #9A9A9A;}
.header.servicesteps a.button {color: #fff;}
.header.servicesteps h1.step,
.header.servicesteps h1.laststep,
.header.servicesteps .h1duplicate {color: #000; display: inline; margin: 0; padding: 0;}
.header.servicesteps .step span,
.header.servicesteps .laststep span {color: #000; font-size: 18px; width: 35px; height: 35px; line-height: 30px; margin: 12px 5px 0 0; text-align: center; display: inline-block; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px;}
.header.servicesteps a.step span,
.header.servicesteps a.laststep span,
.header.servicesteps h1.step span,
.header.servicesteps h1.laststep span,
.header.servicesteps .h1duplicate span {color: #1b1918; position: relative; font-weight: bold;}
.header.servicesteps h1.step.blue span:before,
.header.servicesteps h1.laststep.blue span:before,
.header.servicesteps .step .icon,
.header.servicesteps .laststep .icon {margin-top: 13px; opacity: 20%; height: 30px; width: 30px;}
.header.servicesteps .step .icon.black {opacity: 90%;}
.header.servicesteps .laststep .icon.black {opacity: 90%;}
.header.servicesteps .step .icon.green {opacity: 100%; filter: invert(29%) sepia(100%) saturate(2045%) hue-rotate(102deg) brightness(91%) contrast(109%);}
.header.servicesteps .laststep .icon.green {opacity: 100%; filter: invert(29%) sepia(100%) saturate(2045%) hue-rotate(102deg) brightness(91%) contrast(109%);}
.header.servicesteps .step:after {content: ''; width: 51px; height: 1.5px; display: inline-block; margin: 0 8px 2px 8px; background-color: #cac6c6;}
.header.servicesteps.visibleMenu .h1duplicate span:before {display: none;}
.header.servicesteps .step.h1duplicate:after {content: none;}
.header.servicesteps a.step.green {color: #009100;}
.header.servicesteps h1.laststep.green {color: #009100;}
.header.servicesteps .step.green:after {content: ''; width: 51px; height: 1.5px; display: inline-block; margin: 0 8px 2px 8px; background-color: #009100;}

.topList {padding: 0 20px; display: table; float: right;}
.topList .button {margin: 20px 14px 20px 0;}
.topList:after {content: ''; display: block; clear: both;}
.bottomList {padding: 0 20px; display: table; float: right;}
.bottomList .button {margin: 20px 14px 20px 0;}
.bottomList:after {content: ''; display: block; clear: both;}

.login-aa .page-title h1 {color: #333; font-family: inherit; font-weight: 700; font-style: inherit; font-size: 1.75rem; line-height: 3rem; margin-bottom: 1.5rem; padding: 0;}
.login-aa .page-title p {margin: 1.5rem 0 2.5rem 0; font-size: 1rem; font-weight: 400;}
.login-aa .input-container { position: relative;  flex: 0 0 auto; width: 100%; display: flex; flex-flow: column nowrap; justify-content: flex-start;}
.login-aa .text-highlight {    border-bottom: 2px solid #fc0; font-weight: 700; padding-bottom: 3px; font-size: 16px; color: #333;}
.login-aa a {text-align: right; padding-top: 8px;}
.login-aa a:hover {text-decoration: none;}
.login-aa input[type='checkbox'] { width: 22px; height: 22px;}
.login-aa .remember-me {flex: 1;}
.login-aa .remember-me label { padding: 0; margin: 0; width: auto; padding-top: 7px; padding-left: 8px; font-weight: 400;}
.login-aa .login-help { justify-content: space-between; width: 100%; display: inline-flex; padding-right: 27px;}
.login-aa .quote.inputs .input .container input {border-color: #454545 !important;}

.loginForm {padding: 30px;}
.loginForm label {width: 120px; color: #1b191b; font-weight: 700; font-size: 16px; line-height: 1.5;}
.loginForm .input {margin-bottom: 20px; position: relative;}
.loginForm .input input {width: 300px;}
.loginForm .checkbox {margin-left: 120px;}
.loginForm .checkbox input {width: auto; margin-right: 5px;}
.loginForm .checkbox label {text-align: left;}
.loginForm .formFooter {border-top: 1.5px solid #1b1918; padding: 20px 0 0 180px;}
.loginForm .email input,
.loginForm .password input {padding-right: 39px;}
.loginForm .email:before,
.loginForm .password:before {content: ''; position: absolute; top: 1px; right: 33px; border-left: 1.5px solid #1b1918; width: 32px; height: 98%;}
.loginForm .email:after {content: ''; position: absolute; top: 7px; right: 43px; width: 11px; height: 15px; background-position: -205px -162px;}
.loginForm .password:after {content: ''; position: absolute; top: 10px; right: 38px; width: 19px; height: 10px; background-position: -217px -162px;}
.loginForm .forgotten {float: right; padding-top: 10px; position: relative; z-index: 1000;}
.loginForm .info {padding-bottom: 20px;}
.loginForm .formFooter > button {margin-right: 10px;}
.loginForm .formFooter > a {margin-left: 7px;}


.loginForm.termsAndConditions {line-height: 20px;}
.loginForm.termsAndConditions form{margin-top: 20px;}
.loginForm.termsAndConditions .formFooter {padding-left: 0px; text-align: center;}
.loginForm.termsAndConditions .userHomeFooter {text-align: center;}
.loginForm.termsAndConditions .tacText {margin: 20px 0; padding: 20px; background: #fff; border: #dadada; height: 300px; overflow-y: scroll;}
.loginForm.termsAndConditions .tacText p {padding: 5px 0;}
.loginForm.termsAndConditions .tacText ol[type='1'] {list-style:decimal; padding-left: 30px;}
.loginForm.termsAndConditions .tacText ol[type='i'] {list-style:lower-roman; padding-left: 30px;}
.loginForm.termsAndConditions .tacText ol li {padding: 3px 0;}
.forgottenPasswordForm label {width: 200px;}
.forgottenPasswordForm .input input {width: 220px;}
.forgottenPasswordForm .formFooter {padding-left: 200px;}
.forgottenPasswordForm div.input .error-message {position: relative; border: 1px solid #ddb8b8; background-color: #ecdada; padding: 10px 12px; margin: 15px 0 0 200px; width: 220px;}
.forgottenPasswordForm div.input .error-message:before {content: ''; position: absolute; left: 20px; top: -6px; width: 12px; height: 6px; background-position: -171px -185px;}

.searchForm input {width: 156px;}
.searchForm div.input {float: left; margin-right: 7px;}
.searchForm button {float: left;}
.searchForm button {margin-left: 7px; height: 38px;}
.searchForm label {display: none;}
.searchForm .searchFormLabel {padding: 7px 10px 0 0; float: left;}
.searchForm .dropdown {width: 156px;}
.searchForm .searchFormRow {padding-top: 10px;}
.searchForm .rangeSeparator {padding: 7px 7px 0 0; float: left;}
.searchForm .additionalSearch {display: none;}
.searchForm .additionalSearch.active {display: block;}
.searchForm .additionalSearchButton {float: left; width: 26px; height: 28px; cursor: pointer; position: relative; margin-top: 4px;}
.searchForm .additionalSearchButton:before {content: ''; position: absolute; top: 9px; left: 5px; width: 16px; height: 10px; background-position: -153px -180px; cursor: pointer;}
.searchForm .additionalSearchButton.active:before {top: 11px; background-position: -112px -193px;}
.searchForm .additionalSearch p.searchFormLabel {width: 137px; text-align: right;}

#choosingCarInSteps {min-height: 30px;}
#choosingCarInSteps select {width: 217px;}
#loadCarModel label,
#loadCarModel .dropdown,
#loadCarModel select,
#loadRangesModel label,
#loadRangesModel .dropdown,
#loadRangesModel select {margin-top: 20px;}

.message,
.notice {color: #fff; display: block; padding: 1rem .75rem; font-size: 16px; border: none; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;}
.message {background-color: #ff6961;}
.message.success {background-color: #3d3e3c;}
.notice {background-color: #3d3e3c;}
.content .notice {margin: 0 20px 20px 20px;}
.notice.topPadd {margin-top: 20px;}
.content .noticeOnly {margin: 20px;}
.content .assignment {padding-top: 25px; clear: both;}
.content .assignment.withoutReference {padding-top: 0;}

.content-container form {display: flow-root;}

.content-container  .vehicle-image {text-align: -webkit-center;}
.content-container .vehicle { flex: 0 0 auto; padding: 0 1.5rem 0 0.5rem;}
.content-container .vehicle .details {margin-top: 1rem; margin-bottom: 1rem; border-left-style: solid; padding-left: 0.5rem; border-left:1px solid #009152;}
.content-container .vehicle .details p {display: flex; flex-direction: column; font-size: 1rem; line-height: 1.5; margin: 1rem 0;}

.quote.inputs {display: flex; flex-grow: 0; flex-shrink: 0; flex-basis: auto; flex-direction: row; flex-wrap: wrap; justify-content: space-between; position: relative; flex-wrap: nowrap; width: 100%; line-height: 1.5; font-size: 1rem;
    font-family: 'Open Sans',-apple-system,BlinkMacSystemFont, 'Segoe UI',Roboto,Oxygen-Sans,Ubuntu,Cantarell, 'Helvetica Neue',sans-serif;}

.quote.inputs input::-webkit-outer-spin-button,
.quote.inputs input::-webkit-inner-spin-button {-webkit-appearance: none; margin: 0;}
.quote.inputs input[type=number]{
    -moz-appearance: textfield;
}
.service-confirmation-container button,
.quote.inputs .button,
.quote.inputs button {
    position: relative;
    display: block;

    box-shadow: none;
    width: 100%;
    padding: 0.75rem;
    margin: 20px 0 10px;
    border: none;
    border-radius: 2px;
    min-height: 3rem;

    font-family: inherit;
    font-size: .75rem;
    font-weight: 700;
    line-height: 1.5;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;

    transition: background-color .6s;
    color: #1b1918;
    background-color: transparent;
    cursor: pointer;

    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.service-confirmation-container .button.button.outline,
.quote.inputs .button.outline {border: 1px solid #1b1918;}
.service-confirmation-container .button.button.outline a,
.quote.inputs .button.outline a {color: #1b1918 !important;}
.service-confirmation-container .button.button.outline:hover {background-color: #fff;}
.quote.inputs .button.outline:hover {color: #1b1918 !important;}
.quote.inputs .button.address {color: #f7f7f7; background-color: #9a9c9a; height: auto;}
.quote.inputs .button.address:hover {color: #f7f7f7 !important;}
.quote.inputs .button.continue {background-color: #1b1918; color: #f7f7f7;}
.quote.inputs button:disabled,
.quote.inputs .button.disabled {background-color: #e1e3e1 !important; color: #434640 !important; border: 1px solid #c7c8c7; opacity: 1 !important;}
.quote.inputs .button.disabled:hover {color: #434640 !important}
.quote.inputs .button.green {background-color: #009152 !important; color: #f7f7f7;}
.quote.inputs .button.green:hover {color: #f7f7f7 !important;}

.quote.inputs .circle-container {position: relative; left: 0; float: left; flex: 0 0 48px; width: 24px; height: 24px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background-color:#fff;}
.quote.inputs .circle-container .circle {width: 18px; height: 18px; stroke: #c7c8c7;  fill: #c7c8c7;}
.quote.inputs .bar-container {position: relative; left: 0; float: left; flex: 0 0 48px; width: 24px; height:100%; display: flex; align-items: center; justify-content: center;}
.quote.inputs .bar-container .bar {width: 1px; height: inherit; background-color:#c7c8c7}

.quote.inputs .input {flex: 1 1 auto; position:relative; width:100%; padding: 0 1.5rem 0 .5rem; margin-bottom: 2.25rem}
.quote.inputs .input.no-margin {margin-bottom: 0 !important;}
.quote.inputs .input .container {float: left; width: 100%; display: flex; flex-flow: column nowrap; padding: 0 !important;}
.quote.inputs .input .container .section-header {padding: 0 1.5rem 0 0.5rem; margin-bottom: 1.5rem; flex: 1 1 auto; font-size: 21px; font-weight: 700;}
.quote.inputs .input .container .summary-header {flex: 1 1 auto; font-size: 1rem; font-weight: 600; line-height: 1.5; color: #3d3e3c; border-bottom: 1px solid #1b1918; margin-bottom: 0.5rem;}
.quote.inputs .input .container .summary-header h6 {font-size: 1.2rem;}
.quote.inputs .input .container .input.formFieldValue {margin-bottom: 0;}
.quote.inputs .input .container label {font-size: 1rem; font-weight: 700; margin-bottom: .5rem; float: left; width: 100%; text-align: inherit; padding: 0 !important;}
.quote.inputs .input .container .info {line-height: 1.5; font-weight: 400 !important;}
.quote.inputs .input .container .icon-holder {position: relative; float: left; width: 100%;}
.quote.inputs .input .container input {background-color: transparent; border: 2px solid #9a9c9a !important; border-radius: 3px; padding: 0 32px 0 8px; min-height: 48px; transition: all ease .15s; box-shadow: none;}
.quote.inputs .input .container textarea {background-color: transparent; border: 2px solid #9a9c9a !important; border-radius: 3px; padding: 10px 8px; min-height: 48px; transition: all ease .15s; box-shadow: none;}
.quote.inputs .input .container input:focus, .quote.inputs .input .container textarea:focus {outline: 0; transform: translateY(-2px); box-shadow: 0 5px 5px -3px rgb(0 0 0 / 20%), 0 8px 10px 1px rgb(0 0 0 / 14%), 0 3px 14px 2px rgb(0 0 0 / 12%); border-color: #1b1918 !important;}
.quote.inputs .input .container .question  {display: flex; flex-grow: 0; flex-shrink: 0; flex-basis: auto; flex-direction: row; flex-wrap: wrap; justify-content: space-between; position: relative; flex-wrap: nowrap; float: left; width: 100%;}
.quote.inputs .input .container textarea.question {resize: none}
.quote.inputs .input .container .subtext {font-size: .75rem; line-height: 1.5; color: #3d3e3c; margin-top: 0.5rem!important; position: relative; float: left; clear: both;}
.quote.inputs .input .container .date-question {    display: flex; flex-grow: 0; flex-shrink: 0; flex-basis: auto; flex-direction: row; flex-wrap: wrap; justify-content: space-between; position: relative; flex-wrap: nowrap; float: left; width: 100%;}
.quote.inputs .input .container .date-question .date-group {display: flex; flex-flow: row nowrap; justify-content: stretch; align-items: stretch; float: left; width: 100%;}
.quote.inputs .input .container .date-question .date-group .day,
.quote.inputs .input .container .date-question .date-group .month {flex: 1 1 auto; margin: 0 0.75rem 0 0; width: 50px;}
.quote.inputs .input .container .date-question .date-group .year {flex: 2 1 auto; margin-right: 0;}
.quote.inputs .input .container .date-question .date-group .date-group-icon {top: 50%; margin-top: -14px; right: 4px; transform: translateY(0); transition: all ease .15s; display: inline!important; position: absolute; width: 27px; height: 27px;}
.quote.inputs .input .container .radio-question {display: flex; flex-grow: 0; flex-shrink: 0; flex-basis: auto; flex-direction: row; flex-wrap: wrap; gap: .5rem; position: relative; float: left; width: 100%; justify-content: space-between;}
.quote.inputs .input .container .radio-question.radio-service-products-list {flex-direction: column; gap: 1rem;}
.quote.inputs .input .container .radio-question .radio {flex: 1 1 auto; float: left; min-height: 3rem;}
.quote.inputs .input .container .radio-question .radio.service-grp {margin-right: 0;}
.quote.inputs .input .container .radio-question .radio.last-child {flex: 1 1 auto;  margin-right: 0 !important; float: left; min-height: 3rem;}
.quote.inputs .input .container .radio-question .radio .radio-input {cursor: pointer; display: inline-block; font-family: inherit; text-align: center; text-transform: uppercase; padding: 0 5px; text-decoration: none!important; border: 2px solid #9a9c9a; font-size: 1rem; border-radius: 2px; height: 3rem; text-transform: none; font-weight: 500; white-space: normal; line-height: 1.2; display: flex; align-items: center; justify-content: center; margin-bottom: 0; transition: all 0.3s cubic-bezier(.25, .8, .25,1);}
.quote.inputs .input .container .radio-question .radio .radio-input.plan-info {color: #1b1918; display: flex; justify-content: space-between; flex-direction: column; height: 100%; line-height: 3; border-radius: 10px; background-color: hsl(120deg 1% 61% / 16%); border: none;}
.quote.inputs .input .container .radio-question .radio .radio-input.selected {border: 2px solid #009152; color: #1b1918; font-weight: 500;     box-shadow: 0 5px 5px -3px rgb(0 0 0 / 20%), 0 8px 10px 1px rgb(0 0 0 / 14%), 0 3px 14px 2px rgb(0 0 0 / 12%);}
.quote.inputs .input .container .radio-question .radio .radio-input .visually-hidden { position: absolute; overflow: hidden; clip: rect(0 0 0 0); height: 1px; width: 1px; margin: -1px; padding: 0; border: 0;}
.quote.inputs .input .container .input-icon {top: 25px;margin-top: -14px; right: 4px; transform: translateY(0); transition: all ease .15s; display: inline!important; position: absolute; width: 27px; height: 27px;}
.quote.inputs .input .container .date-question .date-group .date-group-icon svg,
.quote.inputs .input .container .input-icon svg { position: absolute; left: 4px; top: 4px; width: 18px; height: 18px;}
.quote.inputs .input .container #ServiceRegistrationLookup {text-align: inherit; width: 100%; margin-left: 0px; height: auto; line-height: 1.5; font-size: 1rem; font-weight: normal;}
.quote.inputs .input .container #registrationLookup {width: 100%; height: 100%; margin-left: 0px; line-height: 1.5; font-size: .75rem; text-indent: 0px !important; background: #f7f7f7; text-align: center !important;}
.quote.inputs .input .container .registrationLookupLoader {display: none; font-size: 14px; color: #009100;}
.quote.inputs .input .container .dropdown {background-color: transparent; border: 2px solid #9a9c9a !important; border-radius: 3px; padding: 3px 32px 0 8px; min-height: 48px; transition: all ease .15s; box-shadow: none; width: 100%; margin-bottom: 0px !important}
.quote.inputs .input .container #loadCarModel label,
.quote.inputs .input .container #loadCarModel .dropdown {margin-top: 0 !important;}
.quote.inputs .input .container #choosingCarInSteps {padding-top: 35px !important;}
.quote.inputs .input .container .service-plan-container {min-height: 6rem; border: 2px solid #9a9c9a; border-radius: 3px;}
.quote.inputs .input .container .service-plan-container .plan {padding: 0.3rem 0.75rem; display: flex; justify-content: space-between;}
.quote.inputs .input .container .datetime .calenderIcon {top: 16px;}
.quote.inputs .input .container label.tc {padding-top: 0rem !important;}
.quote.inputs .input .container label .info {font-size: .75rem; line-height: 1.25rem; font-weight: normal;}
.quote.inputs .input .container label .info a {color: #009152;}
.quote.inputs .input .container #suggestion_list {font-size: 14px; background-color: #eee;}
.quote.inputs .input .container #suggestion_list li {cursor: pointer; padding: 2px 8px 2px 8px; transition: background-color .2s;}
.quote.inputs .input .container #suggestion_list li:hover {background-color: #ffd400;}
.quote.inputs .input .container #suggestion_list .header {background-color: transparent; border: none !important; border-radius: 0 ; padding: 2px 8px 2px 8px;}

.quote.inputs .input .container #summaryline {
     line-height: 1.5; padding: 0; margin-bottom: 0; height: auto;}

.quote.inputs .input .container .confirm-address {color: #c7c8c7; padding-top: .5rem; text-align: center;}
.quote.inputs .input  table th {padding-bottom: 0.3rem; font-weight: 600; width: 30%;}
.quote.inputs .input table {margin-top: 1rem;}
.quote.inputs .input table.car-summary {font-size: 0.9rem; line-height: 1.3;}
.quote.inputs .workshop-picker-option {line-height: 1.2 !important; font-size: 1rem !important;}
.quote.inputs .workshop-picker-option input {min-height: auto !important; padding: 0 !important; border-radius: 50% !important;}
.radio-input.plan-info .plan-title {font-size: 1.2rem; font-weight: 600;}
.radio-input.plan-info .gross-price {font-size: 1.8rem; font-weight: 700; line-height: 1.2;}
.radio-input.plan-info .net-price {font-size: 13px; line-height: 1.6;}
.radio-input.plan-info .highlights {font-size: 14px; font-weight: normal; line-height: 1.5; color: #3d3e3c; text-align: left;}
.radio-input.plan-info .highlights ul {min-height: 96px;}
.radio-input.plan-info .highlights li {list-style: disc; list-style-position: inside;}
.radio-input.plan-info .highlights li span {margin-left: -8px;}
.radio-input.plan-info .learn-more {color: #009152; padding-top: 1rem;}
.radio-input.plan-info.selected {background-color: #fc0 !important; color: #000 !important; border: none !important; box-shadow: 0 5px 5px -3px rgb(0 0 0 / 20%), 0 8px 10px 1px rgb(0 0 0 / 14%), 0 3px 14px 2px rgb(0 0 0 / 12%);;}
.quote.inputs#summaryline-container {top: -30px;}

.service-confirmation-aa {display: flex; flex-wrap: wrap; align-items: center; justify-content: center;}
.service-confirmation-aa span.success {font-size: 2rem; font-weight: bold;}
.service-confirmation-aa span.ref {font-size: 1.2rem; font-weight: 450; padding-top: 30px; padding-bottom: 30px;}
.service-confirmation-aa img {height: 60px; padding-right: 5px;}
.service-confirmation-container  table th {padding-bottom: 0.3rem; font-weight: 400; width: 30%;}
.service-confirmation-container table {margin-top: 1rem; font-size: 1rem;}
.service-confirmation-container table  th:after{content: ' '; white-space: pre;}

.quote.inputs *,
*::before,
*::after {
    box-sizing: border-box;
}

/* Messages */
.Thread {padding-bottom: 40px}
.internal.Message {width: 100%; position: relative; padding: 2rem;}
.internal.Message .bubbles {position: relative; z-index: 1; width: 888px; margin: 0 auto; overflow: hidden;}
.internal.Message .content.bubble {background: #ccee85; border-width: 1px; border-color: #ccee85; min-height: 100px; width: 385px; padding: 30px 25px; margin-top: 5px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}
.internal.Message .content.bubble .body {overflow: hidden; line-height: 15px;}
.internal.Message .dark .content.bubble {background: #b8ec4c; border-color: #b8ec4c;}
.internal.Message.blue .content.bubble {background: #b4d6e9; border: 1px solid #b4d6e9;}
.internal.Message.blue .dark .content.bubble {background: #83c4e9; border: 1px solid #83c4e9;}
.internal.Message .vertical.line {position: absolute; top: 0; bottom: 0; left: 50%; margin-left: -1px; width: 2px; background: #e1e4e7;}
.internal.last.Message .vertical.line {bottom: auto; height: 70px;}
.internal.Message .action.bubble {margin-top: 15px; position: relative; text-align: center;}
.internal.Message .action.bubble .info {padding: 0 10px;}
.internal.Message.received .content.bubble {float: left;}
.internal.Message.received .content.bubble:after,
.internal.Message.sent .content.bubble:before {position: absolute; top: 38px; display: block; content: ''; width: 0; height: 0; border-style: solid; border-width: 10px 0 10px 10px; border-color: transparent #cdee85 transparent;}
.internal.Message.received .content.bubble:after {right: -10px;}
.internal.Message.sent .content.bubble:before {left: -10px; border-width: 10px 10px 10px 0;}
.internal.Message.received .dark .content.bubble:after,
.internal.Message.sent .dark .content.bubble:before {border-color: transparent #b8ec4c transparent;}
.internal.Message.received.blue .content.bubble:after,
.internal.Message.sent.blue .content.bubble:before {border-color: transparent #b4d6e9 transparent;}
.internal.Message.received.blue .dark .content.bubble:after,
.internal.Message.sent.blue .dark .content.bubble:before {border-color: transparent #83c4e9 transparent;}
.internal.Message.received .action.bubble {float: left; margin-left: 58px;}
.internal.Message.sent .content.bubble {float: right;}
.internal.Message.sent .action.bubble {float: right; margin-right: 58px;}
.internal.Message .action.bubble .notice {background: #ccee85; margin: 0; padding: 17px 30px; border: 1px solid #ccee85; color: #4e4e4e; font-size: 14px;}
.internal.Message .dark .action.bubble .notice {background: #b8ec4c; border: 1px solid #b8ec4c;}
.internal.Message.blue .action.bubble .notice {background: #b4d6e9; border: 1px solid #b4d6e9;}
.internal.Message.blue .dark .action.bubble .notice {background: #83c4e9; border: 1px solid #83c4e9;}
.internal.Message .action.bubble .notice em {color: #000000;}
.internal.Message.received .action.bubble .notice {border-top-left-radius: 0; border-bottom-left-radius: 0;}
.internal.Message.sent .action.bubble .notice {border-top-right-radius: 0; border-bottom-right-radius: 0;}
.internal.Message .action.bubble .message.icon {position: absolute; top: 15px; width: 50px; height: 50px;}
.internal.Message.received .action.bubble .message.icon {left: -25px;}
.internal.Message.sent .action.bubble .message.icon {right: -25px;}
.internal.Message .extra {margin-top: 15px; padding-top: 5px; border-top: 1px solid #bfbfbf; font-size: 12px; color: #4e4e4e;}

.Thread .icon {background: url('../img/system-sprite.png?d=20150804') no-repeat scroll 0 0; margin: 0; padding: 0; border: 0;}
.Thread .message.received.icon {background-position: -10px -559px;}
.Thread .message.sent.icon {background-position: -60px -559px;}
.Thread .left.arrow.icon {background-position: 0 -599px; width: 10px; height: 8px; display: inline-block;}
.Thread .revert .left.arrow.icon {-ms-transform: rotate(180deg); -webkit-transform: rotate(180deg); transform: rotate(180deg);}

.internal.Message .body em {font-style: italic;}
.internal.Message .body strong {font-weight: bold;}
.internal.Message .body img {width: 100%;}
.internal.Message .body img.messageBox {width: 70%;}

.internal.Message .info, .internal.Message .body {color: #000;}
.internal.Message .info {font-size: 11px; margin-bottom: 4px;}
.internal.Message.received .info, .internal.Message.received .body,
.internal.Message.received .info, .internal.Message.received .extra {text-align: right;}
.internal.Editor {clear: both; display: none; border-bottom: 1px solid #e1e4e7;}
.visible.internal.Editor {display: block;}
.internal.Message + .internal.Editor {padding-top: 5px;}
.internal.Editor .files {float: left; padding: 10px;}
.internal.Editor .attachment {margin-bottom: 5px;}
.internal.Editor .attachment .disabled {color: #000; text-decoration: none;}
.internal.Editor .send {padding: 10px;}
.internal.Editor .send button.disabled {opacity: .4;}
.internal.Editor .mce-tinymce {border-radius: 0; border-left-width: 0 !important; border-right-width: 0 !important;}
.internal.Editor .mce-btn button, .mce-window-head .mce-close {background: transparent;}

.internal.editor.trigger {width: 100%; text-align: center; margin: 25px 0;}
.internal.editor.trigger .button {display: inline-block;}
.internal.editor.trigger .button .icon {-webkit-transition: all 2s ease; -o-transition: all 2s ease; -ms-transition: all 2s ease; transition: all 2s ease;}

/* flash button fix for ff */
.internal.Editor .moxie-shim-flash object {width: 300px; height: 150px;}
.Attachments {margin: 30px -25px -30px; padding: 10px 25px; background: #ececec; border-top: 1px solid #d9d9d9; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px;}
.Attachments .label {padding: 0; text-align: left; font-weight: bold; margin-bottom: 10px;}
.Attachments li {overflow: hidden; margin-bottom: 4px;}
.Attachments li:before {content: ''; float: left; width: 24px; height: 30px; margin-right: 15px; background: url('../img/system-sprite.png?d=20150804') no-repeat scroll -65px -198px;}
.Attachments li a {display: inline-block; margin-top: 7px; width: 290px; overflow: hidden; text-overflow: ellipsis; line-height: 15px;}

/* accordion */
.Accordion .option {margin-bottom: 0;}
.Accordion .option + .item {display: none;}
.Accordion .option.active {margin-bottom: 20px;}
.Accordion .option.active + .item {display: block;}
.Accordion h2.option:before {display: none;}
.Accordion h2.option.active:before {display: inline-block;}
.form.Accordion {padding-bottom: 0;}

/* paypal button fix */
button[type='submit'].paypal-button {line-height: 1;}

/* css for timepicker */
.ui-widget {font-size: 13px;}
.ui-datepicker th {padding: 0.5em 0;}
#ui-datepicker-div {box-shadow: 0 0 5px #999;}
.ui-widget-header {background-color: #d5d5d5; background-image: none; white-space: nowrap;}
.ui-datepicker-title {font-weight: normal; color: #006093;}

.ui-widget-header .ui-datepicker-prev {left: 3px; top: 3px;}
.ui-widget-header .ui-datepicker-next {right: 3px; top: 3px;}
.ui-widget-header .ui-datepicker-prev .ui-icon {background-position: -216px -177px; width: 8px; height: 13px;}
.ui-widget-header .ui-datepicker-next .ui-icon {background-position: -226px -177px; width: 8px; height: 13px;}
.ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span {margin-left: -4px; margin-top: -6px;}

.ui-timepicker-div .ui-widget-header {margin-bottom: 8px;}
.ui-timepicker-div dl {text-align: left;}
.ui-timepicker-div dl dt {float: left; clear:left; padding: 0 0 0 5px;}
.ui-timepicker-div dl dd {margin: 0 10px 10px 45%;}
.ui-tpicker-grid-label {background: none; border: none; margin: 0; padding: 0;}
.ui-timepicker-rtl{direction: rtl;}
.ui-timepicker-rtl dl {text-align: right; padding: 0 5px 0 0;}
.ui-timepicker-rtl dl dt{float: right; clear: right;}
.ui-timepicker-rtl dl dd {margin: 0 45% 10px 10px;}
.ui_tpicker_time {font-size: 16px ;}
.ui-timepicker-div dl dt.ui_tpicker_time_label {padding-top: 2px;}

.ui-datepicker .ui-datepicker-buttonpane button {cursor: pointer; width: auto; overflow: visible; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; border: none; color: #fff; background: #0282c5; line-height: 29px; height: 29px; padding: 0 10px; margin: 5px 0;}
.ui-datepicker .ui-datepicker-buttonpane button.ui-priority-secondary {opacity: 1.0; filter:alpha(opacity=100); background: #606060;}
.ui-state-active, .ui-widget-content .ui-state-active {border: 1px solid #fc0; background: #fc0;}
.ui-datepicker .ui-datepicker-header {padding: 0;}


#notesList .noteRow,
#filesList .noteRow,
#uploadedFilesList .noteRow,
.filesUploadContainer .noteRow {padding: 15px 15px 15px 80px; border-bottom: 1px solid #d3d3d3; position: relative;}
.filesUploadContainer.editCarDetails .noteRow {padding: 15px 15px 15px 80px; border-top: 1px solid #d3d3d3; border-bottom: none; position: relative;}
#filesList .fileRow,
#uploadedFilesList .fileRow,
.filesUploadContainer .fileRow {padding: 15px;}
#notesList .noteRow:before,
#filesList .noteRow:before,
#uploadedFilesList .noteRow:before,
.filesUploadContainer .noteRow:before {content: ''; position: absolute; left: 15px; top: 13px; width: 50px; height: 40px; background-position: -52px -194px; background-repeat: repeat-x;}
.fileDownload {float: left; position: relative; width: 50px; height:15px;}
.fileDownload:before {content: ''; position: absolute; left: -5px; top: -11px; width: 50px; height: 40px; background-position: -52px -194px; background-repeat: repeat-x;}
.firstHeader.firstDownloadHeader {padding-left: 247px;}
#notesList .noteRowInfo,
#filesList .noteRowInfo,
.filesUploadContainer .noteRowInfo,
#filesList .noteRowContent p {font-size: 12px; color: #606060; padding-bottom: 7px;}
#uploadedFilesList .noteRowContent p {font-size: 12px; color: #606060; padding-bottom: 7px;}
#filesList .noteRowContent p {padding-bottom: 0;}
#uploadedFilesList .noteRowContent p {padding-bottom: 0;}
#uploadedFilesList .noteRowHeader {font-size: 15px; margin-bottom: 15px;}
#loadPreviousUploadedFiles,
#loadPreviousNotes,
#loadPreviousFiles {margin: 10px 20px 10px 15px;}
#loadPreviousNotes.withAdd,
#loadPreviousFiles.withAdd {margin-bottom: -10px;}
.notesForm {padding: 20px;}
.notesForm.editCarDetails {padding: 0 20px 0 150px;}
.notesForm label {width: 60px;}
.notesForm textarea {width: 410px;}
#saveNote,
#saveFile {margin: 10px 0 0 50px;}
.notesForm .reminderButton {margin: 10px 0 0 60px;}
#placeForNotesMessage {margin-bottom: 10px; position: relative;}
.closeNotesMessage {height: 17px; width: 18px; position: absolute; right: 10px; top: 10px; cursor: pointer; background-position: -100px -163px;}
.filesColumn {float: left;}
.filesColumn #browse {margin-top: 20px; margin-left: 80px;}
.customerRecord .halfSize #browse {margin-top: 20px; margin-left: 80px;}
.filesColumn #saveFile {margin-top: 20px; margin-left: 80px; margin-right: 20px;}
.filesColumnContainer #saveFile {margin-top: 20px; margin-left: 80px; margin-right: 20px;}
.filesUploadContainer {margin: -20px -20px 0;}
.filesUploadContainer.editCarDetails {margin: 0;}
.filesUploadContainer textarea {width: 411px;}
.filesUploadContainer .button {margin: 20px 20px 0 0;}
#uploadedFilesList .noteRowContent a ,
#filesList .noteRowContent a {margin-bottom: 7px; display: block; overflow: hidden; text-overflow: ellipsis; line-height: 1.1em;}

.noteRowRemove:before {background: url('../img/system-sprite.png?d=20150804') -225px -333px no-repeat; content:''; width: 11px; height: 11px; position: absolute; top: 3px; right: 0px;}
.noteRowRemove {float: right; margin-right: 5px; position: relative;}
.noteRowRemove:hover {color: #006093; cursor: pointer;}

.attachmentRemove {right: -30px;}
.reminderArea {display: none;}
.reminderArea.show {display: block;}
.reminderArea {padding: 10px 0 5px 60px; width: 468px;}
.reminderArea .input label {width: 110px; text-align: left; margin-bottom: 5px; display: block; padding: 0;}
.reminderArea .datetime .calender {top: 20px; left: 185px;}
.reminderArea .datetime .calenderIcon {top: 27px; left: 194px;}
.reminderArea .reminderUser {margin: 12px 0 5px 0;}
.reminderArea .checkbox {padding: 5px 10px 6px 6px; margin-bottom: 1px;}
.reminderArea .checkbox.checked {background-color: #5bb3d8; -webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;}
.reminderArea .checkbox input {margin: 1px 10px 0 0;}
.reminderArea .checkbox label {padding: 0; width: 230px; text-align: left; cursor: pointer;}
.reminderArea .checkbox.checked label {color: #fff;}

.notesRemindsRowCheckbox {position: absolute; top: 23px; right: 13px;}
.notesRemindsRowTable {display: table; padding-right: 50px;}
.notesRemindsRowTable .notesRemindsRowCell {display: table-cell; padding-top: 8px;}

.notesRemindsRow .remindDate .time {padding-left: 5px;}
.notesRemindsRow .remindDate > span {position: relative; padding: 5px 7px 6px 7px; text-align: center; color: #fff; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;}
.notesRemindsRow .noteRemindInfo {width: 30%;}
.notesRemindsRow .noteRemindContent {width: 69%;}
.notesRemindsRow .noteRowInfo {padding-left: 30px; padding-top: 4px;}
.notesRemindsRow .noteRowContent {padding-left: 30px;}
.notesRemindsRow .grayBg > span {background-color: #989898;}
.notesRemindsRow .blueBg > span {background-color: #4db9ff;}
.notesRemindsRow .greenBg > span {background-color: #a6d04d;}
.notesRemindsRow .redBg > span {background-color: #ff6961;}
.notesRemindsRow .orangeBg > span {background-color: #ffb540;}
.notesRemindsRow .yellowBg > span {background-color: #dcc210;}
.notesRemindsRow .remindPageLink {padding-left: 15px;}
.notesRemindsRow input[type='checkbox'] {visibility: hidden;}
.notesRemindsRow .prettyCheckbox {margin: 0;}

#notesList .noteRow.tickedOff:before {background-position: -189px -163px; height: 18px; left: 33px; top: 24px; width: 17px;}
#notesList .tickedOff .noteRowInfo {color: #aaa;}
#notesList .tickedOff .noteRowContent {color: #aaa;}
#notesList .tickedOff .remindDate > span {background-color: #d5d5d5;}
#notesList .tickedOff .prettyCheckbox {display: none;}

#showHidePassword, .showHideButton {font-style: italic; color: #606060; cursor: pointer; color: #006093;}
#passwordToShow, .showHideContent {display: none; padding-top: 7px;}

.password.row a.button {margin-left: 20px;}

.prettyCheckbox {background: #fff; border: 1px solid #D3D3D3; cursor: pointer; height: 20px; width: 20px; float: left; margin: 4px 10px -4px -3px;}
.prettyCheckbox.checked {position: relative;}
.prettyCheckbox.checked .check {background-position: -199px -194px; height: 16px; width: 15px; position: absolute; top: 1px; left: 2px;}
.form div.checkbox.pretty input {display: inline-block !important; margin-right: -15px;}
.form div.checkbox.pretty {margin-left: 213px;}
.loginForm div.checkbox.pretty input {display: none;}
.loginForm div.checkbox .prettyCheckbox {margin-left: 0;}
input[type='checkbox'].noPretty {margin: 1px 0 2px 0; padding: 0; width: 20px;}
.noPretty + .prettyCheckbox {display: none;}
.table .tableTd input[type='checkbox'] {display: none; margin: 0;}
.table .tableTd .prettyCheckbox {float: none; margin: -2px auto -6px;}

#chosingProductAndAddOns > div {display: table; margin: 0 auto;}

.singleProduct {margin: 0 auto; display: table-cell; padding: 0 15px; width: 1%;}
.singleProduct .productContainer {min-width: 250px; margin: 30px 0 0; overflow: hidden; border: 1px solid #d3d3d3; -webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;}
.singleProduct .productName {position: relative; padding: 0 20px 0 35px; height: 36px; line-height: 36px; background-position: 0 -100px; background-repeat: repeat-x; white-space: nowrap;}
.singleProduct .productName:before {content: ''; width: 18px; height: 10px; background-position: -142px -193px; position: absolute; bottom: -10px; left: 33px;}
.singleProduct .description {position: relative; padding: 20px 20px 20px 35px; background-color: #e9e9e9; border-top: 1px solid #cccccc; color: #606060;}
.singleProduct .description:before {content: ''; width: 18px; height: 10px; background-position: -162px -193px; position: absolute; bottom: -10px; left: 33px;}
.singleProduct .addOns {padding: 20px 30px 15px 29px; background-color: #f8f8f8; border-top: 1px solid #cccccc;}
.singleProduct .addOns .input {padding: 5px 10px 6px 6px; margin-bottom: 8px;}
.singleProduct .addOns .input.checked {background-color: #3d3e3c; -webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;}
.singleProduct .addOns .input.disabled {background-color: #9e9e9e; -webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;}
.singleProduct .addOns input {margin: 1px 10px 0 0; float: left;}
.singleProduct .addOns label {padding: 0; width: auto; display: block; text-align: left; cursor: pointer; padding-left: 23px;}
.singleProduct .addOns .input.checked label,
.singleProduct .addOns .input.disabled label {color: #fff;}
.singleProduct .addOns .addonsStaticExtension {background-color: #3d3e3c; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; color: #fff; padding: 5px 60px 18px 28px; margin-bottom: 8px; position: relative;}
.singleProduct .addOns .addonsStaticExtension:before {content: ''; width: 16px; height: 16px; background-position: -185px -365px; position: absolute; top: 5px; left: 5px;}
.singleProduct .addOns .addonsStaticExtension .included {position: absolute; bottom: 6px; right: 10px; font-style: italic;}
.singleProduct .terms {padding: 0px 20px 25px 35px; background-color: #e9e9e9; border-top: 1px solid #cccccc;}
.singleProduct .terms legend {width: auto; text-align: left; padding: 20px 0 10px 0; display: block;}
.singleProduct .terms span {margin-right: 20px; cursor: pointer;}
/* this is option in case, when many terms can by selected /
.singleProduct .terms span.selected,
.singleProduct .terms span.def {padding: 4px 8px 5px 6px; margin: 0 12px 0 -6px; color: #fff; background-color: #5bb3d8; -webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;}
/**/
/* this is option in case, when only one term can by selected */
.singleProduct .terms span.selected {padding: 4px 8px 5px 6px; margin: 0 12px 0 -6px; color: #fff; background-color: #3d3e3c; -webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;}
/**/
.singleProduct .periods {padding: 20px 35px 10px 35px; background-color: #f7f7f7; border: 2px solid #1b1918; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; margin-top: -2px;}
.singleProduct .periods input {padding: 0; margin: 5px 10px 0 0;}
.singleProduct .periods label {padding: 4px 8px 5px 6px; text-align: left; cursor: pointer; width: auto; margin-bottom: 10px;}
.singleProduct .periods label.selected {position: relative; color: #fff; background-color: #3d3e3c; -webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;}
.singleProduct .periods label.selected:before {content: ''; width: 6px; height: 12px; background-position: -199px -210px; position: absolute; top: 6px; left: -6px;}
.singleProduct .periods .periodSeparator {clear: both;}
.singleProduct .periods .periodsLabel {color: #1b1918; font-weight: bold; border-bottom: 2px solid #1b1918; margin: 0 -35px 20px; padding: 0 0px 20px 65px; background:0; background-position: 0; background-repeat: repeat-x; position: relative;}
.singleProduct .periods .periodsLabel:after {content: ''; position: absolute; bottom: -11px; left: 34px; width: 17px; height: 11px; background-position: -165px -389px;}
/*.singleProduct .periods .periodsLabel:before {content: ""; position: absolute; top: -5px; left: 28px; width: 28px; height: 26px; background:0;}*/
.singleProduct .periods .periodsLabel:before {content: ''; position: absolute; top: -1px; left: 34px; width: 17px; height: 18px; background-position: -189px -163px;}

.singleProduct .motservice {padding: 20px 35px 10px 35px; background-color: #f7f7f7; border: 2px solid #c05900; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; margin-top: -2px; margin-bottom: 5px;}
.singleProduct .motservice .motserviceLabel {border-bottom: 2px solid #c05900; margin: 0 -35px 20px; padding: 0 0px 20px 65px; background-position: 0 -30px; background-repeat: repeat-x; position: relative;}
.singleProduct .motservice .motserviceLabel:after {content: ''; position: absolute; bottom: -11px; left: 34px; width: 17px; height: 11px; background-position: -191px -388px;}
.singleProduct .motservice .motserviceLabel:before {content: ''; position: absolute; top: -5px; left: 28px; width: 28px; height: 26px; background-position: -209px -370px;}
.singleProduct .motservice input {padding: 0; margin: 5px 10px 0 0; float: left;}
.singleProduct .motservice label {padding: 4px 8px 5px 6px; text-align: left; cursor: pointer; width: auto; margin-bottom: 10px;}
.singleProduct .motservice label.selected {position: relative; color: #fff; background-color: #5bb3d8; -webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;}
.singleProduct .motservice label.selected:before {content: ''; width: 6px; height: 12px; background-position: -199px -210px; position: absolute; top: 6px; left: -6px;}
.singleProduct .motservice .periodSeparator {clear: both;}

.singleProduct .productTableSpacer {display: none;}

#chosingProductAndAddOns .groupForm.productsCount1 .singleProduct .productContainer {width: auto;}
#chosingProductAndAddOns .groupForm.productsCount1 .singleProduct .addOns,
#chosingProductAndAddOns .groupForm.productsCount1 .singleProduct .terms,
#chosingProductAndAddOns .groupForm.productsCount1 .singleProduct .motservice,
#chosingProductAndAddOns .groupForm.productsCount1 .singleProduct .periods {width: 100%;}
#chosingProductAndAddOns .groupForm.productsCount1 .singleProduct .productTableSpacer {width: 10px; display: table-cell;}

.dynamicSubmit {display: none; text-align: right; padding: 20px 0 10px 0; margin-top: 10px; border-top: 1px solid #cccccc;}


/* icons to popup, after text (using text) */
#chosingProductAndAddOns a.showPopup {padding: 0 6px 0 5px; font-weight: bold; border: 2px solid #fc0; color: #fc0; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; font-size: 10px; vertical-align: top; margin-left: 5px;}
#chosingProductAndAddOns div.checked a.showPopup {border-color: white; color: white;}
#chosingProductAndAddOns div.checkbox a.showPopup {padding: 1px 6px 2px 5px; display: inline-table; vertical-align: top;}

/* popup */
.reveal-modal h2 {line-height: 32px; border-radius: 3px; color: white; background-color: #0282C5; padding: 0 15px; margin-bottom: 10px; font-size: 16px;}
.reveal-modal h3 {margin-bottom: 5px;}
.reveal-modal h3:before {content: ''; width: 16px; height: 16px; background: url('../img/system-sprite.png?d=20150804') -189px -163px no-repeat; display: inline-block; margin-right: 10px;}
.reveal-modal p {margin-bottom: 15px;}
.reveal-modal p.special {color: #0681C5;}
.reveal-modal p.specialRed {color: red;}
.reveal-modal p.sign {float: right; font-style: italic; margin-top: 20px; margin-bottom: 5px;}
#myModal3.reveal-modal h3:before, #myModal6.reveal-modal h3:before {width: 17px; height: 18px; background: url('../img/system-sprite.png?d=20150804') -215px -256px no-repeat;}
.reveal-modal h3.note:before {background: none; content: none;}
.reveal-modal img { float: right; margin-left: 300px;}

.reveal-modal ol,
.reveal-modal ul {padding-left: 30px;}
.reveal-modal .dropdown ol,
.reveal-modal .dropdown ul {padding-left: 0;}
.reveal-modal li {padding-bottom: 10px;}
.reveal-modal ul.list-style li {list-style: circle;}
.reveal-modal ol.list-style li {list-style: decimal;}

.reveal-modal.mot-service-popup h2 {line-height: 14px; border-radius: 3px; color: white; background-color: #0282C5; padding: 10px 15px; margin-bottom: 10px; font-size: 14px;}
.reveal-modal.mot-service-popup i {font-style: italic;}
.reveal-modal.mot-service-popup .action-link {display: block; padding: 10px 30px; text-align: center; border: 1px solid #006093; margin-top: 20px;}
.reveal-modal.mot-service-popup p.sign {margin-top: 46px;}
.reveal-modal.mot-service-popup img {margin-left: 0;}
.reveal-modal.mot-service-popup .left-side-img {float: left; width: 150px; margin: 0;}
.reveal-modal.mot-service-popup .mot-service-msg {display: none; padding: 10px 30px; text-align: center; border: 1px solid #dc482c; margin-top: 20px; color: #dc482c;}
.reveal-modal.mot-service-popup .mot-service-msg.success {border: 1px solid #009100; color: #009100;}
.reveal-modal.mot-service-popup h3 {font-weight: bold;}
.reveal-modal.mot-service-popup h3:before {display: none;}
.reveal-modal.mot-service-popup h3:after {content: ''; width: 16px; height: 6px; background-position: -112px -197px; display: inline-block; margin-left: 10px; margin-bottom: 1px;}
.reveal-modal.mot-service-popup h3.inactive:after {-ms-transform: rotate(-90deg); -webkit-transform: rotate(-90deg); transform: rotate(-90deg); margin-bottom: 1px;}

.policyNumber {position: absolute; overflow: hidden; right: 0; top: 0; color: #fff; width: 455px; height: 40px; z-index: 1001;}
.policyNumber .transform {position: absolute; right: -7px; top: -20px; background-color: #1b1918; width: 455px; height: 40px; transform: rotate(5deg); -ms-transform: rotate(5deg); -webkit-transform: rotate(5deg);}
.policyNumber .number {position: absolute; top: 7px; right: 9px; color: #fff; z-index: 1002; font-size: 15px;}
.policyNumber a {color: #fff;}

.quoteAdditionalMenu {position: absolute; right: 2px; top: -116px; color: #fff; z-index: 1100;}
.quoteAdditionalMenu .button {margin-right: 14px;}

#chosingProductAndAddOns .notice {margin-top: 45px;}

button.mobileNaviButton {background-color: transparent; width: 34px; height: 34px; background-position: 0 2px; border: none; margin: -17px 12px 0 auto; cursor: pointer;}
.mobileNaviButton.user {background-position: -58px 2px;}
.mobileNaviButton.active {background-position: -30px 2px;}
.mobileNaviButton.blue {background-position: 0 -25px;}
.mobileNaviButton.blue.active {background-position: -30px -27px;}
.header .mobileNaviButton {position: absolute; top: 12px; right: 20px; margin: 0;}

.callbackForm .half {width: 50%; float: left;}
.callbackForm .input {padding: 0 20px 0 20px;}
.callbackForm .textarea {padding-top: 10px;}
.callbackForm .dropdown,
.callbackForm textarea {width: 100%;}
.callbackForm label {padding: 0 0 5px 7px; text-align: left;}
.callbackForm .checkbox.small {float: right; padding: 3px 27px 0 0;}
.callbackForm .checkbox.small label {padding-top: 7px; width: auto;}
.callbackForm .topInfo {background-color: #f8f8f8; border-bottom: 1px solid #d3d3d3; clear: both; color: #606060; display: block; margin: 0 0 20px; padding: 15px 20px 15px 20px; position: relative;}
.callbackForm .topInfo:before {background: url('../img/system-sprite.png?d=20150804') 0 0 no-repeat; content: ''; width: 18px; height: 10px; background-position: -215px -203px; position: absolute; bottom: -1px; left: 40px;}
.callbackForm .topInfo .row {padding: 4px 0;}
.callbackForm .datetime .calenderIcon {right: 33px;}
.callbackForm .datetime .calender {right: 25px;}
.callbackForm .reminderArea {padding: 0 20px; width: 100%;}
.callbackForm .reminderArea .reminderUser {padding-left: 7px;}
.callbackForm .reminderArea .checkbox label {width: 90%;}
.callbackForm .modalButtons {border-top: 1px solid #d3d3d3; margin-top: 15px; padding: 20px;}
.callbackForm .createdBy {display: none; font-size: 12px; color: #606060; padding: 15px 20px 0 27px;}
.callbackForm .markAsCompleated {margin-left: 10px;}
.callbackForm .modalButtons.loadMore {margin-top: 0;}
.callbackForm .modalButtons.loadMore .callbackWideButtons button {margin-bottom: 20px;}

.callbackForm .hiddenListRow .topInfo {border-top: 1px solid #d3d3d3; margin-bottom: 0;}
.callbackForm .hiddenListRow .modalButtons {margin: 0; border: none;}
.callbackForm .hiddenListRow .modalButtons a,
.callbackForm .hiddenListRow .modalButtons button {margin-right: 10px;}
.callbackForm .hiddenListRow .half {padding-right: 10px;}
.callbackForm .hiddenListRow .message {margin-bottom: 0;}

.callbackCalendar .tableThead .tableTd {text-align: center;}
.callbackCalendar .tableTr .tableTd {padding: 0 7px 7px 7px; background-color: #efefef;}
.callbackCalendarElement {cursor: pointer; margin-top: 7px; padding: 0 0 9px 0; color: #fff; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px;}
.callbackCalendarElement > div {margin-top: 5px; padding: 5px 7px 0 7px;}
.callbackCalendarElement > div.remindTitle {padding-top: 2px;}
.callbackCalendarElement .remindDate {padding: 0; margin: 0; border-bottom: 1px solid rgba(255, 255, 255, .30);}
.callbackCalendarElement .remindDate > span {position: relative; padding: 5px 7px 6px 7px; text-align: center; color: #fff; display: block; font-size: 18px;}
.callbackCalendarElement .remindDate .time span:before {margin-bottom: -2px;}
.callbackCalendarElement.blue {background-color: #4db9ff;}
.callbackCalendarElement.green {background-color: #a6d04d;}
.callbackCalendarElement.red {background-color: #ff6961;}

.policyTimeline {display: none; position: absolute; top: 57px; right: -6px; z-index: 1101; width: auto; background-color: #fff; box-shadow: 0 0 3px #999; border-radius: 3px 3px 3px 3px; border: 1px solid #eee; padding: 10px;}
.policyTimeline:before {content: ''; position: absolute; right: 46px; top: -10px; width: 18px; height: 11px; background-position: -215px -303px;}
.policyTimeline .policyTimelineRow {display: table-row; color: #606060;}
.policyTimeline div.policyTimelineRow {background-color: #e9e9e9;}
.policyTimeline a.policyTimelineRow div {border-bottom: 1px solid #e9e9e9;}
.policyTimeline a.policyTimelineRow:last-child div {border-bottom: none;}
.policyTimeline .policyTimelineRow div {display: table-cell; padding: 10px;}
.policyTimeline .policyTimelineRow .timelineNumber {white-space: nowrap;}
.policyTimeline .policyTimelineRow .timelineDate span {white-space: nowrap;}
.policyTimeline .policyTimelineRow .blue {color: #0681C5;}
.policyTimeline .policyTimelineRow .green {color: #009100;}
.policyTimeline .policyTimelineRow .red {color: #ce3535;}
.policyTimeline.forQuote {top: -65px;}
.policyTimeline.forQuote:before {right: 28px;}
.policyTimeline.forQuoteFinal {top: -6px;}
.policyTimeline.forQuoteFinal:before {right: 46px;}

.hiddenReminders {box-shadow: 0 0 7px #999; display: none; cursor: pointer; z-index: 1099; padding: 20px 30px; position: fixed; bottom: 0; left: 10px; background-color: #dc482c; color: #fff; -webkit-border-radius: 5px 5px 0 0; -moz-border-radius: 5px 5px 0 0; border-radius: 5px 5px 0 0;}
.hiddenReminders span {font-weight: bold; padding: 10px 16px; line-height: 16px; font-size: 16px; color: #fff; background-color: #dc482c; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px;}


/* Customer record */
.customer .icon:before {background: url('../img/system-sprite.png?d=20150804') -221px -318px no-repeat; content:''; width: 15px; height: 15px; position: absolute; top: 7px; left: 7px;}
.customer span.icon {position:relative; display: inline-block; width: 32px; height: 32px; margin: 0 8px 0 0; border-radius: 16px; border: 1px solid #cfcfcf; vertical-align: middle;}
.customer .name h3 {font-size: 18px; margin: 20px 0 10px 0;}
.customer .name:after, .customer .email {clear: both;}
.customer .row {padding: 3px 20px 10px;}
.customer .nameSection {padding: 20px; margin: 0 0 13px 0; border-bottom: 1px solid #d3d3d3; overflow: hidden;}
.customer .photo {border: 2px solid #bfbfbf; border-radius: 50%; width: 95px; height: 95px; overflow: hidden; text-align: center; float: left; margin: 0 50px 0 0;}
.customer .nameSection .name h3 {display: inline-block; margin-right: 15px;}
.customer .nameSection .name a {display: inline-block;}
.customer .messages {display: table; margin-left: 43px;}
.customer .password.row a.button {margin-left: 43px;}
.customer .messages .messagesRow {display: table-row;}
.customer .messages .messagesCell {display: table-cell; padding-bottom: 10px;}
.customer .messages .messagesCell .button {width: 110px; text-align: center;}
.customer a.viewEmails {font-size: 12px; margin-left: 15px;}

.customer .password span.icon:before {background-position: -217px -159px; width: 18px;}
.customer .homePhone span.icon:before {background-position: -128px -190px; width: 14px;}
.customer .workPhone span.icon:before {background-position: -205px -349px; height: 18px;}
.customer .mobilePhone span.icon:before {background-position: -221px -350px; height: 16px;}
.customer .vat span.icon:before {background-position: -221px -331px ; height: 16px;}
.dTable {width: 100%; display: table;}
.customer .table > .tableTr, .customer .table > .tableThead {width: 100%;}
.customer .tableTr:nth-child(even) .tableTd {background-color: transparent;}
.withoutBottomBorder {border-bottom: none;}
.customer .table.address .tableTr .tableTd {line-height: 22px; cursor: pointer;}
.customer .table.address .tableTr .tableTd a {display: none;}

.customer .table.address .tableTr .tableTd:hover {background-color: #e1e1e1;}
.customer .table.address .tableTr .tableTd:hover a {display: inline-block;}
.customer .table.address .tableTr .tableTd.empty {cursor: default;}
.customer .table.address .tableTr .tableTd.empty a {display: inline-block;}
.customer .table.address .tableTr .tableTd.empty:hover {background-color: #efefef;}
.customer .table.address a.button.fRight.gray {margin-top: -10px; margin-left: 10px;}

.customerRecordAdditionalMenu {position: absolute; top: -58px; right: -592px;}
.customerRecord {margin-top: -25px; padding-bottom: 50px;}
.customerRecord .halfSize {float: left;}
.customerRecord .halfSize {float: left;}
.customerRecord .header h2 {padding: 0 30px;}
.customerRecord #flashMessage {position:relative; top: -45px;}



.timelineContainer {padding: 20px; position: relative; background: #f0f0f0 url('../img/timeline.gif') 50% 0 repeat-y;}
.timelineContainer .timelineIcon {width: 50px; height: 50px; border-radius: 25px; border: 1px solid #0081c5; position: absolute; background-color: #F0F0F0; top: 50%; margin-top: -25px;}
.timelineContainer .timelineIcon.purpule {border-color: #5f4bc8;}
.timelineContainer .timelineIcon.blue {border-color: #0081c5;}
.timelineContainer .timelineIcon span {background: url('../img/system-sprite.png?d=20150804'); height: 20px; display: block; margin: 15px auto; width: 21px;}
.timelineContainer .timelineIcon.edit span {background-position: -124px -401px;}
.timelineContainer .timelineIcon.activity span {background-position: -124px -401px;}
.timelineContainer .timelineIcon.approve span {background-position: -193px -401px;}
.timelineContainer .timelineIcon.email span {background-position: -215px -404px; height: 16px;}
.timelineContainer .timelineIcon.warranty span {background-position: -77px -401px;}
.timelineContainer .timelineIcon.logout span {background-position: -76px -419px;}
.timelineContainer .timelineIcon.loggedin span {background-position: -50px -419px;}
.timelineContainer .timelineIcon.callback span {background-position: -5px -422px; width: 20px;}
.timelineContainer .timelineIcon.note span {background-position: -3px -401px; width: 20px;}
.timelineContainer .timelineIcon.quote span {background-position: -50px -401px;}
.timelineContainer .timelineIcon.postalRemoved span {background-position: -126px -420px;}
.timelineContainer .timelineIcon.postalAdded span {background-position: -103px -420px;}
.timelineContainer .timelineIcon.postalChanged span {background-position: -148px -420px;}
.timelineContainer .timelineIcon.postalArchived span {background-position: -25px -445px;}
.timelineContainer .timelineIcon.billingRemoved span {background-position: -192px -420px;}
.timelineContainer .timelineIcon.billingAdded span {background-position: -172px -420px;}
.timelineContainer .timelineIcon.billingChanged span {background-position: -215px -420px;}
.timelineContainer .timelineIcon.billingArchived span {background-position: -4px -445px;}
.timelineContainer .timelineIcon.installmentPaid span {background-position: -179px -464px;}
.timelineContainer .timelineIcon.installmentRejected span {background-position: -208px -464px;}

.timelineContainer .timelineIcon.warrantyPurchased span {background-position: -124px -483px;}
.timelineContainer .timelineIcon.warrantyActivated span {background-position: -73px -483px;}
.timelineContainer .timelineIcon.warrantyCancelled span {background-position: -99px -483px;}
.timelineContainer .timelineIcon.warrantyRefunded span {background-position: -43px -483px;}
.timelineContainer .timelineIcon.warrantyCreated span {background-position: -43px -483px;}

.timelineContainer .timelineIcon.claimCreated span {background-position: -43px -527px; width: 24px; height:27px; margin-top: 10px;}
.timelineContainer .timelineIcon.claimChanged span {background-position: -105px -527px; width: 24px; height:27px; margin-top: 10px;}
.timelineContainer .timelineIcon.claimAccepted span {background-position: -76px -527px; width: 24px; height:27px; margin-top: 10px;}
.timelineContainer .timelineIcon.claimRejected span {background-position: -16px -497px; width: 24px; height:27px; margin-top: 10px;}

.timelineContainer .timelineIcon.fileAdded span {background-position: -190px -531px; width: 24px; height:27px; margin-top: 10px;}

.timelineContainer .timelineIcon.messageRead span {background-position: -125px -463px; width: 23px;}
.timelineContainer .timelineIcon.messageSent span {background-position: -70px -464px; width: 23px; height: 14px; margin-top: 17px;}
.timelineContainer .timelineIcon.messageReceived span {background-position: -98px -463px;}

.timelineContainer .timelineIcon.transferStarted span {background-position: -69px -445px; width: 24px;}
.timelineContainer .timelineIcon.transferPaid span {background-position: -148px -445px; width: 24px;}
.timelineContainer .timelineIcon.transferAccepted span {background-position: -96px -445px; width: 24px;}
.timelineContainer .timelineIcon.transferCancelled span {background-position: -124px -445px; width: 24px;}
.timelineContainer .timelineIcon.transferPartial span {background-position: -177px -445px; width: 24px;}

.timelineContainer .timelineIcon.message {padding: 0;}
.timelineContainer .timelineIcon.message span {background-position: -25px -403px;}
.timelineContainer .timelineItem {width: 50%; margin: 5px 0;}
.timelineContainer .timelineItem.leftItem {float: left; margin-right: 30px; text-align: right;}
.timelineContainer .timelineItem.leftItem .timelineIcon {float: right; right: -27px;}
.timelineContainer .timelineItem.rightItem {float: right; margin-left: 30px;}
.timelineContainer .timelineItem.rightItem .timelineIcon {float: left; left: -25px; text-align: left;}
.timelineContainer .timelineItem .timelineItemDescriptioin {clear: both; position: relative; background: #fcfcfc; line-height: 18px; min-height: 50px; border: 1px solid #9a9c9a; border-radius: 5px; color: #1b1918; padding: 15px 0 10px 0; font-size: 16px;}
.timelineContainer .timelineItem.leftItem .timelineItemDescriptioin {padding-right: 40px;}
.timelineContainer .timelineItem.rightItem .timelineItemDescriptioin {padding-left: 40px;}
.timelineContainer .timelineItem time {color: #9f9f9f; padding: 7px 25px; float: right;}
.timelineContainer .timelineItem.rightItem time {float: left;}
.timelineContainer .timelineBottom {clear: both;}
.timelineContainer.emptyBg {background: #f0f0f0;}
.timelineBottom {text-align: center;}
.toggleButton {background-position: -141px -217px; height: 15px; position: absolute; left: 15px; top: 24px; width: 21px; cursor: pointer;}
.toggleButton.show {background-position: -162px -217px;}
.settingsArea .header {margin: 0 0 20px 0; cursor: move;}
.settingsArea .header.disabled {cursor: default;}
.settingsArea .header.halfSize {float: left; margin: 0 0 20px 30px; max-height: 62px;}
.settingsArea .header.fullSize {clear: both; margin: 0 0 20px 30px; width: 1060px;}
.settingsArea .header .fRight {margin-top: -7px;}
.settingsArea .delete {margin-left: 30px;}
.settingsArea .ui-state-highlight {height: 64px; margin: 0 0 20px 30px; min-width: 515px; clear:both; max-width: 1060px;}
.settingsArea .ui-state-highlight.halfSize {float: left; clear: none;}

.timelineContainer .timelineIcon.vehicleCreated span {background-position: -43px -506px; width: 25px;}
.timelineContainer .timelineIcon.vehicleChanged span {background-position: -100px -506px; width: 25px;}
.timelineContainer .timelineIcon.vehiclePhoto span {background-position: -15px -533px; width: 25px;}
.timelineContainer .timelineIcon.vehicleMileage span {background-position: -159px -506px; width: 25px;}
.timelineContainer .timelineIcon.vehicleReg span {background-position: -131px -506px; width: 25px;}
.timelineContainer .timelineIcon.vehicleMot span {background-position: -160px -535px; width: 25px;}
.timelineContainer .timelineIcon.vehicleService span {background-position: -130px -535px; width: 25px;}
.timelineContainer .timelineIcon.vehicleNewClaim span {background-position: -43px -526px; width: 25px; height: 30px; margin-top: 10px;}
.timelineContainer a.button {display: block; margin: auto; width: 165px; text-align: center;}
.sortableItem .marginSeparator {margin-top: 25px;}
.sortableItem .content {margin-bottom: 25px;}

.button.settings:before {background-position: -117px -382px; width: 18px; height: 18px; top: 7px; left: 7px;}
span.useAddress {position: relative; margin-right: 30px;}
span.useAddress a.button:after {width: 0; height: 0; border-style: solid; border-width: 6px 0 6px 6px; border-color: transparent transparent transparent #0282C5; position: absolute; right: -6px; top: 10px; z-index: 1004; content:'';}

.assignTo {float: none; border-bottom: 1px solid #DADADA; margin-bottom: 25px;}
.assignTo .dropdown {min-width: 300px;}
.email-template-textarea{width: 100%; height: 300px;}

h1.padding {padding: 20px 20px 0 20px;}
.absRight10 {position: absolute; top: -10px; right: 25px;}
.messageVin {margin-left: 20px; margin-right: 20px;}
.button.marginTopMinus {margin-top: -7px; margin-left: 15px;}
.hide {display: none;}

.descriptionSection {padding: 20px 20px 20px 230px; font-size: 15px; line-height: 22px;}


.leftCol {width:30%; float: left; overflow: hidden;}
.leftCol .userDetails{background: #ffd400; padding: 1.2rem; color: #FFFFFF; line-height: 1.5; margin-bottom: 30px; color: #000; font-weight: 400; display: flow-root;}
.leftCol .userInfo{padding: 0 0 20px 0; border-bottom: 1px solid #63a3c7; margin-bottom: 20px;}
.leftCol .userDetails h2{font-size: 24px; margin-bottom: 20px; line-height: 30px;}
.leftCol .userDetails h2 strong {font-weight: bold; }
.leftCol .userDetails button {margin: 0px !important;}
.leftCol .userDetails button a {color: #f7f7f7;}

.leftCol .userDetails .icon:before {background: url('../img/system-sprite.png?d=20150804') -221px -561px no-repeat; width: 15px; height: 15px; position: absolute; top: 7px; left: 7px;}
.leftCol .userDetails span.icon {position:relative; display: inline-block; width: 22px; height: 22px; margin: 0px 8px 0 0; vertical-align: middle;}
.leftCol .userDetails .email .fLeft {white-space: nowrap; margin-right: -10%;}
.leftCol .userDetails .phone span.icon:before {background-position: -196px -561px;}
.leftCol .userDetails .phone, .userDetails .email {margin-bottom: 20px;}
.leftCol .lastMessageBoxHeader {padding-left: 13%;}
.leftCol .lastMessageBoxHeader > h2 {padding-right: 0;}
.leftCol .lastMessageBox { padding: 20px 13%; background: #FFFFFF; border: 1px solid #d5d5d5; border-top: none;}
.leftCol .lastMessageBox .message.icon{height: 50px; top: 15px; width: 50px; float: left; background-position: -60px -609px;}
.lastMessageBox.Thread .body {clear: both; padding-top: 20px; color: #303030;}
.lastMessageBox.Thread .body a {color: #303030;}
.lastMessageBox.Thread .body strong {font-weight: bold;}
.lastMessageBox.Thread .body em {font-style: italic;}
.lastMessageBox.Thread .body img {display: none;}
.lastMessageBox.Thread .messageType {color: #000000;}
.lastMessageBox.Thread .messageType span{color: #5098ca;}
.lastMessageBox.Thread .info {color: #5f5f5f; margin-left: 20px; line-height: 1.6em; float: left;}
.leftCol .lastMessageBox.lastMessageBoxButtons {margin-bottom: 30px;}
.rightCol {width: 68%; float: left; margin-left: 2%;}
.rightCol .section {display: flex; flex-wrap: nowrap; padding: 10px 0 25px 0;}
.rightCol .section img {width: 32px; height: 32px; margin-top: 4px; margin-right: 10px; }
.rightCol .section .title {font-size: 1.5rem; line-height: 1.5; font-weight: bold; color: #1b1918;}
.aa-account-navbar {flex-direction: column !important; gap: 15px;}

.vehicleTable .tableTd a {margin:0; padding: 0; display: inline-block;}
.vehicleTable .tableTr .tableTd,
.vehicleTable .tableTr:nth-child(even) .tableTd {background: #ffffff; padding: 10px; vertical-align: middle;}
.vehicleTable .tableTr .tableTd.firstTd { padding: 10px; width: 120px; border-right: none; text-align: center;}
.vehicleTable .tableTd a.vehicleName {padding-left: 10px;}
.vehicleTable div.tableTd, .vehicleTable div.tableTd a {vertical-align: middle;}
.noBorderRight {border-right: none;}
.white {background: #FFFFFF;}
.vehicleImageContainer {border-bottom: 1px solid #eeeeee; text-align: center; margin-bottom: 20px; }
.vehicleImageContainer .info, .vehiclePhoto span.info, td.carDetails .half .info {color: #b8b8b8; font-size: 11px; }
.form.white h2::before, .form h2.coverHeader::before {background-position: -214px -302px;}
.form h2.coverHeader {font-weight: bold; color: #000000; margin: 0; font-size: 16px;}
.twoColumnsForm div.formGroup.vehiclePhoto {text-align: center;}
.twoColumnsForm div.formGroup.vehiclePhoto.mobile {display: none;}
.hr {border-top:1px solid #d3d3d3; margin-bottom: 20px;}
.twoColumnsForm .formFooter.marginBottom.white {padding: 20px 0; margin:0;}
.form.twoColumnsForm.white {padding-bottom: 0; border-bottom: 1px solid #fff;}

table.vehiclesList {border-spacing: 0; border-collapse: inherit; border: 1px solid #d5d5d5; border-width: 0 1px 1px 0; width: 100%;}
td.header {border: 1px solid #d5d5d5; color: #8e8e8e; font-weight: bold; border-width: 0 0 0 1px;}
td.header.second {border-width: 0 1px; width: 32%;}
td.header.third {border-width: 0; width: 30%;}
td.header.first {border-width: 0 0 0 1px; width: 28%;}
td.header span {color: #252525; font-weight: normal;}
td.carDetails {border: none;}

td.carDetails .contentContainer {position: relative;}
td.carDetails .content {background: #FFFFFF; display: table; width: 100%;}
.contentContainer.pointer:before {z-index: 1004; content: ''; width: 22px; height: 11px; background: url('../img/system-sprite.png?d=20150804') no-repeat scroll -27px -178px;; position: absolute; top: -9px; left: 28px;}
td.carDetails .left {width: 60%; padding: 20px 10px 20px 20px; display: table-cell;}
td.carDetails .right {width: 40%; padding: 20px; border-left: 1px solid #ededed; display: table-cell; vertical-align: top;}
td.carDetails .half {width: 50%; float: left;}
td.carDetails .half.image {padding-right: 20px;}
td.carDetails .half.carData {font-weight: bold; color: #8e8e8e; border: 1px solid #ffffff;}
td.carDetails .half.carData strong {color: #252525;}
td.carDetails .left .half img {width: 100%; max-width: 240px;}
td.carDetails .left .half .row {margin-bottom: 10px; line-height: 1.7em}
td.carDetails .left .half.carData .row:last-child {margin-bottom: 0;}
td.carDetails .right div {margin-bottom: 25px;}
td.carDetails .right div.last {margin-bottom: 0;}
td.carDetails .right div a {font-size: 1.2em; display: block; margin-bottom: 5px;}
td.carDetails .right div span.info { font-size: 0.85em; margin: 0 0 0 3px; display: inline-block; color: #b8b8b8;}
.greenArrow, .orangeArrow, .redArrow {text-align: center; padding: 0; vertical-align: middle; cursor: pointer; min-width: 35px;}

.greenArrow span, .orangeArrow span, .redArrow span {width:28px; height: 14px; background: url('../img/system-sprite.png?d=20150804') -115px -613px no-repeat; display: inline-block;}
.redArrow span {background-position: -147px -613px;}
.orangeArrow span {background-position: -179px -613px}

.greenArrow.show span, .orangeArrow.show span, .redArrow.show span{background: url('../img/system-sprite.png?d=20150804') -134px -555px no-repeat; display: inline-block; width:14px; height: 28px;}
.greenArrow.show span {background-position: -152px -555px;}
.orangeArrow.show span {background-position: -116px -555px;}

.keyInfo {border: 1px solid #c3c3c3; background: #f7f7f7; font-size: 14px; padding: 10px 20px 10px 0; margin-top: 30px; color: #8e8e8e;}
.keyInfo .keyLabel, .keyInfo .greenArrow, .keyInfo .orangeArrow, .keyInfo .redArrow {float: left; line-height: 29px; margin: 0 30px 0 25px; min-width: 100px; text-align: left;}
.keyInfo .greenArrow span, .keyInfo .orangeArrow span, .keyInfo .redArrow span {float:left; height:19px; width:18px; background: url('../img/system-sprite.png?d=20150804') -133px -586px no-repeat; margin-top: 6px;}
.keyInfo .greenArrow span {background-position: -152px -586px;}
.keyInfo .orangeArrow span {background-position: -116px -586px;}

.noVehicles {border: 1px solid #d5d5d5; background-color: #e1e1e1; border-top: none; padding: 10px 20px;}
.noVehicles .button {margin-left: 20px;}

.userVehicleImage {margin-bottom: 10px;}
.button.silver.upload.vehUpload {background: #f4f4f4; color: #3191cd; cursor: pointer;}
.button.silver.upload.vehUpload span{background: url('../img/system-sprite.png?d=20150804') -218px -539px no-repeat; width: 18px; height: 35px; display: inline-block; font-size: 14px;}
.imageLoading {background: url('../img/preloader.gif') center center no-repeat; display: inline-block;}
.imageLoading img.userVehicleImage {border:1px solid #ececec;}

.select2-container {box-sizing: border-box; display: inline-block; margin: 0; position: relative; vertical-align: middle;}
.select2-container .select2-selection--single {box-sizing: border-box; cursor: pointer; display: block; height: 28px; user-select: none; -webkit-user-select: none;}
.select2-container .select2-selection--single .select2-selection__rendered {display: block; padding-left: 8px; padding-right: 20px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.select2-container[dir='rtl'] .select2-selection--single .select2-selection__rendered {padding-right: 8px; padding-left: 20px;}
.select2-container .select2-selection--multiple {box-sizing: border-box; cursor: pointer; display: block; min-height: 32px; user-select: none; -webkit-user-select: none;}
.select2-container .select2-selection--multiple .select2-selection__rendered {display: inline-block; overflow: hidden; padding-left: 8px; text-overflow: ellipsis; white-space: nowrap;}
.select2-container .select2-search--inline {float: left;}
.select2-container .select2-search--inline .select2-search__field {box-sizing: border-box; border: none; font-size: 100%; margin-top: 5px;}
.select2-container .select2-search--inline .select2-search__field::-webkit-search-cancel-button {-webkit-appearance: none;}
.select2-dropdown {background-color: white; border: 1px solid #aaa; border-radius: 4px; box-sizing: border-box; display: block; position: absolute; left: -100000px; width: 100%; z-index: 1051;}
.select2-results {display: block;}
.select2-results__options {list-style: none; margin: 0; padding: 0;}
.select2-results__option {padding: 6px; user-select: none; -webkit-user-select: none; border-left: 1px solid #fff;}
.select2-results__option[aria-selected] {cursor: pointer;}
.select2-container--open .select2-dropdown {left: 0;}
.select2-container--open .select2-dropdown--above {border-bottom: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0;}
.select2-container--open .select2-dropdown--below {border-top: none; border-top-left-radius: 0; border-top-right-radius: 0;}
.select2-search--dropdown {display: block; padding: 4px;}
.select2-search--dropdown .select2-search__field {padding: 4px; width: 100%; box-sizing: border-box;}
.select2-search--dropdown .select2-search__field::-webkit-search-cancel-button {-webkit-appearance: none;}
.select2-search--dropdown.select2-search--hide {display: none;}
.select2-close-mask {border: 0; margin: 0; padding: 0; display: block; position: fixed; left: 0; top: 0; min-height: 100%; min-width: 100%; height: auto; width: auto; opacity: 0; z-index: 99; background-color: #fff; filter: alpha(opacity=0);}
.select2-hidden-accessible {border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px;}
.select2-container--default .select2-selection--single {background-color: #fff; border: 1px solid #D3D3D3;}
.select2-container--default .select2-selection--single .select2-selection__rendered {color: #444; line-height: 28px;}
.select2-container--default .select2-selection--single .select2-selection__clear {cursor: pointer; float: right; font-weight: bold;}
.select2-container--default .select2-selection--single .select2-selection__placeholder {color: #999;}
.select2-container--default .select2-selection--single .select2-selection__arrow {height: 26px; position: absolute; top: 1px; right: 1px; border-left: 1px solid #E4E4E4; width: 32px;}
.select2-container--default .select2-selection--single .select2-selection__arrow b {border-color: #7b7b7b transparent transparent transparent; border-style: solid; border-width: 6px 6px 0 6px; height: 0; left: 50%; margin-left: -6px; margin-top: -2px; position: absolute; top: 50%; width: 0;}
.select2-container--default[dir='rtl'] .select2-selection--single .select2-selection__clear {float: left;}
.select2-container--default[dir='rtl'] .select2-selection--single .select2-selection__arrow {left: 1px; right: auto;}
.select2-container--default.select2-container--disabled .select2-selection--single {background-color: #eee; cursor: default;}
.select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__clear {display: none;}
.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {border-color: transparent transparent #888 transparent; border-width: 0 4px 5px 4px;}
.select2-container--default .select2-selection--multiple {background-color: white; border: 1px solid #aaa; border-radius: 4px; cursor: text;}
.select2-container--default .select2-selection--multiple .select2-selection__rendered {box-sizing: border-box; list-style: none; margin: 0; padding: 0 5px; width: 100%;}
.select2-container--default .select2-selection--multiple .select2-selection__placeholder {color: #999; margin-top: 5px; float: left;}
.select2-container--default .select2-selection--multiple .select2-selection__clear {cursor: pointer; float: right; font-weight: bold; margin-top: 5px; margin-right: 10px;}
.select2-container--default .select2-selection--multiple .select2-selection__choice {background-color: #e4e4e4; border: 1px solid #aaa; border-radius: 4px; cursor: default; float: left; margin-right: 5px; margin-top: 5px; padding: 0 5px;}
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {color: #999; cursor: pointer; display: inline-block; font-weight: bold; margin-right: 2px;}
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover {color: #333;}
.select2-container--default[dir='rtl'] .select2-selection--multiple .select2-selection__choice, .select2-container--default[dir='rtl'] .select2-selection--multiple .select2-selection__placeholder {float: right;}
.select2-container--default[dir='rtl'] .select2-selection--multiple .select2-selection__choice {margin-left: 5px; margin-right: auto;}
.select2-container--default[dir='rtl'] .select2-selection--multiple .select2-selection__choice__remove {margin-left: 2px; margin-right: auto;}
.select2-container--default.select2-container--focus .select2-selection--multiple {border: solid black 1px; outline: 0;}
.select2-container--default.select2-container--disabled .select2-selection--multiple {background-color: #eee; cursor: default;}
.select2-container--default.select2-container--disabled .select2-selection__choice__remove {display: none;}
.select2-container--default.select2-container--open.select2-container--above .select2-selection--single, .select2-container--default.select2-container--open.select2-container--above .select2-selection--multiple {border-top-left-radius: 0; border-top-right-radius: 0;}
.select2-container--default.select2-container--open.select2-container--below .select2-selection--single, .select2-container--default.select2-container--open.select2-container--below .select2-selection--multiple {border-bottom-left-radius: 0; border-bottom-right-radius: 0;}
.select2-container--default .select2-search--dropdown .select2-search__field {border: 1px solid #aaa;}
.select2-container--default .select2-search--inline .select2-search__field {background: transparent;  border: none; outline: 0;}
.select2-container--default .select2-results > .select2-results__options {max-height: 200px; overflow-y: auto;}
.select2-container--default .select2-results__option[role=group] {padding: 0;}
.select2-container--default .select2-results__option[aria-disabled=true] {color: #999;}
.select2-container--default .select2-results__option[aria-selected=true] {color: #006093; border-left: 1px solid #0081C5; padding-left: 5px; margin-left: 1px;}
.select2-container--default .select2-results__option .select2-results__option {padding-left: 1em;}
.select2-container--default .select2-results__option .select2-results__option .select2-results__group {padding-left: 0;}
.select2-container--default .select2-results__option .select2-results__option .select2-results__option {margin-left: -1em; padding-left: 2em;}
.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option {margin-left: -2em; padding-left: 3em;}
.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option {margin-left: -3em; padding-left: 4em;}
.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option {margin-left: -4em; padding-left: 5em;}
.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option {margin-left: -5em; padding-left: 6em;}
.select2-container--default .select2-results__option--highlighted[aria-selected] {color: #006093; border-left: 1px solid #0081C5; padding-left: 5px; margin-left: 1px;}
.select2-container--default .select2-results__group {cursor: default; display: block; padding: 6px;}

.asideMenuButtons > a,
.asideMenuButtons > a.button,
.asideMenuButtons > span,
.asideMenuButtons > button {background-color: #fff; color: #606060;}
.asideMenuButtons > a.renewButton,
.asideMenuButtons > a.button.renewButton,
.asideMenuButtons > span.renewButton,
.asideMenuButtons > button.renewButton {background-color: #a6d04d; color: #000;}
/*.asideMenuButtons > button.renewButton {background-color: #a6d04d; color: #fff;}*/

.form h2.firstHeader.hideBefore:before {display:none;}

.form .formFieldRightButton.documents {padding: 0 10px 5px 0;}
.form .formFieldRightButton.documents ul li {padding-top: 25px; margin-left: -8px;}

.systemStaticPage {line-height: 24px;}
.systemStaticPage p {padding-bottom: 30px;}
.systemStaticPage h2 {font-size: 30px; color: #000; margin-bottom: 35px;}
.systemStaticPage h2 span {display: block; font-size: 14px; padding: 0 10px 5px 2px; margin-top: 10px;}
.systemStaticPage h3 {margin: 0 0 30px 0; border-bottom: 1px solid #d3d3d3; font-size: 20px; padding-bottom: 16px;}
.systemStaticPage h4 {font-weight: bold; padding-bottom: 20px;}
.systemStaticPage .side.left {float: left; width: 235px; text-align: center;}
.systemStaticPage .side.left .woman {margin-top: 25px;}
.systemStaticPage .side.right {padding: 50px 145px 20px 235px;}
.systemStaticPage .side.right .frame {border: 1px solid #d2d2d2; padding: 30px 35px 15px 40px; background-color: #ffffff; margin-bottom: 30px;}
.systemStaticPage .side.right .frame p {padding-bottom: 15px;}
.systemStaticPage .side.right .frame.motInfo {background: #ffffff url('../img/making-a-claim-mot.jpg') 52px 50% no-repeat; padding: 45px 35px 25px 260px; margin-top: 20px;}
.systemStaticPage .side.right .frame.grey {background-color: #ebebeb; padding: 15px 35px 0 40px;}
.systemStaticPage .side.right .mot {float: left;}
.systemStaticPage .number {background-color: #0282c4; border: 5px solid #3591c1; width: 60px; height: 60px; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; color: #fff; font-size: 20px; line-height: 46px; margin: 34px auto 0;}
.systemStaticPage ul {padding: 0 0 20px 42px;}
.systemStaticPage ul li {line-height: 24px; padding-bottom: 15px;}

.systemStaticPage .warning,
.systemStaticPage .accepted,
.systemStaticPage .rejected,
.systemStaticPage ul li {position: relative; padding-left: 40px;}

.systemStaticPage .warning {padding-left: 30px;}

.systemStaticPage .warning:before,
.systemStaticPage .accepted:before,
.systemStaticPage .rejected:before,
.systemStaticPage ul li:before {background: transparent url('../img/making-a-claim-icons.png') 0 0 no-repeat; content: ''; position: absolute; left: 0; top: 1px; width: 23px; height: 23px; background-position: 0 0;}

.systemStaticPage .accepted:before {background-position: -25px 0;}
.systemStaticPage .rejected:before {background-position: -53px 0;}
.systemStaticPage ul li:before {background-position: -77px 0;}

.radio-v2 {
    display: flex;
    align-items: center;
}

.radio-v2 input {
    width: 30px !important;
    min-width: 30px !important;
    height: 30px !important;
    border: 3px solid #1b1918 !important;
}

.radio-v2 label {
    padding: 0 0 0 10px !important;
    text-align: left !important;
}

/* Stripe */
.StripeElement {
    box-sizing: border-box;

    min-height: 49px;

    padding: 14px 12px;

    border: 2px solid #9a9c9a;
    border-radius: 4px;
    background-color: white;

    box-shadow: none;
    -webkit-transition: box-shadow 150ms ease;
    transition: box-shadow 150ms ease;
}

.StripeElement--focus {
    border-color: #1b1918;
    box-shadow: 0 5px 5px -3px rgb(0 0 0 / 20%), 0 8px 10px 1px rgb(0 0 0 / 14%), 0 3px 14px 2px rgb(0 0 0 / 12%);
}

.StripeElement--invalid {
    border-color: #fa755a;
}

.StripeElement--webkit-autofill {
    background-color: #fefde5 !important;
}

a.button.nav-button-right-spacer {
    margin-right: 2rem;
}

.no-left-padding {
    padding-left: 0 !important;
}

.w99 {width: 99%;}
.w49 {width: 49%;}
.w33 {width: 33%;}
/* --- */


.quote-checklist .checkbox {
    margin-left: 10px !important;
    width: 100% !important;
}

.update-vehicle-table .checkbox {
    margin-left: 0 !important;
    padding-left: 0 !important;
    width: 100% !important;
}

.not-aa #custom-webchat-button {
    display: none;
}
