/*
 *  INFINITI CSM UI WIDE SCREEN STYLES
 *  Bundle enhances the styles.scss styles for wide viewports.
 */
/* MIXINS */
/* STANDARDS */
/*
 *  SHARED CSM DESIGN STANDARDS
 *  Contains mappings from design concepts to styles
 */
/* PROPORTIONS */
/* GRID PROPORTIONS */
/* NB. Uses border-box model */
/* Z-INDICES */
/*
 *  INFINITI DESIGN STANDARDS
 *  Contains mappings from design concepts to styles
 */
/* TEMPORARY PATH CONFIG */
/* COLOURS */
/* Required for use with IE gradients */
/* SEMANTIC COLOURS */
/* FONTS */
/* TEXT PROPORTIONS */
/* SMACSS CATEGORIES */
/*
 *  NISSAN CSM UI WIDE BASE STYLES
 *  Enhance the existing base styles for wide viewports.
 */
html {
  height: 100%;
  /* Full height for sticky footer */
  min-height: 100%;
  /* Full height for sticky footer */
  overflow: -moz-scrollbars-vertical;
  /* Make vertical scrollbar always show */
  overflow-y: scroll;
  /* Make vertical scrollbar always show */
}

body {
  font-size: 0.8125em;
  height: 100%;
  /* Full height for sticky footer */
  min-height: 100%;
  /* Full height for sticky footer */
  min-width: 880px;
  /* Set a min-width for IE and print */
}

h1, .admin-vehicle-title, .admin-user-title {
  font-size: 2.30769em;
  margin: 0.83333em 0.65359%;
  padding-bottom: 0.5em;
}

h2 {
  font-size: 1.53846em;
}

h3 {
  font-size: 1.23077em;
}

h4 {
  font-size: 1.23077em;
  margin: 0.625em 0;
}

p {
  line-height: 1.61538em;
  margin: 1.53846em 0;
}

hr {
  margin: 1.92308em 0;
}

input[type="email"], input[type="number"], input[type="password"], input[type="search"], input[type="tel"], input[type="text"], input[type="url"], input[type="color"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="month"], input[type="time"], input[type="week"],
select {
  /* See Bourbon. Target all HTML5 text inputs. */
  padding: 0.69231em 0.92308em 0.76923em;
  /* Target height of 38px excl border*/
  margin: 0 0 0.38462em;
  width: 18.84615em;
  height: 3.07692em;
}

select {
  padding: 0.61538em 0.92308em 0.69231em;
  /* Target height of 37px excl border*/
}

input[type=submit], .button {
  margin: 1.53846em 0;
  line-height: normal;
  padding: 0.76923em 2.30769em;
}

/* Checkboxes and Radio buttons - */
input[type=checkbox],
input[type=radio] {
  height: 24px;
  width: 24px;
  opacity: 0;
  vertical-align: middle;
  z-index: 1;
  /* Raise above label:before */
  position: absolute;
  left: 0;
}

input[type=radio] {
  height: 19px;
  width: 19px;
}

/* Use label:before to hold checkbox/radio image */
input[type=checkbox] + label:before,
input[type=radio] + label:before {
  background: url(/Content/images/infiniti/sprite-sheet.png) no-repeat;
  content: " ";
  height: 24px;
  width: 24px;
}

input[type=radio] + label:before {
  height: 19px;
  width: 19px;
}

.lt-ie9 input[type=checkbox] + label:before,
.lt-ie9 input[type=radio] + label:before {
  display: none;
}

/* NB. Requires specific element order. */
input[type=checkbox] + label:before {
  background-position: -48px 0;
}

input[type=checkbox]:hover + label:before {
  background-position: -104px 0;
}

input[type=checkbox]:checked + label:before {
  background-position: -160px 0;
}

input[type=checkbox][disabled] + label:before {
  background-position: -216px 0;
}

input[type=checkbox][disabled]:checked + label:before {
  background-position: -272px 0;
}

input[type=radio] + label:before {
  background-position: -48px -31px;
}

input[type=radio]:hover + label:before {
  background-position: -101px -31px;
}

input[type=radio]:checked + label:before {
  background-position: -154px -31px;
}

input[type=radio][disabled] + label:before {
  background-position: -207px -31px;
}

input[type=radio][disabled]:checked + label:before {
  background-position: -260px -31px;
}

/* NB. If browser doesn't understand selector, will ignore all selectors for rule, must use a rule for each. */
::-webkit-input-placeholder {
  color: transparent !important;
}

:focus::-webkit-input-placeholder {
  color: transparent !important;
}

:-moz-placeholder {
  color: transparent !important;
}

:focus:-moz-placeholder {
  color: transparent !important;
}

::-moz-placeholder {
  color: transparent !important;
}

:focus::-moz-placeholder {
  color: transparent !important;
}

:-ms-input-placeholder {
  color: transparent !important;
}

:focus:-ms-input-placeholder {
  color: transparent !important;
}

fieldset {
  margin: 0.76923em 0;
}

legend {
  font-size: 0.84615em;
  margin: 0 0 0.76923em;
}

label {
  line-height: 1.53846em;
}

/*
 *  NISSAN CSM UI WIDE LAYOUT STYLES
 *  Enhance the existing layout styles for wide viewports.
 */
/* MIXINS */
/* GRID STYLES */
.layout-grid-1 {
  display: block;
  /* Repeat declarations from mobile so the mixin can be used independently */
  float: left;
  margin-left: 0.65359%;
  margin-right: 0.65359%;
  position: relative;
  /* Width is the column width percentage times column count,
      take the width of the left and right column margins */
  width: 7.02614%;
}

.layout-grid-2 {
  display: block;
  /* Repeat declarations from mobile so the mixin can be used independently */
  float: left;
  margin-left: 0.65359%;
  margin-right: 0.65359%;
  position: relative;
  /* Width is the column width percentage times column count,
      take the width of the left and right column margins */
  width: 15.35948%;
}

.layout-grid-3 {
  display: block;
  /* Repeat declarations from mobile so the mixin can be used independently */
  float: left;
  margin-left: 0.65359%;
  margin-right: 0.65359%;
  position: relative;
  /* Width is the column width percentage times column count,
      take the width of the left and right column margins */
  width: 23.69281%;
}

.layout-grid-4 {
  display: block;
  /* Repeat declarations from mobile so the mixin can be used independently */
  float: left;
  margin-left: 0.65359%;
  margin-right: 0.65359%;
  position: relative;
  /* Width is the column width percentage times column count,
      take the width of the left and right column margins */
  width: 32.02614%;
}

.layout-grid-5 {
  display: block;
  /* Repeat declarations from mobile so the mixin can be used independently */
  float: left;
  margin-left: 0.65359%;
  margin-right: 0.65359%;
  position: relative;
  /* Width is the column width percentage times column count,
      take the width of the left and right column margins */
  width: 40.35948%;
}

.layout-grid-6 {
  display: block;
  /* Repeat declarations from mobile so the mixin can be used independently */
  float: left;
  margin-left: 0.65359%;
  margin-right: 0.65359%;
  position: relative;
  /* Width is the column width percentage times column count,
      take the width of the left and right column margins */
  width: 48.69281%;
}

.layout-grid-7 {
  display: block;
  /* Repeat declarations from mobile so the mixin can be used independently */
  float: left;
  margin-left: 0.65359%;
  margin-right: 0.65359%;
  position: relative;
  /* Width is the column width percentage times column count,
      take the width of the left and right column margins */
  width: 57.02614%;
}

.layout-grid-8 {
  display: block;
  /* Repeat declarations from mobile so the mixin can be used independently */
  float: left;
  margin-left: 0.65359%;
  margin-right: 0.65359%;
  position: relative;
  /* Width is the column width percentage times column count,
      take the width of the left and right column margins */
  width: 65.35948%;
}

.layout-grid-9 {
  display: block;
  /* Repeat declarations from mobile so the mixin can be used independently */
  float: left;
  margin-left: 0.65359%;
  margin-right: 0.65359%;
  position: relative;
  /* Width is the column width percentage times column count,
      take the width of the left and right column margins */
  width: 73.69281%;
}

.layout-grid-10 {
  display: block;
  /* Repeat declarations from mobile so the mixin can be used independently */
  float: left;
  margin-left: 0.65359%;
  margin-right: 0.65359%;
  position: relative;
  /* Width is the column width percentage times column count,
      take the width of the left and right column margins */
  width: 82.02614%;
}

.layout-grid-11 {
  display: block;
  /* Repeat declarations from mobile so the mixin can be used independently */
  float: left;
  margin-left: 0.65359%;
  margin-right: 0.65359%;
  position: relative;
  /* Width is the column width percentage times column count,
      take the width of the left and right column margins */
  width: 90.35948%;
}

.layout-grid-12 {
  display: block;
  /* Repeat declarations from mobile so the mixin can be used independently */
  float: left;
  margin-left: 0.65359%;
  margin-right: 0.65359%;
  position: relative;
  /* Width is the column width percentage times column count,
      take the width of the left and right column margins */
  width: 98.69281%;
}

.layout-content {
  padding-left: 0.65359%;
  padding-right: 0.65359%;
}

.layout-max-width-content {
  padding-left: 2.1875%;
  padding-right: 2.1875%;
}

.layout-max-width-content-narrow {
  padding-left: 0;
  padding-right: 0;
}

.layout-max-width-content-wide {
  position: relative;
  /* Then apply max width on wide :D */
  margin-left: auto;
  margin-right: auto;
  max-width: 1280px;
  padding-left: 2.1875%;
  padding-right: 2.1875%;
}

.layout-only-mobile {
  display: none !important;
}

.layout-only-desktop {
  display: block !important;
}

.layout-only-mobile-inline {
  display: none !important;
}

.layout-only-desktop-inline {
  display: inline-block !important;
}

.layout-sticky-footer-content-wrapper {
  margin: 0 auto -4.15385em;
  min-height: 100%;
}

.layout-sticky-footer,
.layout-sticky-footer-push {
  height: 4.15385em;
}

.layout-form-column {
  display: block;
  float: left;
  margin-left: 0.65359%;
  margin-right: 0.65359%;
  position: relative;
  width: 430px;
}

.layout-form-column-aside {
  display: block;
  right: 0.65359%;
  left: 490px;
  /* Form column plus a gap B) */
  position: absolute;
  top: 0;
  bottom: 0.76923em;
}

/*
 *  NISSAN CSM UI WIDE MODULE STYLES
 *  Enhance the existing module styles for wide viewports.
 */
/* SMALL COMPONENTS */
.tabs-small li a {
  padding: 0.92308em 1.92308em;
}

.tabs-large {
  margin: 1.53846em 0 0;
}
.tabs-large li {
  width: 15.38462em;
  border-bottom: none;
  /* Reset borders */
  border-left: none;
  border-right: none;
  border-top: 1px solid rgba(255, 255, 255, 0.2);
  position: relative;
  /* Required for abs-relative positioning of pseudo-borders */
  /* IE9 AND IE8 FALLBACKS */
  /* THE ACTUAL APPROACH */
}
.lt-ie10 .tabs-large li {
  border-top: 1px solid rgba(255, 255, 255, 0.2);
  border-left: 1px solid rgba(255, 255, 255, 0.1);
  border-right: 1px solid rgba(255, 255, 255, 0.1);
  border-bottom: none;
}
.lt-ie10 .tabs-large li:before, .lt-ie10 .tabs-large li:after {
  display: none;
}
.lt-ie9 .tabs-large li {
  border-top: 1px solid #aaaaaa;
  border-left: 1px solid #646464;
  border-right: 1px solid #646464;
  border-bottom: none;
}
.tabs-large li:before, .tabs-large li:after {
  /* Make a 1px pseudo-border on left and right with a linear gradient. Won't work in IE < 10. */
  background-color: transparent;
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(255, 255, 255, 0.2)), color-stop(100%, transparent));
  background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.2), transparent);
  background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 0.2), transparent);
  background-image: -ms-linear-gradient(top, rgba(255, 255, 255, 0.2), transparent);
  background-image: -o-linear-gradient(top, rgba(255, 255, 255, 0.2), transparent);
  background-image: linear-gradient(top, rgba(255, 255, 255, 0.2), transparent);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#33FFFFFF', endColorstr='#00000000');
  zoom: 1;
  /* In IE, elements must have layout for filters to apply */
  content: " ";
  position: absolute;
  width: 1px;
  height: 100%;
  max-height: 200px;
  top: 0;
}
.tabs-large li:before {
  left: 0;
}
.tabs-large li:after {
  right: 0;
}
.tabs-large .is-current {
  background-color: transparent;
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0, 0, 0, 0.5)), color-stop(100%, transparent));
  background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.5), transparent);
  background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0.5), transparent);
  background-image: -ms-linear-gradient(top, rgba(0, 0, 0, 0.5), transparent);
  background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0.5), transparent);
  background-image: linear-gradient(top, rgba(0, 0, 0, 0.5), transparent);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#80000000', endColorstr='#00000000');
  zoom: 1;
  /* In IE, elements must have layout for filters to apply */
}

.service-status {
  font-size: 1em;
  /* Same as container */
  line-height: 1;
}

.accordion.subscriptions {
  margin: -1.15385em 0 0;
  min-height: 20px;
}
.accordion.narrow-accordion {
  border-bottom: none;
  margin: 0 0 30px 0;
}
.accordion.narrow-accordion > li > .collapsed {
  height: auto;
}
.accordion.narrow-accordion > li:first-child {
  clear: none;
}
.accordion.narrow-accordion > li .desktop-heading {
  display: block;
}
.accordion.narrow-accordion > li > .accordion-header {
  background: none;
  border: none;
  font-family: "Infiniti Meta", Helvetica, Arial, sans-serif;
  margin: 0;
  padding: 0;
  display: none;
}
.accordion.narrow-accordion > li > .accordion-header:before {
  display: none;
}
.accordion.narrow-accordion > li > .accordion-body {
  background: none;
  border: none;
  margin-bottom: 0;
  padding: 0;
}
.accordion.narrow-accordion > li > .accordion-body:before, .accordion.narrow-accordion > li > .accordion-body:after {
  display: none;
}
.accordion.narrow-accordion > li > .accordion-body.active {
  display: block;
}
.accordion.narrow-accordion > li.active > .accordion-header {
  border: none;
}
.accordion.narrow-accordion > li.active > .accordion-header:before {
  display: none;
}

.button.emphasised,
input[type=submit].emphasised,
.emphasised.button {
  display: inline-block;
  vertical-align: baseline;
  zoom: 1;
  *display: inline;
  *vertical-align: auto;
  width: auto;
}

/* NB. There are no .button-add styles on infiniti. */
/* CONSTANTS */
.form-field {
  *zoom: 1;
  position: relative;
  margin: 0 0 0.38462em;
  width: 100%;
  min-width: 33.07692em;
}
.form-field:before, .form-field:after {
  content: " ";
  display: table;
}
.form-field:after {
  clear: both;
}

.field-validation-error,
.form-error-summary {
  font-size: 0.84615em;
}

.form-field > .label {
  display: block;
  clear: left;
  float: left;
  width: 15.90909em;
  font-weight: normal;
  margin-top: 0;
  text-transform: uppercase;
}

.form-field > label {
  /* Used on registration form? */
  margin: 0.30769em 0 0.76923em;
}

fieldset.form-field {
  margin: 1.15385em 0 0;
}
fieldset.form-field .label {
  padding: 0;
}

.form-field .field-validation-valid,
.form-field .field-validation-error {
  font-size: 0.84615em;
  width: 209px;
}
.form-field .field-validation-error {
  margin: 0 0 0 15.90909em;
}
.form-field + .form-field > .field-validation-error {
  margin-top: 0.36364em;
}
.form-field .form-field-note,
.form-field .form-field-short-note {
  margin-left: 15.90909em;
  width: 23.18182em;
}

.form-field-controls {
  display: table;
  min-height: 37px;
  /* See Bourbon. Target all HTML5 text inputs.
  input[type="email"], input[type="number"], input[type="password"], input[type="search"], input[type="tel"], input[type="text"], input[type="url"], input[type="color"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="month"], input[type="time"], input[type="week"],
  select {
      margin: 0;
      width: wem($input-width);
  } */
  /* When field has been validated, show tick */
}
.form-field-controls > label {
  clip: auto;
  height: auto;
  overflow: visible;
  position: static;
  width: auto;
  /* Un-hide on wide */
  display: table-cell;
  padding-right: 0.9375em;
  vertical-align: middle;
  width: 13.46154em;
}
.form-field-controls.inline-form {
  float: left;
}
.form-field-controls.inline-form > label {
  width: auto;
}
.form-field-controls .label-optional {
  right: 3.30769em;
  top: 0.38462em;
}
.form-field-controls .field-text- + .label-optional,
.form-field-controls .field-text + .status-icon + .label-optional {
  right: 3.30769em;
}
.form-field-controls .field-text,
.form-field-controls .field-select,
.form-field-controls input.validated {
  width: 16em;
  margin: 0;
}
.form-field-controls .field-text + .status-icon,
.form-field-controls .field-select + .status-icon,
.form-field-controls input.validated + .status-icon {
  margin-left: 0.7em;
}
.form-field-controls input.valid,
.form-field-controls select.valid {
  float: left;
}
.form-field-controls input.valid, .form-field-controls input.valid + .status-icon,
.form-field-controls select.valid, .form-field-controls select.valid + .status-icon {
  top: 0;
  background-position: -18px -44px;
  height: 37px;
}

.form-field-confirmation {
  line-height: auto;
  margin: 0 0 0.76923em;
}
.form-field-confirmation label {
  line-height: 1;
  vertical-align: auto;
}
.form-field-confirmation .controls {
  margin-top: 0.38462em;
  min-height: auto;
  /* Reset min-height */
  padding-left: 35px;
  /* Checkbox width + 1em */
  padding-top: 5px;
}

.form-field-link {
  font-size: 0.92308em;
  margin: 0.58333em 0 0.08333em 14.66667em;
}

.form-error-summary {
  font-size: 0.84615em;
  margin: 1.81818em 0;
}

.form-actions {
  margin-top: 1.92308em;
}

.form-confirmation-actions {
  margin-top: 1.92308em;
  padding: 0 0 1.15385em;
  /* Only bottom padding */
}

.form-field-note {
  font-size: 0.84615em;
  margin: 0.45455em 0 0.90909em;
  /* Bottom has 5px from form-field */
}

.form-field-short-note {
  font-size: 0.84615em;
  margin: 0.63636em 0 0.18182em;
  /* Bottom has 5px from form-field */
}

.form-button-row {
  /* Form button row lets inline-block buttons be contained in a block with collapsing margins */
  margin: 1.15385em 0;
  /* Will sum to 20px with inner button margins */
}

.form-button-row > input,
.form-button-row > button,
.form-button-row > .button {
  margin-top: 0.38462em;
  /* Will sum to 10px if buttons wrap over a line */
  margin-bottom: 0.38462em;
}

.form-actions {
  /* Form actions surrounds buttons in a padded div with a margin up top and border */
  margin-top: 1.92308em;
  padding: 1.15385em 0;
  /* Will sum to 20px with inner button margins */
}

.form-actions > input,
.form-actions > button,
.form-actions > .button {
  margin-top: 0.38462em;
  /* Will sum to 10px if buttons wrap over a line */
  margin-bottom: 0.38462em;
  margin-right: 0.76923em;
}

.form-actions input[type=submit], .form-actions .button {
  position: relative;
  top: -1px;
  /* Align with next button */
}

.form-actions .button.tertiary {
  position: relative;
  top: 0;
}

.form-field-terms {
  margin: 1.53846em 0;
}

.form-field-terms > div {
  font-size: 0.84615em;
  line-height: 2em;
}

/* CUSTOM SELECTS */
.js .custom-select {
  height: 37px;
}

.js .custom-select-underlay {
  padding: 0.76923em 0.76923em 0.53846em 0.92308em;
  /* Target height of 38px excl border*/
  top: 0;
  width: 16em;
  height: 100%;
}
.js .custom-select-underlay .placeholder {
  display: none;
}

.js .custom-select + .custom-select-underlay,
.js .custom-select + .status-icon + .custom-select-underlay {
  width: 16em;
}

/* Custom radio and checkbox fields for when field is marked up so.
   Uses the general approach from Ajaxian here: http://ajaxian.com/archives/custom-css-inputs */
.form-radios-checkboxes {
  float: left;
  width: 15.38462em;
}

.form-field-checkbox,
.form-field-radio {
  float: left;
  margin: 0 0 0.76923em;
  padding-left: 19px;
  width: 50%;
}

.brand-identity-area {
  text-align: right;
  z-index: 0;
  display: none;
}

.brand-identity-image {
  position: absolute;
  bottom: 2.30769em;
  right: 0;
  max-width: 100%;
}

.vehicle-name {
  font-size: 1em;
  margin: 0 0 0.76923em;
}
.vehicle-name .year {
  font-size: 2.30769em;
}
.vehicle-name .model {
  font-size: 6.15385em;
  line-height: 1.0625em;
}
.vehicle-name .nickname {
  font-size: 2.30769em;
}

.vehicle-name.small {
  margin: 0;
}
.vehicle-name.small .year {
  font-size: 1em;
  letter-spacing: normal;
  line-height: 1;
}
.vehicle-name.small .model {
  font-size: 2.53846em;
  letter-spacing: normal;
  line-height: 1;
}
.vehicle-name.small .nickname {
  font-size: 1em;
  letter-spacing: normal;
  line-height: 1.53846em;
}

.vehicle-name .infobar {
  position: absolute;
  top: 0;
  left: 0;
  padding-left: 15px;
  width: 100%;
  background-color: rgba(0, 0, 0, 0.2);
  height: 3.07692em;
  line-height: 3.07692em;
}
.vehicle-name .infobar span {
  display: inline-block;
  line-height: 1em;
  color: #949494;
  margin-top: 0;
  margin-bottom: 0;
  margin-right: 10px;
  padding-right: 10px;
  border-right: 1px solid #949494;
}
.vehicle-name .infobar span:last-of-type {
  border-right: none;
}
.vehicle-name .infobar .info-driver, .vehicle-name .infobar .key {
  position: static;
  text-indent: 0;
  background: none;
  width: auto;
  height: auto;
}
.vehicle-name .infobar .key:before {
  content: "";
  background: url(/Content/images/infiniti/sprite-sheet.png) no-repeat;
  display: inline-block;
  vertical-align: baseline;
  zoom: 1;
  *display: inline;
  *vertical-align: auto;
  height: 17px;
  width: 20px;
  background-position: -292px -87px;
  position: relative;
  top: 4px;
  margin-right: 5px;
}
.vehicle-name .infobar .info-driver:before {
  content: "";
  background: url(/Content/images/infiniti/sprite-sheet.png) no-repeat;
  display: inline-block;
  vertical-align: baseline;
  zoom: 1;
  *display: inline;
  *vertical-align: auto;
  height: 17px;
  width: 17px;
  background-position: -313px -87px;
  position: relative;
  top: 4px;
  margin-right: 5px;
}

.primary-link {
  font-size: 1em;
}

.secondary-link {
  font-size: 1em;
}

.detail-list {
  padding: 10px 0 0 176px;
}
.detail-list dt {
  clear: both;
  float: left;
  font-size: 1em;
  margin: 0 0 30px -176px;
  width: 166px;
}
.detail-list dd {
  float: left;
  margin: 0 0 30px 0;
  width: 100%;
}

.detail-wrapper {
  /* TODO: Bit of a mess in here. Flatten and make less crazy */
  padding: 0.38462em 0 1.92308em;
  display: table;
}
.detail-wrapper.two-column {
  /* This is to make there be two equal-height columns with gradient backgrounds */
}
.detail-wrapper.two-column .detail-list {
  display: table-cell;
  vertical-align: top;
  background-clip: padding-box;
  background-color: transparent;
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(90, 75, 85, 0.2)), color-stop(100%, transparent));
  background-image: -webkit-linear-gradient(to right bottom, rgba(90, 75, 85, 0.2), transparent);
  background-image: -moz-linear-gradient(to right bottom, rgba(90, 75, 85, 0.2), transparent);
  background-image: -ms-linear-gradient(to right bottom, rgba(90, 75, 85, 0.2), transparent);
  background-image: -o-linear-gradient(to right bottom, rgba(90, 75, 85, 0.2), transparent);
  background-image: linear-gradient(to right bottom, rgba(90, 75, 85, 0.2), transparent);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#335A4B55', endColorstr='#00000000');
  zoom: 1;
  /* In IE, elements must have layout for filters to apply */
  float: none;
  padding: 20px 20px 0px 196px;
  width: 45%;
  margin-top: 0;
  /* Override narrow */
}
.detail-wrapper.two-column .detail-list:first-child {
  /* And with a 20px clear division between them */
  background-color: transparent;
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(90, 75, 85, 0.2)), color-stop(100%, transparent));
  background-image: -webkit-linear-gradient(to left bottom, rgba(90, 75, 85, 0.2), transparent);
  background-image: -moz-linear-gradient(to left bottom, rgba(90, 75, 85, 0.2), transparent);
  background-image: -ms-linear-gradient(to left bottom, rgba(90, 75, 85, 0.2), transparent);
  background-image: -o-linear-gradient(to left bottom, rgba(90, 75, 85, 0.2), transparent);
  background-image: linear-gradient(to left bottom, rgba(90, 75, 85, 0.2), transparent);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#335A4B55', endColorstr='#00000000');
  zoom: 1;
  /* In IE, elements must have layout for filters to apply */
  border-right: 20px solid transparent;
}
.lt-ie10 .detail-wrapper.two-column .detail-list:first-child {
  border-right: 20px solid rgba(0, 0, 0, 0.5);
}

.detail-wrapper-item {
  float: left;
  margin: 0 0 0 -176px;
  /* Pull back just like a dt */
}

.detail-wrapper-note {
  float: none;
  /* Reset narrow float */
  font-size: 1em;
  position: absolute;
  bottom: 1.92308em;
  right: 0;
}

.alert {
  margin: 2.30769em 0 1.53846em;
  padding: 0.46154em 1em;
}

.alert-separated {
  margin-top: 2.30769em;
  /* Reset on wide */
}

.remove-vehicle-link {
  position: absolute;
  right: 15px;
  top: 0;
  line-height: 40px;
}

.forgot-username-password .field-validation-error {
  width: 245px;
  margin-left: 179px;
}

.toggle-switch {
  float: left;
  margin-top: -4px;
}
.toggle-switch a {
  height: 28px;
  line-height: 26px;
  font-size: 12px;
}

/* STANDALONE COMPONENTS */
.tabbed-content .tab-control {
  display: block;
  /* Reset on wide to give Firefox positioning context */
}

.tabbed-content .tab-control a {
  display: inline-block;
  vertical-align: baseline;
  zoom: 1;
  *display: inline;
  *vertical-align: auto;
  /* Reset on wide to give Firefox positioning context */
  font-size: 1em;
  padding: 0.84615em 1.92308em;
  width: auto;
  /* Reset on wide */
}
.tabbed-content .tab-control a.active:after {
  border-color: #000000 transparent transparent transparent;
}

.js .tabbed-content .tab-control {
  width: auto;
  min-width: 220px;
}

.admin-bar {
  *zoom: 1;
  background: black;
  display: block;
}
.admin-bar:before, .admin-bar:after {
  content: " ";
  display: table;
}
.admin-bar:after {
  clear: both;
}

.admin-bar-link {
  float: right;
  padding: 0.76923em 0.38462em;
  border: none;
  /* Override narrow properties */
  background: transparent;
  font-size: 1em;
  position: static;
  z-index: auto;
  width: auto;
}
.admin-bar-link:hover, .admin-bar-link:focus, .admin-bar-link:active {
  border-top: none;
}

.admin-bar-link:after {
  position: static;
  margin-left: 0.3em;
  margin-top: 0;
}

.content-wrapper {
  background: url(/Content/images/infiniti/page-background-large.jpg) no-repeat 50% 85px;
  background-size: 100%;
}

.panel {
  background: rgba(0, 0, 0, 0.5);
  border-bottom: none;
  /* Reset borders */
  border-left: none;
  border-right: none;
  border-top: 1px solid rgba(255, 255, 255, 0.2);
  position: relative;
  /* Required for abs-relative positioning of pseudo-borders */
  /* IE9 AND IE8 FALLBACKS */
  /* THE ACTUAL APPROACH */
  border-bottom: none;
  overflow: hidden;
  padding: 0 2.30769em 2.30769em 2.30769em;
}
.lt-ie9 .panel {
  background: transparent;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#80000000', endColorstr='#80000000');
}
.lt-ie10 .panel {
  border-top: 1px solid rgba(255, 255, 255, 0.2);
  border-left: 1px solid rgba(255, 255, 255, 0.1);
  border-right: 1px solid rgba(255, 255, 255, 0.1);
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.lt-ie10 .panel:before, .lt-ie10 .panel:after {
  display: none;
}
.lt-ie9 .panel {
  border-top: 1px solid #aaaaaa;
  border-left: 1px solid #646464;
  border-right: 1px solid #646464;
  border-bottom: 1px solid #646464;
}
.panel:before, .panel:after {
  /* Make a 1px pseudo-border on left and right with a linear gradient. Won't work in IE < 10. */
  background-color: transparent;
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(255, 255, 255, 0.2)), color-stop(100%, transparent));
  background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.2), transparent);
  background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 0.2), transparent);
  background-image: -ms-linear-gradient(top, rgba(255, 255, 255, 0.2), transparent);
  background-image: -o-linear-gradient(top, rgba(255, 255, 255, 0.2), transparent);
  background-image: linear-gradient(top, rgba(255, 255, 255, 0.2), transparent);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#33FFFFFF', endColorstr='#00000000');
  zoom: 1;
  /* In IE, elements must have layout for filters to apply */
  content: " ";
  position: absolute;
  width: 1px;
  height: 100%;
  max-height: 200px;
  top: 0;
}
.panel:before {
  left: 0;
}
.panel:after {
  right: 0;
}
.panel .aside-link {
  /* TODO: Rename this to namespace it */
  float: right;
}

.accordion-body {
  /* TODO: Break out the accordion-body style into the ephing accordion styles. */
  background: rgba(0, 0, 0, 0.5);
  border-bottom: none;
  /* Reset borders */
  border-left: none;
  border-right: none;
  border-top: 1px solid rgba(255, 255, 255, 0.2);
  position: relative;
  /* Required for abs-relative positioning of pseudo-borders */
  /* IE9 AND IE8 FALLBACKS */
  /* THE ACTUAL APPROACH */
  border-bottom: none;
  overflow: hidden;
  padding: 0 2.30769em 2.30769em 2.30769em;
}
.lt-ie9 .accordion-body {
  background: transparent;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#80000000', endColorstr='#80000000');
}
.lt-ie10 .accordion-body {
  border-top: 1px solid rgba(255, 255, 255, 0.2);
  border-left: 1px solid rgba(255, 255, 255, 0.1);
  border-right: 1px solid rgba(255, 255, 255, 0.1);
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.lt-ie10 .accordion-body:before, .lt-ie10 .accordion-body:after {
  display: none;
}
.lt-ie9 .accordion-body {
  border-top: 1px solid #aaaaaa;
  border-left: 1px solid #646464;
  border-right: 1px solid #646464;
  border-bottom: 1px solid #646464;
}
.accordion-body:before, .accordion-body:after {
  /* Make a 1px pseudo-border on left and right with a linear gradient. Won't work in IE < 10. */
  background-color: transparent;
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(255, 255, 255, 0.2)), color-stop(100%, transparent));
  background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.2), transparent);
  background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 0.2), transparent);
  background-image: -ms-linear-gradient(top, rgba(255, 255, 255, 0.2), transparent);
  background-image: -o-linear-gradient(top, rgba(255, 255, 255, 0.2), transparent);
  background-image: linear-gradient(top, rgba(255, 255, 255, 0.2), transparent);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#33FFFFFF', endColorstr='#00000000');
  zoom: 1;
  /* In IE, elements must have layout for filters to apply */
  content: " ";
  position: absolute;
  width: 1px;
  height: 100%;
  max-height: 200px;
  top: 0;
}
.accordion-body:before {
  left: 0;
}
.accordion-body:after {
  right: 0;
}
.accordion-body .aside-link {
  /* TODO: This may not even be needed in accordion */
  float: right;
}

.tab .panel:after {
  display: block;
}

.management-tool .panel {
  /* TODO: Move out into management tool styles */
  margin-left: 0;
  margin-right: 0;
}

html.is-header-dropdown-active {
  overflow: auto;
  /* Override narrow lock */
  position: static;
  width: auto;
}

.header {
  background-color: black;
}

.header-underlay {
  display: none;
}

.header-content {
  height: 6.53846em;
  font-family: "Infiniti Meta", Helvetica, Arial, sans-serif;
  text-transform: uppercase;
}

.header-title-and-nav {
  margin-top: 4em;
  font-size: 1em;
}

.header-title {
  float: left;
  color: #949494;
  margin-left: 20px;
  letter-spacing: 4px;
}

.header-container-logo {
  border-right: 1px solid #131313;
  border-right: 1px solid rgba(0, 0, 0, 0.2);
  position: relative;
  z-index: 1;
}

.header-home-link {
  width: 125px;
  height: 85px;
  margin: 0;
  padding: 0;
  background-size: auto auto;
  background-position: left center;
  background-repeat: no-repeat;
  border-right: 1px solid #5a5a5a;
  border-right: 1px solid rgba(255, 255, 255, 0.1);
}

.header-nav-list {
  height: auto;
}

.header-nav-list > li {
  margin-right: 40px;
}

.header-nav-list > li.last {
  margin-right: 0;
}

.header-nav-link {
  background: none !important;
  border: none;
  width: auto !important;
  height: auto !important;
}

.header-nav-link.current {
  color: white;
}

.header-nav-link.garage {
  display: block;
}

.header-nav-link.profile,
.header-nav-link.admin-logout {
  background: none !important;
  border: none;
  width: auto !important;
  height: auto !important;
}
.header-nav-link.profile:before,
.header-nav-link.admin-logout:before {
  display: none;
}

.header-greeting {
  position: relative;
  background-color: transparent;
  width: auto;
  border: none;
  right: 0.65359%;
  top: -70px;
  z-index: 0;
  text-transform: none;
  font-size: 14px;
  white-space: normal;
  text-overflow: clip;
}

.content {
  background: transparent none 0 0;
  padding-bottom: 0.38462em;
  /* Padding for 50px gap from last content element to footer */
  padding-top: 0.38462em;
}
.is-logged-in .content {
  padding-top: 0.38462em;
}

.login-title {
  background: none;
  /* Reset properties from base */
  border: none;
  line-height: 0.9;
  margin: 0.92308em 0 0.84615em;
  padding: 0;
}

.login-company-name {
  display: inline;
  font-size: 0.96154em;
  line-height: 0.91667em;
  letter-spacing: -0.05em;
}

.login-title-line {
  display: inline;
  font-size: 0.96154em;
  line-height: 0.91667em;
  letter-spacing: -0.05em;
}

.login-form-field {
  margin-bottom: 1.30769em;
}

.login-identity-area {
  top: 1.53846em;
  bottom: 5em;
}

.login-site-info {
  max-width: 22.69231em;
}

.login-form-field .form-field-error {
  width: 254px;
  margin-left: 176px;
}

.breadcrumb {
  margin: 1.92308em 0 1.53846em;
}

/* CONSTANTS FROM DESIGN */
.my-garage {
  padding-bottom: 1.53846em;
}

.my-garage-header {
  /* Reset back to normal on wide */
  border-bottom: 1px solid #464646;
  /* IE Fallback */
  border-bottom: 1px solid rgba(255, 255, 255, 0.15);
  margin-top: 0.83333em;
  margin-bottom: 0.83333em;
  padding-bottom: 0.5em;
}
.my-garage-header .small {
  padding-right: 13.84615em;
}

.my-garage-single-vehicle-header {
  /* Show on wide, make it match vehicle details header */
  border-bottom: none;
  display: block;
  margin-bottom: 0.5em;
  padding-bottom: 0;
}

.my-garage-add-vehicle {
  float: none;
  margin: 0;
  position: absolute;
  right: 0.65359%;
  top: 1.53846em;
}

.my-garage-nav {
  margin-bottom: -1.15385em;
  /* Eat margin off last car */
  /* For more than two vehicles, have a third-width grid */
  /* For less than two vehicles, have a half-width grid */
}
.my-garage-nav .vehicle-list {
  *zoom: 1;
  /* Make the container wider by one margin width, to 'hide' the rightmost vehicle's margin */
  width: 101.26476%;
}
.my-garage-nav .vehicle-list:before, .my-garage-nav .vehicle-list:after {
  content: " ";
  display: table;
}
.my-garage-nav .vehicle-list:after {
  clear: both;
}
.my-garage-nav .vehicle {
  float: left;
  height: 17.30769em;
  margin-bottom: 1.15385em;
  /* Vehicles are a third-width including margin. Margin is taken from block's percentage width. */
  margin-right: 1.26476%;
  padding: 1.53846em;
  width: 32.06858%;
}
.my-garage-nav .vehicle-count-1,
.my-garage-nav .vehicle-count-2 {
  /* Override vehicle name styles for this one scenario */
}
.my-garage-nav .vehicle-count-1.vehicle-list,
.my-garage-nav .vehicle-count-2.vehicle-list {
  /* Same approach as above */
  width: 101.51771%;
}
.my-garage-nav .vehicle-count-1 .vehicle,
.my-garage-nav .vehicle-count-2 .vehicle {
  height: 26.15385em;
  margin-right: 1.51771%;
  padding: 2.15385em 2.30769em 2.30769em;
  width: 48.48229%;
}
.my-garage-nav .vehicle-count-1 .year,
.my-garage-nav .vehicle-count-1 .nickname,
.my-garage-nav .vehicle-count-2 .year,
.my-garage-nav .vehicle-count-2 .nickname {
  font-size: 1.53846em;
}
.my-garage-nav .vehicle-count-1 .model,
.my-garage-nav .vehicle-count-2 .model {
  font-size: 3.84615em;
  line-height: 1.08em;
}
.my-garage-nav .vehicle-image {
  bottom: 1.15385em;
  left: 50%;
  margin-left: -32.5%;
  position: absolute;
  width: 65%;
}
.my-garage-nav .arrow-container {
  display: none;
}

.vehicle-details-header {
  border-bottom: none;
  margin-bottom: 0.5em;
  padding-bottom: 0;
}

.vehicle-details {
  border-bottom: none;
  /* Reset borders */
  border-left: none;
  border-right: none;
  border-top: 1px solid rgba(255, 255, 255, 0.2);
  position: relative;
  /* Required for abs-relative positioning of pseudo-borders */
  /* IE9 AND IE8 FALLBACKS */
  /* THE ACTUAL APPROACH */
  padding: 0 3.07692em 0;
  margin-top: 0;
  margin-bottom: 0;
  /* Remove vehicle actions spacing */
}
.lt-ie10 .vehicle-details {
  border-top: 1px solid rgba(255, 255, 255, 0.2);
  border-left: 1px solid rgba(255, 255, 255, 0.1);
  border-right: 1px solid rgba(255, 255, 255, 0.1);
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.lt-ie10 .vehicle-details:before, .lt-ie10 .vehicle-details:after {
  display: none;
}
.lt-ie9 .vehicle-details {
  border-top: 1px solid #aaaaaa;
  border-left: 1px solid #646464;
  border-right: 1px solid #646464;
  border-bottom: 1px solid #646464;
}
.vehicle-details:before, .vehicle-details:after {
  /* Make a 1px pseudo-border on left and right with a linear gradient. Won't work in IE < 10. */
  background-color: transparent;
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(255, 255, 255, 0.2)), color-stop(100%, transparent));
  background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.2), transparent);
  background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 0.2), transparent);
  background-image: -ms-linear-gradient(top, rgba(255, 255, 255, 0.2), transparent);
  background-image: -o-linear-gradient(top, rgba(255, 255, 255, 0.2), transparent);
  background-image: linear-gradient(top, rgba(255, 255, 255, 0.2), transparent);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#33FFFFFF', endColorstr='#00000000');
  zoom: 1;
  /* In IE, elements must have layout for filters to apply */
  content: " ";
  position: absolute;
  width: 1px;
  height: 100%;
  max-height: 200px;
  top: 0;
}
.vehicle-details:before {
  left: 0;
}
.vehicle-details:after {
  right: 0;
}
.vehicle-details .vehicle-description {
  margin: 0.76923em -2.30769em 2.69231em;
  padding: 5em 2.30769em 0;
}
.vehicle-details .vehicle-edit-link-wrapper {
  margin: 1.15385em 0 0;
}
.vehicle-details .vehicle-image {
  height: auto;
  margin-top: 0;
  /* Reset narrow margin */
  position: absolute;
  right: 1.92308em;
  top: 3.46154em;
  width: 33.33333%;
}
.vehicle-details .vehicle-drivers {
  border: 1px solid #1e1e1e;
  /* IE Fallback */
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-width: 1px 0;
  padding: 1.53846em 0;
  position: relative;
  margin: 0;
}
.vehicle-details .vehicle-drivers > p {
  width: 60%;
}
.vehicle-details .vehicle-drivers a.add {
  position: absolute;
  top: 0;
  right: 0;
}
.vehicle-details .driver {
  border-bottom: 0;
  padding-bottom: 0.76923em;
  margin: 20px 0 20px;
  height: 84px;
}
.vehicle-details .multiple {
  padding-top: 0;
}
.vehicle-details .multiple .driver {
  border-bottom: none;
  border-right: 0;
  border-right: 0;
  border-left: 1px solid #646464;
  /* IE Fallback */
  border-left: 1px solid rgba(255, 255, 255, 0.2);
  float: left;
  margin: 20px 0 20px 0;
  padding: 0 2% 0 3%;
  position: relative;
  width: 25%;
}
.vehicle-details .multiple .driver:first-child,
.vehicle-details .multiple .driver:nth-child(4n+1) {
  border-left: 0;
  padding-left: 0;
  clear: left;
  width: 22%;
}
.vehicle-details .driver-description {
  margin-bottom: 0;
}
.vehicle-details .driver-name-wrapper {
  padding-left: 1.53846em;
}
.vehicle-details .driver-name {
  font-size: 1em;
}
.vehicle-details .driver-invite-links {
  padding-top: 15px;
}

.vehicle-actions {
  left: auto;
  /* Reset from narrow */
  margin: 2.30769em 0 0;
  position: static;
  /* Reset from narrow */
}
.vehicle-actions.controls {
  text-align: right;
}
.vehicle-actions.controls a {
  margin-left: 10px;
}

html.is-locked {
  overflow: hidden;
}

.modal-underlay {
  background: rgba(0, 0, 0, 0.85);
  display: block;
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 8;
}
.lt-ie9 .modal-underlay {
  background: transparent;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#D9000000', endColorstr='#D9000000');
}

/* Prevent click-through to page in IE8 by having a set 'background' property */
.lt-ie9 .modal-underlay {
  background: black;
  /* Match black 85% above */
  filter: alpha(opacity=85);
}

.modal-wrapper {
  background: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: table;
  padding: 0 2.1875%;
  min-width: 600px;
  margin-left: auto;
  margin-right: auto;
  vertical-align: middle;
  z-index: 9;
}

.modal-content-wrapper {
  background: none;
  filter: none;
  /* Turn off in IE too */
  display: table-cell;
  vertical-align: middle;
  padding: 0 0.65359%;
  max-width: 1280px;
  margin: 0 auto;
}

.modal-content-wrapper.is-loading {
  position: static;
  /* Reset narrow rules */
  top: auto;
  left: auto;
  width: auto;
  height: auto;
}

.modal-content-wrapper.is-loading .modal {
  min-height: 300px;
  /* Min height when loading to position spinner on background */
}

.modal-header {
  display: none;
}

.modal {
  border: 1px solid #646464;
  /* IE Fallback */
  border: 1px solid rgba(255, 255, 255, 0.2);
  background: url(/Content/images/infiniti/modal-background.jpg) -275px -30px no-repeat;
  position: relative;
  vertical-align: top;
  margin: 0 auto;
  max-width: 750px;
  min-height: auto;
  /* Reset min-height from narrow */
  padding: 5em 6.92308em 6.15385em;
}

.modal .content {
  padding-bottom: 0;
  /* Reset content padding */
}

.modal h1, .modal .admin-vehicle-title, .modal .admin-user-title {
  /* Re-show on wide */
  display: block;
}

.modal .close-button {
  background: #1e1e1e;
  border: 1px solid #2a2a2a;
  border-left: none;
  display: block;
  height: 60px;
  line-height: 60px;
  position: absolute;
  text-align: center;
  top: -1px;
  right: -61px;
  width: 60px;
}
.modal .close-button .close-icon {
  /* Pixel jog on wide to look just so */
  margin-left: -10px;
}
.modal .close-button:hover, .modal .close-button:focus, .modal .close-button:active {
  border-color: #616162;
}

.csstransitions .modal-underlay {
  opacity: 0;
  -webkit-transition: opacity ease 100ms;
  -moz-transition: opacity ease 100ms;
  -ms-transition: opacity ease 100ms;
  -o-transition: opacity ease 100ms;
  transition: opacity ease 100ms;
}
.csstransitions .modal-underlay.fadeIn {
  opacity: 1;
}
.csstransitions .modal {
  opacity: 0;
  -webkit-transform: scale(0.9) translateY(30px);
  -moz-transform: scale(0.9) translateY(30px);
  -ms-transform: scale(0.9) translateY(30px);
  -o-transform: scale(0.9) translateY(30px);
  transform: scale(0.9) translateY(30px);
  -webkit-transition: all ease 300ms;
  -moz-transition: all ease 300ms;
  -ms-transition: all ease 300ms;
  -o-transition: all ease 300ms;
  transition: all ease 300ms;
}
.csstransitions .modal-content-wrapper.loaded .modal {
  opacity: 1;
  -webkit-transform: scale(1) translateY(0);
  -moz-transform: scale(1) translateY(0);
  -ms-transform: scale(1) translateY(0);
  -o-transform: scale(1) translateY(0);
  transform: scale(1) translateY(0);
}
.csstransitions .modal .content {
  opacity: 1;
  -webkit-transition: all ease 300ms;
  -moz-transition: all ease 300ms;
  -ms-transition: all ease 300ms;
  -o-transition: all ease 300ms;
  transition: all ease 300ms;
}
.csstransitions .modal .content.hide {
  opacity: 0;
}

@media screen and (min-width: 480px) and (max-height: 550px) {
  .modal {
    border: 1px solid #646464;
    /* IE Fallback */
    border: 1px solid rgba(255, 255, 255, 0.2);
    background: url(/Content/images/infiniti/modal-background.jpg) -240px -30px no-repeat;
    position: relative;
    vertical-align: top;
    margin: 0 auto;
    max-width: 480px;
    padding: 0 1.15385em 0.76923em;
  }
}
.add-vehicle .vehicle-details-list dt {
  font-size: 1em;
  margin-top: 0;
  width: 8.75em;
}
.add-vehicle .vehicle-details-list dd {
  font-size: 1.23077em;
  letter-spacing: -0.03846em;
}

.vin-help {
  margin: 0;
  vertical-align: middle;
  padding-left: 13.46154em;
  margin-left: 0.30769em;
}

.delete-vehicle .vehicle-description {
  margin-top: 0;
  font-size: 1.23077em;
  line-height: 1.3125em;
}
.delete-vehicle .vehicle-type {
  font-size: 1.625em;
  letter-spacing: -0.03846em;
}

.my-profile {
  padding: 0.38462em 1.92308em;
}
.my-profile dl {
  /* Shave bottom margin to match design */
  margin-bottom: 0.38462em;
}
.my-profile .change-email,
.my-profile .change-username {
  display: inline;
  margin: 0 0 0 0.75em;
}
.my-profile .email-is-username-note {
  font-size: 1em;
  margin: 0.38462em 0;
}
.my-profile .edit-profile-link {
  position: absolute;
  right: 0;
  top: 0;
}

.my-profile-personal-details .form-radios-checkboxes {
  width: 15.38462em;
}

.my-profile-account-details {
  /* Override paddings from narrow */
  padding: 0.38462em 0 0.76923em;
}

.my-profile-personal-details {
  padding: 0.38462em 0 0;
}

.my-profile-delete-profile {
  *zoom: 1;
}
.my-profile-delete-profile:before, .my-profile-delete-profile:after {
  content: " ";
  display: table;
}
.my-profile-delete-profile:after {
  clear: both;
}
.my-profile-delete-profile .delete-profile-link {
  float: right;
}

.footer {
  border-top: 1px solid #242424;
  padding: 0;
}

.footer-content {
  padding: 0.76923em 0;
}

.footer-links-container {
  display: inline;
  text-align: right;
}

.footer-links-list {
  color: #4d4d4d;
  display: inline-block;
}

.footer-language-container {
  padding: 0;
  margin: 0;
  display: inline-block;
  float: left;
}

.footer-list-item {
  display: inline-block;
  border: none !important;
  padding: 0;
  margin: 0 12px;
  position: relative;
}

.footer-list-item:hover {
  border: none;
  background-color: transparent;
}

.footer-list-item.languages {
  display: inline-block;
  margin: 0;
}

.footer-list-item.languages:after {
  content: "";
  margin: 0;
}

.footer-link {
  font-size: 1em;
  border: none;
  position: relative;
}

.footer-link:after {
  background: none;
  padding: 0;
  margin: 0;
  content: "";
  position: absolute;
  top: 1.07692em;
  right: -12px;
}

.footer-link.active:after {
  background: none;
}

#footer-select-language-open {
  padding-top: 0.76923em;
}

#footer-select-language-open:hover {
  background-color: transparent;
}

#footer-select-language-open:after {
  background: none;
  opacity: 0.3;
  background: url(/Content/images/infiniti/sprite-sheet.png) no-repeat;
  display: inline-block;
  vertical-align: baseline;
  zoom: 1;
  *display: inline;
  *vertical-align: auto;
  width: 13x;
  height: 8px;
  background-position: -13px -27px;
  top: 1.07692em;
  right: 13px;
}

.footer-link:hover {
  border: none;
}

.footer-link:hover:after {
  background: url(/Content/images/infiniti/sprite-sheet.png) no-repeat;
  display: inline-block;
  vertical-align: baseline;
  zoom: 1;
  *display: inline;
  *vertical-align: auto;
  content: "";
  position: absolute;
  top: 0.92308em;
}

.footer-copyright {
  font-size: 1em;
  display: inline-block;
  padding: 0;
  margin: 0 0 0 12px;
}

.footer-layout-grid-12 {
  text-align: right;
  display: block;
  /* Repeat declarations from mobile so the mixin can be used independently */
  float: left;
  margin-left: 0.65359%;
  margin-right: 0.65359%;
  position: relative;
  /* Width is the column width percentage times column count,
      take the width of the left and right column margins */
  width: 98.69281%;
}

#footer-current-language {
  padding-left: 30px;
  padding-right: 33px;
}

.footer-globe-icon:before {
  top: 5px;
}

#footer-current-language:before {
  left: 0;
  top: 6px;
}

.footer-language-select-menu {
  background-color: black;
  border-bottom: none;
  font-size: 0.9375em;
  bottom: 0;
  padding-bottom: 20px;
  position: absolute;
  text-align: left;
  z-index: 1;
  margin-left: -14px;
}

.footer-language-select-menu li {
  padding-left: 15px;
  white-space: nowrap;
}

.footer-language-select-menu li:first-child {
  padding-left: 15px;
}

#footer-select-language-close {
  padding: 0.9375em 35px 1.25em 26px;
  padding: 0.9375em 35px 1.25em 26px;
  display: block;
}

#footer-select-language-close.footer-globe-icon.active:before {
  top: 0.69231em;
  left: -2px;
}

#footer-select-language-close.footer-globe-icon.active:after {
  position: absolute;
  content: "";
  background: url(/Content/images/infiniti/sprite-sheet.png) no-repeat;
  display: inline-block;
  vertical-align: baseline;
  zoom: 1;
  *display: inline;
  *vertical-align: auto;
  width: 13px;
  height: 8px;
  background-position: -14px -14px;
  top: 1.23077em;
  opacity: 0.7;
  right: 16px;
}

.footer-language {
  padding-left: 26px;
}
.footer-language.active {
  padding-left: 41px;
}

#footer-select-language:before {
  left: 9px;
  left: 9px;
}

.footer-layout-max-width-content {
  position: relative;
  margin-left: auto;
  margin-right: auto;
  max-width: 1280px;
  padding-left: 2.1875%;
  padding-right: 2.1875%;
}

.edit-nickname-form {
  margin-top: -0.76923em;
  /* Just pull it up a tiny bit */
}

.edit-nickname-form .form-button-row {
  margin-top: 1.15385em;
}

.edit-nickname-form label {
  display: none;
}

.edit-nickname-form .form-field .field-validation-error {
  margin-left: 0;
}

.admin-search {
  margin: 0 0 1.53846em;
  padding: 1.53846em;
}
.admin-search .admin-search-controls {
  width: auto;
}
.admin-search label {
  display: inline-block;
  padding: 0.92308em 0 0.84615em;
  /* Make it appear vertically centred */
  margin-right: 2.30769em;
}
.admin-search input.vehicle-search-input {
  /* Arbitrary selector to override specificity of input[type=submit] */
  width: 17.30769em;
  padding-right: 0;
}
.admin-search input.customer-search-input {
  /* Arbitrary selector to override specificity of input[type=submit] */
  width: 30.76923em;
  padding-right: 0;
}
.admin-search input.admin-search-submit {
  /* Arbitrary selector to override specificity of input[type=submit] */
  background: #4d265b;
  height: auto;
  padding: 10px 28px;
  position: static;
  top: auto;
  right: auto;
  text-indent: 0;
  width: auto;
}

.admin-vehicle-panel {
  border-bottom: none;
  /* Reset borders */
  border-left: none;
  border-right: none;
  border-top: 1px solid rgba(255, 255, 255, 0.2);
  position: relative;
  /* Required for abs-relative positioning of pseudo-borders */
  /* IE9 AND IE8 FALLBACKS */
  /* THE ACTUAL APPROACH */
  /* Re-instate on wide */
  margin-top: 0;
  /* Reset narrow */
}
.lt-ie10 .admin-vehicle-panel {
  border-top: 1px solid rgba(255, 255, 255, 0.2);
  border-left: 1px solid rgba(255, 255, 255, 0.1);
  border-right: 1px solid rgba(255, 255, 255, 0.1);
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.lt-ie10 .admin-vehicle-panel:before, .lt-ie10 .admin-vehicle-panel:after {
  display: none;
}
.lt-ie9 .admin-vehicle-panel {
  border-top: 1px solid #aaaaaa;
  border-left: 1px solid #646464;
  border-right: 1px solid #646464;
  border-bottom: 1px solid #646464;
}
.admin-vehicle-panel:before, .admin-vehicle-panel:after {
  /* Make a 1px pseudo-border on left and right with a linear gradient. Won't work in IE < 10. */
  background-color: transparent;
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(255, 255, 255, 0.2)), color-stop(100%, transparent));
  background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.2), transparent);
  background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 0.2), transparent);
  background-image: -ms-linear-gradient(top, rgba(255, 255, 255, 0.2), transparent);
  background-image: -o-linear-gradient(top, rgba(255, 255, 255, 0.2), transparent);
  background-image: linear-gradient(top, rgba(255, 255, 255, 0.2), transparent);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#33FFFFFF', endColorstr='#00000000');
  zoom: 1;
  /* In IE, elements must have layout for filters to apply */
  content: " ";
  position: absolute;
  width: 1px;
  height: 100%;
  max-height: 200px;
  top: 0;
}
.admin-vehicle-panel:before {
  left: 0;
}
.admin-vehicle-panel:after {
  right: 0;
}

.admin-vehicle-panel .desktop-heading {
  background: none;
  border: none;
  margin: 0;
  margin-top: 2.30769em;
  padding: 0;
}

.admin-vehicle-header {
  position: relative;
  /* Positioning context for actions */
}

.admin-vehicle-title {
  border-bottom: 1px solid #464646;
  /* IE Fallback */
  border-bottom: 1px solid rgba(255, 255, 255, 0.15);
  margin: 0.83333em 0 0.33333em;
}

.admin-vehicle-actions {
  border-bottom: none;
  /* Override narrow */
  position: absolute;
  padding: 0;
  /* Override narrow */
  top: 0.76923em;
  right: -0.38462em;
  /* Sub right margin from rightmost link */
  text-align: right;
}

.admin-vehicle-actions a {
  margin: 0 0.38462em;
}

.admin-subscriptions-title-block {
  background: none;
  /* Reset narrow */
  border: none;
  margin: 0;
  padding: 0;
}

.admin-subscriptions-title {
  font-size: 1.53846em;
  /* Reset narrow size */
  margin: 1.75em 0 0.6em;
  /* Match design */
}

.admin-subscriptions-status {
  font-size: 1em;
  /* Reset narrow size */
  margin: 0.92308em 0;
  /* Make smaller to compensate for line height */
}

.admin-vehicle-property-action {
  display: inline;
  margin-top: 0;
  /* Reset on wide */
}

label.admin-accept-tncs-label {
  /* Arbitrarily specific */
  line-height: 1;
  /* Reset narrow styles */
  margin-top: 0;
}

/* Note: Some declarations will be overridden by .panel styles, but
 * we should re-set them ourselves to prevent interdepence on .panel */
.admin-user-details-panel {
  background: rgba(0, 0, 0, 0.5);
  margin-top: 0;
}
.lt-ie9 .admin-user-details-panel {
  background: transparent;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#80000000', endColorstr='#80000000');
}

.admin-user-title {
  border-bottom: 1px solid #464646;
  /* IE Fallback */
  border-bottom: 1px solid rgba(255, 255, 255, 0.15);
}

.admin-user-actions {
  border-bottom: none;
  /* Override narrow */
  position: absolute;
  padding: 0;
  /* Override narrow */
  top: 2.84615em;
  right: 1.92308em;
  /* Sub right margin from rightmost link */
  text-align: right;
}

.admin-user-actions a {
  margin: 0 0.38462em;
}

.admin-user-address {
  line-height: 1;
  /* Reset narrow */
}

.admin-user-vehicles-title {
  font-size: 1.23077em;
  margin-top: 1.875em;
}

.admin-user-vehicles .results-list li {
  margin-bottom: 0.76923em;
}

body.management-tool {
  /* The management tool can only be used on wide viewports */
  min-width: 880px;
}

.results-title {
  color: #dbd1d9;
  font-family: "Infiniti Meta", Helvetica, Arial, sans-serif;
  font-weight: bold;
  text-transform: uppercase;
  font-size: 1em;
  margin: 2.30769em 0 1.53846em;
}

.results-list {
  margin: 0 0 1.53846em;
  padding: 0;
  /* Vehicle Info */
  /* Text Positions. Different on each page. */
}
.results-list li {
  color: #dbd1d9;
  font-family: "Infiniti Meta", Helvetica, Arial, sans-serif;
  font-weight: bold;
  text-transform: uppercase;
  height: 4.15385em;
  list-style: none;
  margin: 0;
  padding: 0 1.53846em;
  position: relative;
  /* Positioning context for link and labels */
  margin-bottom: 1px;
}
.results-list .relationship-type {
  top: auto;
  right: auto;
}
.results-list .model {
  padding-left: 3.07692em;
}
.results-list p {
  display: inline-block;
  vertical-align: baseline;
  zoom: 1;
  *display: inline;
  *vertical-align: auto;
  color: #dbd1d9;
  font-size: 1em;
  margin: 0;
  padding: 0;
  position: absolute;
  margin: 1.38462em 0 1.15385em;
}
.results-list p:first-child {
  /* Reset narrow override */
  margin: 1.38462em 0 1.15385em;
}
.results-list .deemphasised {
  color: #99948f;
}
.results-list .model,
.results-list .last-name {
  color: #dbd1d9;
  /* Override on wide */
  left: 1.53846em;
  /* Fix along left edge */
}
.results-list .color,
.results-list .first-name {
  left: 18.21192%;
}
.results-list .year {
  left: 25.66225%;
}
.results-list .vin,
.results-list .email {
  left: 35.18212%;
}
.results-list .color-2 {
  left: 41.39073%;
}
.results-list .nickname {
  left: 57.94702%;
}
.results-list .reg-date {
  right: 11.5894%;
}

.result-link {
  /* Cover the whole list item */
  line-height: 4.15385em;
}

/* Note: Package details is not styled on wide, because it's not linked to on wide. */
.packages {
  margin-top: 1.92308em;
}

.package {
  background: rgba(0, 0, 0, 0.5);
  border-bottom: none;
  /* Reset borders */
  border-left: none;
  border-right: none;
  border-top: 1px solid rgba(255, 255, 255, 0.2);
  position: relative;
  /* Required for abs-relative positioning of pseudo-borders */
  /* IE9 AND IE8 FALLBACKS */
  /* THE ACTUAL APPROACH */
  border-bottom: none;
  overflow: hidden;
  padding: 0;
  margin-bottom: 1.53846em;
}
.lt-ie9 .package {
  background: transparent;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#80000000', endColorstr='#80000000');
}
.lt-ie10 .package {
  border-top: 1px solid rgba(255, 255, 255, 0.2);
  border-left: 1px solid rgba(255, 255, 255, 0.1);
  border-right: 1px solid rgba(255, 255, 255, 0.1);
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.lt-ie10 .package:before, .lt-ie10 .package:after {
  display: none;
}
.lt-ie9 .package {
  border-top: 1px solid #aaaaaa;
  border-left: 1px solid #646464;
  border-right: 1px solid #646464;
  border-bottom: 1px solid #646464;
}
.package:before, .package:after {
  /* Make a 1px pseudo-border on left and right with a linear gradient. Won't work in IE < 10. */
  background-color: transparent;
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(255, 255, 255, 0.2)), color-stop(100%, transparent));
  background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.2), transparent);
  background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 0.2), transparent);
  background-image: -ms-linear-gradient(top, rgba(255, 255, 255, 0.2), transparent);
  background-image: -o-linear-gradient(top, rgba(255, 255, 255, 0.2), transparent);
  background-image: linear-gradient(top, rgba(255, 255, 255, 0.2), transparent);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#33FFFFFF', endColorstr='#00000000');
  zoom: 1;
  /* In IE, elements must have layout for filters to apply */
  content: " ";
  position: absolute;
  width: 1px;
  height: 100%;
  max-height: 200px;
  top: 0;
}
.package:before {
  left: 0;
}
.package:after {
  right: 0;
}
.package:first-child {
  margin-bottom: 0;
}

.package-header,
.tab-control + .package-count-one .package-header,
.tab-control + .tab + .package-count-one .package-header {
  /* Must match specificity of narrow shananigans */
  border-top: none;
  /* Override narrow */
  background: #1f1f1f;
  overflow: hidden;
  padding: 16px 30px;
}

.package-header.is-auto-renewing {
  padding: 8px 30px;
}

.package-count-one .package-header {
  padding-top: 16px;
  /* Override narrow */
}

.package-name {
  float: left;
  font-size: 1.23077em;
  margin: 2px 0 0;
  /* Nudge down a little to centre it */
}

.is-auto-renewing .package-name {
  line-height: 2.1875em;
  /* Expand to vertically centre when renewal price shown in header */
}

.package-header-price {
  /* Hide on wide */
  display: none;
}

.package-renewal-date,
.package-expiry-date,
.package-renewal-price,
.package-header-recommended {
  clear: right;
  float: right;
  font-size: 1em;
  margin: 0;
}

.package-header-recommended {
  position: static;
}
.package-header-recommended span {
  display: inline;
}

.package-renewal-price {
  display: block;
  /* Show by default on wide */
}

.package-header-stop-auto-renew {
  display: none;
  /* Hide on wide */
}

.package-details-link {
  /* Hide on wide */
  display: none;
}

.package-body {
  background: #0d0d0d;
  padding: 25px 30px 50px;
  overflow: hidden;
  clear: both;
}

.package-description,
.package-services,
.package-actions {
  display: block;
  float: left;
  padding-right: 30px;
  width: 25%;
}

.package-description {
  margin: 0;
  min-height: 1px;
}

.package-services {
  width: 50%;
}

.package-actions {
  margin-bottom: -20px;
  /* Eat margin from last child */
  text-align: right;
  /* Align right on wide */
  padding-right: 0;
}

.package-actions:first-child {
  /* Gobble top margin */
  margin-top: 0;
}

.package-actions-stop-auto-renew {
  display: block;
  /* Show on wide */
}

.package-price {
  padding-top: 0.38462em;
  text-align: right;
  margin-bottom: 1.15385em;
  /* Target 20px with line-height */
}
.package-price .currency {
  font-size: 2.92308em;
}
.package-price .price {
  font-size: 3.07692em;
}
.package-price .period {
  display: block;
  font-size: 1em;
  margin-left: 0.25em;
}

.package.highlight {
  margin-left: 0;
  margin-right: 0;
  padding-left: 0;
  padding-right: 0;
  border: 2px solid #9c9793;
}
.package.highlight .package-body {
  background-color: #212121;
}
.package.highlight .package-header {
  background-color: #2e2c2f;
}

/* Note: Many of these styles won't apply because the above styles will override. */
/* TODO: Have a look at this at some point and eliminate duplicate declarations */
.management-tool {
  /* Don't override .package:before, because it's
   * used for the pseudo-gradient borders on wide */
}
.management-tool .packages {
  margin-top: 1.92308em;
  border-bottom: none;
}
.management-tool .package {
  background: rgba(255, 255, 255, 0.05);
  border: none;
  border-top: 1px solid #646464;
  /* IE Fallback */
  border-top: 1px solid rgba(255, 255, 255, 0.2);
  margin-bottom: 1.53846em;
  padding: 0;
}
.lt-ie9 .management-tool .package {
  background: transparent;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0DFFFFFF', endColorstr='#0DFFFFFF');
}
.management-tool .package-header {
  border-top: none;
  padding: 1.23077em 2.30769em;
}
.management-tool .package-name {
  margin: 0;
  font-size: 1.23077em;
}
.management-tool .package-body {
  padding-right: 2.30769em;
}

.vehicle-manage-apps {
  position: relative;
  padding: 1.53846em 0;
  border-top: 1px solid #1e1e1e;
  /* IE Fallback */
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  border-bottom: 1px solid #1e1e1e;
  /* IE Fallback */
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  margin-bottom: 0;
}

.vehicle-manage-apps p {
  width: 60%;
}

.vehicle-manage-apps h3 {
  margin-left: 0;
  margin-right: 0;
  padding: 0;
  background: none;
  border: none;
}

.vehicle-manage-apps p {
  margin-bottom: 0;
}

.vehicle-manage-apps .primary {
  position: absolute;
  top: 0;
  right: 0;
}

.purchase-package-container .purchase-package-name {
  margin-top: 0;
  width: 70%;
}

.purchase-package-model {
  font-size: 1.07692em;
}

.purchase-package-details {
  position: relative;
  margin: 0;
  padding: 0;
}

.toggle-field-label {
  margin-bottom: 0;
  margin-right: 3.07692em;
  line-height: 24px;
}

.purchase-package-price {
  position: absolute;
  top: 0;
  right: 0;
  border: none;
  margin: 0;
  padding: 0;
  line-height: 25px;
  text-align: right;
}
.purchase-package-price .period {
  display: block;
}
.purchase-package-price.position-static {
  position: static;
  text-align: left;
}

.purchase-package-note {
  font-size: 0.92308em;
}

.purchase-package-container input[type=submit], .purchase-package-container .button, .purchase-package-container .button {
  width: auto;
}

.all-text-content {
  display: block;
  /* Repeat declarations from mobile so the mixin can be used independently */
  float: left;
  margin-left: 0.65359%;
  margin-right: 0.65359%;
  position: relative;
  /* Width is the column width percentage times column count,
      take the width of the left and right column margins */
  width: 48.69281%;
  margin: 0;
}
.all-text-content p:first-child {
  margin-top: 0;
}

.services-list {
  overflow: hidden;
  border-bottom: 1px solid #1e1e1e;
  /* IE Fallback */
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.service-item {
  border-bottom: 0;
  float: left;
  width: 50%;
  padding-right: 5%;
  padding-left: 73px;
}

.service-item .divider {
  border-left: 1px solid #343434;
  height: 36px;
  margin: 0 10px;
}

.service-item .app-download-badge {
  border: none;
  padding: 0;
  background: none;
}

.services-list.single .service-item {
  width: 60%;
  padding-right: 0;
}

.service-name, .service-renewal {
  padding-left: 0;
}

.service-name {
  margin-top: 0;
  line-height: 1.23077em;
}

.service-icon {
  width: 58px;
  height: 58px;
}

.service-item p {
  margin: 0.625em 0;
}

#ogone-template .layout-form-column {
  width: 450px;
}
#ogone-template input.button {
  width: auto;
  margin-right: 5px;
}

.support-faq h1, .support-faq .admin-vehicle-title, .support-faq .admin-user-title {
  border-bottom: 1px solid #464646;
  /* IE Fallback */
  border-bottom: 1px solid rgba(255, 255, 255, 0.15);
}

.support-faq .accordion.subscriptions li .accordion-body {
  border-bottom: 1px solid #464646;
  /* IE Fallback */
  border-bottom: 1px solid rgba(255, 255, 255, 0.15);
}

.support-faq .desktop-heading {
  font-size: 2.30769em;
}

.support-faq .accordion li:first-child .desktop-heading {
  margin-top: 0;
}

.support-faq .accordion.subscriptions .accordion-header {
  font-size: 1.23077em;
  color: white;
}

.support-faq .desktop-heading {
  border-bottom: 1px solid #464646;
  /* IE Fallback */
  border-bottom: 1px solid rgba(255, 255, 255, 0.15);
  padding-bottom: 15px;
  margin-bottom: 15px;
}

.support-faq {
  padding-bottom: 23.07692em;
}

.sidebar-links, .sidebar-links ul {
  padding: 0.76923em 0;
  margin: 0;
}

.sidebar-links li {
  list-style-type: none;
  font-family: "Infiniti Meta", Helvetica, Arial, sans-serif;
  text-transform: uppercase;
  font-size: 1.23077em;
  margin-bottom: 0.625em;
}

.sidebar-links a {
  color: #949494;
}

.sidebar-links a:hover {
  color: white;
}

.sidebar-links a.active, .sidebar-links li.active a {
  color: white;
}

.market-landing {
  margin-top: 1.53846em;
}
.market-landing .login-title {
  margin-bottom: 10px;
}
.market-landing p {
  margin: 0;
}
.market-landing .eu-map {
  position: absolute;
  top: -3.84615em;
  right: 0;
  background: url(/Content/images/infiniti/eu-map-large.png) no-repeat;
  width: 1280px;
  height: 642px;
}
.market-landing .layout-grid-container {
  max-width: 850px;
  margin: 0 auto;
}
.market-landing .country-list {
  margin-top: 1.53846em;
  padding-top: 1.53846em;
}
.market-landing .country-list li {
  float: left;
  width: 170px;
  margin-top: 10px;
  margin-bottom: 15px;
  height: 35px;
}
.market-landing .country-list li:first-child {
  margin-top: 10px;
}
.market-landing .country-list a {
  font-size: 1em;
  line-height: 1.38462em;
}
.market-landing .country-list a:before {
  float: left;
  margin-bottom: 20px;
  margin-top: -2px;
}

/* MEDIUM WIDTH LAYOUT OVERRIDES */
@media screen and (min-width: 600px) and (max-width: 880px) {
  body {
    min-width: 0;
  }

  /*
   *  NISSAN CSM UI MEDIUM MODULE STYLES
   *  Enhance the existing wide module styles for medium viewports.
   */
  .header-title {
    margin-left: 20px;
  }

  .header-nav-list > li {
    margin-right: 20px;
  }

  /* Pull the alignment to the left */
  .footer-layout-grid-12,
  .footer-links-container {
    text-align: left;
  }

  /* Float all the containers left in a stack*/
  .footer-links-container,
  .footer-links-list,
  .footer-copyright {
    float: left;
  }

  /* Make links container full-width to stop lang and copyright floating to right */
  .footer-links-container,
  .footer-links-list {
    width: 100%;
  }

  /* Pull off the left margin on the links list */
  .footer-list-item:first-child {
    margin-left: 0;
  }

  /* Pull the margin in ever so slightly for the list items */
  .footer-list-item {
    margin: 0 10px;
  }

  /* Pull off the last child border */
  .footer-list-item:last-child:after {
    content: "";
  }

  /* Make the padding of the language picker look more 'left aligned' */
  #footer-current-language:before {
    left: 3px;
  }

  #footer-select-language-open:after,
  #footer-select-language-open:hover:after {
    right: 9px;
  }

  #footer-current-language {
    padding-left: 28px;
    padding-right: 24px;
  }

  /* Make the copyright notice have the same padding as the other list things */
  /* And pull it onto the same visual line as the language selector */
  .footer-copyright {
    padding: 0.84615em 0;
    margin: 0;
    position: absolute;
    right: 0;
    top: 34px;
  }

  .login-identity-area {
    top: 1.53846em;
    bottom: 1.53846em;
    /* Make into a thinner 'column' shape on medium */
  }

  .vehicle-details .vehicle-image {
    position: static;
    /* Reset wide positioning */
    right: auto;
    top: auto;
    float: right;
    margin-top: -3.07692em;
    width: 55%;
  }
  .vehicle-details .vehicle-drivers {
    border-left: none;
    margin: 0;
    width: 100%;
  }
  .vehicle-details .vehicle-drivers > p {
    width: 100%;
  }
  .vehicle-details .multiple .driver {
    width: 33%;
  }
  .vehicle-details .multiple .driver:first-child,
  .vehicle-details .multiple .driver:nth-child(4n+1) {
    width: 33%;
    clear: none;
  }
  .vehicle-details .multiple .driver:nth-child(3n+1) {
    clear: left;
    border-left: none;
  }
  .vehicle-details .multiple .driver:nth-child(4n+1) {
    border-left: 1px solid #646464;
    /* IE Fallback */
    border-left: 1px solid rgba(255, 255, 255, 0.2);
    padding-left: 3%;
  }
  .vehicle-details .multiple .driver:first-child,
  .vehicle-details .multiple .driver:nth-child(3n+1) {
    border-left: none;
    padding-left: 0;
    width: 30%;
  }

  html.is-locked {
    overflow: hidden;
  }

  .has-modal {
    display: block;
  }

  .modal-underlay {
    background: rgba(0, 0, 0, 0.85);
    display: block;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 8;
  }
  .lt-ie9 .modal-underlay {
    background: transparent;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#D9000000', endColorstr='#D9000000');
  }

  .modal-wrapper {
    background: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: table;
    padding: 0 2.1875%;
    min-width: 200px;
    margin-left: auto;
    margin-right: auto;
    vertical-align: middle;
    z-index: 9;
  }

  .modal-content-wrapper {
    display: table-cell;
    vertical-align: middle;
    padding: 0 0.65359%;
    max-width: 1280px;
    margin: 0 auto;
  }

  .modal {
    border: 1px solid #646464;
    /* IE Fallback */
    border: 1px solid rgba(255, 255, 255, 0.2);
    background: url(/Content/images/infiniti/modal-background.jpg) -240px -30px no-repeat;
    position: relative;
    vertical-align: top;
    margin: 0 auto;
    max-width: 480px;
    padding: 0 1.15385em 0.76923em;
  }

  .vehicle-manage-apps p {
    width: 100%;
  }

  .all-text-content {
    display: block;
    /* Repeat declarations from mobile so the mixin can be used independently */
    float: left;
    margin-left: 0.65359%;
    margin-right: 0.65359%;
    position: relative;
    /* Width is the column width percentage times column count,
        take the width of the left and right column margins */
    width: 98.69281%;
    margin: 0;
  }
  .all-text-content p:first-child {
    margin-top: 0;
  }

  .services-list.single .service-item {
    width: 100%;
    padding-right: 0;
  }

  .service-item .divider {
    border-left: none;
  }

  .market-landing .eu-map {
    background-position: 340px 0;
  }

  .layout-sticky-footer-content-wrapper {
    margin-bottom: -6.76923em;
    /* Permit taller footer on medium width */
  }

  .layout-sticky-footer,
  .layout-sticky-footer-push {
    height: 6.76923em;
  }

  .layout-form-column {
    width: 430px;
  }

  .layout-form-column-aside {
    left: 460px;
    /* Use smaller left gap on medium */
  }
}

/*# sourceMappingURL=wide.css.map */