@charset "utf-8";
/* CSS RESET */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}
@font-face {
  font-family: 'CenturySBK';
  src:  url(../fonts/century_gothic.woff2) format('woff2'),
  url(../fonts/century_gothic.woff)  format('woff'),
  url(../fonts/century_gothic.ttf) format('ttf');
}
body {
  font-family: 'CenturySBK', "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
  line-height: 1;
}
html, body {
  width: 100%;
  height: 100%;
}
html {
  font-size: 16px;
}
body * {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.house-picture {
  width:100%;
  height:100%;
  position:absolute;
  top:0;
  left:0;
  z-index:0;
}
.cover {
  background-color:rgba(255,255,255,0.90);
}
.preloader {
  position:absolute;
  top:50%;
  left:50%;
  margin:-30px 0 0 -30px;
  font-size:64px;
  color: rgba(118,118,118,0.75);
}
.base {
  background-image:url(/images/online/base.jpg);
  background-position:center center;
  background-size:cover;
  -webkit-print-color-adjust: exact;
}
.bricks div, .seams div, .plaster div, .windows div, .roof div {
  width:100%;
  height:100%;
  position:absolute;
  top:0;
  left:0;
  opacity:0;
  background-position:center center;
  background-size:cover;
  -webkit-transition: opacity 500ms linear;
  -moz-transition: opacity 500ms linear;
  -o-transition: opacity 500ms linear;
  transition: opacity 500ms linear;
  -webkit-print-color-adjust: exact;
}
.temp_blur {
  -webkit-filter: blur(10px);
  filter:blur(10px);
  -webkit-transition: filter 500ms linear;
  -moz-transition: filter 500ms linear;
  -o-transition: filter 500ms linear;
  transition: filter 500ms linear;
}
.bricks-abricos {
  background-image:url(/images/online/brick1/house1_brick1_abricos.png);
}
.bricks-cacao {
  background-image:url(/images/online/brick1/house1_brick1_cacao.png);
}
.bricks-cacao1 {
  background-image:url(/images/online/brick1/house1_brick1_cacao1.png);
}
.bricks-morkovka {
  background-image:url(/images/online/brick1/house1_brick1_morkovka.png);
}
.bricks-persic {
  background-image:url(/images/online/brick1/house1_brick1_persic.png);
}
.bricks-red_classic {
  background-image:url(/images/online/brick1/house1_brick1_red_classic.png);
}
.bricks-soloma {
  background-image:url(/images/online/brick1/house1_brick1_soloma.png);
}
.bricks-vishnya {
  background-image:url(/images/online/brick1/house1_brick1_vishnya.png);
}
.bricks-white {
  background-image:url(/images/online/brick1/house1_brick1_white.png);
}
.bricks-white2 {
  background-image:url(/images/online/brick1/house1_brick1_white2.png);
}
.seams-dark {
  background-image:url(/images/online/seam/house1_seam_dark.png);
}
.seam-mid {
  background-image:url(/images/online/seam/house1_seam_mid.png);
}
.seam-white {
  background-image:url(/images/online/seam/house1_seam_white.png);
}
.plaster-bej {
  background-image:url(/images/online/plaster/house1_plaster_bej.png);
}
.plaster-brown {
  background-image:url(/images/online/plaster/house1_plaster_brown.png);
}
.plaster-grey {
  background-image:url(/images/online/plaster/house1_plaster_grey.png);
}
.plaster-white {
  background-image:url(/images/online/plaster/house1_plaster_white.png);
}
.windows-darkwood {
  background-image:url(/images/online/windows/house1_windows_darkwood.png);
}
.windows-lightwood {
  background-image:url(/images/online/windows/house1_windows_lightwood.png);
}
.windows-white {
  background-image:url(/images/online/windows/house1_windows_white.png);
}
.roof-brown {
  background-image:url(/images/online/roof/house1_roof_brown.png);
}
.roof-grey {
  background-image:url(/images/online/roof/house1_roof_grey.png);
}
.roof-red {
  background-image:url(/images/online/roof/house1_roof_red.png);
}
.chosen {
  opacity:1 !important;
}
.parts-selector {
  position:absolute;
  top:300px;
  left:0;
  width:230px;
  height:auto;
  background-color:#ffffff;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;

}
.parts-branch {
  height:80px;
  background-color:#ffffff;
  color:#333333;
  position: relative;
  cursor:pointer;
}
.parts-branch h2 {
  margin:0;
  padding:20px 0 0 40px;
  box-sizing:border-box;
  text-transform:uppercase;
  font-size:1em;
}
.parts-branch p {
  margin:0;
  padding:0px 0 0 40px;
  box-sizing:border-box;
  font-size:14px;
  color:#999999;
}
.parts-branch .dropout {
  position:absolute;
  left:200px;
  top:0;
  padding-left:30px;
  width:400%;
  max-width:800px;
  display:none;
}
.parts-branch:hover {
  background-color:#f26723;
  color:#ffffff;
}
.parts-branch:hover p {
  color:#ffffff;
}
.parts-branch:hover .dropout {
  display:block;
}
.dropout-item {
  display:inline-block;
  position: relative;
  margin-right:-5px;
  margin-bottom: -2px;
  height:80px;
  width:120px;
}
.dropout-item span {
  position: absolute;
  bottom: 0;
  left: 0;
  line-height:20px;
  background-color:#ffffff;
  display:block;
  width:120px;
  min-height:20px;
  box-sizing:border-box;
  padding-left:5px;
  color:#333333;
  font-size:10px;
}
.chosen-tab {
  -webkit-box-shadow: inset 0px 0px 0px 4px #fff;
  -moz-box-shadow: inset 0px 0px 0px 4px #fff;
  box-shadow: inset 0px 0px 0px 4px #fff;
}

.logo {
  position: fixed;
  top: 1rem;
  left: 1rem;
  background-color: white;
  background-image: url("../images/SBK_logo_header.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  height: 5rem;
  width: 14rem;
  z-index: 100;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  border: 1rem solid white;
}


.definitions {
  margin-top:830px;
  position:relative;
  z-index:1000;
}
.definitions .grid {
  position:relative;
}
.definitions .grid .white-extender {
  position:absolute;
  left:99%;
  top:0;
  width:1000px;
  height:100%;
  background-color:#ffffff;
}
.definitions .grid .grey-extender {
  position:absolute;
  right:0;
  top:60px;
  width:3000px;
  height:160px;
  background-color:#4a4a4a;
  z-index:-1;
}
.definitions .c10 {
  background-color:#ffffff;
  padding:0;
}
.definitions h1 {
  line-height:80px;
  margin:0;
  text-transform:uppercase;
  padding-left:25px;
}
.save_pdf {
  background-color:#ffffff;
  color:#333333;
  cursor:pointer;
  display:inline-block;
  margin-right:-5px;
  line-height:80px;
  padding:0 50px;
  font-size:20px;
}
.save_pdf:hover {
  background-color:#f26723;
  color:#ffffff;
}
.print {
  color:#333333;
  cursor:pointer;
  display:inline-block;
  margin-right:-5px;
  line-height:80px;
  padding:0 50px;
  font-size:20px;
}
.print:hover {
  background-color:#f26723;
  color:#ffffff;
}
.share {
  color:#333333;
  cursor:pointer;
  display:inline-block;
  margin-right:-5px;
  line-height:80px;
  padding:0 50px;
  font-size:20px;
  position:relative;
}
.sharehidden {
  position:absolute;
  top:60px;
  left:0;
  width:100%;
  background-color:#ffffff;
  padding:20px 0 0 15px;
  display:none;
}
.share:hover .sharehidden {
  display:block;
}
.right-side-menu {
  display:none;
}
.print-layer {
  display:none;
}


















@media only screen and (max-height:900px){


}
@media only screen and (max-device-width: 900px) {
}
