
body, body * {
  vertical-align: baseline;
  border: 0 none;
  outline: 0;
  padding: 0;
  margin: 0;
  font-size: 14px;
  color: #6f6f6f;
  font-family: 'Source Sans Pro', sans-serif;
  overflow: hidden;
}

:invalid {
  box-shadow: none;
}

:-moz-submit-invalid {
  box-shadow: none;
}

:-moz-ui-invalid {
  box-shadow:none;
}

button {
  background-color: Transparent;
  background-repeat:no-repeat;
  border: none;
  cursor: pointer;
  overflow: hidden;
  outline:none;
  z-index: 200;
}

#main-container {
  position: absolute;
  width: 300px;
  height: 600px;
  background-image: url("images/bg1.png");
}

#main-stage {
  display: none;
}

#main-stage.show {
  display: block;
}

#main-stage .bg {
  background-image: url("images/bg2.png");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center center;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 50;
}

#main-stage .bg-corner-top {
  background-image: url("images/corner1.png");
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  width: 113px;
  height: 150px;
  z-index: 60;
}

#main-stage .bg-corner-bottom {
  background-image: url("images/corner2.png");
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  width: 113px;
  height: 150px;
  top: 450px;
  left: 187px;
  z-index: 60;
}

#overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 300px;
  height: 600px;
  z-index: 500;
  display: none;
  background-color: #fff;
  opacity: 0.2;
}

#exit {
  cursor: pointer;
  width: 100%;
  height: 100%;
  z-index: 1;
}

.feature {
  top: 0px;
  left: 0px;
  width: 300px;
  height: 600px;
  position: absolute;
}
#main-img-0 {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: url(images/logo.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center center;
  z-index:200;
}

#title-1 {
  background-image: url("images/title1.png");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center center;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 100;
}

#title-2 {
  background-image: url("images/title2.png");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center center;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 100;
}

:focus {
  outline:none;
}
::-moz-focus-inner {
  border:0;
}

#btn-learn-more{
  position: absolute;
  bottom: 10px;
  left: 0;
  display: block;
  z-index: 200;
}

.btn-continue {
  position: absolute;
  top: 390px;
  left: 0;
  display: none;
}

.btn-submit {
  position: absolute;
  top: 240px;
  left: 0;
  display: block;
}

.btn-buy-now {
  position: absolute;
  top: 390px;
  left: 0;
  display: block;
}

.btn-reset {
  position: absolute;
  top: 430px;
  left: 0;
  display: block;
}

.scene {
  width: 300px;
  height: 600px;
  text-align: center;
  position: absolute;
  top: 0;
  left: 0;
  display: none;
}

#scene-intro .title1 {
  background-image: url("images/title1.png");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center center;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 100;
}

#scene-intro .title2 {
  background-image: url("images/title2.png");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center center;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 100;
}

#scene-build-form .headline {
  background-image: url("images/headline1.png");
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  width: 300px;
  height: 38px;
  top: 149px;
  z-index: 110;
}

#scene-build-form .content {
  background-image: url("images/content1.png");
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  width: 300px;
  height: 38px;
  top: 206px;
  z-index: 100;
}

#scene-build-form .question1 {
  background-image: url("images/question1.png");
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  width: 300px;
  height: 79px;
  top: 232px;
  z-index: 110;
}

#scene-build-form .question1.answered {
  background-image: url("images/question1_h.png");
}

#scene-build-form .question2 {
  background-image: url("images/question2.png");
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  width: 300px;
  height: 79px;
  top: 311px;
  z-index: 110;
}

#scene-build-form .question2.answered {
  background-image: url("images/question2_h.png");
}

#scene-cover-form .headline {
  background-image: url("images/headline1.png");
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  width: 300px;
  height: 38px;
  top: 149px;
  z-index: 110;
}

#scene-cover-form .content {
  background-image: url("images/content2.png");
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  width: 300px;
  height: 38px;
  top: 206px;
  z-index: 100;
}

#scene-cover-form .question3 {
  background-image: url("images/question3.png");
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  width: 300px;
  height: 79px;
  top: 232px;
  z-index: 110;
}

#scene-cover-form .question3.answered {
  background-image: url("images/question3_h.png");
}

#scene-cover-form .question4 {
  background-image: url("images/question4.png");
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  width: 300px;
  height: 79px;
  top: 311px;
  z-index: 110;
}

#scene-cover-form .question4.answered {
  background-image: url("images/question4_h.png");
}

#scene-personal-form .headline {
  background-image: url("images/headline2.png");
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  width: 300px;
  height: 17px;
  top: 150px;
  z-index: 110;
}

#scene-personal-form form {
  background-image: url("images/form_bg.png");
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  width: 300px;
  height: 288px;
  top: 182px;
  z-index: 250;
}

#scene-personal-form input {
  width: 240px;
  height: 20px;
  padding: 15px 5px 5px 10px;
  background-color: transparent;
  font-size: 14px;
  font-weight: 700;
}

.error {
  font-size: 14px;
  font-weight: 700;
  z-index: 255;
  width: 240px;
  text-align: left;
  background-color: #f5f5f5;
  color: #ff0000;
  padding: 4px 5px;
  display: none;
}

#error-first_name {
  position: absolute;
  left: 27.5px;
  top: 194px;
}
#error-phone {
  position: absolute;
  left: 27.5px;
  top: 234px;
}
#error-email {
  position: absolute;
  left: 27.5px;
  top: 273.5px;
}

#scene-personal-form textarea {
  width: 240px;
  height: 90px;
  padding: 15px 5px 5px 10px;
  background-color: transparent;
  font-size: 14px;
  font-weight: 700;
  resize: none;
}

#scene-result .headline {
  background-image: url("images/headline3.png");
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  width: 300px;
  height: 37px;
  top: 150px;
  z-index: 110;
}

#scene-result .content {
  background-image: url("images/rateBox.png");
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  width: 300px;
  height: 171px;
  top: 195px;
  z-index: 110;
}

#scene-result .result{
  background-image: url("images/answer.png");
  background-repeat: no-repeat;
  position: absolute;
  width: 300px;
  height: 20px;
  top: 285px;
  left: 0;
  z-index: 250;
}

.show {
  display: block;
}

.btn {
  /*display: none;*/
}

.disabled {
  opacity: 0.3;
}

.motion {
  display: none;
}

.animated {
  width: 300px;
  height: 600px;
  position: absolute;
  top: 0;
  left: 0;
  display: block;
}

.animation {
  /*animation-duration: 13s;
  animation-delay: 0s;
  animation-iteration-count: 2;
  -webkit-animation-duration: 13;
  -webkit-animation-delay: 0s;
  -webkit-animation-iteration-count: 2;
  -moz-animation-duration: 13s;
  -moz-animation-delay: 0s;
  -moz-animation-iteration-count: 2;*/
}

/* Dropdown */
#propertySelect {
  position: absolute;
  top: 265px;
  left: 20px;
  width: 260px;
  height: 30px;
  overflow: visible;
}

#propertyDropdownArrow {
  background-image: url("images/dropdown.png");
  background-repeat: no-repeat;
  position: relative;
  left: 0;
  width: 260px;
  height: 30px;
  z-index: 200;
}

#propertyTxt {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 260px;
  height: 30px;
  background-image: url("images/result1_h.png");
  background-repeat: repeat-y;
}

#propertyDropdown {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 260px;
  height: 150px;
  z-index: 400;
  background-image: url("images/result1.png");
  overflow: visible;
  display: none;
}

#propertyDropdownImg {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 260px;
  height: 150px;
}

#propertyDropdownImg .propertySubItem {
  background-image: url("images/result1.png");
  background-repeat: repeat-y;
  position: relative;
  left: 0px;
  height: 30px;
  width: 260px;
}

#propertyDropdownImg .propertySubItem:hover, #propertyDropdownImg .propertySubItem.active {
  background-image: url("images/result1_o.png");
  background-repeat: repeat-y;
  opacity: 1;
}

/**/
#occupancySelect {
  position: absolute;
  top: 344px;
  left: 20px;
  width: 260px;
  height: 30px;
  overflow: visible;
}

#occupancyDropdownArrow {
  background-image: url("images/dropdown.png");
  background-repeat: no-repeat;
  position: relative;
  left: 0;
  width: 260px;
  height: 30px;
  z-index: 200;
}

#occupancyTxt {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 260px;
  height: 30px;
  background-image: url("images/result2_h.png");
  background-repeat: repeat-y;
}

#occupancyDropdown {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 260px;
  height: 120px;
  z-index: 400;
  background-image: url("images/result2.png");
  overflow: visible;
  display: none;
}

#occupancyDropdownImg {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 260px;
  height: 120px;
}

#occupancyDropdownImg .occupancySubItem {
  background-image: url("images/result2.png");
  background-repeat: repeat-y;
  position: relative;
  left: 0px;
  height: 30px;
  width: 260px;
}

#occupancyDropdownImg .occupancySubItem:hover, #occupancyDropdownImg .occupancySubItem.active {
  background-image: url("images/result2_o.png");
  background-repeat: repeat-y;
  opacity: 1;
}

#buildingSelect {
  position: absolute;
  top: 265px;
  left: 20px;
  width: 260px;
  height: 30px;
  overflow: visible;
}

#buildingDropdownArrow {
  background-image: url("images/dropdown.png");
  background-repeat: no-repeat;
  position: relative;
  left: 0;
  width: 260px;
  height: 30px;
  z-index: 200;
}

#buildingTxt {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 260px;
  height: 30px;
  background-image: url("images/result3_h.png");
  background-repeat: repeat-y;
}

#buildingDropdown {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 260px;
  height: 90px;
  z-index: 400;
  overflow: visible;
  display: none;
}

#buildingDropdownImg {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 260px;
  height: 90px;
}

#buildingDropdownImg .buildingSubItem {
  background-repeat: repeat-y;
  position: relative;
  left: 0px;
  height: 30px;
  width: 260px;
}

#buildingDropdownImg .buildingSubItem:hover, #buildingDropdownImg .buildingSubItem.active {
  background-repeat: repeat-y;
  opacity: 1;
}

#contentSelect {
  position: absolute;
  top: 344px;
  left: 20px;
  width: 260px;
  height: 30px;
  overflow: visible;
}

#contentDropdownArrow {
  background-image: url("images/dropdown.png");
  background-repeat: no-repeat;
  position: relative;
  left: 0;
  width: 260px;
  height: 30px;
  z-index: 200;
}

#contentTxt {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 260px;
  height: 30px;
  background-image: url("images/result4_h.png");
  background-repeat: repeat-y;
}

#contentDropdown {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 260px;
  height: 90px;
  z-index: 400;
  overflow: visible;
  display: none;
}

#contentDropdownImg {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 260px;
  height: 90px;
}

#contentDropdownImg .contentSubItem {
  background-repeat: repeat-y;
  position: relative;
  left: 0px;
  height: 30px;
  width: 260px;
}

#contentDropdownImg .contentSubItem:hover, #contentDropdownImg .contentSubItem.active {
  background-repeat: repeat-y;
  opacity: 1;
}
