/* Reset */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,
form,fieldset,input,textarea,p,blockquote,th,td {margin: 0;  padding: 0;}
table                                           {border-collapse: collapse;  border-spacing: 0;}
fieldset,img                                    {border: none;}
address,caption,cite,code,dfn,em,strong,th,var  {font-style: normal;  font-weight: normal;}
ol,ul                                           {list-style: none;}
caption,th                                      {text-align: left;}
h1,h2,h3,h4,h5,h6                               {font-size: 100%;  font-weight: normal;}
q:before,q:after                                {content: '';}
abbr,acronym                                    {border: 0;}

.ie .png {behavior: url(iepngfix.htc);}

/* Styles */
body {
  overflow: auto;
  background: #b6b6b6;
  /* width: 1px;  min-width: 100%; */ /* iframe scaling hack - does not work */
}
textarea {
  overflow: auto;
}

#door-wall {
  position: absolute;  top: 0;  left: -30px /* 0 */;  width: 100%;  height: 628px;
  min-width: 500px;  max-width: 1000px;
  background: #888;
}
#door-floor {
  position: absolute;  top: 0;  left: 0;  width: 100%;  height: 100%;
  background: url(../img/bg-floor.png) repeat-x bottom;
}

#door-conf {
  position: absolute;  top: 0;  left: 0;  width: 440px /* 500px */;
}
#door-conf .ac {
  position: relative;  width: 100%;
}
#door-conf .ac:after {
  content: '';  display: block;  clear: both;
}
#door-conf .acl {
  position: relative;  top: 30px;  right: 50%;  float: right;
}
#door-conf .acr {
  position: relative;  right: -50%;  z-index: 1;
}

#door-conf .size-n,  #door-conf .size-n  img {width: 224px;  height: 408px;}
#door-conf .size-l,  #door-conf .size-l  img {width: 344px;  height: 408px;}
#door-conf .size-xl, #door-conf .size-xl img {width: 400px;  height: 408px;}

#dcfg-hinge, #dcfg-handle, #dcfg-model, #dcfg-filling, #dcfg-filling img {
  position: absolute;  top: 0;  left: 0;
}
#dcfg-filling img {
  visibility: hidden;
}

#door-attr {
  position: absolute;  top: 0;  left: 440px /* 500px */;  width: 436px;
  padding: 0 10px;
  background: #cfcec8;
  box-shadow: 0 0 5px #888;
}
.ie #door-attr {
  width: 456px;
}
#door-attr h3 {
  margin: 5px 0 2px 0;
  color: #000;
  font: normal 85% sans-serif;
}
#door-attr h3 i {
  font-style: italic;
}
#door-attr .box {
  height: 58px;
}

#door-attr .demo {
  margin-bottom: 10px;
  color: #730;
  font: bold 100% sans-serif;
}
#door-attr .demo a {
  color: #930;
  text-decoration: none;
}

.box {
  position: relative;  overflow: hidden;
}
.box .cn {
  position: absolute;
  background: #838383 url(../img/bg-box.png);
  font-size: 0;
}
.box .cn.tl {
  left: 0;  top: 0;  width: 100%;  height: 100%;
  background-position: -2px -2px;
}
.box .cn.r {
  left: -2px;  top: 0;  width: 2px;  height: 100%;
  margin-left: 100%;
  background-position: 0 -2px;
}
.box .cn.b {
  left: 0;  bottom: 0;  width: 100%;  height: 2px;
  background-position: -2px 0;
}
.box .cn.br {
  left: -2px;  bottom: 0;  width: 2px;  height: 2px;
  margin-left: 100%;
}

.box .content {
  position: relative;  width: 100%;  height: 100%;
  padding: 2px;
  font-size: 0;
}
.box .content img {
  width: 50px;  height: 50px;
  margin: 2px;
}
.box .content img.hover {
  margin: 0;
  border: 2px solid #00bfff /*DeepSkyBlue*/;
}
.box .content img.chosen {
  margin: 0;
  border: 2px solid #ffd700 /*Gold*/;
}

#wall-palette {
  position: absolute;  left: 0;  top: 50px;  width: 20px;
}
.wall-palette {
  display: inline-block;  width: 16px;  height: 32px;
  margin: 2px;
  background: #888 url('../img/wall-palette.png') 0 0 no-repeat;
}
.pdg {background-position:    0px 0;} /* Tinkas tamsus pilkas   (dark-grey)   #535553 */
.psg {background-position:  -50px 0;} /* Tinkas šviesus pilkas  (silver-grey) #bbbec1 */
.pds {background-position: -100px 0;} /* Tinkas smėlio spalvos  (desert-sand) #e5d7b5 */
.prb {background-position: -150px 0;} /* Tinkas tamsus raudonas (red-brick)   #935f4e */
.bdg {background-position: -200px 0;} /* Plyta tamsi pilka      (dark-grey)   #535553 */
.bsg {background-position: -250px 0;} /* Plyta balta            (silver-grey) #bbbec1 */
.bds {background-position: -300px 0;} /* Plyta geltona          (desert-sand) #e5d7b5 */
.brb {background-position: -350px 0;} /* Plyta raudona          (red-brick)   #935f4e */



#door-inquiry, #door-inquiry-off {
  margin-top: 14pt;
}
#door-inquiry tr {
  vertical-align: top;
}
#door-inquiry label {
  display: block;
  margin: 0 6px 0 0;  padding: 4px 0 0 0;  vertical-align: baseline;
  font: normal 77% sans-serif;
}
#door-inquiry .in {
  margin: 1px 0;  padding: 2px 4px;  vertical-align: middle;
  border: 1px solid #666;  background: #f5f5f5;
  font: normal 77% sans-serif;
}
#door-inquiry .bt {
  width: auto;  overflow: visible;
  margin: 5px 0;  padding: 5px 10px;  vertical-align: middle;
  font: normal 77% sans-serif;
  border: 1px solid hsl(0, 0%, 50%);  border-radius: 3px;
  background-color: hsl(80, 50%, 90%);
}
#door-inquiry .bt:disabled {
  background-color: hsl(0, 0%, 70%);
}
#door-inquiry .disclaimer {
  color: #555;
  font: italic 77% sans-serif;
}

#door-inquiry-off {display: none;}

#modal-bg
{	display: none; overflow: hidden; z-index: 98;
  position: absolute; top: 0; left: 0; width: 100%; height: 100%; margin: 0; padding: .5em;
  background: #333333; color: #ffffff; }
#progress
{	display: none; overflow: hidden; z-index: 99;
  position: absolute; top: 0; left: 0; width: 100%; height: 6px;
  background: url(../img/progress.gif);}

#copyright {
  margin: 0 0 10px 0;  text-align: right;
  color: #888;
  font: normal 77% sans-serif;
}
#copyright a {
  color: #58c;
  text-decoration: none;
}
#copyright a u {
  text-decoration: none;
  border-bottom: 1px solid #9BC;
}

#corporate {
  position: absolute;  top: 480px;  left: 0;  width: 500px;  padding: 10px 30px;
}
#corporate .tel {
  margin: 5px 0;
  font: normal 100% sans-serif;
}
.ie #corporate .tel {font-size: 80%;}
.tel .code {
  font-size: 80%;
}

@viewport {
  width: device-width;
}

@media screen and (max-width: 900px) {
  #door-wall {
    left: 0;
  }
  #door-conf {
    width: 500px;
  }
  #door-attr {
    top: 510px;  left: 22px;
  }
}

@media screen and (max-width: 475px) {body {transform-origin: 0 0;  transform: scale(.90);}}
@media screen and (max-width: 450px) {body {transform-origin: 0 0;  transform: scale(.86);}}
@media screen and (max-width: 425px) {body {transform-origin: 0 0;  transform: scale(.81);}}
@media screen and (max-width: 400px) {body {transform-origin: 0 0;  transform: scale(.76);}}
@media screen and (max-width: 375px) {body {transform-origin: 0 0;  transform: scale(.71);}}
@media screen and (max-width: 350px) {body {transform-origin: 0 0;  transform: scale(.67);}}
@media screen and (max-width: 325px) {body {transform-origin: 0 0;  transform: scale(.62);}}
@media screen and (max-width: 300px) {body {transform-origin: 0 0;  transform: scale(.57);}}
@media screen and (max-width: 275px) {body {transform-origin: 0 0;  transform: scale(.52);}}
@media screen and (max-width: 250px) {body {transform-origin: 0 0;  transform: scale(.48);}}
@media screen and (max-width: 225px) {body {transform-origin: 0 0;  transform: scale(.43);}}
@media screen and (max-width: 200px) {body {transform-origin: 0 0;  transform: scale(.38);}}