/* CSS Document */

@import url(https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&subset=latin,latin-ext);

* {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -moz-outline: none;
  -webkit-outline: none;
  outline: none;
  /*
  -webkit-user-select: none;    
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
  */
}

*:focus, *:select {
  -moz-outline: none;
  -webkit-outline: none;
  outline: none;
}
/*
.btn_kovanie {
  display: block !important
}
*/
html, body {
  height: 100%;
  min-height: 100%
}

body:not(.inline), .navrhar_inline {
  margin: 0;
  padding: 0;
  font-size: 100%;
  line-height: 100%;
  font-family: 'Roboto', sans-serif;
  font-weight: 500;
  background: #fff;
  overflow-x: hidden;
  z-index: 0;
  position: relative
}

.navrhar_inline {
  width: calc(100% + 40px);
  /*left: -20px;*/
  /*padding-left: 15px;
  padding-right: 15px;*/
  text-align: left;
}

.navrhar_inline.fullscreen {
  width: 100%;
  height: 100%;
  position: fixed;
  left: 0;
  top: 0;
  z-index: 10000000000000000000
}


                          
#page {
  width: 100%;
  max-width: 1040px;
  /* height: 630px; */
  font-size: 0.9em;
  line-height: 1.5em;
  padding: 0px 10px 0px 10px;
  margin: 0 auto;
  /* position: relative; */
  position: absolute;
  left: 50%;
  top: 50%;
  margin-top: -350px;
  margin-left: -520px
}


  
aside {
  width: 230px;
  height: 630px;
  float: left;
  padding: 0px 5px 0px 0px;
  display: table;
  padding-top: 0px;
  margin-left: -10px;
  z-index: 100;
  position: relative;
  box-sizing: border-box;
}   



aside #side {  
  height: 100%;
  display: block;

  padding: 0px 0px 0px 0px
}

aside .step_link {
  width: 100%;
  min-height: 36px;
  display: block;
  color: #74A5E7;
  font-weight: 500;
  font-size: 1.3em;
  text-decoration: none;
  z-index: 10;
  position: relative;
  display: none
}

aside .step_link.current {
  display: inline-block
}

aside .step_link > span {
  float: left;
  cursor: pointer
}

.sub_link_holder {
  display: none;
  margin-left: 10px;
  padding-left: 10px;
  float: left;
  border-left: 2px solid #74A5E7
}

aside .step_link .sub_link_holder span {
  color: #74A5E7; 
}

aside .step_link span:hover, aside .step_link span.active, aside .step_link .sub_link_holder span.active, aside .step_link .sub_link_holder span:hover {
  color: #205DDA;
}

aside .step_link {
  cursor: pointer;
}

aside .step_link .i {
  width: 21px;
  height: 21px;
  background: url(/assets/images/i.png) 0px 0px no-repeat;
  float: left;
  margin-left: 7px;
  cursor: help;
  position: relative;
}

aside .step_link .i:hover {
  background-position: -31px 0px
}

aside .step_link .i span {
  width: 219px;
  height: auto;
  background: #74A5E7;
  color: #fff;
  position: absolute;
  left: 50%;
  top: 24px;
  margin-left: -110px;
  display: none;
  font-size: 0.8em;
  line-height: 1.3em;
  padding: 5px 10px 5px 10px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
}

aside .step_link .i:hover span {
  display: block
}

aside .step_form {
  margin: 0px 0px 35px 0px;
  display: none;
  z-index: 5
}

aside [data-step="1"] .step_form {
  display: block;
  margin-top: 0px
} 

aside [data-step="4"] .step_form {
  margin-bottom: 0px
} 


            
#workspace {
  width: calc(100% - 250px);
  height: 650px;
  float: right;
  position: relative;
  z-index: 50;
  margin-right: 15px
}


   
#navrhar {
  width: 100%;
  height: 605px;
  position: relative;
  overflow: hidden;
  z-index: 50;
  -moz-box-shadow: 0px 0px 20px #999;
  -webkit-box-shadow: 0px 0px 20px #999;
  box-shadow: 0px 0px 20px #999;
  background-size: cover !important
}   
 

#navrhar {
  /*background: none*/ 
}

#workspace nav {
  width: calc(100% - 20px);
  height: 30px;
  margin-bottom: 15px;
  position: relative;
  z-index: 1000
}

#workspace nav .link_btn {
  float: left;
  display: inline-block;
  margin-right: 17px;
  color: #817054;
  font-weight: 500;
  font-size: 1.1em;
  cursor: pointer;
  height: 30px;
  line-height: 30px
}

#workspace nav .link_btn:hover,
#workspace nav .link_btn.active {
  color: #000;
}

#navrhar .opt_btns {
  width: 100%;
  margin-top: 10px;
  text-align: left;
  display: inline-block;
  padding-left: 10px
}

#navrhar .opt_btn {
  width: auto;
  height: 30px;
  background: #fff;
  padding: 0px 15px 0px 15px;
  line-height: 30px;
  -moz-border-radius: 15px;
  -webkit-border-radius: 15px;
  border-radius: 15px;
  color: #285FBA;
  font-weight: 500;
  display: inline-block;
  text-transform: uppercase;
  font-size: 1.1em;
  cursor: pointer;
  display: none
}
      
#skrina_holder {
  width: auto;
  height: auto;
  display: block;
  position: absolute;
  left: 50%;
  bottom: 27%;
  z-index: 10;
  padding: 0px 6px 0px 6px;
  margin-bottom: -6px;
  -moz-transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);            
}

body:not(.fullscreen) #skrina_holder {
  margin-left: 0 !important
}
      
#skrina {
  width: 455px;
  height: 338px;
  display: inline-block;
  /*background: #fff; */
  
  /*padding: 6px; */
  background-size: 100% 100% !important;
  
  position: relative;
  left: 50%;
  -moz-transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);   
} 

body:not(.fullscreen) #skrina {
  /*margin-left: 0 !important;
  left: 0 */ 
}

#skrina_vnutro {
  width: 100%;
  height: 100%;
  display: inline-block;
  /*background: url(../images/bg-skrina.png) center top no-repeat;*/
  background-size: 100% 100% !important;
  z-index: 100;
  position: relative
}   

.css-ios #skrina_vnutro * {
  cursor: pointer
}

#skrina .podlaha_helper {
  position: absolute;
  width: 100%;
  height: 1px;
  bottom: 15px;
  left: 0;
  background: transparent;
}

#skrina .sektory {
  width: 100%;
  height: 100%;
  position: absolute;
  left: -3px;
  z-index: 1000 !important;
}

#skrina .sektor { 
  height: 100%;
  float: left;
  position: relative;
  /*padding-right: 6px*/
  /*overflow: hidden;*/ 
}

#skrina .skrina_top .sektor { 
  /*height: calc(100% - 6px);*/
  z-index: 1000
}


#skrina[data-oddeleni="1"] .sektor {
  width: 100%
}

#skrina[data-oddeleni="2"] .sektor {
  width: 50%
}

#skrina[data-oddeleni="3"] .sektor:nth-of-type(1) {
  width: 33.33%
}

#skrina[data-oddeleni="3"] .sektor:nth-of-type(2) {
  width: 33.34%
}

#skrina[data-oddeleni="3"] .sektor:nth-of-type(3) {
  width: 33.33%
}

#skrina[data-oddeleni="4"] .sektor {
  width: 25%
}

#skrina[data-oddeleni="5"] .sektor {
  width: 20%
}

#skrina[data-oddeleni="6"] .sektor {
  width: 16.6666%;
}

#skrina[data-oddeleni="7"] .sektor {
  width: 14.2857%
}

#skrina[data-oddeleni="8"] .sektor {
  width: 12.5%
}

#skrina[data-oddeleni="9"] .sektor {
  width: 11.1111%
}

#skrina[data-oddeleni="10"] .sektor {
  width: 10%
}



#skrina[data-oddeleni="1"] .sektor:nth-of-type(2),
#skrina[data-oddeleni="1"] .sektor:nth-of-type(3),
#skrina[data-oddeleni="1"] .sektor:nth-of-type(4),
#skrina[data-oddeleni="1"] .sektor:nth-of-type(5),
#skrina[data-oddeleni="1"] .sektor:nth-of-type(6),
#skrina[data-oddeleni="1"] .sektor:nth-of-type(7),
#skrina[data-oddeleni="1"] .sektor:nth-of-type(8),
#skrina[data-oddeleni="1"] .sektor:nth-of-type(9),
#skrina[data-oddeleni="1"] .sektor:nth-of-type(10) {
  display: none !important
}

#skrina[data-oddeleni="2"] .sektor:nth-of-type(3),
#skrina[data-oddeleni="2"] .sektor:nth-of-type(4),
#skrina[data-oddeleni="2"] .sektor:nth-of-type(5),
#skrina[data-oddeleni="2"] .sektor:nth-of-type(6),
#skrina[data-oddeleni="2"] .sektor:nth-of-type(7),
#skrina[data-oddeleni="2"] .sektor:nth-of-type(8),
#skrina[data-oddeleni="2"] .sektor:nth-of-type(9),
#skrina[data-oddeleni="2"] .sektor:nth-of-type(10) {
  display: none !important
}

#skrina[data-oddeleni="3"] .sektor:nth-of-type(4),
#skrina[data-oddeleni="3"] .sektor:nth-of-type(5),
#skrina[data-oddeleni="3"] .sektor:nth-of-type(6),
#skrina[data-oddeleni="3"] .sektor:nth-of-type(7),
#skrina[data-oddeleni="3"] .sektor:nth-of-type(8),
#skrina[data-oddeleni="3"] .sektor:nth-of-type(9),
#skrina[data-oddeleni="3"] .sektor:nth-of-type(10) {
  display: none !important
}

#skrina[data-oddeleni="4"] .sektor:nth-of-type(5),
#skrina[data-oddeleni="4"] .sektor:nth-of-type(6),
#skrina[data-oddeleni="4"] .sektor:nth-of-type(7),
#skrina[data-oddeleni="4"] .sektor:nth-of-type(8),
#skrina[data-oddeleni="4"] .sektor:nth-of-type(9),
#skrina[data-oddeleni="4"] .sektor:nth-of-type(10) {
  display: none !important
}

#skrina[data-oddeleni="5"] .sektor:nth-of-type(6),
#skrina[data-oddeleni="5"] .sektor:nth-of-type(7),
#skrina[data-oddeleni="5"] .sektor:nth-of-type(8),
#skrina[data-oddeleni="5"] .sektor:nth-of-type(9),
#skrina[data-oddeleni="5"] .sektor:nth-of-type(10) {
  display: none !important
}

#skrina[data-oddeleni="6"] .sektor:nth-of-type(7),
#skrina[data-oddeleni="6"] .sektor:nth-of-type(8),
#skrina[data-oddeleni="6"] .sektor:nth-of-type(9),
#skrina[data-oddeleni="6"] .sektor:nth-of-type(10) {
  display: none !important
}

#skrina[data-oddeleni="7"] .sektor:nth-of-type(8),
#skrina[data-oddeleni="7"] .sektor:nth-of-type(9),
#skrina[data-oddeleni="7"] .sektor:nth-of-type(10) {
  display: none !important
}

#skrina[data-oddeleni="8"] .sektor:nth-of-type(9),
#skrina[data-oddeleni="8"] .sektor:nth-of-type(10) {
  display: none !important
}

#skrina[data-oddeleni="9"] .sektor:nth-of-type(10) {
  display: none !important
}




















#skrina .sektor:last-of-type {
  /*display: none*/
}

#skrina .sektor .skrina_main > .tien {
  width: 100%; 
  height: 100%;
  position: absolute;
  left: 0;
  bottom: 0;
  background: url(/assets/images/insec-sh.png) center center no-repeat;
  background-size: 100% 100%; 
  z-index: 1
}

#skrina .sektor.nadstavec .skrina_main > .tien {
  display: none !important
}

.vertikalne_dosky {
  /*width: 100%;
  height: 100%;*/
  /*position: absolute;
  top: 0;
  left: 0*/

}


.vertikalne_dosky .doska {
  width: 6px;
  height: calc(85% + 0px);
  position: absolute;
  bottom: 0;
  margin-left: -6px;
  z-index: 1
}

.vertikalne_dosky .doska.full {
  height: 100% !important
}

#skrina[data-oddeleni="1"] .vertikalne_dosky .doska1,
#skrina[data-oddeleni="1"] .vertikalne_dosky .doska2,
#skrina[data-oddeleni="1"] .vertikalne_dosky .doska3,
#skrina[data-oddeleni="1"] .vertikalne_dosky .doska4,
#skrina[data-oddeleni="1"] .vertikalne_dosky .doska5,
#skrina[data-oddeleni="1"] .vertikalne_dosky .doska6,
#skrina[data-oddeleni="1"] .vertikalne_dosky .doska7,
#skrina[data-oddeleni="1"] .vertikalne_dosky .doska8,
#skrina[data-oddeleni="1"] .vertikalne_dosky .doska9 {
  display: none !important
}

#skrina[data-oddeleni="2"] .vertikalne_dosky .doska2,
#skrina[data-oddeleni="2"] .vertikalne_dosky .doska3,
#skrina[data-oddeleni="2"] .vertikalne_dosky .doska4,
#skrina[data-oddeleni="2"] .vertikalne_dosky .doska5,
#skrina[data-oddeleni="2"] .vertikalne_dosky .doska6,
#skrina[data-oddeleni="2"] .vertikalne_dosky .doska7,
#skrina[data-oddeleni="2"] .vertikalne_dosky .doska8,
#skrina[data-oddeleni="2"] .vertikalne_dosky .doska9 {
  display: none !important
}

#skrina[data-oddeleni="3"] .vertikalne_dosky .doska3,
#skrina[data-oddeleni="3"] .vertikalne_dosky .doska4,
#skrina[data-oddeleni="3"] .vertikalne_dosky .doska5,
#skrina[data-oddeleni="3"] .vertikalne_dosky .doska6,
#skrina[data-oddeleni="3"] .vertikalne_dosky .doska7,
#skrina[data-oddeleni="3"] .vertikalne_dosky .doska8,
#skrina[data-oddeleni="3"] .vertikalne_dosky .doska9 {
  display: none !important
}

#skrina[data-oddeleni="4"] .vertikalne_dosky .doska4,
#skrina[data-oddeleni="4"] .vertikalne_dosky .doska5,
#skrina[data-oddeleni="4"] .vertikalne_dosky .doska6,
#skrina[data-oddeleni="4"] .vertikalne_dosky .doska7,
#skrina[data-oddeleni="4"] .vertikalne_dosky .doska8,
#skrina[data-oddeleni="4"] .vertikalne_dosky .doska9 {
  display: none !important
}

#skrina[data-oddeleni="5"] .vertikalne_dosky .doska5,
#skrina[data-oddeleni="5"] .vertikalne_dosky .doska6,
#skrina[data-oddeleni="5"] .vertikalne_dosky .doska7,
#skrina[data-oddeleni="5"] .vertikalne_dosky .doska8,
#skrina[data-oddeleni="5"] .vertikalne_dosky .doska9 {
  display: none !important
}

#skrina[data-oddeleni="6"] .vertikalne_dosky .doska6,
#skrina[data-oddeleni="6"] .vertikalne_dosky .doska7,
#skrina[data-oddeleni="6"] .vertikalne_dosky .doska8,
#skrina[data-oddeleni="6"] .vertikalne_dosky .doska9 {
  display: none !important
}

#skrina[data-oddeleni="7"] .vertikalne_dosky .doska7,
#skrina[data-oddeleni="7"] .vertikalne_dosky .doska8,
#skrina[data-oddeleni="7"] .vertikalne_dosky .doska9 {
  display: none !important
}

#skrina[data-oddeleni="8"] .vertikalne_dosky .doska8,
#skrina[data-oddeleni="8"] .vertikalne_dosky .doska9 {
  display: none !important
}

#skrina[data-oddeleni="9"] .vertikalne_dosky .doska9 {
  display: none !important
}





#skrina[data-oddeleni="2"] .vertikalne_dosky .doska {
  left: 50%;
}

#skrina[data-oddeleni="3"] .vertikalne_dosky .doska:nth-of-type(1) {
  left: 33.33%;
}

#skrina[data-oddeleni="3"] .vertikalne_dosky .doska:nth-of-type(2) {
  left: 66.67%;
}

#skrina[data-oddeleni="4"] .vertikalne_dosky .doska:nth-of-type(1) {
  left: 25%;
}

#skrina[data-oddeleni="4"] .vertikalne_dosky .doska:nth-of-type(2) {
  left: 50%;
}

#skrina[data-oddeleni="4"] .vertikalne_dosky .doska:nth-of-type(3) {
  left: 75%;
}

#skrina[data-oddeleni="5"] .vertikalne_dosky .doska:nth-of-type(1) {
  left: 20%;
}

#skrina[data-oddeleni="5"] .vertikalne_dosky .doska:nth-of-type(2) {
  left: 40%;
}

#skrina[data-oddeleni="5"] .vertikalne_dosky .doska:nth-of-type(3) {
  left: 60%;
}

#skrina[data-oddeleni="5"] .vertikalne_dosky .doska:nth-of-type(4) {
  left: 80%;
}




#skrina[data-oddeleni="6"] .vertikalne_dosky .doska:nth-of-type(1) {
  left: 16.6666%;
}

#skrina[data-oddeleni="6"] .vertikalne_dosky .doska:nth-of-type(2) {
  left: 33.3333%;
}

#skrina[data-oddeleni="6"] .vertikalne_dosky .doska:nth-of-type(3) {
  left: 50%;
}

#skrina[data-oddeleni="6"] .vertikalne_dosky .doska:nth-of-type(4) {
  left: 66.6666%;
}

#skrina[data-oddeleni="6"] .vertikalne_dosky .doska:nth-of-type(5) {
  left: 83.3333%;
}



#skrina[data-oddeleni="7"] .vertikalne_dosky .doska:nth-of-type(1) {
  left: 14.2857%;
}

#skrina[data-oddeleni="7"] .vertikalne_dosky .doska:nth-of-type(2) {
  left: 28.5714%;
}

#skrina[data-oddeleni="7"] .vertikalne_dosky .doska:nth-of-type(3) {
  left: 42.8571%;
}

#skrina[data-oddeleni="7"] .vertikalne_dosky .doska:nth-of-type(4) {
  left: 57.1428%;
}

#skrina[data-oddeleni="7"] .vertikalne_dosky .doska:nth-of-type(5) {
  left: 71.4285%;
}

#skrina[data-oddeleni="7"] .vertikalne_dosky .doska:nth-of-type(6) {
  left: 85.7142%;
}





#skrina[data-oddeleni="8"] .vertikalne_dosky .doska:nth-of-type(1) {
  left: 12.5%;
}

#skrina[data-oddeleni="8"] .vertikalne_dosky .doska:nth-of-type(2) {
  left: 25%;
}

#skrina[data-oddeleni="8"] .vertikalne_dosky .doska:nth-of-type(3) {
  left: 37.5%;
}

#skrina[data-oddeleni="8"] .vertikalne_dosky .doska:nth-of-type(4) {
  left: 50%;
}

#skrina[data-oddeleni="8"] .vertikalne_dosky .doska:nth-of-type(5) {
  left: 62.5%;
}

#skrina[data-oddeleni="8"] .vertikalne_dosky .doska:nth-of-type(6) {
  left: 75%;
}

#skrina[data-oddeleni="8"] .vertikalne_dosky .doska:nth-of-type(7) {
  left: 87.5%;
}





#skrina[data-oddeleni="9"] .vertikalne_dosky .doska:nth-of-type(1) {
  left: 11.11%;
}

#skrina[data-oddeleni="9"] .vertikalne_dosky .doska:nth-of-type(2) {
  left: 22.22%;
}

#skrina[data-oddeleni="9"] .vertikalne_dosky .doska:nth-of-type(3) {
  left: 33.33%;
}

#skrina[data-oddeleni="9"] .vertikalne_dosky .doska:nth-of-type(4) {
  left: 44.44%;
}

#skrina[data-oddeleni="9"] .vertikalne_dosky .doska:nth-of-type(5) {
  left: 55.55%;
}

#skrina[data-oddeleni="9"] .vertikalne_dosky .doska:nth-of-type(6) {
  left: 66.66%;
}

#skrina[data-oddeleni="9"] .vertikalne_dosky .doska:nth-of-type(7) {
  left: 77.77%;
}

#skrina[data-oddeleni="9"] .vertikalne_dosky .doska:nth-of-type(8) {
  left: 88.88%;
}




#skrina[data-oddeleni="10"] .vertikalne_dosky .doska:nth-of-type(1) {
  left: 10%;
}

#skrina[data-oddeleni="10"] .vertikalne_dosky .doska:nth-of-type(2) {
  left: 20%;
}

#skrina[data-oddeleni="10"] .vertikalne_dosky .doska:nth-of-type(3) {
  left: 30%;
}

#skrina[data-oddeleni="10"] .vertikalne_dosky .doska:nth-of-type(4) {
  left: 40%;
}

#skrina[data-oddeleni="10"] .vertikalne_dosky .doska:nth-of-type(5) {
  left: 50%;
}

#skrina[data-oddeleni="10"] .vertikalne_dosky .doska:nth-of-type(6) {
  left: 60%;
}

#skrina[data-oddeleni="10"] .vertikalne_dosky .doska:nth-of-type(7) {
  left: 70%;
}

#skrina[data-oddeleni="10"] .vertikalne_dosky .doska:nth-of-type(8) {
  left: 80%;
}

#skrina[data-oddeleni="10"] .vertikalne_dosky .doska:nth-of-type(9) {
  left: 90%;
}

#skrina[data-dvere-typ="otvaracie"] .spodok{
  height:6px;
  width:100%;
  position:absolute;
  bottom:0px;
  z-index: 2;
}
#skrina[data-dvere-typ="otvaracie"] .vrch{
  height:6px;
  width:100%;
  position:absolute;
  top:0px;
}


#skrina .sektor .spodna_doska {
  width: 100%;
  height: 10px;
  /*background: url(../images/bg-skrina-spodok.png) center bottom no-repeat;*/
  background-size: 100% 100%;
  position: absolute;
  left: 0px;
  bottom: 0px;
}

#skrina .interier_cast {
  width: 100%;
  height: 15px;
  background: url(../images/bg-skrina-spodok.png) center bottom no-repeat;
  background-size: 100% 100%;
  position: absolute;
  left: 0px;
  bottom: 133px;
}

#skrina .interier {
  width: calc(100%);
  height: 100%;
  position: absolute;
  left: 0px;
  top: 0;
  z-index: 9
}

[data-zobrazenie="1"] [data-step="1"]  { display: inline-block; }
[data-zobrazenie="2"] [data-step="2"]  { display: inline-block; }
[data-zobrazenie="3"] [data-step="3"]  { display: inline-block; }
[data-zobrazenie="4"] [data-step="4"]  { display: inline-block; }
[data-zobrazenie="5"] [data-step="5"]  { display: inline-block; }
[data-zobrazenie="6"] [data-step="6"]  { display: inline-block; }
[data-zobrazenie="7"] [data-step="7"]  { display: inline-block; }
[data-zobrazenie="8"] [data-step="8"]  { display: inline-block; }
[data-zobrazenie="9"] [data-step="9"]  { display: inline-block; }


[data-zobrazenie="6"] #skrina .interier  {
  /*display: none */
}

#skrina .sektor:first-of-type .interier {
  left: 0;

}

#skrina .interier.interier_sem {
  background: #74A5E7
}
/*
#skrina .interier .polica {
  width: 100%;
  height: 6px;
  background: #fff;
  position: absolute;
  left: 0;
}
*/
#skrina .polica {
  width: 100%;
  height: 16px;
  position: absolute;
  left: 0px;
  background-size: 100% 100%;
  margin-top: -16px
}
    

#skrina #tapeta {
  width: calc(100% + 5px);
  height: 100%;
  position: absolute;
  left: -6px;
  top: 0;
  z-index: 10;
  background-size: cover !important;
  display: none                
}

[data-zobrazenie="6"] #tapeta,
.foto_exterier #tapeta {
  display: block !important
}
/*    
#skrina .dvere_div {
  width: calc(100% + 6px);
  height: calc(100% + 0px);
  position: absolute;
  left: -6px;
  top: 0px;
  z-index: 10
}
*/
#skrina .dvere {
  width: 100%;
  height: 100%;
  float: left;
  position: relative
}

#skrina .sektor[data-otvorena="true"] .ext {
  display: none
}
/*
#skrina .dvere_div .dvere.dvere_sem .vyplne {
  display: none
} */

#skrina .dvere.dvere_sem .vyplne_zony {
  background: #74A5E7
}
/*
#skrina[data-oddeleni="1"] .dvere_div .dvere {
  width: 100%;
}

#skrina[data-oddeleni="2"] .dvere_div .dvere {
  width: 50%;
}

#skrina[data-oddeleni="3"] .dvere_div .dvere {
  width: 33.33%;
}

#skrina[data-oddeleni="4"] .dvere_div .dvere {
  width: 25%;
}

#skrina[data-oddeleni="5"] .dvere_div .dvere {
  width: 20%;
}

#skrina[data-oddeleni="6"] .dvere_div .dvere {
  width: 16.6666%;
}

#skrina[data-oddeleni="7"] .dvere_div .dvere {
  width: 14.2857%;
}

#skrina[data-oddeleni="8"] .dvere_div .dvere {
  width: 12.5%;
}

#skrina[data-oddeleni="9"] .dvere_div .dvere {
  width: 11.1111%;
}

#skrina[data-oddeleni="10"] .dvere_div .dvere {
  width: 10%;
}
*/

/*
#skrina[data-oddeleni="1"] .dvere_div .dvere_2,
#skrina[data-oddeleni="1"] .dvere_div .dvere_3
#skrina[data-oddeleni="1"] .dvere_div .dvere_4,
#skrina[data-oddeleni="1"] .dvere_div .dvere_5,
#skrina[data-oddeleni="1"] .dvere_div .dvere_6,
#skrina[data-oddeleni="1"] .dvere_div .dvere_7,
#skrina[data-oddeleni="1"] .dvere_div .dvere_8,
#skrina[data-oddeleni="1"] .dvere_div .dvere_9,
#skrina[data-oddeleni="1"] .dvere_div .dvere_10 {
  display: none
}

#skrina[data-oddeleni="2"] .dvere_div .dvere_3,
#skrina[data-oddeleni="2"] .dvere_div .dvere_4,
#skrina[data-oddeleni="2"] .dvere_div .dvere_5,
#skrina[data-oddeleni="2"] .dvere_div .dvere_6,
#skrina[data-oddeleni="2"] .dvere_div .dvere_7,
#skrina[data-oddeleni="2"] .dvere_div .dvere_8,
#skrina[data-oddeleni="2"] .dvere_div .dvere_9,
#skrina[data-oddeleni="2"] .dvere_div .dvere_10 {
  display: none
}


#skrina[data-oddeleni="3"] .dvere_div .dvere_4,
#skrina[data-oddeleni="3"] .dvere_div .dvere_5,
#skrina[data-oddeleni="3"] .dvere_div .dvere_6,
#skrina[data-oddeleni="3"] .dvere_div .dvere_7,
#skrina[data-oddeleni="3"] .dvere_div .dvere_8,
#skrina[data-oddeleni="3"] .dvere_div .dvere_9,
#skrina[data-oddeleni="3"] .dvere_div .dvere_10 {
  display: none
}

#skrina[data-oddeleni="4"] .dvere_div .dvere_5,
#skrina[data-oddeleni="4"] .dvere_div .dvere_6,
#skrina[data-oddeleni="4"] .dvere_div .dvere_7,
#skrina[data-oddeleni="4"] .dvere_div .dvere_8,
#skrina[data-oddeleni="4"] .dvere_div .dvere_9,
#skrina[data-oddeleni="4"] .dvere_div .dvere_10 {
  display: none
}

#skrina[data-oddeleni="5"] .dvere_div .dvere_6,
#skrina[data-oddeleni="5"] .dvere_div .dvere_7,
#skrina[data-oddeleni="5"] .dvere_div .dvere_8,
#skrina[data-oddeleni="5"] .dvere_div .dvere_9,
#skrina[data-oddeleni="5"] .dvere_div .dvere_10 {
  display: none
}

#skrina[data-oddeleni="6"] .dvere_div .dvere_7,
#skrina[data-oddeleni="6"] .dvere_div .dvere_8,
#skrina[data-oddeleni="6"] .dvere_div .dvere_9,
#skrina[data-oddeleni="6"] .dvere_div .dvere_10 {
  display: none
}

#skrina[data-oddeleni="7"] .dvere_div .dvere_8,
#skrina[data-oddeleni="7"] .dvere_div .dvere_9,
#skrina[data-oddeleni="7"] .dvere_div .dvere_10 {
  display: none
}

#skrina[data-oddeleni="8"] .dvere_div .dvere_9,
#skrina[data-oddeleni="8"] .dvere_div .dvere_10 {
  display: none
}

#skrina[data-oddeleni="9"] .dvere_div .dvere_10 {
  display: none
}
*/
#skrina .lista {
  width: 100%;
  height: 6px;
  background: #fff;
  position: absolute;
  left: 0;
}

#skrina .dvere .vyplne {
  width: 100%;
  height: 100%;
}   

#skrina .dvere .vypln {
  width: 100%;
  position: relative
}

#skrina .dvere .vypln:not(.tap),
#skrina .skrinka .vypln:not(.tap),
#skrina .skrina_top .vypln:not(.tap) {
  background-size: 100% 100% !important;
  background-position: center center !important;
}

#skrina .dvere .vyplne_zony {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
  /*display: none*/
}

#skrina .dvere .vyplne_zony .zona {
  width: 100%;
  background-size: 100% 100%;
  position: relative
}


#skrina .dvere .vyplne_zony .zona .zona_btn {
  width: 80px;
  height: 30px;
  background: #0064FF;
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -40px;
  margin-top: -15px;
  text-align: center;
  line-height: 30px;
  color: #fff;
  -moz-border-radius: 15px;
  -webkit-border-radius: 15px;
  border-radius: 15px;
  cursor: pointer;
  text-transform: uppercase;
  font-size: 12px;
  font-weight: 500;
  display: none !important
}

#skrina .dvere .vyplne_zony .zona:hover .zona_btn {
  display: block
}

/*
#skrina .dvere[data-typ="1"] .vypln,
#skrina .dvere[data-typ="1"] .vyplne_zony .zona {
  height: 100%
}

#skrina .dvere[data-typ="2"] .vypln,
#skrina .dvere[data-typ="2"] .vyplne_zony .zona {
  height: 50%
}

#skrina .dvere[data-typ="3"] .vypln,
#skrina .dvere[data-typ="3"] .vyplne_zony .zona {
  height: 33.33%
}

#skrina .dvere[data-typ="4"] .vypln,
#skrina .dvere[data-typ="4"] .vyplne_zony .zona {
  height: 25%
}

#skrina .dvere[data-typ="5"] .vypln,
#skrina .dvere[data-typ="5"] .vyplne_zony .zona {
  height: 20%
}


#skrina .dvere[data-typ="6"] .vypln,
#skrina .dvere[data-typ="6"] .vyplne_zony .zona {
  height: 16.66%
}

#skrina .dvere[data-typ="7"] .vypln,
#skrina .dvere[data-typ="7"] .vyplne_zony .zona {
  height: 12.33%
}

#skrina .dvere[data-typ="7"] .vypln:nth-of-type(1),
#skrina .dvere[data-typ="7"] .vyplne_zony .zona:nth-of-type(1) {
  height: 13%
}




#skrina .dvere[data-typ="8"] .vypln:nth-of-type(1),
#skrina .dvere[data-typ="8"] .vyplne_zony .zona:nth-of-type(1) {
  height: 34%
}

#skrina .dvere[data-typ="8"] .vypln:nth-of-type(2),
#skrina .dvere[data-typ="8"] .vyplne_zony .zona:nth-of-type(2) {
  height: 12%
}

#skrina .dvere[data-typ="8"] .vypln:nth-of-type(3),
#skrina .dvere[data-typ="8"] .vyplne_zony .zona:nth-of-type(3) {
  height: 34%
}



#skrina .dvere[data-typ="9"] .vypln:nth-of-type(1),
#skrina .dvere[data-typ="9"] .vyplne_zony .zona:nth-of-type(1) {
  height: 34%
}

#skrina .dvere[data-typ="9"] .vypln:nth-of-type(2),
#skrina .dvere[data-typ="9"] .vyplne_zony .zona:nth-of-type(2) {
  height: 16%
}

#skrina .dvere[data-typ="9"] .vypln:nth-of-type(3),
#skrina .dvere[data-typ="9"] .vyplne_zony .zona:nth-of-type(3) {
  height: 16%
}

#skrina .dvere[data-typ="9"] .vypln:nth-of-type(4),
#skrina .dvere[data-typ="9"] .vyplne_zony .zona:nth-of-type(4) {
  height: 34%
}





#skrina .dvere[data-typ="10"] .vypln:nth-of-type(1),
#skrina .dvere[data-typ="10"] .vyplne_zony .zona:nth-of-type(1) {
  height: 18%
}

#skrina .dvere[data-typ="10"] .vypln:nth-of-type(2),
#skrina .dvere[data-typ="10"] .vyplne_zony .zona:nth-of-type(2) {
  height: 64%
}

#skrina .dvere[data-typ="10"] .vypln:nth-of-type(3),
#skrina .dvere[data-typ="10"] .vyplne_zony .zona:nth-of-type(3) {
  height: 18%
}

#skrina .dvere[data-typ="11"] .vypln:nth-of-type(1),
#skrina .dvere[data-typ="11"] .vyplne_zony .zona:nth-of-type(1) {
  height: 18%
}

#skrina .dvere[data-typ="11"] .vypln:nth-of-type(2),
#skrina .dvere[data-typ="11"] .vyplne_zony .zona:nth-of-type(2) {
  height: 32%
}

#skrina .dvere[data-typ="11"] .vypln:nth-of-type(3),
#skrina .dvere[data-typ="11"] .vyplne_zony .zona:nth-of-type(3) {
  height: 32%
}

#skrina .dvere[data-typ="11"] .vypln:nth-of-type(4),
#skrina .dvere[data-typ="11"] .vyplne_zony .zona:nth-of-type(4) {
  height: 18%
}


#skrina .dvere[data-typ="12"] .vypln:nth-of-type(1),
#skrina .dvere[data-typ="12"] .vyplne_zony .zona:nth-of-type(1) {
  height: 18%
}

#skrina .dvere[data-typ="12"] .vypln:nth-of-type(2),
#skrina .dvere[data-typ="12"] .vyplne_zony .zona:nth-of-type(2) {
  height: 82%
}


#skrina .dvere[data-typ="13"] .vypln:nth-of-type(1),
#skrina .dvere[data-typ="13"] .vyplne_zony .zona:nth-of-type(1) {
  height: 33%
}

#skrina .dvere[data-typ="13"] .vypln:nth-of-type(2),
#skrina .dvere[data-typ="13"] .vyplne_zony .zona:nth-of-type(2) {
  height: 12%
}

#skrina .dvere[data-typ="13"] .vypln:nth-of-type(3),
#skrina .dvere[data-typ="13"] .vyplne_zony .zona:nth-of-type(3) {
  height: 10%
}

#skrina .dvere[data-typ="13"] .vypln:nth-of-type(4),
#skrina .dvere[data-typ="13"] .vyplne_zony .zona:nth-of-type(4) {
  height: 12%
}

#skrina .dvere[data-typ="13"] .vypln:nth-of-type(5),
#skrina .dvere[data-typ="13"] .vyplne_zony .zona:nth-of-type(5) {
  height: 33%
}



#skrina .dvere[data-typ="14"] .vypln:nth-of-type(1),
#skrina .dvere[data-typ="14"] .vyplne_zony .zona:nth-of-type(1) {
  height: 28.5%
}

#skrina .dvere[data-typ="14"] .vypln:nth-of-type(2),
#skrina .dvere[data-typ="14"] .vyplne_zony .zona:nth-of-type(2) {
  height: 12%
}

#skrina .dvere[data-typ="14"] .vypln:nth-of-type(3),
#skrina .dvere[data-typ="14"] .vyplne_zony .zona:nth-of-type(3) {
  height: 9.5%
}

#skrina .dvere[data-typ="14"] .vypln:nth-of-type(4),
#skrina .dvere[data-typ="14"] .vyplne_zony .zona:nth-of-type(4) {
  height: 9.5%
}

#skrina .dvere[data-typ="14"] .vypln:nth-of-type(5),
#skrina .dvere[data-typ="14"] .vyplne_zony .zona:nth-of-type(5) {
  height: 12%
}
   
#skrina .dvere[data-typ="14"] .vypln:nth-of-type(6),
#skrina .dvere[data-typ="14"] .vyplne_zony .zona:nth-of-type(6) {
  height: 28.5%
}


#skrina .dvere[data-typ="15"] .vypln:nth-of-type(1),
#skrina .dvere[data-typ="15"] .vyplne_zony .zona:nth-of-type(1) {
  height: 17%
}

#skrina .dvere[data-typ="15"] .vypln:nth-of-type(2),
#skrina .dvere[data-typ="15"] .vyplne_zony .zona:nth-of-type(2) {
  height: 9%
}

#skrina .dvere[data-typ="15"] .vypln:nth-of-type(3),
#skrina .dvere[data-typ="15"] .vyplne_zony .zona:nth-of-type(3) {
  height: 19%
}

#skrina .dvere[data-typ="15"] .vypln:nth-of-type(4),
#skrina .dvere[data-typ="15"] .vyplne_zony .zona:nth-of-type(4) {
  height: 10%
}

#skrina .dvere[data-typ="15"] .vypln:nth-of-type(5),
#skrina .dvere[data-typ="15"] .vyplne_zony .zona:nth-of-type(5) {
  height: 19%
}
   
#skrina .dvere[data-typ="15"] .vypln:nth-of-type(6),
#skrina .dvere[data-typ="15"] .vyplne_zony .zona:nth-of-type(6) {
  height: 10%
}

#skrina .dvere[data-typ="15"] .vypln:nth-of-type(7),
#skrina .dvere[data-typ="15"] .vyplne_zony .zona:nth-of-type(7) {
  height: 16%
}
   
   
#skrina .dvere[data-typ="16"] .vypln:nth-of-type(1),
#skrina .dvere[data-typ="16"] .vyplne_zony .zona:nth-of-type(1) {
  height: 66%
}

#skrina .dvere[data-typ="16"] .vypln:nth-of-type(2),
#skrina .dvere[data-typ="16"] .vyplne_zony .zona:nth-of-type(2) {
  height: 11%
}

#skrina .dvere[data-typ="16"] .vypln:nth-of-type(3),
#skrina .dvere[data-typ="16"] .vyplne_zony .zona:nth-of-type(3) {
  height: 23%
}
*/
   

#skrina .dvere .ram {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background-size: 100% 100% !important;
}




#podlaha {
  width: 100%;
  height: 27%;
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 1;
  background-repeat: no-repeat !important;
  background-size: cover !important;
  background: #efefef
}

#dalej {
  width: 90px;
  height: 90px;
  -moz-border-radius: 45px;
  -webkit-border-radius: 45px;
  border-radius: 45px;
  background: #0065FF url(../images/sipka.png) 65px 35px no-repeat;
  color: #e5e5e5;
  line-height: 90px;
  text-align: center;
  padding-right: 15px;
  font-weight: 500;
  font-size: 1.1em;
  cursor: pointer;
  margin-top: 50px;
  position: absolute;
  left: 0px;
  bottom: 5px
}

#dalej:hover {
  background-color: #74A5E7
}

[data-zobrazenie="9"] #workspace nav .link_btn {
  display: none !important
}

/* step 1 */

.rozmer_slider { 
  margin-top: 15px;     
  margin-bottom: 25px;
  font-size: 1.1em;
  display: inline-block;
  width: 100%
}

.rozmer_slider .name {
  float: left;
  text-transform: uppercase;
  font-weight: 400
}
.typ_dvier .name {
  text-transform: uppercase;
  font-weight: 400;
  margin-bottom:10px;

}

.rozmer_slider .value {
  float: right;
  font-weight: 700;
}

.rozmer_slider input {
  width: 40px;
  border: 0;
  background: transparent;
  height: 21px;
  text-align: right;
  font-weight: 700;
  margin-top: -2px;
  display: inline-block;
}

.rozmer_slider .slider_div {
  clear: both;
  margin-top: 20px;
  width: 100%;
  height: 2px;
  background: #0065FF;
  position: relative;
  padding-right: 10px;
  padding-left: 10px
}

.ui-widget-content.ui-slider {
  background: none;
  border: 0
}

.ui-slider-horizontal .ui-slider-handle {
  width: 20px;
  height: 20px;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  border-radius: 10px;
  background: #fff !important;
  border: 2px solid #0065FF !important;
  top: -10px !important;
  cursor: ew-resize !important
}

/* step 2 */

.oddelenia_vyber {
  width: 220px !important;
  height: 195px;
  overflow: hidden;

}

.oddelenia_vyber .jspContainer {
  width: 220px !important;
}

.oddelenia_vyber .jspPane {
  width: 100% !important;
  padding-right: 25px !important
}

.oddelenia_vyber .oddelenie {
  height: 60px;
  cursor: pointer;
  /*display: block !important;  */
}

.oddelenia_vyber .oddelenie .img {
  border: 2px solid #80B1FE;
  height: 50px;
  float: left;
  position: relative;
  margin-top: 5px;
  width: 80px !important;
  opacity: 0.5
}

.oddelenia_vyber .oddelenie:hover .img,
.oddelenia_vyber .oddelenie.active .img {
  border: 2px solid #0065FF;
  opacity: 1
}

.oddelenia_vyber .oddelenie .img .line {
  width: 2px;
  height: 46px;
  position: absolute;
  top: 0px;
  left: 0;
  background: #80B1FE;
  margin-left: -1px
}

.oddelenia_vyber .oddelenie:hover .img .line,
.oddelenia_vyber .oddelenie.active .img .line {
  background: #0065FF;
}

.oddelenia_vyber .oddelenie .name {
  float: right;
  height: 60px;
  line-height: 60px;
  text-align: right;
  color: #7F7F7F;
  text-transform: uppercase;
  font-weight: 500;
  font-size: 1.1em;
}

.oddelenia_vyber .oddelenie:hover .name,
.oddelenia_vyber .oddelenie.active .name {
  color: #000
}

.oddelenia_vyber .oddelenie_1 .img {
  width: 10px
}

.oddelenia_vyber .oddelenie_2 .img {
  width: 20px
}

.oddelenia_vyber .oddelenie_2 .img .line {
  left: 50%
}

.oddelenia_vyber .oddelenie_3 .img {
  width: 30px
}

.oddelenia_vyber .oddelenie_3 .img .line:nth-of-type(1) {
  left: 33.33%
}

.oddelenia_vyber .oddelenie_3 .img .line:nth-of-type(2) {
  left: 66.66%
}

.oddelenia_vyber .oddelenie_4 .img {
  width: 40px
}

.oddelenia_vyber .oddelenie_4 .img .line:nth-of-type(1) {
  left: 25%
}

.oddelenia_vyber .oddelenie_4 .img .line:nth-of-type(2) {
  left: 50%
}

.oddelenia_vyber .oddelenie_4 .img .line:nth-of-type(3) {
  left: 75%
}

.oddelenia_vyber .oddelenie_5 .img {
  width: 50px
}

.oddelenia_vyber .oddelenie_5 .img .line:nth-of-type(1) {
  left: 20%
}

.oddelenia_vyber .oddelenie_5 .img .line:nth-of-type(2) {
  left: 40%
}

.oddelenia_vyber .oddelenie_5 .img .line:nth-of-type(3) {
  left: 60%
}

.oddelenia_vyber .oddelenie_5 .img .line:nth-of-type(4) {
  left: 80%
}


.oddelenia_vyber .oddelenie_6 .img {
  width: 60px
}

.oddelenia_vyber .oddelenie_6 .img .line:nth-of-type(1) {
  left: 16.6666%
}

.oddelenia_vyber .oddelenie_6 .img .line:nth-of-type(2) {
  left: 33.3333%
}

.oddelenia_vyber .oddelenie_6 .img .line:nth-of-type(3) {
  left: 50%
}

.oddelenia_vyber .oddelenie_6 .img .line:nth-of-type(4) {
  left: 66.6666%
}

.oddelenia_vyber .oddelenie_6 .img .line:nth-of-type(5) {
  left: 83.3333%
}


.oddelenia_vyber .oddelenie_7 .img {
  width: 70px
}

.oddelenia_vyber .oddelenie_7 .img .line:nth-of-type(1) {
  left: 14.2857%
}

.oddelenia_vyber .oddelenie_7 .img .line:nth-of-type(2) {
  left: 28.5714%
}

.oddelenia_vyber .oddelenie_7 .img .line:nth-of-type(3) {
  left: 42.8571%
}

.oddelenia_vyber .oddelenie_7 .img .line:nth-of-type(4) {
  left: 57.1428%
}

.oddelenia_vyber .oddelenie_7 .img .line:nth-of-type(5) {
  left: 71.4285%
}

.oddelenia_vyber .oddelenie_7 .img .line:nth-of-type(6) {
  left: 85.7142%
}



.oddelenia_vyber .oddelenie_8 .img {
  width: 80px
}

.oddelenia_vyber .oddelenie_8 .img .line:nth-of-type(1) {
  left: 12.5%
}

.oddelenia_vyber .oddelenie_8 .img .line:nth-of-type(2) {
  left: 25%
}

.oddelenia_vyber .oddelenie_8 .img .line:nth-of-type(3) {
  left: 37.5%
}

.oddelenia_vyber .oddelenie_8 .img .line:nth-of-type(4) {
  left: 50%
}

.oddelenia_vyber .oddelenie_8 .img .line:nth-of-type(5) {
  left: 62.5%
}

.oddelenia_vyber .oddelenie_8 .img .line:nth-of-type(6) {
  left: 75%
}

.oddelenia_vyber .oddelenie_8 .img .line:nth-of-type(7) {
  left: 87.5%
}


.oddelenia_vyber .oddelenie_9 .img {
  width: 90px
}

.oddelenia_vyber .oddelenie_9 .img .line:nth-of-type(1) {
  left: 11.11%
}

.oddelenia_vyber .oddelenie_9 .img .line:nth-of-type(2) {
  left: 22.22%
}

.oddelenia_vyber .oddelenie_9 .img .line:nth-of-type(3) {
  left: 33.33%
}

.oddelenia_vyber .oddelenie_9 .img .line:nth-of-type(4) {
  left: 44.44%
}

.oddelenia_vyber .oddelenie_9 .img .line:nth-of-type(5) {
  left: 55.55%
}

.oddelenia_vyber .oddelenie_9 .img .line:nth-of-type(6) {
  left: 66.66%
}

.oddelenia_vyber .oddelenie_9 .img .line:nth-of-type(7) {
  left: 77.77%
}

.oddelenia_vyber .oddelenie_9 .img .line:nth-of-type(8) {
  left: 88.88%
}



.oddelenia_vyber .oddelenie_10 .img {
  width: 100px
}

.oddelenia_vyber .oddelenie_10 .img .line:nth-of-type(1) {
  left: 10%
}

.oddelenia_vyber .oddelenie_10 .img .line:nth-of-type(2) {
  left: 20%
}

.oddelenia_vyber .oddelenie_10 .img .line:nth-of-type(3) {
  left: 30%
}

.oddelenia_vyber .oddelenie_10 .img .line:nth-of-type(4) {
  left: 40%
}

.oddelenia_vyber .oddelenie_10 .img .line:nth-of-type(5) {
  left: 50%
}

.oddelenia_vyber .oddelenie_10 .img .line:nth-of-type(6) {
  left: 60%
}

.oddelenia_vyber .oddelenie_10 .img .line:nth-of-type(7) {
  left: 70%
}

.oddelenia_vyber .oddelenie_10 .img .line:nth-of-type(8) {
  left: 80%
}

.oddelenia_vyber .oddelenie_10 .img .line:nth-of-type(9) {
  left: 90%
}

/* step 3 */

.umiestnenie_vyber {
  margin-top: -20px
}

.umiestnenie_vyber .umiestnenie {
  width: 50%;
  float: left;
  /*padding-top: 80px; */
  color: #7F7F7F;
  max-width: 107px;
  margin-top: 20px;
  cursor: pointer;
  margin-right: 4px
}

.umiestnenie_vyber .umiestnenie .icon {
  width: 100%;
  height: 80px;
  display: inline-block;
  opacity: 0.35
}

.umiestnenie_vyber .umiestnenie_1 .icon {
  background:  url(../images/skrina-priestor.png) left 6px no-repeat;
}

.umiestnenie_vyber .umiestnenie_2 .icon {
  background:  url(../images/skrina-medzi-stenami.png) left top no-repeat;
  margin-right: 0
}

.umiestnenie_vyber .umiestnenie_3 .icon {
  background:  url(../images/skrina-stena-zlava.png) left top no-repeat;
}

.umiestnenie_vyber .umiestnenie_4 .icon {
  background:  url(../images/skrina-stena-zprava.png) left top no-repeat;  
  margin-right: 0
}
 
.umiestnenie_vyber .umiestnenie:hover,
.umiestnenie_vyber .umiestnenie.active {
  color: #000
}

.umiestnenie_vyber .umiestnenie:hover .icon,
.umiestnenie_vyber .umiestnenie.active .icon {
  opacity: 1
}
 
 
/* step 4 */


.interier_vyber, .dvere_vyber {
  margin-top: -20px;
  height: 230px;
  /*overflow-y: hidden*/
}

aside .step_form .btn {
  -moz-border-radius: 15px;
  -webkit-border-radius: 15px;
  border-radius: 15px;
}

.interier_vyber .slide, .dvere_vyber .slide {
  height: 190px;
  overflow: hidden;
  display: none
} 
            
.interier_vyber .slide:first-of-type,
.dvere_vyber .slide:first-of-type {
  display: block
}


.interier_vyber .arrows, 
.dvere_vyber .arrows {
  width: 100%;
  text-align: center;
  margin-top: 10px;
}

.interier_vyber .arrows {

}

.arrows .arrow_left,
.arrows .arrow_right {
  display: inline-block;
  font-size: 27px;
  cursor: pointer;
  width: 30px;
  height: 30px;
  text-align: center;
  color: #000;
  
}

.arrows .arrow_left:hover,
.arrows .arrow_right:hover {
  color: rgb(0, 101, 255)
}

.interier_vyber h2 {
  margin: 0px 0px 20px 0px;
  display: none   
}

.interier_vyber.opened {
  width: 100% !important;
  height: 100%;
  position: absolute;
  left: -15px;
  top: 0px;
  background: #fff;
  margin: 0;
  z-index: 1000 !important;
  padding-left: 25px;
  padding-top: 20px;
  overflow: visible
}

.interier_vyber .btn {
  margin-top: 20px;
  height: 30px;
  line-height: 30px;
  margin-bottom: 10px;
  -moz-border-radius: 30px;
  -webkit-border-radius: 30px;
  border-radius: 30px;   
}

.interier_vyber.opened h2 {
  display: block
}

.interier_vyber .interier {
  width: 40px;
  height: 80px;
  border: 2px solid #0065FF;
  float: left;
  margin-right: 16px;
  position: relative;
  margin-top: 15px;
  cursor: move;
  background: #fff;
  z-index: 1000000 !important
}

.interier_vyber .interier:nth-of-type(4n) {
  margin-right: 0
}


.interier_vyber .interier.nadstavec {
  border: 2px solid transparent
}


/*
.interier_vyber .interier .suflik.lavy {
  margin-left: -2px
}

.interier_vyber .interier .suflik.pravy {
  margin-left: -4px
}
*/
.interier_vyber .interier .top {
  width: 100%;
  height: 10%;
  top: 0%;
  position: absolute; 
}

.interier_vyber .interier .main {
  width: 100%;
  height: 90%;
  top: 10%;
  position: absolute;
  border-top: 2px solid #0065FF; 
}
/*
.interier_vyber .interier_4,
.interier_vyber .interier_8,
.interier_vyber .interier_12,
.interier_vyber .interier_16,
.interier_vyber .interier_20,
.interier_vyber .interier_24 {
  margin-right: 0
}
*/
.interier_vyber .interier .polica {
  width: 100%;
  height: 2px;
  background: #0065FF;
  position: absolute;
  left: 0; 
  margin-top: -1px
}

.interier_vyber .lava_cast {
  width: calc(50% + 1px);
  position: absolute;
  left: 0;
  border-right: 2px solid #0065FF;
}

.interier_vyber .lava_cast .doska_top {
  width: calc(100% + 2px)
}

.interier_vyber .prava_cast {
  width: calc(50% - 1px);
  position: absolute;
  right: 0;
}

.interier_vyber {
  width: calc(100% + 5px) !important
}

/*
.interier_vyber .interier_1 .doska {
  top: 13%;
}

.interier_vyber .interier_2 .doska:nth-of-type(1) {
  top: 13%;
}

.interier_vyber .interier_2 .doska:nth-of-type(3) {
  top: 62%;
}


.interier_vyber .interier_3 .doska:nth-of-type(1) {
  top: 13%;
}

.interier_vyber .interier_3 .doska:nth-of-type(2) {
  top: 30%;
}

.interier_vyber .interier_3 .doska:nth-of-type(3) {
  top: 54%;
}

.interier_vyber .interier_3 .doska:nth-of-type(4) {
  top: 78%;
}


.interier_vyber .interier_4 .doska:nth-of-type(1) {
  top: 13%;
}

.interier_vyber .interier_4 .doska:nth-of-type(2) {
  top: 32%;
}

.interier_vyber .interier_4 .doska:nth-of-type(3) {
  top: 48%;
}

.interier_vyber .interier_4 .doska:nth-of-type(4) {
  top: 64%;
}

.interier_vyber .interier_4 .doska:nth-of-type(5) {
  top: 80%;
}

.interier_vyber .interier_5 .doska:nth-of-type(1) {
  top: 13%;
}

.interier_vyber .interier_5 .doska:nth-of-type(2) {
  top: 27%;
}

.interier_vyber .interier_5 .doska:nth-of-type(3) {
  top: 41%;
}

.interier_vyber .interier_5 .doska:nth-of-type(4) {
  top: 55%;
}

.interier_vyber .interier_5 .doska:nth-of-type(5) {
  top: 69%;
}

.interier_vyber .interier_5 .doska:nth-of-type(6) {
  top: 83%;
}

.interier_vyber .interier_6 .doska:nth-of-type(1) {
  top: 13%;
}

.interier_vyber .interier_6 .doska:nth-of-type(2) {
  top: 55%;
}

.interier_vyber .interier_6 .doska:nth-of-type(3) {
  top: 77%;
}

.interier_vyber .interier_7 {
  height: 12px
}
.interier_vyber .interier_8 .doska:nth-of-type(1) {
  top: 13%;
}

.interier_vyber .interier_9 .doska:nth-of-type(1) {
  top: 13%;
}

.interier_vyber .interier_9 .doska:nth-of-type(2) {
  top: 22%;
}

.interier_vyber .interier_9 .doska:nth-of-type(4) {
  top: 62%;
}


.interier_vyber .interier_10 .doska:nth-of-type(1) {
  top: 13%;
}

.interier_vyber .interier_10 .doska:nth-of-type(2) {
  top: 26%;
}

.interier_vyber .interier_10 .doska:nth-of-type(4) {
  top: 85%;
}


.interier_vyber .interier_11 .doska:nth-of-type(1) {
  top: 13%;
}

.interier_vyber .interier_11 .doska:nth-of-type(3) {
  top: 85%;
}

.interier_vyber .interier_12 .doska:nth-of-type(1) {
  top: 13%;
}

.interier_vyber .interier_12 .doska:nth-of-type(3) {
  top: 51%;
}

.interier_vyber .interier_13 .doska:nth-of-type(1) {
  top: 13%;
}

.interier_vyber .interier_13 .doska:nth-of-type(2) {
  top: 26%;
}

.interier_vyber .interier_13 .doska:nth-of-type(3) {
  top: 39%;
}

.interier_vyber .interier_13 .doska:nth-of-type(4) {
  top: 51%;
}


.interier_vyber .interier_14 .doska:nth-of-type(1) {
  top: 13%;
}
                                    
.interier_vyber .interier_14 .doska:nth-of-type(3) {
  top: 57%;
}

.interier_vyber .interier_14 .doska:nth-of-type(4) {
  top: 72%;
}

.interier_vyber .interier_14 .doska:nth-of-type(5) {
  top: 87%;
}


.interier_vyber .interier_15 .doska:nth-of-type(1) {
  top: 13%;
}

.interier_vyber .interier_15 .doska:nth-of-type(2) {
  top: 26%;
}

.interier_vyber .interier_15 .doska:nth-of-type(3) {
  top: 39%;
}

.interier_vyber .interier_15 .doska:nth-of-type(4) {
  top: 51%;
}

.interier_vyber .interier_15 .doska:nth-of-type(5) {
  top: 64%;
}

.interier_vyber .interier_15 .doska:nth-of-type(6) {
  top: 77%;
}


.interier_vyber .interier_16 .doska:nth-of-type(1) {
  top: 13%;
}

.interier_vyber .interier_16 .doska:nth-of-type(2) {
  top: 55%;
}

.interier_vyber .interier_16 .doska:nth-of-type(5) {
  top: 83%;
}

*/

.interier_vyber .interier .half_box {
  width: 50%;
  height: 50%;
  position: absolute;
  left: 0;
  bottom: 0;
  border-top: 2px solid #0065FF;
  border-right: 2px solid #0065FF;
}
/*
.interier_vyber .interier .half_box .tyc {
  width: 100%;
  height: 5px;
  background: transparent url(/assets/images/tyc.png) center top no-repeat;
  background-size: 100% 100%;
  position: absolute;
  left: 0;
  top: 2px;
}
*/
.interier_vyber .tyc_vesiak {
  width: 100%;
  height: 10%;
  position: absolute;
  left: 0;
}

.interier_vyber .half_box .tyc_vesiak {
  height: 20%;
  top: 1px !important
}

.interier_vyber .tyc_vesiak .tyc {
  width: 100%;
  height: 2px;
  position: absolute;
  left: 0;
  top: 1px;
  background: transparent url(/assets/images/tyc.png) center top no-repeat;
  background-size: 100% 100% !important  
}

.interier_vyber .tyc_vesiak .vesiak {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 1px;
  background: transparent url(/assets/images/vesiak.png) center top no-repeat;
  background-size: auto 100% !important  
}
      
/*
.interier_vyber .interier_1 .tyc_vesiak {
  top: 17%
}

.interier_vyber .interier_2 .tyc_vesiak {
  top: 17%
}
*/
/*
.interier_vyber .interier_2 .tyc_vesiak {
  top: 17%
}
*/
/*
.interier_vyber .interier_8 .tyc_vesiak {
  top: 17%;
}

.interier_vyber .interier_9 .tyc_vesiak {
  top: calc(22% + 3px)
}

.interier_vyber .interier_10 .tyc_vesiak {
  top: calc(26% + 3px)
}
*/
/*
.interier_vyber .interier_11 {
  top: 17%
}

.interier_vyber .interier_11 .tyc_vesiak {
  top: 17%
}

.interier_vyber .interier_12 .tyc_vesiak:nth-of-type(2) {
  top: 17%
}

.interier_vyber .interier_12 .tyc_vesiak:nth-of-type(4) {
  top: 54%
}

.interier_vyber .interier_13 .tyc_vesiak {
  top: 54%
}

.interier_vyber .interier_14 .tyc_vesiak {
  top: 17%
}
*/

.interier_vyber .suflik {
  width: 100%;
  height: 10%;
  position: absolute;
  left: 0;
  top: 0;
  background: #0065FF;
  margin-top: 1px
}

.interier_vyber .suflik .madlo {
  width: 4px;
  height: 2px;
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -2px;
  margin-top: -1px;
  background: url(/assets/images/madlo.png) center top no-repeat;
  background-size: 100% 100%
}
/*
.interier_vyber .interier_2 .suflik_1 {
  top: calc(61% + 4px);
  height: 10%
}

.interier_vyber .interier_2 .suflik_2 {
  top: calc(78% + 0px);
  height: 10%
}

.interier_vyber .interier_2 .suflik_3 {
  top: calc(90% + 0px);
  height: 10%
}

.interier_vyber .interier_9 .suflik_1 {
  top: calc(61% + 4px);
  height: 10%
}

.interier_vyber .interier_9 .suflik_2 {
  top: calc(78% + 0px);
  height: 10%
}

.interier_vyber .interier_9 .suflik_3 {
  top: calc(90% + 0px);
  height: 10%
}

.interier_vyber .interier_15 .suflik_1 {
  top: calc(78% + 3px);
  height: 5%
}

.interier_vyber .interier_15 .suflik_2 {
  top: calc(90% - 1px);
  height: 5%
}

.interier_vyber .interier_16 .suflik_1 {
  top: calc(55% + 3px);
  height: 5%
}

.interier_vyber .interier_16 .suflik_2 {
  top: calc(67% - 1px);
  height: 5%
}

*/



.interier_vyber .mriezka {
  width: 90%;
  position: absolute;
  left: 5%;
  background: url(/assets/images/klietka.png) center top no-repeat;
  background-size: 100% 100%
}














/* step 5 */
/*
.step:nth-of-type(5) .step_form {
  display: block !important
}*/

.dvere_vyber {
  height: 230px; 
  width: calc(100% + 5px) !important;   
}

.dvere_vyber h2 {
  margin: 0px 0px 20px 0px;
  display: none   
}

.dvere_vyber.opened {
  width: calc(100% + 30px) !important;
  height: 100%;
  position: absolute;
  left: -30px;
  top: 0;
  background: #fff;
  z-index: 1000 !important;
  padding-left: 25px;
  overflow: visible
}

.dvere_vyber .btn {
  margin-top: 20px;
  height: 30px;
  line-height: 30px;
  margin-bottom: 10px;
  -moz-border-radius: 30px;
  -webkit-border-radius: 30px;
  border-radius: 30px;   
}

.dvere_vyber.opened h2 {
  display: block
}

.dvere_vyber .dvere {
  width: 40px;
  height: 80px;
  border: 1px solid #0065FF;
  float: left;
  margin-right: 16px;
  position: relative;
  margin-top: 15px;
  cursor: move;
  background: #fff;
  z-index: 1000000 !important
}

.dvere_vyber .dvere_0 .text {
  width: 80px;
  font-size: 16px;
  line-height: 16px;
  transform: rotate(90deg) translateY(20px) translateX(5px);
  position: absolute;
  top: 50%
}



.dvere_vyber .dvere .cast {
  width: 100%;
  border-top: 1px solid #0065FF;
}

.dvere_vyber .dvere .cast:first-of-type {
  border-top: 0
}

.dvere_vyber .dvere_3,
.dvere_vyber .dvere_7,
.dvere_vyber .dvere_11,
.dvere_vyber .dvere_15,
.dvere_vyber .dvere_19 {
  margin-right: 0
}
/*
.dvere_vyber .dvere_0 {
  margin-top: 0 !important
}

.dvere_vyber .dvere_1 {
  margin-top: 0 !important
}

.dvere_vyber .dvere_2 {
  margin-top: 0 !important
}

.dvere_vyber .dvere_3 {
  margin-top: 0 !important
}
*/

.dvere_vyber .dvere .ram {
  width: 38px;
  height: 78px;
  border: 3px solid #99C1FF
}

.dvere_vyber .dvere .ram .lista {
  width: 32px;
  height: 2px;
  background: #99C1FF;
  position: absolute;
  left: 3px;
  margin-top: -1px
}

.dvere_vyber .dvere_0 .ram {
  border: 0
}

.dvere_vyber .dvere_2 .lista:nth-of-type(1) {
  top: 50%;
}

.dvere_vyber .dvere_3 .lista:nth-of-type(1) {
  top: 33.33%
}

.dvere_vyber .dvere_3 .lista:nth-of-type(2) {
  top: 66.66%
}

.dvere_vyber .dvere_4 .lista:nth-of-type(1) {
  top: 25%
}

.dvere_vyber .dvere_4 .lista:nth-of-type(2) {
  top: 50%
}

.dvere_vyber .dvere_4 .lista:nth-of-type(3) {
  top: 75%
}

.dvere_vyber .dvere_5 .lista:nth-of-type(1) {
  top: 20%
}

.dvere_vyber .dvere_5 .lista:nth-of-type(2) {
  top: 40%
}

.dvere_vyber .dvere_5 .lista:nth-of-type(3) {
  top: 60%
}

.dvere_vyber .dvere_5 .lista:nth-of-type(4) {
  top: 80%
}


.dvere_vyber .dvere_6 .lista:nth-of-type(1) {
  top: 16.66%
}

.dvere_vyber .dvere_6 .lista:nth-of-type(2) {
  top: 33.33%
}

.dvere_vyber .dvere_6 .lista:nth-of-type(3) {
  top: 50%
}

.dvere_vyber .dvere_6 .lista:nth-of-type(4) {
  top: 66.66%
}

.dvere_vyber .dvere_6 .lista:nth-of-type(5) {
  top: 83.33%
}


.dvere_vyber .dvere_7 .lista:nth-of-type(1) {
  top: 12.5%
}

.dvere_vyber .dvere_7 .lista:nth-of-type(2) {
  top: 25%
}

.dvere_vyber .dvere_7 .lista:nth-of-type(3) {
  top: 37.5%
}

.dvere_vyber .dvere_7 .lista:nth-of-type(4) {
  top: 50%
}

.dvere_vyber .dvere_7 .lista:nth-of-type(5) {
  top: 62.5%
}

.dvere_vyber .dvere_7 .lista:nth-of-type(6) {
  top: 75%
}

.dvere_vyber .dvere_7 .lista:nth-of-type(7) {
  top: 87.5%
}



.dvere_vyber .dvere_8 .lista:nth-of-type(1) {
  top: 40%
}

.dvere_vyber .dvere_8 .lista:nth-of-type(2) {
  top: 60%
}



.dvere_vyber .dvere_9 .lista:nth-of-type(1) {
  top: 35%
}

.dvere_vyber .dvere_9 .lista:nth-of-type(2) {
  top: 50%
}

.dvere_vyber .dvere_9 .lista:nth-of-type(3) {
  top: 65%
}



.dvere_vyber .dvere_10 .lista:nth-of-type(1) {
  top: 20%
}

.dvere_vyber .dvere_10 .lista:nth-of-type(2) {
  top: 80%
}



.dvere_vyber .dvere_11 .lista:nth-of-type(1) {
  top: 20%
}

.dvere_vyber .dvere_11 .lista:nth-of-type(2) {
  top: 50%
}

.dvere_vyber .dvere_11 .lista:nth-of-type(3) {
  top: 80%
}


.dvere_vyber .dvere_12 .lista:nth-of-type(1) {
  top: 20%
}



.dvere_vyber .dvere_13 .lista:nth-of-type(1) {
  top: 35%
}

.dvere_vyber .dvere_13 .lista:nth-of-type(2) {
  top: 46%
}

.dvere_vyber .dvere_13 .lista:nth-of-type(3) {
  top: 54%
}

.dvere_vyber .dvere_13 .lista:nth-of-type(4) {
  top: 65%
}



.dvere_vyber .dvere_14 .lista:nth-of-type(1) {
  top: 30%
}

.dvere_vyber .dvere_14 .lista:nth-of-type(2) {
  top: 41%
}

.dvere_vyber .dvere_14 .lista:nth-of-type(3) {
  top: 50%
}

.dvere_vyber .dvere_14 .lista:nth-of-type(4) {
  top: 59%
}

.dvere_vyber .dvere_14 .lista:nth-of-type(5) {
  top: 70%
}



.dvere_vyber .dvere_15 .lista:nth-of-type(1) {
  top: 20%
}

.dvere_vyber .dvere_15 .lista:nth-of-type(2) {
  top: 30%
}

.dvere_vyber .dvere_15 .lista:nth-of-type(3) {
  top: 45%
}

.dvere_vyber .dvere_15 .lista:nth-of-type(4) {
  top: 55%
}

.dvere_vyber .dvere_15 .lista:nth-of-type(5) {
  top: 70%
}

.dvere_vyber .dvere_15 .lista:nth-of-type(6) {
  top: 80%
}


.dvere_vyber .dvere_16 .lista:nth-of-type(1) {
  top: 65%
}

.dvere_vyber .dvere_16 .lista:nth-of-type(2) {
  top: 75%
}






.left {
  float: left
}

.right {
  float: right 
}

.clear {
  clear: both;
  overflow: hidden
}



[data-zobrazenie="1"] #skrina .ext,
[data-zobrazenie="2"] #skrina .ext,
[data-zobrazenie="3"] #skrina .ext,
[data-zobrazenie="4"] #skrina .ext,
[data-zobrazenie="5"] #skrina .ext  {
  display: none
}

/*
[data-zobrazenie="6"] #skrina .vertikalne_dosky,
[data-zobrazenie="7"] #skrina .vertikalne_dosky {
  display: none
}
*/


.popup {
  width: 500px;
  height: 80%;
  background: #fff;
  padding: 15px 20px 20px 20px;
  position: absolute;
  left: 10px;
  top: 10px;
  z-index: 100000;
  display: none;
  -moz-box-shadow: 0px 0px 10px #999;
  -webkit-box-shadow: 0px 0px 10px #999;
  box-shadow: 0px 0px 10px #999;
}

.popup h2 {
  font-weight: 300;
  font-size: 1.7em;
  margin: 5px 0px 25px 0px
}

.popup h3 {
  font-weight: 300;
  font-size: 1.4em;
  margin: 10px 0px 25px 0px
}


.popup nav {
  border-bottom: 1px solid #CDCDCD
}

.popup nav span {
  color: #808080;
  display: inline-block;
  margin-right: 15px;
  font-weight: 500;
  font-size: 1.05em;
  cursor: pointer;
  line-height: 30px;
  margin-bottom: 10px
}

#interier_material_popup.popup nav span:nth-of-type(10) {
  margin-right: 0
}


.popup nav span:hover,
.popup nav span.active {
  color: #080808;
}


*/
.material.stena img, .material.podlaha img {   
  -moz-box-shadow: 0px 0px 15px #ccc;   
  -webkit-box-shadow: 0px 0px 15px #ccc;   
  box-shadow: 0px 0px 15px #ccc;
}

/*
#interier_material_popup {
  padding-top: 20px;
  padding-bottom: 20px
}
*/



.material .img {
  width: 70px;
  height: 70px;
  margin-bottom: 10px;
  background-size: 100% 100%
}

.material .img.hor {
  -ms-transform: rotate(-90deg); /* IE 9 */
  -webkit-transform: rotate(-90deg); /* Chrome, Safari, Opera */
  transform: rotate(-90deg);
}

.material .nazov {
  width: 100%;
  height: auto;
  overflow: hidden;
  text-align: center;
  color: #7E7E7E !important;
  font-weight: 300;
  line-height: 1.3em;
  word-break: break-word;
  max-height: 55px;
}

.material .overlay {
  width: 70px;
  height: 70px;
  position: absolute;
  left: 0;
  top: 0;
  background: rgba(0,0,0,0.7);
  display: none
}
/*
.material:hover .overlay {
  display: block
}
*/

.material .overlay .btn {
  width: 60px;
  overflow: hidden;
  left: 5px;
  height: 20px;
  line-height: 20px;
  font-size: 11px;
  position: absolute;
  margin-top: 0;
  text-align: center;
  padding: 0
}

.material .overlay .btn.horizontal {
  top: 10px;
}

.material .overlay .btn.vertical {
  top: 40px;
}



.polica .front {
  width: 100%;
  height: 6px;
  position: absolute;
  left: 0;
  bottom: 0;
  background-size: 100% 100% !important
}

.polica .top {
  width: 100%;
  height: 10px;
  position: absolute;
  left: 0;
  bottom: 5px;
  background-size: 100% 100% !important;
}

.skrina_top .polica .top {
  width: calc(100% - 0px);
  left: 6px;
}

.polica .top:after {
  width: 100%;
  height: 15px;
  position: absolute;
  left: 0;
  bottom: 0;
  background: url(/assets/images/tien1.png) center bottom no-repeat;
  background-size: 100% 100%;
  content: "";
  z-index: 1000000
}
/*
.polica:first-of-type .top:after {
  background: none !important
}
*/

#skrina .interier .polovice {
  width: 100%;
  position: absolute;
  left: 0;
}

#skrina .interier .lava_cast {
  width: calc(50% - 3px);
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  /*margin-top: 2px*/
}

#skrina .interier .prava_cast {
  width: calc(50% - 3px);
  position: absolute;
  right: 0;
  top: 0;
  height: 100%;
  /*margin-top: 2px */
}


#skrina .interier .lava_cast .doska_top,
#skrina .interier .prava_cast .doska_top {
  width: calc(100% + 6px)
}


#skrina .interier .polovice .priecka {
  width: 6px;
  position: absolute;
  top: 0;
  left: 50%;
  margin-left: -3px;
  height: 100%;
}

#skrina .interier .half_box {
  width: calc(50% + 3px);
  height: 50%;
  position: absolute;
  bottom: 0;
}

#skrina .interier .half_box.left {
  left: 0;
}

#skrina .interier .half_box.right {
  right: 0;
}

.interier .half_box .top {
  width: 100%;
  height: 6px;
  background: #fff;
  background-size: 100% 100% !important;
  position: absolute;
  top: 0;
}

.interier .half_box.left .top {
  left: 0;
}

.interier .half_box.right .top {
  right: 0;
}

.interier .half_box .side {
  width: 6px;
  height: 100%;
  background: #fff;
  background-size: 100% 100%;
  position: absolute;
  top: 0;
}

#skrina .interier .half_box.left .side {
  right: 0px
}

#skrina .interier .half_box.right .side {
  left: 0px
}

#skrina .interier .half_box .tyc_vesiak {
  width: calc(100% - 6px) !important;
  top: 6px
}


#skrina .interier .tyc_vesiak {
  width: 100%;
  height: 12%;
  background-size: 100% 100% !important;
  position: absolute;
  left: 0;
}


#skrina .interier .tyc_vesiak .tyc {
  width: 100%;
  height: 4px;
  position: absolute;
  left: 0;
  top: 3px;
  background: transparent url(/assets/images/tyc.png) center top no-repeat;
  background-size: 100% 100% !important
}

#skrina .interier .tyc_vesiak .vesiak {
  width: 100%;
  height: 110%;
  position: absolute;
  left: 0;
  top: 3px;
  background: transparent url(/assets/images/vesiak.png) center top no-repeat;
  background-size: auto 100% !important
}



#skrina .interier .suflik {
  width: 100%;
  height: 10%;
  position: absolute;
  left: 0;
  top: 0;
  background-size: 100% 100% !important;  
}

#skrina .interier .suflik .madlo {
  width: 10px;
  height: 3px;
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -4px;
  margin-top: -1px;
  background: url(/assets/images/madlo.png) center top no-repeat;
  background-size: 100% 100%
}

#skrina .interier .mriezka {
  width: 90%;
  position: absolute;
  left: 5%;
  background: url(/assets/images/klietka.png) center top no-repeat;
  background-size: 100% 100%
}
/*
#skrina .interier .sklopny_vesiak {
  width: 100%;
  position: absolute;
  left: 0;
  background-size: 100% 100% !important;
  background-color: yellow
}
*/
#skrina .interier .hacik {
  width: 6px;
  height: 10px;
  position: absolute;
  background: url(/assets/images/zavesak.png) center top no-repeat;
  background-size: 100% 100%
}


.interier_vyber .hacik {
  width: 3px;
  height: 5px;
  position: absolute;
  background: url(/assets/images/zavesak.png) center top no-repeat;
  background-size: 100% 100%
  margin-top: 3px
}

#skrina .skrina_main .skrinka {
  width: calc(100% + 12px) !important;
  left: -6px !important;
  position: absolute;
}




.interier_vyber .skrinka {
  width: 100%;
  left: 0px;
  position: absolute;
  margin-top: 2px
}


.skrinka.madlo_hore {

}

#skrina .dvere_lave,
.interier_vyber .skrinka .dvere_lave,
.interier_vyber .top .dvere_lave {
  width: 50.5%;
  height: 100%;
  position: absolute;
  left: 0px;
  top: 0px;
  background-size: 100% 100% !important;
}

#skrina .skrina_top .dvere_lave {
  height: calc(100% - 0px);
}


#skrina .dvere_prave,
.interier_vyber .skrinka .dvere_prave,
.interier_vyber .top .dvere_prave {
  width: 50.5%;              
  height: 100%;
  position: absolute;
  right: 0;
  top: 0;
  background-size: 100% 100% !important;
}

#skrina .skrina_top .dvere_prave {
  height: calc(100% - 0px);
}

.interier_vyber .dvere_lave,
.interier_vyber .dvere_prave {
  background: #0065FF
}

.interier_vyber .dvere_lave .madlo,
.interier_vyber .dvere_prave .madlo {
  width: 4px;
  height: 2px;
  position: absolute;
  top: 50%;
  margin-top: -1px;
  background: url(/assets/images/madlo.png) center top no-repeat;
  background-size: 100% 100%
}


.interier_vyber .dvere_lave .madlo {
  right: 10%
}

.interier_vyber .dvere_prave .madlo {
  left: 10%
}

#skrina .dvere_lave .madlo,
#skrina .dvere_prave .madlo {
  width: 10px;
  height: 3px;
  position: absolute;
  top: 75%;
  background: url(/assets/images/madlo.png) center top no-repeat;
  background-size: 100% 100%
}

#skrina .dvere_lave .madlo {
  right: 10%
}

#skrina .dvere_prave .madlo {
  left: 10%
}

#skrina .skrinka.madlo_hore .dvere_lave .madlo {
  top: 15%;
  right: 15%
}

#skrina .skrinka.madlo_hore .dvere_prave .madlo {
  top: 15%;
  left: 15%
}

#skrina .skrinka .dvere_lave .vypln,
#skrina .skrinka .dvere_prave .vypln,
#skrina .skrina_top .dvere_lave .vypln,
#skrina .skrina_top .dvere_prave .vypln,
#skrina .suflik .vypln {
  width: 100%;
  height: 100%; 
  -moz-box-shadow: 0px 0px 1px 0px rgb(146,129,119);
  -webkit-box-shadow: 0px 0px 1px 0px rgb(146,129,119);
  box-shadow: 0px 0px 1px 0px rgb(146,129,119);
}

#skrina .skrinka .dvere_lave .vypln:not(.tap),
#skrina .skrinka .dvere_prave .vypln:not(.tap),
#skrina .skrina_top .dvere_lave .vypln:not(.tap),
#skrina .skrina_top .dvere_prave .vypln:not(.tap),
#skrina .skrina_top .suflik .vypln:not(.tap) {
  background-size: 100% 100% !important
}



[data-zobrazenie="6"] .dvere_lave .vypln,
[data-zobrazenie="6"] .dvere_prave .vypln {
  cursor: pointer
}




.materialy {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  gap: 10px;
}

#interier_material_popup {
  width: 500px
}


.popup .jspPane {
  width: 460px !important
}

.popup .jspPane .materialy {
  width: 460px !important
}

#interier_material_popup .tab {
  height: calc(100% - 50px)
}


#interier_material_popup.popup h3 {
  margin-bottom: 10px
}



.jspTrack {
  background: #ccc
}

.jspDrag {
  background: #74A5E7 
}


.popup .tab {
  display: none;
}

.popup .tab1 {
  display: block
}

#silueta {   
  width: auto;
  position: absolute;
  bottom: -20px;
  z-index: 100000;
  display: none
}

#silueta img {
  height: 100%;
  width: auto;  
}

[data-silueta="1"] #silueta {
  left: -80px;
}

[data-zobrazenie="6"][data-silueta="1"] #silueta {
  left: -200px
}

[data-silueta="2"] #silueta {
  left: -110px;
}

[data-silueta="3"] #silueta {
  left: -80px;
}

[data-zobrazenie="6"] #silueta {
  display: none !important
}


.kota {
  background: #000;
  position: absolute;
}

.kota.horizontalna {
  width: calc(100% + 6px);
  /*width: calc(100% - 1px);*/
  height: 1px;
  left: -6px;
  top: -30px
}

.kota.horizontalna div {
  position: absolute;
  width: 1px;
  height: 17px;
  background: #000
}

.kota.horizontalna div:first-of-type {
  left: 0;
  top: -8px
}

.kota.horizontalna div:nth-of-type(2) {
  right: 0;
  top: -8px
}

.kota.horizontalna span {
  display: block;
  position: absolute;
  left: 0;
  top: -25px;
  width: 100%;
  text-align: center;
  color: #000;
  font-size: 0.9em;
  font-weight: 700 
}




.kota.vertikalna {
  width: 1px;
  height: calc(100% - 2px);
  right: -30px;
  top: 0
}

.kota.vertikalna div {
  position: absolute;
  height: 1px;
  width: 17px;
  background: #000
}

.kota.vertikalna div:first-of-type {
  left: -8px;
  top: 0
}

.kota.vertikalna div:nth-of-type(2) {
  left: -8px;
  bottom: 0
}

.kota.vertikalna span {
  display: block;
  position: absolute;
  left: 10px;
  top: 50%;
  margin-top: -15px;
  width: 50px;
  height: 30px;
  text-align: left;
  color: #000;
  font-size: 0.9em;
  font-weight: 700 
}




#silueta .kota {
  width: 1px;
  height: calc(93% - 20px);
  left: -10px;
  bottom: 20px
}

#silueta .kota div {
  position: absolute;
  height: 1px;
  width: 17px;
  background: #000
}

#silueta .kota div:first-of-type {
  left: -8px;
  top: 0
}

#silueta .kota div:nth-of-type(2) {
  left: -8px;
  bottom: 0
}

#silueta .kota span {
  display: block;
  position: absolute;
  left: -50px;
  top: 50%;
  margin-top: -15px;
  width: 50px;
  height: 30px;
  text-align: left;
  color: #000;
  font-size: 0.9em;
  font-weight: 700 
}


#objednavka {
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: #fff;
  position: absolute;
  left: 0;
  top: 0;
  padding: 20px 0px 20px 0px !important;
  display: none;
  z-index: 100000
}

[data-zobrazenie="9"] #objednavka {
  display: block !important
}

[data-zobrazenie="9"].thankyou_popup #objednavka {
  display: none !important
}


#objednavka .jspContainer {
  height: 565px !important
}  



#objednavka .jspPane {
  width: 100% !important;
  padding: 10px 60px 40px 60px !important
}

#objednavka .jspVerticalBar {
  right: 20px;
  width: 4px;
}

#objednavka h2, #thankyou h2 {
  font-size: 2em;
  font-weight: 300;
  margin-bottom: 20px;
  line-height: 1.3em
}

#objednavka h2 {
  font-size: 1.7em;
  font-weight: 400
}

#objednavka p, #thankyou p {
  color: #7C7C7C;
  font-weight: 400
}

#objednavka form {
  margin-top: 25px
}

#objednavka form .inputs {
  width: 48%;
  float: left
}

#objednavka form .others {
  width: 48%;
  min-height: 465px;
  padding-bottom: 60px;
  position: relative;
  float: right;
  margin-top: -15px
}

#objednavka form input[type=text] {
  width: 100%;
  float: left;
  height: 40px;
  line-height: 38px;
  border: 1px solid #365D94;
  background: #fff;
  padding: 0px 15px 0px 15px;
  color: #000;
  margin-bottom: 10px;
  font-weight: 500
}

#objednavka form input[type=text].nevyplnene {
  border: 1px solid red
}

#objednavka form input[type=text]:nth-of-type(2n) {
  float: right
}

#objednavka form input[type=text]::-webkit-input-placeholder,
#objednavka form textarea::-webkit-input-placeholder {
  color: #000
}

#objednavka form input[type=text]:-moz-placeholder,
#objednavka form textarea:-moz-placeholder { /* Firefox 18- */
  color: #000  
}

#objednavka form input[type=text]::-moz-placeholder,
#objednavka form textarea::-moz-placeholder {  /* Firefox 19+ */
  color: #000  
}

#objednavka form input[type=text]:-ms-input-placeholder,
#objednavka form textarea:-ms-input-placeholder {  
  color: #000  
}

#objednavka form select {
  width: 100%;
  float: left;
  height: 40px;
  line-height: 38px;
  border: 1px solid #365D94;
  background: #fff;
  padding: 0px 10px 0px 10px;
  color: #000;
  margin-bottom: 10px;
  font-weight: 500
}

#objednavka form textarea {
  width: 100%;
  height: 100px;
  line-height: 20px;
  border: 1px solid #365D94;
  background: #fff;
  padding: 15px;
  color: #000;
  margin-bottom: 5px;
  font-weight: 500;
  -moz-resize: none;
  -webkit-resize: none;
  resize: none;
}

#objednavka .check_box_line {
  width: 100%;
  margin-bottom: 15px
}
 #side .check_box_line {
  margin-bottom: 15px;
  padding-right:5px;
}
@media screen and (max-width: 768px) { 
  #side .check_box_line {
    width: 120px;
    display: block;
    margin: 0px auto;
    margin-bottom: 15px;
    float: none !important;
  }
}

#objednavka .check_box_line .check_box, #side .check_box_line .check_box {
  width: 30px;
  height: 30px;
  float: left;
  margin-right: 10px;
  background: url(/assets/images/checks.png) 0px 0px no-repeat;
  cursor: pointer
}

#objednavka .check_box_line .check_box.active, #side .check_box_line .check_box.active {
  background: url(/assets/images/checks.png) -40px 0px no-repeat;
}

#objednavka .check_box_line .popis{
  width: calc(100% - 40px);
  float: left;
  color: #000;
  font-weight: 500;
  line-height: 30px;
  text-align: left;
}
#side .check_box_line .popis{
  width: calc(100% - 40px);
  color: #000;
  font-weight: 500;
  line-height: 30px;
  text-align: left;
}

#objednavka .check_box_line a.popis {
  text-decoration: underline;
}

#objednavka .check_box_line a.popis:hover {
  text-decoration: none;
}

#objednavka .upload {
  margin: 20px 0px 30px 0px
}

#objednavka .upload_btn {
  width: 150px;
  height: 30px;
  background: #0064FF;
  padding: 0px 15px 0px 15px;
  text-align: center;
  line-height: 30px;
  color: #fff;
  cursor: pointer;
  text-transform: uppercase;
  font-size: 1em;
  font-weight: 500;
  overflow: hidden;
  position: relative;
  display: inline-block;
}

#objednavka .upload_btn input {
  opacity: 0.01;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%
}
   
#objednavka input[type=submit] {
  width: auto;
  height: 50px;
  background: #0064FF;
  padding: 0px 20px 0px 20px;
  text-align: center;
  line-height: 50px;
  color: #fff;
  cursor: pointer;
  text-transform: uppercase;
  font-size: 1em;
  font-weight: 500;
  overflow: hidden;
  position: relative;
  margin-top: 30px;
  margin-bottom: 20px;
  position: absolute;
  bottom: 0;
  margin-bottom: 0;
  left: 0
}

#objednavka input[type=submit].disabled {
  background: #ccc;
  cursor: default
}

#renderer {
  z-index: 0;
  visibility: hidden;
  height: calc(100% - 5px);
  position: absolute;
  left: 0;
  top: 0;
  display: none
}

#holder {
  width: 100%;
  height: 100%;
  z-index: 1;
}

#thankyou {
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: #fff;
  position: fixed;
  left: 0;
  top: 0;
  padding: 40px;
  display: none;
  z-index: 100000;
  text-align: center;
  display: none;
  vertical-align: middle;
}

.thank_you_popup #thankyou {
  display: table;
}


.fullscreen #thankyou .thank_you_div {
  width: 1000px;
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -500px;
  margin-top: -100px 
}

.fullscreen #thankyou .thank_you_div {
  width: 1000px;
  margin-top: 0px 
}


.btn {
  width: auto;
  height: 50px;
  display: inline-block;
  background: #0064FF;
  padding: 0px 25px 0px 25px;
  text-align: center;
  line-height: 50px;
  color: #fff;
  cursor: pointer;
  text-transform: uppercase;
  text-decoration: none;
  font-size: 1em;
  font-weight: 500;
  overflow: hidden;
  position: relative;
  margin-top: 30px;
  margin-bottom: 20px
}

.btn:hover, .btn.active {
  background: #000;
}


.btn.smaller {
  height: 30px;
  padding: 0px 15px 0px 15px;
  line-height: 30px;
  margin-top: 10px;
  margin-bottom: 10px
}


.btn.fb_login {
  margin-top: 15px;
  margin-bottom: 15px
}

#kovanie_popup {
  width: 440px;
  height: 530px;
  padding: 15px 0px 20px 20px !important;
  display: none
}

#kovanie_popup .jspPane {
  width: 440px !important
}

#kovanie_popup .jspContainer {
  height: 440px !important
}

.kovania {
  margin-top: 20px;
  margin-left: -20px;
  padding-bottom: 40px;
  height: calc(100% - 105px)
}

.kovanie_typ,.material_typ  {
  margin: 18px 0;
}

.kovanie_typ .typ_info {
  width: 120px;
  float: left;
}

.kovanie_typ .typ_info .img {
  width: 85px;
  height: 85px;
  background-size: 95px 110px;
  margin-bottom: 0px;
  background-position: left center;
  margin-left: -15px
} 

.kovanie_typ .typ_info .nazov, .material_typ .typ_info .nazov {
  font-weight: 400;
  color: #858585;
  text-align: center;
  width: 100%;
  font-size: 1.1em;
  padding-right: 20px
}

.typ_farby {
  float: left;
  padding-right: 20px;
  margin-top: 20px;
  width: calc(100% - 120px)
}

/* .kovanie_farba {
  width: 40px;
  margin-right: 20px;
  float: left;
  text-align: center;
  cursor: pointer;
  /*border: 1px solid #ddd*/
  /* margin-bottom: 20px
}

.kovanie_farba .img {
  width: 40px;
  height: 40px;
  background-size: 100% 100%;
  display: inline-block
} */ */

.typ_farby .nazov {
  width: 100%;
  font-weight: 400;
  color: #858585;     
  text-align: left;
  margin-top: 11px;
  height: 30px;
  line-height: 30px;
  font-size: 1.1em
}


.stena1 #navrhar {
  background-image: url(../images/steny/1.jpg);
}



.ukonci_fullscreen {
  display: none;
  color: #0064FF;
  font-weight: 500;
  margin-top: -10px;
  cursor: pointer
}

.ukonci_fullscreen:hover {
  color: #000;
}

.fullscreen .ukonci_fullscreen {
  display: block
}

#workspace nav .link_btn.fullscreen_on {
  margin-right: 0
}

#workspace nav .link_btn.fullscreen_off {
  display: none;                        
  margin-right: 0
}

.fullscreen #workspace nav .link_btn.fullscreen_on {
  display: none
}

.fullscreen #workspace nav .link_btn.fullscreen_off {
  display: block
}
/*
.stena_prava {
  width: 20%;
  height: 100%;
  position: absolute;
  right: 0;
  top: 0;
  background: url(../images/steny/1.jpg) left top no-repeat;
  z-index: 10000000; 
  

	background:
		
		linear-gradient(45deg,  transparent 70px, url(../images/steny/1.jpg) 0) bottom left;
	background-size: 100% 100%;
}
*/
/*
.stena_prava .vnutro{
  display: none;
  width: 100%;
  height: 100%;
  position: absolute;
  right: 0;
  bottom: 0;
  background-image: url(../images/steny/1.jpg);
  border-left: 20px solid transparent;
  border-bottom: 20px solid transparent;
  z-index: 10000000;
  -webkit-transform: skewX(28deg)  
}   */

.stena_prava {
  width: 20%;
  height: 100%;
  position: absolute;
  right: 0;
  top: 0;
  background: #FAF0A9;
  z-index: 10000000; 
      -webkit-mask-box-image: url(http://www.html5rocks.com/en/tutorials/masking/adobe/stampTiles.svg) 35 repeat;  
}

#podlahy_popup {
  width: 480px;
  height: 535px;
  /*display: block !important;*/
  padding: 15px 20px 20px 20px !important;
  /*top: 10px*/
}




#podlahy_popup .material {   
  width: 70px;
  min-height: 90px;
  float: left;
  margin-right: 22px;
  cursor: pointer;
  margin-top: 22px;
  margin-bottom: 0;
  text-align: center;
}

#podlahy_popup .material:nth-of-type(5n) {
  margin-right: 0 !important
}


.material.podlaha:nth-of-type(1),
.material.podlaha:nth-of-type(2),
.material.podlaha:nth-of-type(3),
.material.podlaha:nth-of-type(4),
.material.podlaha:nth-of-type(5) {
  margin-top: 0 !important
}



#podlahy_popup .material img,
#steny_popup .material img {   
  width: 70px;
  height: 70px;
  display: inline-block;
}

.popup {
  width: 480px !important
}

.popup .scroll {
  width: calc(100% + 20px) !important;
  height: calc(100% - 50px) !important
}

#interier_material_popup.popup .scroll {
  height: calc(100% - 50px) !important;
  
}

#interier_material_popup.popup .jspContainer {

}

.popup .jspContainer {
  width: 100% !important;
  height: 100% !important
}

.popup .jspPane {
  width: 100% !important;
}

.jspVerticalBar {
  right: 1px;
  width: 6px;
  background: transparent
}
/*
#dvere_material_popup.popup .jspContainer {
  height: calc(100% - 50px) !important
}
*/

#dvere_material_popup.popup .scroll {
  height: calc(100% - 50px) !important
}



#siluety_popup {
  height: 500px !important;
  /*top: 10px*/
} 

#siluety_popup input {
  width: 50px;
  height: 30px;
  border: 1px solid #999;
  text-align: center;
} 


#siluety_popup .silueta {
  width: 32%;
  margin-right: 2%;
  height: 205px;
  float: left;
  text-align: center;
  position: relative;
  cursor: pointer
} 


#siluety_popup .silueta img {
  position: absolute;
  left: 50%;
  bottom: 0
} 


#siluety_popup .silueta:nth-of-type(3n) {
  margin-right: 0
} 

#siluety_popup [data-typ="1"].silueta img {
  width: 140px;
  height: 205px;
  margin-left: -70px
} 

#siluety_popup [data-typ="2"].silueta img {
  width: 80px;
  height: 205px;
  margin-left: -40px
} 

#siluety_popup [data-typ="3"].silueta img {
  width: 56px;
  height: 166px;
  margin-left: -28px
} 

/*
#objednavka {
  display: block !important
}
*/
.upload #queue {
  margin-bottom: 20px
}

.upload .file {
  line-height: 30px;
  height: 30px;
  overflow: hidden
}

.upload .file .file_name {
  width: 40%;
  float: left;
  text-align: left;
  overflow: hidden;
  margin-right: 2%
}

.upload .file .progress {
  width: calc(58% - 30px);
  float: left;
  height: 6px;
  margin-top: 12px 
}

.upload .file .progress_done {
  height: 5px;
  background: #0064FF;
  width: 0
}

.upload .file .cancel_upload,
.upload .file .remove {
  width: 25px;
  height: 30px;
  text-align: center;
  font-size: 1.2em;
  float: right;
  cursor: pointer
}

.upload .file.completed .progress {
  display: none
}


#steny_popup {
  height: 420px
}

.material.stena {
  width: 70px;
  min-height: 90px
}

.material.stena:nth-of-type(1),
.material.stena:nth-of-type(2),
.material.stena:nth-of-type(3),
.material.stena:nth-of-type(4),
.material.stena:nth-of-type(5) {
  margin-top: 0
}


/*
[data-step="5"] .step_form {
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 605px;
  z-index: 10000;
  background-color: #fff;
  margin: 0
}

[data-step="5"] .step_form .dvere_vyber {
  height: 605px
}   */



#interier_material_popup nav .btn {
  height: 30px;
  line-height: 30px;
  float: none;
  margin-top: 10px;
  margin-bottom: 30px;
  background: #000
}

#interier_material_popup nav .btn.active,
#interier_material_popup nav .btn:hover {
  background: #0064FF
}





.sektor_vnutro {
  width: calc(100% - 6px);
  height: 100%;
  position: relative;
  background-size: 100% 100% !important;
  background: none !important;

}

#workspace .sektor_vnutro {
     margin-left: 3px 
}
/*
[data-otvorena="true"] .sektor_vnutro {
  width: 100%;
  margin-left: 0
}
*/
.sektor[data-typ="7"] .sektor_vnutro {
  /*height: 15% !important;*/
  /*overflow-y: hidden;  */
}

.sektor[data-typ="7"] .sektor_vnutro .tien {
  /*height: 667% !important */
}


/*
.sektor[data-typ="7"] .spodna_doska {
  height: 13% !important
} */

.sektor .hrany {
  
}

.sektor .hrany div {
  position: absolute;
  background-size: cover !important;
  z-index: 100
}

[data-zobrazenie="6"] .sektor .hrany {
  display: none !important
}

.sektor .hrany div:nth-of-type(1) {
  width: 100%;
  height: 6px;
  left: 0;
  top: 0;
  display: none
}

.sektor .hrany div:nth-of-type(2) {
  width: 100%;
  height: 6px;
  left: 0;
  bottom: 0;
  display: none
}

.sektor .hrany div:nth-of-type(3) {
  width: 6px;
  height: 100%;
  left: -6px;
  top: 0;
  display: none
}

.sektor .hrany div:nth-of-type(4) {
  width: 6px;
  height: 100%;
  right: -6px;
  top: 0;
  display: none
}


[data-oddeleni="10"] .sektor:nth-of-type(10) .hrany div:nth-of-type(4) {
  display: block;
}

[data-oddeleni="9"] .sektor:nth-of-type(9) .hrany div:nth-of-type(4) {
  display: block;
}

[data-oddeleni="8"] .sektor:nth-of-type(8) .hrany div:nth-of-type(4) {
  display: block;
}

[data-oddeleni="7"] .sektor:nth-of-type(7) .hrany div:nth-of-type(4) {
  display: block;
}

[data-oddeleni="6"] .sektor:nth-of-type(6) .hrany div:nth-of-type(4) {
  display: block;
}

[data-oddeleni="5"] .sektor:nth-of-type(5) .hrany div:nth-of-type(4) {
  display: block;
}

[data-oddeleni="4"] .sektor:nth-of-type(4) .hrany div:nth-of-type(4) {
  display: block;
}

[data-oddeleni="3"] .sektor:nth-of-type(3) .hrany div:nth-of-type(4) {
  display: block;
}

[data-oddeleni="2"] .sektor:nth-of-type(2) .hrany div:nth-of-type(4) {
  display: block;
}

[data-oddeleni="1"] .sektor:nth-of-type(1) .hrany div:nth-of-type(4) {
  display: block;
}

.sektor:nth-of-type(1) .hrany div:nth-of-type(3) {
  display: none;
}



.dvere.dvere_nadstavec {
  visibility: hidden;
  opacity: 0 !important
}

.foto_interier .dvere {
  display: none !important
}

.foto_exterier .vertikalne_dosky,
.foto_exterier .hrany {
  /*display: none !important */
}

.foto_interier .tien_pred,
.foto_interier .tien_za,
.foto_exterier .tien_pred,
.foto_exterier .tien_za,
.foto_interier .tien_nad,
.foto_exterier .tien_nad {
  display: none !important
}

.foto_interier #tapeta {
  display: none !important
}



.pouzite {
  border-bottom: 1px solid #CDCDCD;
  display: none;
  margin-bottom: 5px;
}

.pouzite h2 {
  font-size: 1.15em;
  font-weight: 300;
  margin-bottom: 20px;
  margin-top: 0
}

.pouzite .material {
  margin-top: 0;
  margin-bottom: 20px
}


.close {
  width: 40px;
  height: 40px;
  background: url(/assets/images/close.png) center center no-repeat;
  background-size: 80% 80%;
  cursor: pointer;
  position: absolute;
  right: 10px;
  top: 10px;
  z-index: 10000
}

.tien_nad {
  width: 100%;
  height: 82px;
  position: absolute;
  left: 0;
  top: -82px;
  background: url(/assets/images/tien4.png) center bottom no-repeat;
  background-size: 100% 100%;
  z-index: 1;
  display: none
}

[data-zobrazenie="6"] .tien_nad {
  /*display: block*/
}

#skrina .tien_pred,
#skrina .tien_za {
  width: 100px;
  height: 100%;
  position: absolute;
  bottom: 0px;
  background-size: 100% 100% !important;
  z-index: 1
}

#skrina .tien_pred {
  left: -106px;
  background: url(/assets/images/side-sh-left.png) left center no-repeat;
}

#skrina .tien_za {
  right: -99px;
  background: url(/assets/images/side-sh-right.png) left center no-repeat;
}






.skrina_top {
  width: calc(100% + 6px);
  margin-left: -3px; 
  height: 15.3846%;
  position: relative;
  text-align: center;
  z-index: 1; 
}

.skrina_top .skrinka {
  width: calc(100% + 6px);
  height: 100%;
  left: -3px;
  position: relative 
}


.skrina_top .polica {
  left: 0;
  bottom: 0;
  z-index: 1
}

/*
.skrina_top .hrana_lava,
.skrina_top .hrana_prava {
  width: 6px;
  height: 100%;
  position: absolute;
  top: 0;
  background-size: 100% 100% !important
}


.skrina_top .hrana_lava {
  left: 0;
}

.skrina_top .hrana_prava {
  right: 0;
}
*/
.skrina_main {
  width: 100%;
  height: calc(100% - 15.3846%);
  position: relative;
  z-index: 10;
}

.lava_stena_skrine,
.prava_stena_skrine {
  width: 6px;
  height: 100%;
  position: absolute;
  top: 0;
  background-size: 100% 100% !important;
  z-index: 10
}


.lava_stena_skrine {
  left: -6px;
}

.prava_stena_skrine {
  right: 0px;
}



.nadstavec_lava_stena,
.nadstavec_prava_stena {
  width: 6px;
  height: 100%;
  position: absolute;
  top: 0;
  background-size: 100% 100% !important;
  z-index: 10;
  display: none
}


.nadstavec_lava_stena {
  left: -2px;
}

.nadstavec_prava_stena {
  right: -2px
}



.doplnok {
  width: 32%;
  float: left;
  margin-right: 2%;
  margin-top: -20px;
  cursor: pointer
}

.doplnok:nth-of-type(3n) {
  margin-right: 0
}

.doplnok.ziadny {
  text-align: center;
  font-weight: 700;
  border: 1px solid #555;
  margin-top: 40px;
  height: auto;
  padding: 15px
}

#doplnok {
  width: 150px;
  height: auto;
  background-size: 100% 100% !important;
  position: absolute;
  right: 20px;
  bottom: 10%;
  z-index: 10000
}

.nadstavec_prvy .tien_pred {
  display: none
}

[data-oddeleni="1"].nadstavec_prvy .tien_pred {
  display: block
}

.nadstavec_prvy .lava_stena_skrine {
  height: 15.3846%;
}

.nadstavec_posledny .tien_za {
  display: none
}

.nadstavec_posledny .prava_stena_skrine {
  height: 15.3846%;
}



.nadstavec_prvy .vertikalne_dosky .doska1 {
  height: 100% !important
}

[data-oddeleni="1"].nadstavec_prvy .lava_stena_skrine {
  height: 100% !important
}



.nadstavec_2 .vertikalne_dosky .doska1,
.nadstavec_2 .vertikalne_dosky .doska2 {
  height: 100% !important
}

.nadstavec_3 .vertikalne_dosky .doska2,
.nadstavec_3 .vertikalne_dosky .doska3 {
  height: 100% !important
}

.nadstavec_4 .vertikalne_dosky .doska3,
.nadstavec_4 .vertikalne_dosky .doska4 {
  height: 100% !important
}

.nadstavec_5 .vertikalne_dosky .doska4,
.nadstavec_5 .vertikalne_dosky .doska5 {
  height: 100% !important
}

.nadstavec_6 .vertikalne_dosky .doska5,
.nadstavec_6 .vertikalne_dosky .doska6 {
  height: 100% !important
}

.nadstavec_7 .vertikalne_dosky .doska6,
.nadstavec_7 .vertikalne_dosky .doska7 {
  height: 100% !important
}

.nadstavec_8 .vertikalne_dosky .doska7,
.nadstavec_8 .vertikalne_dosky .doska8 {
  height: 100% !important
}

.nadstavec_9 .vertikalne_dosky .doska8,
.nadstavec_9 .vertikalne_dosky .doska9 {
  height: 100% !important
}

.nadstavec_10 .vertikalne_dosky .doska9,
.nadstavec_10 .vertikalne_dosky .doska10 {
  height: 100% !important
}

.nadstavec_prvy.nadstavec_2 .vertikalne_dosky .doska1 {
  display: none !important
}



 [data-oddeleni="3"].nadstavec_2.nadstavec_posledny .vertikalne_dosky .doska2,
 [data-oddeleni="4"].nadstavec_3.nadstavec_posledny .vertikalne_dosky .doska3,
 [data-oddeleni="5"].nadstavec_4.nadstavec_posledny .vertikalne_dosky .doska4,
 [data-oddeleni="6"].nadstavec_5.nadstavec_posledny .vertikalne_dosky .doska5,
 [data-oddeleni="7"].nadstavec_6.nadstavec_posledny .vertikalne_dosky .doska6,
 [data-oddeleni="8"].nadstavec_7.nadstavec_posledny .vertikalne_dosky .doska7,
 [data-oddeleni="9"].nadstavec_8.nadstavec_posledny .vertikalne_dosky .doska8,
[data-oddeleni="10"].nadstavec_9.nadstavec_posledny .vertikalne_dosky .doska9 {
  display: none !important
}

.nadstavec_2.nadstavec_3 .vertikalne_dosky .doska2 {
  display: none !important
}

.nadstavec_3.nadstavec_4 .vertikalne_dosky .doska3 {
  display: none !important
}

.nadstavec_4.nadstavec_5 .vertikalne_dosky .doska4 {
  display: none !important
}

.nadstavec_5.nadstavec_6 .vertikalne_dosky .doska5 {
  display: none !important
}

.nadstavec_6.nadstavec_7 .vertikalne_dosky .doska6 {
  display: none !important
}

.nadstavec_7.nadstavec_8 .vertikalne_dosky .doska7 {
  display: none !important
}

.nadstavec_8.nadstavec_9 .vertikalne_dosky .doska8 {
  display: none !important
}

.nadstavec_9.nadstavec_10 .vertikalne_dosky .doska9 {
  display: none !important
}







#skrina .dvere .predel {
  width: calc(100% - 0px);
  height: 0px;
  position: absolute;
  left: 0px;
  top: -3px;
  z-index: 0
}

#skrina .dvere .vyplne .vypln:first-of-type .predel {
  display: none
}

.sektor_vnutro .int {
  width: 100%;
  height: 100%;
  position: relative;
  z-index: 1
}

.sektor_vnutro .ext {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 5
}

.sektor .ext {
  width: calc(100% + 6px) !important;
  margin-left: -3px;
  z-index: 100
}

.sektor_1 .ext {
  width: calc(100% + 9px) !important;
  margin-left: -6px;
}
 
[data-oddeleni="3"] .sektor_3 .ext {
  width: calc(100% + 9px) !important
}

[data-oddeleni="4"] .sektor_4 .ext {
  width: calc(100% + 9px) !important
}

[data-oddeleni="5"] .sektor_5 .ext {
  width: calc(100% + 9px) !important
}

[data-oddeleni="6"] .sektor_6 .ext {
  width: calc(100% + 9px) !important
}

[data-oddeleni="7"] .sektor_7 .ext {
  width: calc(100% + 9px) !important
}

[data-oddeleni="8"] .sektor_8 .ext {
  width: calc(100% + 9px) !important
}

[data-oddeleni="9"] .sektor_9 .ext {
  width: calc(100% + 9px) !important
}

[data-oddeleni="10"] .sektor_10 .ext {
  width: calc(100% + 9px) !important
}



.horna_doska {
  width: calc(100% + 12px);
  height: 6px;
  position: absolute;
  left: 0;
  top: 15.3846%;
  margin-top: 0px;
  margin-left: -6px;
  z-index: 10;
  background-size: 1000% 100% !important
}
/*
.sektor .priecka_lava {
  width: 3px;
  height: 100%;
  position: absolute;
  left: -3px;
  top: 0;
  background-color: red;
  background-size: 100% 100% !important
}

.sektor .priecka_prava {
  width: 3px;
  height: 100%;
  position: absolute;
  right: -3px;
  top: 0;               
  background-color: red;
  background-size: 100% 100% !important
}
*/


.interier_vyber.otvorene {
  display: none
}

.televizor {
  width: 90%;
  position: absolute;
  left: 5%;
  background: url(/assets/images/tv.png) center top no-repeat;
  background-size: 100% 100%
}

.sklopny_vesiak {
  position: absolute;
  width: 80%;
  left: 10%;
  background: url(/assets/images/sklapac.png) center top no-repeat;
  background-size: 100% 100%
}
                                                     
.sektor.bez_hornej_police .horna_doska {
  display: none
}



.interier_23,
.interier_24,
.interier_25 {
  border-top: 0 !important
}

.interier_23 .main,
.interier_24 .main,
.interier_25 .main {
  border-top: 0 !important
}

.interier_23 .sklopny_vesiak,
.interier_24 .sklopny_vesiak,
.interier_25 .sklopny_vesiak {
  margin-top: -9px
}


.interier_vyber .interier .dvere_bezne {
  width: 100%;
  position: absolute;
  left: 0;
  background: rgb(127,184,255);
  margin-top: 5%
}

.otvorene .interier_3 .main {
  border-top: 0
}
     
.interier_vyber .interier .dvere_klucka {
  width: 9px;
  height: 7px;
  position: absolute;
  left: 3px;
  background: #fff;
  margin-top: 1px;
  background: url(/assets/images/klucka.png) left top no-repeat;
  background-size: cover
}
  
#skrina .dvere_bezne {
  width: 100%;
  position: absolute;
  left: 0;
  background: transparent url(/data/materialy/rotated/dx1V5-jelsa.jpg) left top no-repeat;
  background-size: cover
}

#skrina .dvere_klucka {
  width: 17px;
  height: 15px;
  position: absolute;
  left: 10%;
  margin-top: 1px;
  background: url(/assets/images/klucka.png) left top no-repeat;
  background-size: cover
}

[data-otvorena="true"][data-typ="3"] .horna_doska {
  display: none
}



.interier_material_kategorie {
  display: none
}

.popup select {
  width: 170px;
  height: 40px;
  border: 1px solid rgb(205, 205, 205);
  padding-left: 10px
}

.btn_view_change {
  float: right;
  margin-right: 30px
}

.jspVerticalBar .jspArrow {
  width: 0;
  height: 0;
  background: rgb(255, 255, 255);
  margin-left: -7px
}   

.jspVerticalBar .jspArrowUp {
  border-left: 10px solid rgba(0, 0, 0, 0);
  border-right: 10px solid rgba(0, 0, 0, 0);
  border-bottom: 10px solid rgb(116, 165, 231);
}  

.jspVerticalBar .jspArrowDown {
  border-left: 10px solid rgba(0, 0, 0, 0);
  border-right: 10px solid rgba(0, 0, 0, 0);
  border-top: 10px solid rgb(116, 165, 231);
}  


.arrows {
  padding-right: 15px;
}

.arrows .arrow_left {
  float: left;
  transform: translateY(-108px) translateX(-30px);
  position: absolute;
  left: 0;
  color: red
} 

.arrows .arrow_right {
  float: right;
  transform: translateY(-108px); 
  position: absolute;
  right: 0;
  color: red
}   

.arrow_info {
  line-height: 20px;
  text-align: center;
  width: calc(100% - 60px);
  width: 100%;
  padding: 0px 5px 0px 5px;
  float: left; 
  color: red
  /*margin-top: -20px*/
}

[data-typ="0"].dvere .vyplne,
[data-typ="0"].dvere .ram,
[data-typ="0"].dvere .vyplne_zony {
  display: none
}

.dvere_0 .diag1 {
  background: red;
  width: 100%;
  height: 1px;
  display: none
}


.ui-autocomplete {
    max-height: 100px;
    overflow-y: auto;
    /* prevent horizontal scrollbar */
    overflow-x: hidden;
  }
  
.ui-menu .ui-menu-item {
  height: 30px !important;
  line-height: 30px !important;
  padding: 0 10px 0px 15px !important;
  font-size: 14px !important;
  font-weight: bold !important;
  text-align: left !important;
}

.ui-autocomplete .ui-state-hover, 
.ui-autocomplete .ui-widget-content .ui-state-hover, 
.ui-autocomplete .ui-widget-header .ui-state-hover, 
.ui-autocomplete .ui-state-focus, 
.ui-autocomplete .ui-widget-content .ui-state-focus, 
.ui-autocomplete .ui-widget-header .ui-state-focus {
  border: 0 !important;
  background: transparent !important;
  color: #0064FF !important;
  margin: 0 !important
}

.user_logged_info {
  position: absolute;
  right: 30px;
  font-size: 12px
}
@media (min-width: 1281px) {
  .user_logged_info {
    bottom: -40px;
  }
}
@media (min-width: 1025px) and (max-width: 1280px) {
  .user_logged_info {
    bottom: 0px;
    z-index: 100;
  }
}
@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
  
  /* CSS */
  .user_logged_info {
    top: 8px;
    z-index: 100;
  }
  
}
@media (min-width: 768px) and (max-width: 1024px) {
  
  /* CSS */
  .user_logged_info {
    top: 8px;
    z-index: 100;

  }
  
}
@media (min-width: 481px) and (max-width: 767px) {
  .user_logged_info {
    top: 7px;
    z-index: 100;
  }
}

@media (min-width: 320px) and (max-width: 480px) {
  /* CSS */
  .user_logged_info {
    top: 7px;
    z-index: 100;
  }
}
  
  
/* UPGRADE */

aside {
  
}           
.nav {
  position: absolute;
  left: 0;
  bottom: 0px;
  width: 100%
}

.nav.mobile {
  display: none
}

.nav-prev, .nav-next {
  position: relative;
  color: #000;
  font-size: 1.4rem;
  display: inline-block;
  cursor: pointer;
  transition: all 200ms;
  text-transform: uppercase;
}

.nav-prev:after, .nav-next:after {
  position: absolute;
  top: 0;
  font-family: FontAwesome;
  font-size: 3rem;
  color: #000;
  transition: all 200ms
}

.nav-prev {
  float: left;
  padding-left: 25px
}

.nav-next {
  float: right;
  padding-right: 25px;
}

.nav-next.disabled {
  display: none
}

.nav-prev:after {
  content: "\f104";
  left: 0
}

.nav-next:after {
  content: "\f105";
  right: 0
}

.nav-prev:hover, .nav-next:hover,
.nav-prev:hover:after, .nav-next:hover:after {
  color: #0065FF;
}

body[data-zobrazenie="1"] .nav-prev {
  display: none
}

.navrhar_logo {
  width: 100%;
  height: 80px;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  margin-top: -20px;
  position: absolute;
  left: 0;
  top: 0;
}                       

.rozmer_slider input {
  border: 2px solid #0065FF;
  height: 30px;
  padding: 0px 10px;
  width: 55px;
  margin-top: -5px;
  margin-right: 5px 
}

.interier_vyber, .dvere_vyber {
  height: 445px
}

.interier_vyber .slide, .dvere_vyber .slide {
  height: 400px
}

.interier_vyber .arrows, .dvere_vyber .arrows {
  margin-top: 0;
  position: relative
}

.dvere_vyber .dvere .handle {
  width: 4px;
  height: 10px;
  background: #0065FF;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  border-radius: 3px;
}
.ext .dvere .handle {
  width: 6px;
  height: 20px;
  background: #0065FF;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  border-radius: 3px;
}
.dvere_vyber .dvere .handle.handle-left {
  left: 5px; /* Adjust for the left side handle */
}
.ext .dvere .handle.handle.handle-left {
  left: 10px; /* Adjust for the left side handle */
}

.dvere_vyber .dvere .handle.handle-right {
  right: 5px; /* Adjust for the right side handle */
}

.ext .dvere .handle.handle.handle-right {
  right: 10px; /* Adjust for the right side handle */
}

#skrina[data-kovanie-farba="#888"] .dvere .ram{
  border:1px solid #333;
  box-shadow:0px 0px 0px 1px #888;
}
.arrows .arrow_left {
  transform: translateY(-225px) translateX(-30px)
}

.arrows .arrow_right {
  transform: translateY(-225px) translateX(10px)
}

.oddelenia_vyber {
  width: 100% !important;
}

aside #side {
  position: absolute;
  padding-top: 60px;
  width: 100%;
}

.oddelenia_vyber .jspPane {
  width: 220px !important;
  padding-right: 0 !important
}

.step {
  width: 100%;
  position: absolute;
  left: 0;
  top: 60px;
  height: calc(100% - 60px);
  display: none
}

.step_form h3 {
  margin: 10px 0px 10px 0px
}



.material .img {
  width: 60px;
  height: 60px;
}

.material, .kovanie_farba {   
  width: 60px;

}

.popup .material .nazov {
  margin-top: 10px;
  margin-bottom: 10px
}

.material-selected .img {
  border: 2px solid #222
}

.dvere-material .step_form,
.dvere-ramy .step_form {
  margin-top: 0;
}

.select-typ {
  width: 100%;
  height: 34px;
  border: 1px solid #222;
  padding: 5px;
  /*margin-top: -10px*/
}

.dvere-material-vyber, .interier-material-vyber {
  overflow: hidden;
  height: 470px;
  height: calc(100% - 215px) !important;       /*135*/
  width: 100% !important;
  position: absolute;
  left: 0;
  top: 85px
}

.info-material-dveri {
  position: absolute;
  left: 0;
  bottom: 55px;
}

.dvere-material-vyber h3 {
  margin-bottom: 15px;
  margin-top: 20px
}



.interier-material-vyber h3, .dvere-material-vyber h3 {
  font-size: 17px;
  line-height: 21px
}

.step .kovania{
  margin-left: 0;
  margin-top: 0 !important;
  overflow: hidden;
  height: 470px;
  height: calc(100% - 135px) !important;
  width: 100% !important;
  position: absolute;
  left: 0;
  top: 85px
}

.step .kovania .typ_info, .step .dvere-material-vyber .typ_info{
  width: 100%;
  float: none
}

.step .kovanie_typ {
  margin-top: 0
}

.step .kovanie_typ .typ_info .img, .step .material_typ .typ_info .img{
  float: left;
  margin-left: 0;
  width: 70px;
  height: 70px;
  background-size: 80px 95px
}

.step .kovanie_typ .typ_info .nazov,.step .material_typ .typ_info .nazov  {
  width:100%;
  height:70px;
  text-align: left;
  padding: 12px 0;
  display: flex;
  align-items: center;
}

.step .kovanie_typ .typ_info div.img + .nazov,.step .material_typ .typ_info div.img + .nazov  {
  width: calc(100% - 85px);
  float: right;
}
.step .typ_farby {
  float: none;
  width: 100%;
  padding-right: 0
}

.typ_farby .nazov {
  margin-top: 0;
  margin-bottom: 5px
}
