@charset "utf-8";

/* Helvetica Neue Font Import */

@font-face{
    font-family:"HelveticaNeueW01-47LtCn 692686";
    src:url("../fonts/7de6b03f-1298-4bc2-89af-9d9da594008d.eot?#iefix");
    src:url("../fonts/7de6b03f-1298-4bc2-89af-9d9da594008d.eot?#iefix") format("eot"),url("../fonts/42aacb2f-222e-46f5-a95a-1c22948ee0d1.woff") format("woff"),url("../fonts/217a2f81-1e65-4924-a0d4-05ac8576f883.ttf") format("truetype"),url("../fonts/5405647d-099e-47f7-9d4a-f8692e57a206.svg#5405647d-099e-47f7-9d4a-f8692e57a206") format("svg");
}

@font-face{
    font-family:"HelveticaNeueW01-57Cn";
    src:url("../fonts/ecaa98fe-425a-42de-846b-c235f0dbc449.eot?#iefix");
    src:url("../fonts/ecaa98fe-425a-42de-846b-c235f0dbc449.eot?#iefix") format("eot"),url("../fonts/842088d0-1ae2-40d0-8561-3c95761ba7a6.woff") format("woff"),url("../fonts/c74505d5-13e8-47ed-94a8-630aab4da3e6.ttf") format("truetype"),url("../fonts/6cd480d1-47d0-48b4-86bd-283db2cb9235.svg#6cd480d1-47d0-48b4-86bd-283db2cb9235") format("svg");
}

@font-face{
    font-family:"HelveticaNeueW01-77BdCn 692722";
    src:url("../fonts/83d5bc89-af33-46a9-8fe3-15d87784f50e.eot?#iefix");
    src:url("../fonts/83d5bc89-af33-46a9-8fe3-15d87784f50e.eot?#iefix") format("eot"),url("../fonts/102ab74c-0e84-4fe5-a17a-b20fb643591a.woff") format("woff"),url("../fonts/1d146b29-55e2-485b-96aa-5cb628e7e9eb.ttf") format("truetype"),url("../fonts/d90b3358-e1e2-4abb-ba96-356983a54c22.svg#d90b3358-e1e2-4abb-ba96-356983a54c22") format("svg");
}

body {
  margin: 0;
  padding: 0;
}

h1, 
h3 {
  cursor: default;
}

h1 {
  color: #000000;
  font-family: "HelveticaNeueW01-77BdCn 692722";
  font-size: 2.133em;
  line-height: 0.86;
  position: relative;
  text-align: center;
  text-transform: uppercase;
  top: 50px;
}

h3 {
  color: #000;
  font-family: "HelveticaNeueW01-57Cn";
  font-size: 1.464em;
  height: 42px;
  line-height: 1.091;
  position: relative;
  text-align: center;
  text-transform: uppercase;
  top: 20px;
}

hr {
  border-color: -moz-use-text-color -moz-use-text-color #ccc;
  border-style: none none solid;
  border-width: medium medium 1px;
  margin-top: 70px;
  position: relative;
  width: 240px;
}

/* Form Elements */

input[type='radio'] {
    opacity: 0;
    float: left;
    width: 18px;
}

input[type="radio"] + label {
  background: url("../img/off.png") no-repeat scroll left center rgba(0, 0, 0, 0);
  clear: none;
  cursor: pointer;
  margin: 0;
  padding: 6px 0 8px 38px;
}

input[type='radio']:checked + label {
    background-image: url(../img/on.png);
}

.contentWrapper {
  height: auto;
  overflow: hidden !important;
  width: 100%;
}

.contentHolder {
  display: block;
  height: 885px;
  margin: 0 auto;
  width: 851px;
}

.clear {
  clear: both;
}

.header {
  float: left;
  position: relative;
  width: 852px;
}

.header .renault-logo {
  margin: 8px 8px 8px 16px;
  float: left;
}
.header-image {
  height: 337px;
  width: 851px;
}

.app-heading {
  border: 1px solid #a6a6a6;
  border-radius: 2px;
  float: left;
  margin-left: 2px;
  margin-right: 425px;
  margin-top: 12px;
  padding: 0 8px;
  position: relative;
}

.app-heading > span {
  cursor: default;
  float: left;
  font-family: "Tahoma";
  font-size: 13.002px;
  font-weight: bold;
  height: 24px;
  line-height: 22px;
}

.app-heading-divider {
  background-color: #dedfe0;
  margin: 0 7px;
  width: 1px;
}

.fb-like {
  float: right !important;
  left: 788px;
  margin: 16px 13px 0 0;
  position: absolute !important;
}

.fb-share-button {
  bottom: -30px;
  cursor: pointer;
  left: 647px;
}

.fb_iframe_widget span {
  display: inline !important;
  position: absolute !important;
}

.duster-colours > div {
  float: left;
  height: 20px;
  width: 141px;
  border-right: 1px solid #212121;
}

.duster-colours > div:last-child {
  border-right: medium none;
}

.duster-white {
  background-color: #ffffff;
}

.duster-silver {
  background-color: #afb0b4;
}

.duster-red {
  background-color: #8d181f;
}

.duster-brown {
  background-color: #673f2c;
}

.duster-grey {
  background-color: #343434;
}

.duster-black {
  background-color: #101010;
}

.quiz-holder {
  border-bottom: 1px solid #c4cde0;
  height: 380px;
  overflow: hidden;
  position: relative;
  width: 100%;
}

.screen {
    position: inherit;
}

.quiz-start-btn {
  background-color: rgb(244, 185, 37);
  color: #000;
  cursor: pointer;
  font-family: "HelveticaNeueW01-77BdCn 692722";
  font-size: 1.564em;
  height: 59px;
  line-height: 2.5;
  margin: 0 auto;
  position: relative;
  text-align: center;
  text-transform: uppercase;
  top: 46px;
  vertical-align: middle;
  width: 230px;
}

.steps-container {
  display: none;
}

.steps-rectangle-selected:before {
  background: url("../img/triangle.png") repeat scroll 0 0 rgba(0, 0, 0, 0);
  content: "";
  height: 12px;
  left: 118px;
  position: absolute;
  top: 60px;
  width: 19px;
  z-index: 4;
}

.steps-rectangle-selected {
  background-color: rgb(244, 185, 37);
  height: 60px;
  position: absolute;
  top: 345px;
  width: 175px;
  z-index: 3;
}

.steps-rectangle-selected:after {
  color: #000 !important;
  left: 143px !important;
  top: 18px !important;
}

.steps-rectangle-deselected {
  background: url(../img/stegs-bg.png) repeat 0 0;
  border-color: rgb(255, 255, 255);
  border-style: solid;
  border-width: 6px;
  display: block;
  float: left;
  height: 48px;
  position: absolute;
  top: 345px;
  width: 163px;
}

.step-one-pos:after {
  content: "1";
  cursor: default;
}
.step-two-pos {
  margin-left: 169px;
}

.step-two-pos:after {
  content: "2";
  cursor: default;
}

.step-three-pos {
  margin-left: 338px;
}

.step-three-pos:after {
  content: "3";
  cursor: default;
}

.step-four-pos {
  margin-left: 507px;
}

.step-four-pos:after {
  content: "4";
  cursor: default;
}

.step-five-pos {
  margin-left: 676px;
}

.step-five-pos:after {
  content: "5";
  cursor: default;
}

.step-one-pos:after,
.step-two-pos:after,
.step-three-pos:after,
.step-four-pos:after,
.step-five-pos:after {
  color: rgb(255, 255, 255);
  font-family: "HelveticaNeueW01-57Cn";
  font-size: 2.99em;
  height: 33px;
  left: 136px;
  line-height: 0.5;
  position: absolute;
  text-align: left;
  text-transform: uppercase;
  top: 12px;
  width: 20px;
  z-index: 1;
}

.next-btn {
  background-color: #f4bc25;
  color: #000;
  cursor: pointer;
  font-family: "HelveticaNeueW01-57Cn";
  font-size: 1.656em;
  height: 73px;
  left: 595px;
  line-height: 2.95;
  position: relative;
  text-align: center;
  text-transform: uppercase;
  top: -74px;
  width: 235px;
  display: none;
}

.question {
  color: #fff;
  font-family: "HelveticaNeueW01-77BdCn 692722";
  font-size: 1.526em;
  height: 22px;
  line-height: 1.071;
  position: absolute;
  text-align: center;
  text-transform: uppercase;
  top: 43px;
  width: 100%;
}

.answers {
  color: #fff;
  font-family: "HelveticaNeueW01-57Cn";
  height: 17px;
  left: 288.937px;
  line-height: 2;
  position: absolute;
  text-align: left;
  top: 83px;
}

.your-duster-color > img {
  border: 1px solid #B7B7B7;
  float: left;
  margin: 38px 24px 0 32px;
}

.your-duster-color > p {
  cursor: default;
  color: #000000;
  font-family: "HelveticaNeueW01-77BdCn 692722";
  font-size: 16.835px;
  left: 220px;
  line-height: 0.833;
  position: absolute;
  text-align: left;
  text-transform: uppercase;
  top: 54px;
  transform: matrix(2.13949, 0, 0, 2.13873, 0, 0);
  width: 70px;
}

.your-personality-heading {
  cursor: default;
  color: #000;
  float: right;
  font-family: "HelveticaNeueW01-77BdCn 692722";
  font-size: 1.651em;
  height: 56px;
  left: 588px;
  line-height: 0.833;
  position: absolute;
  text-align: left;
  text-transform: uppercase;
  top: 34px;
  width: 150px;
}

.your-personality-description {
  color: #000000;
  font-family: "Arial";
  font-size: 0.719em;
  height: 69px;
  left: 589px;
  position: absolute;
  text-align: left;
  top: 97px;
  width: 213px;
}

.destinations {
  float: left;
  margin: 113px 0 0 33px;
  position: relative;
  width: 45%;
}

.destinations > img {
  border: 1px solid #b7b7b7;
  float: left;
  margin: 0 24px 25px 0;
}

.destinations-heading {
  color: #000;
  font-family: "HelveticaNeueW01-77BdCn 692722";
  font-size: 1.381em;
  left: 35px;
  line-height: 0.833;
  position: absolute;
  text-align: left;
  text-transform: uppercase;
  top: 216px;
  width: 95px;
}

.destination-sub-heading {
  color: #000;
  font-family: "HelveticaNeueW01-77BdCn 692722";
  font-size: 0.986em;
  line-height: 1.8;
  position: relative;
  text-align: left;
  top: -8px;
}

.destination-sub-name {
  color: #000;
  font-family: "HelveticaNeueW01-57Cn";
  font-size: 0.786em;
  line-height: 0.6;
  position: relative;
  text-align: left;
  top: -8px;
}

.destination-sub-description {
  color: #000;
  font-family: "Arial";
  font-size: 0.74em;
  line-height: 1.333;
  position: relative;
  text-align: left;
  top: 4px;
}