
 
 #featureModal.modal.fade.in {top: 4%;}
 
 #featureModal .col2-set .wide {
  width: 63%;
  float: left;
  margin-left: 5%;
}
.col2-set{  margin-bottom: 0px;}
 #featureModal .col2-set .col-1.narrow{
  margin-top: 0px !important;
}
#rootwizard .imageinput  label > input + img{ /* IMAGE STYLES */
  cursor:pointer;
  border:2px solid transparent;
  display: block;
    border-radius: 8px;
}
#rootwizard .imageinput  label > input:checked + img{ /* (RADIO CHECKED) IMAGE STYLES */
  border:2px solid #e40001;
}
#rootwizard .imageinput  label > input {
  visibility: visible;
  position: absolute;
  opacity:0;
 }
 
 .control-group textarea{
  width: 337px !important;
  /*matrid*/
  margin-left: 5px;
}
 #featureModal p.help-block {
    width: auto;
    margin-bottom: 0;
}

label.control-label {width:150px;   margin-right: 5px;}

/*modal*/
.modal-backdrop{  background-color: #fff;}
.modal.fade{top:-105%;}
.modal-header {
  padding: 9px 15px 0;
  border-bottom: 0px none;
}
.modal-body{padding:0px 15px 15px;     height: 75vh;
  max-height: none;}

/*form*/

.button-next-holder.disabled  input.btn.button-next, .btn-cart.disabled
{cursor:default;   opacity:0.5; display:none;}
.next-info{display:none; color:#e40001;  text-align:right; font-size:10px;}
.next-info.visible
{
display:block; }
.disclaimers:before{content:""; display:table; width:100%; clear:both;}
.disclaimers{font-size: 0.8em; margin: 0.5em 0; }

label.control-label{margin-top:12px;   color: #333 !important;   font-size: 13px; float:left;}
 p.config_info .icon-info{
    border: 3px solid #9fa3a6;
    border-radius: 50%;
    margin-right: 5px;
    padding: 2px 7px;
    display: inline-block;
  }

p.config_info {
  margin-top: 0px;
  display: block;
  font-family: 'Lato', sans-serif;
  font-size: 14px;
  color: #9fa3a6;
  max-width: 720px;
}

#featureModal .note-msg{color:#333; }


.tab-inner{  border-top: 1px solid #d4d4d4;   padding-top: 1em;}

#featureModal .required{ color: #9fa3a6;}
#featureModal #group_Fastening .required {color: #000000cf;}
#featureModal #group_Ylaosan_tyyli .required {color: #000000cf;}
#featureModal #group_Ylaosan_tyyli .radio.inline.required+.radio.inline.required {margin-left: 10px !important;}
#featureModal #group_Fastening .radio.inline +.radio.inline {margin-left: 12px !important;}
#group_Fastening label input{margin-right: 2px !important;margin-top: -3px !important;}
#group_Decorations__On_OFF_ input {margin-top: -1px !important;margin-right: 4px !important;margin-top: -3px !important;margin-left: 5px !important;
}
#group_Waist_decorations input {margin-top: -1px !important;margin-right: 4px !important;margin-top: -3px !important;margin-left: 5px !important;
}
#group_Pockets input {margin-top: -1px !important;margin-right: 4px !important;margin-top: -3px !important;margin-left: 5px !important;
}
#group_Extra_fabric_and_decorations input {margin-top: -1px !important;margin-right: 4px !important;margin-top: -3px !important;margin-left: 5px !important;
}


.controls.imageinput label.radio{  font-size: 11px;     vertical-align: top;
  font-style: italic; /* max-width: 74px; */     position: relative;}
.controls.imageinput label.radio input{  width: 100%;  left: 0;  top: 0;  height: 100%; }
  
.imageinput{display:block; position:relative;}
/*.imageinput.colours{min-height:150px;overflow: hidden;}*/

.selectedColour{
  width: 105px;
  position: absolute;
 
  color:#666666;
   font-size: 11px;
  font-style: italic; color:#9fa3a6; line-height: 1.2em;
}

.selectedColour img{
  display: block;
    border: 2px solid #e40001;
    border-radius: 8px;
    width:130px; height:auto;
    margin-bottom:4px;
    /*matrid*/ margin-left: 4px;
}
/*matrid*/
span.labelText {
    margin-left: 4px;
    font-size: 13px;
    white-space: nowrap;
    overflow: hidden;
}
.smallOptions{
  float: right;
  width: 418px;
  margin-top: 100px;
  padding-left: 10px;
}

.controls.imageinput .smallOptions label.radio {
  max-width: 37px;
  margin-left: 0px;
  margin-right: 7px;
      position: relative;
}
.smallOptions label .colorNumber{
    position: absolute;
    top: 11px;
    display: block;
    text-align: center;
    width: 100%;
    left: 2px; font-weight:700;
  color:#949494;
}


.moreBox{margin-bottom:30px;   margin-right: 42px; 
/*matrid*/
margin-left: 13px;
}
.viewMore_button {
  display: block;
  color: #fff;
  padding: 6px;
  color: #666;
  background-color: #ECF0F1;
  /* text-transform: uppercase; */
  font-size: 13px;
  text-align: center;
  margin: 8px 0 0;
  font-style: italic;
  border-radius: 11px;
  transition: all 0.2s linear 0.1s;
}
.viewMore_button.expanded{ border-radius:11px  11px 0 0;}


.moreContent{border:1px solid #eee; border-radius:5px; }
.moreContent {
  border: 1px solid #eee;
  border-radius: 0 5px 5px 0;
  /*padding: 11px;*/
  padding-left: 19px;
}

.mittayksikko {
    color: #9fa3a6;
    display: inline-block;
    margin-top: 8px;
    padding: 0 5px;
}
#measurmentVideo{
    margin-top: 15px;
}
 #video-instructions{ font-size: 12px;
    line-height: 1.1em;
    margin: 0.5em 0 1em; display:none;}
 #video-instructions span{color:#e40001; }

.buttons-right input.btn.button-next
{margin:10px 20px;margin-right: 76px;}
#tab2 .buttons-right .button-next-holder input.btn.button-next { margin-right: 42px;}
#tab3 .buttons-right input.btn.button-next {margin-right: 89px;}
.disclaimer2 p {padding-right: 42px;text-align: justify;}
#lukio-response {
  max-width: 319px;
  color: #9fa3a6;
  font-weight: 400;
  font-size: 12px;
  line-height: 1.3em;
  margin: 0.5em 0;
}

/*
#option_Koko{width:90%;}
*/

#featureModal .col3-set  .col-2.wide {
  width: 63%;
  float: left;  margin-left: 3%;
}

#featureModal .col3-set .narrow { width: 31%; margin-left: 3%;}

  
.input-small {
  width: 40px;
  margin-left: 6px;
}

#featureModal .col-3 .form, #featureModal .col3-set .col-2 .form {margin-top: 20px; }

.required_higlight
{  border-color: #e40001;
box-shadow: inset 0px 0px 4px rgba(228,0,1,0.75) !important;
}
.value_suggestion {box-shadow: inset 0px 0px 4px rgba(173, 170, 163, 0.96) !important;}

.icon-play-circle{cursor:pointer;   padding: 5px;     font-size: 1.2em;
    color: #e40001;}
/*slider*/

#featureModal .thumbnail-direction-nav .thumbnail-next {
  background-position: 100% 100%;
  right: -29px !important;
  top: 57px;
}
#featureModal .thumbnail-direction-nav .thumbnail-prev {
  left: -31px !important;
}
#featureModal  .more-views {
  width: 236px;
  padding-right: 0px;
  padding-left: 0px;
}

#featureModal #image{max-width:86%; margin-left:auto; margin-right:auto;}

/**nämä voisi yhdistää  päätyyleihin..*/
#rootwizard .moreContent > label > input {
  position: absolute;
}

#rootwizard .moreContent  > label > input + img {
  cursor: pointer;
  border: 2px solid transparent;
  display: block;
  border-radius: 8px;
}

#rootwizard .moreContent > label > input:checked + img {
  border: 2px solid #e40001;
}
#featureModal  select{margin-top:5px; margin-left: 5px;}

/*last step*/

.textRadio {
  position: relative; padding-left: 0px !important; margin-right: 7px; margin-left: 7px; display: inline-block;   margin-bottom: 13px; max-width: 272px;   background-color: rgba(118, 117, 117, 0.31);
  padding-bottom: 5px; 
}
.textRadio.primary{ background-color: #fff;}

.textRadio input[type=radio] {  
    display: none;  
}  

.textRadio label.package_labelbox{text-transform:uppercase; font-size:13px; font-weight:700; color:#8e8d8d; margin-left: 34px;
  /*matrid*/
  padding-left:0px;
}
.textRadio label.package_labelbox:before{
 content: "";  
    display: inline-block;  
  
    width: 21px;  
    height: 21px;  
  
    margin-right: 10px;  
    position: absolute;  
  left: 4px;
  bottom: 5px;
    background-color: #ffffff;
  border:1px solid #dbddde; 
border-radius:2px;  
}

.textRadio input[type=radio]:checked + label.package_labelbox:before {
    background-color: #e40001;
  border:1px solid #00;
}
.textRadio input[type=radio]:checked + label.package_labelbox
{color:#e50000;}

.page4 fieldset
{background-color:#ecf0f1;   padding: 12px;   margin-bottom: 11px;}

.packages p{color:#666666;   margin-top: 1em;}

.package_labelimg img{margin-bottom:5px;}

#package_description{font-size:0.9em; color:#545454;}

#mallinukke  {
    max-height: 342px;
    margin: 5px 0 0 10px;
    width: auto;
}

.measureButtons .button{margin-bottom:0.5em; margin-top:0.2em; text-transform:none; font-family:georgia, serif; font-style:italic; font-size:1.2em; padding:0.7em 1em; border-radius:10px; } 
.instructions-standard{display:none;}

@media only screen and (max-width: 1024px) and (min-width: 978px){
  .moreBox {margin-bottom: 30px;margin-right: 52px;margin-left: 3px;}
  .buttons-right input.btn.button-next {margin-right: 89px;}
  #tab3 .buttons-right input.btn.button-next {margin-right: 90px;}
}

@media only screen and (max-width: 1024px) and (min-width: 568px)
{
.modal-body .col2-set .col-1 {  width: 29%;}
.modal-body .col2-set .col-2 {width: 66%;}

}


@media only screen and (min-width: 768px)
{
 body.modal-open {
    overflow: hidden;
}
.size_pituutesi , .size_vaatekoko{float:left; width: 40%;}
.size_pituutesi {width: 54%;}
.selectedColour {left: 155px;}
}

/*mobiilityylit*/
@media only screen and (max-width: 767px)
{
  #featureModal  .controls.imageinput label.radio{margin-left:0 !important; margin-right:5px;}
  #featureModal .controls label.radio{margin-left:0 !important;}
  .moreBox{margin-left: 0px;margin-top: 20px;margin-right: 10px;}
  #group_Paketti label.radio.inline.package_labelbox {margin-left: 31px !important;}
  #group_Vari label.control-label.selectedColour {margin-left: 41px;}
  
  #featureModal #image { max-width: 61%;  margin-bottom: 10px;}
  #featureModal, .bigModal{position: relative !important;  top: 0 !important; left: auto !important;     border: 0; box-shadow: 0px 0px 0px #fff; margin:0 !important;     width: auto !important; display:none;} 
  #featureModal .col-1.narrow, #featureModal  .wide , .col2-set .col-2, .col3-set .narrow, .col3-set .narrow, .size_pituutesi , .size_vaatekoko, #featureModal  .control-group textarea{width: auto !important;   float:none; max-width:100%; margin:0 !important; padding:0 !important;  }
  #featureModal .control-group textarea{padding:10px !important; }
  #featureModal  .tab-content>.tab-pane, .pill-content>.pill-pane {
    display: block !important;}
  #featureModal .tab-pane{margin-bottom:1em;   padding-bottom:10px; border-bottom: 1px solid #d4d4d4; }
  #featureModal .tab-inner{border:0px none;}
  #featureModal .col-3 .form, #featureModal .col3-set .col-2 .form { margin-top: 0px; }
  #featureModal   ul.nav.nav-pills {  display: none;}
  #featureModal  label.control-label { display: block;}
  .selectedColour {width: 125px!important;float: left;position: relative;top: 21px;margin-bottom: 11px !important;}
  .smallOptions { float: left;width:100%;margin-top:30px;}
  #featureModal .more-images{ margin-bottom: 20px;}
  .controls.imageinput .smallOptions label.radio {  max-width: 42px; margin-right: 3px;}
  .controls.imageinput label.radio {      max-width: 59px; }
  #featureModal .modal-body{height: auto !important; padding:0 !important;}  
  #featureModal label.control-label{max-width:100%;}
  .product-options .options-list li {margin: 0px 0;}
  #measurmentVideo { max-width: 100%; position:relative;} #mallinukke {
  max-height: 236px;}
  #video-instructions{
    position: absolute;
    bottom: -74px;
    z-index: 1000;
    margin-right: 10px;
    background-color: rgba(255,255,255,0.9);
    padding: 10px;
    border: 1px solid #9fa3a6;}
  #featureModal .btn.button-next, .buttons-right input.btn.button-previous{display:none;}
  .page4 fieldset { background-color: #fff; padding: 12px 0;}
  #featureModal div#tab1:before {
  content: "Täytä tilauksen tiedot"; font-size: 1.5em;padding-bottom: 21px; display: block;}
  .config-next-info {display:none;}
  #group_Haluan_mekon_lisaksi_kangasta_ja_extra_koristeita label{width:100%;}
  #featureModal #tab3 .col-1.narrow {display:none;}
  #group_Paketti label img{display:none;}
  #group_Paketti .textRadio {max-width:none; display:block; padding-top:5px;    margin-bottom: 6px;     padding-right: 6px; margin-right:0px; }
  .textRadio.primary { border: 1px solid rgba(118, 117, 117, 0.31);}
  #package_description { margin-top: 5px;}

  #featureModal .thumbnail-direction-nav .thumbnail-next {
      top: 20px;
  }
  /* 
  .modal-backdrop, .modal-backdrop.fade.in{display:none;}
  
  */ 
  #featureModal .tab-content>.tab-pane, .pill-content>.pill-pane {
    display:none !important;
  }
  #featureModal .tab-content>.tab-pane.active {
    display:block !important;
  }
  #featureModal .btn.button-next, .buttons-right input.btn.button-previous {
    display: block;
  }
  #tab5 .buttons-right input.btn.button-previous, #tab2 .buttons-right input.btn.button-previous, #tab3 .buttons-right input.btn.button-previous {
    position: relative;
    top: 40px;
    left: -80px;
  }
  #tab4 .buttons-right input.btn.button-previous {
    position: relative;
    top: 30px;
    left: -100px;
  }
}

/*ipad portrait*/
@media only screen and (max-width: 977px) and (min-width: 768px){
.bigModal { width: 750px;margin-left: -377px;}
label.control-label { width: 100px;  margin-right: 5px;}
.imageinput.colours { min-height: 120px;}
.selectedColour {width: 68px;}
.smallOptions { width: 350px;} 
#tab1 .controls, #tab1 .controls select, #tab1 .control-group textarea { width: 100%;}
div#group_Mallikoodi .controls input[type="text"] {float: left;margin-left: 110px;margin-top: -28px;}
#tab5 div#group_Mallikoodi .controls input[type="text"] {float: none !important;margin-left: 0 !important;margin-top: 0 !important;}
.moreBox {margin-left: 1px;}
select#option_Puvun_tyyli__pituus_ {float: left;margin-left: 110px;width: 69% !important;margin-top: -27px;}
select#option_Laahus {float: left;margin-left: 110px;width: 69% !important;margin-top: -27px;}
select#option_Halkio {float: left;margin-left: 110px;width: 69% !important;margin-top: -27px;}
.buttons-right input.btn.button-next{margin-right: 59px;}
#tab3 .buttons-right input.btn.button-next {margin-right: 10px;}
.control-group textarea {width: 338px !important;margin-left: 110px;margin-top: -55px;}
#group_Pituus .controls span {top: -18px !important;}
.controls input#options_Pituus_text {float: left;margin-left: 110px;margin-top: -22px;}
div#group_Mallikoodi ul li {margin: -17px 0 15px 110px !important;}
#group_Additional_information_for_the_model_and_details .controls textarea {float: left;margin-top: -50px;margin-left: 110px;}
.moreBox label.radio.inline.required {padding-top: 4px;}
#group_Koko .controls p {margin-top: 24px;margin-left: 69px !important;}
select#option_Koko {float: left;margin-left: 111px;margin-top: -27px;width: 326px;}
#group_Rinnanymparys .controls input {float: left;margin-left: 0px;margin-top: 2px;}
#group_Vyotaro .controls input {float: left;margin-left: 0px;margin-top: 2px;}
#group_Lantio .controls input {float: left;margin-left: 0px;margin-top: 2px;}
#group_Olkapaasta_vyotaroon .controls input {float: left;margin-left: 0px;margin-top: 2px;}
#group_Vyotarosta_helmaan .controls input {float: left;margin-left: 0px;margin-top: 2px;}
.disclaimers {width:80% !important;}
.disclaimers .disclaimer2 {margin-left: 249px;margin-top: -184px;width: 436px;}
fieldset .control-group label.control-label.required {width: 114px;}
#group_Toimitusaika .controls select {float: left;margin-left: 110;margin-top: -1px;}
#group_Juhla .controls select {float: left;margin-left: 110px;margin-top: -27px;}
#group_Lisatietoja_toimituksesta .controls textarea {float: left;margin-left: 110px;margin-top: -37px;}
#group_Paketti label.radio.inline.package_labelbox {font-size: 10px;}
.controls.imageinput .smallOptions label.radio {  max-width: 29px; margin-right: 3px;}
.controls.imageinput label.radio {  max-width: 76px; }

#featureModal.modal.fade.in { top: 4vh;}
#measurmentVideo { overflow: hidden;} .modal-body {  height: 80vh;}
#measurmentVideo iframe{width:216px; }
#featureModal .more-views { width: 157px;}
.packages .textRadio{    max-width: 215px;}
.size_pituutesi label , .size_vaatekoko label {display:block;}

}
@media only screen and (max-width: 479px) and (min-width: 320px){
  input#options_Pituus_text {margin-left: -108px;}
  p.tab3_para {margin-left: 0 !important;text-align: left !important;}
  #featureModal #group_Ylaosan_tyyli .required {color: #000000cf;margin-left: 0px !important;}
  #featureModal .controls label.radio{margin-left: 6px !important;margin-right: 113px;}
  #featureModal .controls label.radio input.tab3-checkbox { margin-right: 0px !important;}
  .input-small{margin-left:0;}
  div#group_Mallikoodi ul li {margin: -10px 0 10px 82px !important;}
  div#group_Mallikoodi .controls input[type="text"] {float: right;margin-left: 82px;margin-top: -22px;}
  label.radio.inline.package_labelbox {margin-right: 0px !important;padding-left: 31px;}
  #featureModal select{margin-left:0px;}
  #group_Haluan_pukuni_silitettyna__suositus_ label.radio.inline {margin-right: 2px !important;}
  #featureModal label.control-label.selectedColour {margin-left: 80px;}
  #group_Puvun_tyyli__pituus_ label.radio.inline {margin-right: 0px !important;}
  #group_Paketti label.radio.inline.package_labelbox {margin-left: 0px !important;}
  #group_Vari label.control-label.selectedColour {margin-left:80px;}
  .selectedColour img{margin-left: -5px;}
  span.labelText{margin-left: -3px;}
  #featureModal #group_Ylaosan_tyyli .radio.inline.required+.radio.inline.required {margin-left: 0px !important;}
  #featureModal #group_Fastening .radio.inline +.radio.inline {margin-left: 0px !important;}
  .Toimi_para {margin-left: 0px !important;}
}
@media only screen and (max-width: 567px) and (min-width: 480px){
 input#options_Pituus_text {margin-left: -108px;}
  p.tab3_para {margin-left: 0 !important;text-align: left !important;}
  .input-small{margin-left:0;}
  #group_Vari label.control-label.selectedColour {margin-left: 2px;}
  #featureModal #group_Ylaosan_tyyli .radio.inline.required+.radio.inline.required {margin-left: 0px !important;}
  #featureModal #group_Fastening .radio.inline +.radio.inline {margin-left: 0px !important;}
  .Toimi_para {margin-left: 6px !important;}
}