<script src="https://fibrotech.it/wp-content/themes/kallyas-child/babylonjs/babylon.js"></script>
<script src="https://fibrotech.it/wp-content/themes/kallyas-child/babylonjs/babylonjs_new.loaders.min.js"></script>
<script src="https://fibrotech.it/wp-content/themes/kallyas-child/babylonjs/pep.js"></script>







<script src="https://fibrotech.it/wp-content/themes/kallyas-child/babylonjs/5.0.0-rc.4/babylon.js"></script>
<script src="https://fibrotech.it/wp-content/themes/kallyas-child/babylonjs/dat.gui.min.js"></script>
<script src="https://fibrotech.it/wp-content/themes/kallyas-child/babylonjs/ammo.js"></script>
<script src="https://fibrotech.it/wp-content/themes/kallyas-child/babylonjs/cannon.js"></script>
<script src="https://fibrotech.it/wp-content/themes/kallyas-child/babylonjs/Oimo.js"></script>
<script src="https://fibrotech.it/wp-content/themes/kallyas-child/babylonjs/earcut.min.js"></script>

<script src="https://fibrotech.it/wp-content/themes/kallyas-child/babylonjs/babylonjs.materials.min.js"></script>
<script src="https://fibrotech.it/wp-content/themes/kallyas-child/babylonjs/babylonjs.proceduralTextures.min.js"></script>
<script src="https://fibrotech.it/wp-content/themes/kallyas-child/babylonjs/babylonjs.postProcess.min.js"></script>
<script src="https://fibrotech.it/wp-content/themes/kallyas-child/babylonjs/babylonjs.loaders.js"></script>
<script src="https://fibrotech.it/wp-content/themes/kallyas-child/babylonjs/babylonjs.serializers.min.js"></script>
<script src="https://fibrotech.it/wp-content/themes/kallyas-child/babylonjs/babylon.gui.min.js"></script>
<script src="https://fibrotech.it/wp-content/themes/kallyas-child/babylonjs/babylon.inspector.bundle.js"></script>


<input type="hidden" id="instanceCounti" value="0" />
<input type="hidden" id="instanceCountl" value="0" />
<input type="hidden" id="instanceCountu" value="0" />
<input type="hidden" id="squere" value="0" />
<input type="hidden" id="hid_color" value="0" />
<input id="flipfance" name="flipfance" type="hidden" value="0" />
<input id="threedcreate" name="threedcreate" type="hidden" value="0" />
<div id="append_all_heden_input"></div>
<div id="all_canvas_button_hide_show">
  <input type="hidden" id="canvas_button_hide_show" value="1" />
</div>
<style>
  .fullwidth {
    z-index: 999;
  }

  html {
    overflow: scroll;
    overflow-x: hidden;
  }

  ::-webkit-scrollbar {
    width: 0;/ Remove scrollbar space / background: transparent;/ Optional: just make scrollbar invisible /
  }

  / Optional: show position indicator in red /::-webkit-scrollbar-thumb {
    background: #FF0000;
  }

  .calculator-box.calculator-1 img,
  .calculator-box.calculator-2 img,
  .calculator-box.calculator-3 img,
  .calculator-box.calculator-4 img,
  .calculator-box.calculator-5 img,
  .calculator-box.calculator-6 img,
  .calculator-box.calculator-7 img,
  .calculator-box.calculator-8 img {
    mix-blend-mode: darken;
  }

  .calculator-box.calculator-4 .ccb-text-box img,
  .calculator-box.calculator-5 .ccb-text-box img,
  .calculator-box.calculator-6 .ccb-text-box img {
    height: 200px !important;
    object-fit: contain;
  }

  #embed-host {
    display: none;
  }

  #gift-wrap-option1 {
    position: fixed;
    top: 50% !important;
    left: 50%;
    transform: translate(-50%, -50%);
    max-width: 500px;
  }

  .custom_radio_button {
    display: flex;
    width: 25%;
    float: none;
    margin: auto;
  }

  .custom_glb_type {
    width: 25%;
    margin-top: 5px !important;
    margin-bottom: 0;
  }

  .custom_height {
    width: 25%;
    /* padding: 15px !important;*/
    margin: 0;
  }

  .custom_radio_button input {
    margin-left: 5px;
  }

  .custom_radio_button label {
    margin-left: 5px;
  }

  #popupBoxCloseengraving {
    background: #367b11;
    border: none;
    font-weight: 700;
    font-size: 22px;
  }

  .custom_ok_button {
    background-color: rgb(54 123 17) !important;
    width: 12% !important;
    padding: 8px;
    color: #fff;
    font-size: 17px;
    border: none;
  }

  .gift-wrap-option {
    background: #ffffff none repeat scroll 0 0;
    border-radius: 12px;
    box-shadow: 0 0 19px #474747;
    display: none;
    font: 400 14px/24px Helvetica, sans-serif;
    /*left: 15.5%;*/
    left: 24%;
    margin: 0;
    min-height: 235px;

    padding: 0;
    position: fixed;

    /* top: 0px !important;*/
    top: 25% !important;
    /*width: 69%;*/
    width: 52%;
    z-index: 999999999;
    display: flex;
    flex-wrap: wrap;
  }

  .shield-engraving {
    background: none repeat scroll 0 0 #333333;
    height: 100%;
    left: 0;
    top: 0;
    width: 100%;
    z-index: 1000;
  }

  .close-popup {
    color: #000 !important;
    float: right !important;
    font-size: 21px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    opacity: 0.2 !important;
    text-shadow: 0 1px 0 #fff;
    cursor: pointer !important;
    padding: 1px 9px !important;
    margin: 0px !important;
    box-sizing: border-box !important;
    font: 400 14px/24px Helvetica, sans-serif !important;
  }

  #ModalTitle,
  .ModalTitle {
    font: 400 14px/24px Helvetica, sans-serif;
    min-height: 40px;
    width: 100%;

    background: #367b11;
    border-bottom: 1px solid #fff;
    border-radius: 7px 7px 0 0;
    color: #fff;

    padding: 1%;
    text-align: left;

    height: 20px;
  }

  div#ModalButtonRow1 {
    width: 100%;
    margin: 5px auto;
    text-align: center;
  }

  #ModalButtonRow,
  .ModalButtonRow {
    background: #fff none repeat scroll 0 0;
    border-radius: 0 0 7px 7px;
    border-top: 1px solid #e5e5e5;
    min-height: 12.43px;
    padding: 1%;
    text-align: right;
    width: 98%;
    position: absolute;
    bottom: 0;
  }

  #ModalButtonRow .Button {
    background: #57ad68 none repeat scroll 0 0;
    border: 1px solid #439f55;
    border-radius: 2px;
    box-shadow: 0 1px 1px rgba(255, 255, 255, 0.2) inset;
    color: #fff !important;
    cursor: pointer;
    display: inline-block;
    font-size: 14px;
    line-height: 24px !important;
    margin: 0 5px 0 0;
    opacity: 1 !important;
    padding: 4px 12px !important;
    position: relative;
    text-align: center;
    text-decoration: none;
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
    text-transform: lowercase;
    white-space: nowrap;
    width: 70px;
  }

  #ModalButtonRow1 label {
    display: block;
  }

  .cleardiv {
    clear: both;
  }

  .renderCanvas {
    height: 800px;
  }

  .profile_selection_step_wrap .select_product p {
    text-align: center;
    color: #000;
    min-height: 52px;
  }

  .calculator-6 .select_accessories label {
    color: #000;
    min-height: 50px;
    width: 90%;
    margin: 0 auto;
    line-height: 16px;
  }

  .modal-vo {
    display: none !important;
  }

  .desktop-vo {
    display: block;
  }

  .calculator-box.calculator-7 .calculator-contact-box .col-8 .ccb-text-box {
    width: 100%;
  }

  @media screen and (max-width:767px) {
    .renderCanvas {
      height: 350px;
    }

    .mouse_gest {
      display: none;
    }
  }
</style>
<style type="text/css">
  .btn_next {
    float: right;
    border: 1px solid #f2f2f2 !important;
    border-radius: 0;
    background: #f2f2f2;
    margin: 6px 5px;
    height: 38px;
    font-weight: bold;
  }

  body {
    outline: none;
    padding: 0px;
    margin: 0px;
    font-family: Roboto;
  }

  :focus {
    outline: none;
  }

  button:focus {
    outline: none;
  }

  select:focus {
    outline: none;
  }

  a:focus {
    outline: none;
  }

  img {
    border: none;
  }

  * {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }

  :after,
  :before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
  }

  img {
    max-width: 100%;
    display: block;
  }

  a {
    text-decoration: none;
  }

  a:hover {
    text-decoration: none;
  }

  img {
    margin: 0px;
    display: block;
  }

  ul,
  ol {
    margin: 0px;
    padding: 0px;
    list-style: none;
  }

  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    margin: 0px;
    font-weight: normal;
  }

  a:focus {
    text-decoration: none;
  }

  p {
    padding: 0;
    margin: 0;
  }

  .calculator-contact-box {
    width: 100%;
    float: left;
    display: flex;
  }

  .col-8 {
    width: 65%;
    float: left;
    display: flex;
  }

  .col-4 {
    width: 35%;
    float: left;
    display: flex;
  }

  .ccb-text {
    background-color: #f4f4f4;
    width: 100%;
    padding-bottom: 80px;
  }

  .ccb-list {
    background-color: #fafafa;
    width: 100%;
  }

  .ccb-text-box {
    margin: auto;
    width: 80%;
    display: table;
  }

  .ccb-list-box {
    margin: auto;
    width: 90%;
    display: table;
  }

  .ccb-text-box h2 {
    font-size: 26px;
    font-weight: 500;
    color: #000;
    margin: 21px 0 2px;
    text-transform: uppercase;
    margin-bottom: 30px;
  }

  .ccb-list-box h2 {
    font-size: 36px;
    font-weight: 500;
    color: #000;
    margin: 50px 0;
    width: 100%;
    float: left;
    text-align: center;
    text-transform: uppercase;
  }

  .vaelg-form {
    width: 100%;
    float: left;
  }

  .vaelg-form ul {
    margin: auto;
    display: table;
    width: 70%;
  }

  .vaelg-form ul li {
    width: 49%;
    padding: 15px;
    float: left;
    border: 1px solid #ddd;
    margin: 2px;
  }

  .ccb-list-box ul {
    float: left;
    width: 100%;
  }

  .ccb-list-box ul li span {
    margin: auto 0 auto 20px;
    float: left;
    width: 80%;
    font-size: 16px;
    font-weight: 600;
  }

  .ccb-list-box ul li {
    height: 64px;
    width: 100%;
    background-color: #fff;
    display: flex;
    box-shadow: 0 6px 5px #DFDFDF;
    margin: 0 0 10px;
    opacity: 0.6;
    cursor: no-drop;
  }

  .ccb-list-box ul li.active-list {
    opacity: 1;
    cursor: pointer;
  }

  .ccb-list-box ul li img {
    float: right;
    display: none;
  }

  .ccb-list-box ul li.active-list img {
    display: block;
  }

  .id-box-50 {
    width: 33.33%;
    float: left;
    display: table;
    margin: auto;
  }

  /*.df-row .w-50 {
  width:50%;
  float:left;
  padding:20px;
}*/
  .df-row .w-100 {
    width: 100%;
    float: left;
    padding: 2px;
  }

  .dimensioner-form {
    width: 100%;
    float: left;
  }

  .indsaet-dimensioner {
    display: flex;
  }

  .df-row label {
    font-size: 18px;
    margin-bottom: 12px;
  }

  .df-row .form-control {
    height: 35px;
    border-radius: 0;
    border: 1px solid #d7d7d7;
    background: #fff;
    float: left;
    margin: 0px;
    width: 75%;
  }

  .df-row span {
    height: 35px;
    border-radius: 0;
    float: left;
    border: 1px solid #d7d7d7;
    text-align: center;
    line-height: 35px;
    width: 25%;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    background: #f4f4f4;
  }

  .df-row {
    width: 70%;
    float: left;
    padding: 0 40px;
  }

  textarea:focus,
  input[type="text"]:focus,
  input[type="password"]:focus,
  input[type="datetime"]:focus,
  input[type="datetime-local"]:focus,
  input[type="date"]:focus,
  input[type="month"]:focus,
  input[type="time"]:focus,
  input[type="week"]:focus,
  input[type="number"]:focus,
  input[type="email"]:focus,
  input[type="url"]:focus,
  input[type="search"]:focus,
  input[type="tel"]:focus,
  input[type="color"]:focus,
  .uneditable-input:focus {
    box-shadow: 0 0 0;
    border-color: #777;
  }

  .id-box-50 img {
    /*margin:40px auto;*/
    mix-blend-mode: darken;
  }

  @keyframes hover-color {
    from {
      border-color: #c0c0c0;
    }

    to {
      border-color: #3e97eb;
    }
  }

  .id-box-50 img {
    mix-blend-mode: darken;
  }

  .profile_selection_step_wrap .select_product {
    mix-blend-mode: darken;
  }

  .magic-radio,
  .magic-checkbox {
    position: absolute;
    display: none;
  }

  .magic-radio[disabled],
  .magic-checkbox[disabled] {
    cursor: not-allowed;
  }

  .magic-radio+label,
  .magic-checkbox+label {
    position: relative;
    display: block;
    padding-left: 30px;
    cursor: pointer;
    vertical-align: middle;
    font-size: 16px;
    color: #000;
  }

  .magic-radio+label:hover:before,
  .magic-checkbox+label:hover:before {
    animation-duration: 0.4s;
    animation-fill-mode: both;
    animation-name: hover-color;
  }

  .magic-radio+label:before,
  .magic-checkbox+label:before {
    position: absolute;
    top: 0;
    left: 0;
    display: inline-block;
    width: 20px;
    height: 20px;
    content: '';
    border: 1px solid #c0c0c0;
  }

  .magic-radio+label:after,
  .magic-checkbox+label:after {
    position: absolute;
    display: none;
    content: '';
  }

  .magic-radio[disabled]+label,
  .magic-checkbox[disabled]+label {
    cursor: not-allowed;
    color: #e4e4e4;
  }

  .magic-radio[disabled]+label:hover,
  .magic-radio[disabled]+label:before,
  .magic-radio[disabled]+label:after,
  .magic-checkbox[disabled]+label:hover,
  .magic-checkbox[disabled]+label:before,
  .magic-checkbox[disabled]+label:after {
    cursor: not-allowed;
  }

  .magic-radio[disabled]+label:hover:before,
  .magic-checkbox[disabled]+label:hover:before {
    border: 1px solid #000;
    animation-name: none;
  }

  .magic-radio[disabled]+label:before,
  .magic-checkbox[disabled]+label:before {
    border-color: #e4e4e4;
  }

  .magic-radio:checked+label:before,
  .magic-checkbox:checked+label:before {
    animation-name: none;
  }

  .magic-radio:checked+label:after,
  .magic-checkbox:checked+label:after {
    display: block;
  }

  .magic-radio+label:before {
    border-radius: 50%;
  }

  .magic-radio+label:after {
    top: 0;
    left: 0;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #000;
  }

  .magic-radio:checked+label:before {
    border: 1px solid #3e97eb;
  }

  .magic-radio:checked[disabled]+label:before {
    border: 1px solid #000;
  }

  .magic-radio:checked[disabled]+label:after {
    background: #c9e2f9;
  }

  .magic-checkbox+label:before {
    border-radius: 3px;
  }

  .magic-checkbox+label:after {
    top: 2px;
    left: 7px;
    box-sizing: border-box;
    width: 6px;
    height: 12px;
    transform: rotate(45deg);
    border-width: 2px;
    border-style: solid;
    border-color: #fff;
    border-top: 0;
    border-left: 0;
  }

  .magic-checkbox:checked+label:before {
    border: #3e97eb;
    background: #3e97eb;
  }

  .magic-checkbox:checked[disabled]+label:before {
    border: #c9e2f9;
    background: #c9e2f9;
  }

  .vaelg-tilbehor-1 {
    /*width:100%;*/
    padding: 0 30px;
    float: left;
    /*margin:50px 0;*/

  }

  .vaelg-tilbehor-1-img {
    width: 33.333%;
    float: left;
    text-align: center;
  }

  .vaelg-tilbehor-1-img img {
    margin: 15px auto;
  }

  .vaelg-tilbehor-1-img p {
    font-size: 16px;
    color: #000;
  }

  .vaelg-tilbehor-2 {
    float: left;
    width: 100%;
    border: 1px solid #000;
    border-right: none;
    display: flex;
    padding: 0 0 0 20px;
  }

  .vaelg-tilbehor-2 span {
    font-size: 16px;
    line-height: 50px;
    width: 20%;
    color: #000;
  }

  .vaelg-tilbehor-gup {
    width: 20%;
    float: left;
    border-right: 1px solid #000;
    padding: 15px 10px 0;
  }

  .vaelg-tilbehor-gup small {
    font-size: 10px;
  }

  .vaelg-tilbehor-3 {
    float: left;
    width: 100%;
    text-align: center;
    margin: 50px 0;
  }

  .vaelg-tilbehor-3 p {
    width: 100%;
    float: left;
    padding: 0 0 50px;
    font-size: 16px;
    color: #000;
  }

  .vaelg-tilbehor-3 button {
    background: #e8e828;
    border: none;
    padding: 15px 50px;
    text-transform: uppercase;
    font-size: 20px;
  }

  .total-row {
    width: 90%;
    margin: auto;
    display: table;
    padding: 30px 0;
  }

  .te-price {
    width: 100%;
    float: left;
    text-align: center;
    font-size: 19px;
    text-transform: uppercase;
    font-weight: 600;
    color: #000;
  }

  .te-price span {
    font-size: 36px;
    padding: 0 15px;
    color: #367b11;
    font-weight: 400;
  }

  .button-row {
    width: 100%;
    float: left;
    margin-top: 40px;
    margin-bottom: 40px;
  }

  .button-row button {
    width: 44%;
    float: left;
    margin: 0 3%;
    background: #e8e828;
    border: none;
    padding: 15px 0;
    font-size: 16px;
  }

  .show-3d {
    width: 100%;
    float: left;
  }

  .show-3d h3 {
    width: 100%;
    float: left;
    text-align: center;
    font-size: 66px;
    margin: 20px 0;
    line-height: initial;
  }

  .show-3d .show-3d-box {
    margin: auto;
    display: table;
    width: 100%;
  }

  .show-3d .show-3d-box img {
    margin: auto;
  }

  .tbl_custom_data {
    width: 100%;
    float: none;
    margin: auto;
    /*padding:70px 0;*/
    display: table;
  }

  .tbl_custom_data th,
  .tbl_custom_data td {
    /*border-bottom:1px solid #999;*/
    text-align: left;
    padding: 4px 5px;
    font-size: 14px;
    /*padding:13px 20px;
  font-size:18px;*/
  }

  .tbl_custom_data td:first-child {
    width: 50%;
  }

  ;

  .tbl_custom_data p {
    font-size: 18px;
    padding: 20px 0;
    line-height: 30px;
  }

  .tbl_custom_data span {
    padding: 0 50px;
    /*font-size:22px;*/
  }

  .serie-alu-hegn {
    float: left;
    width: 100%;
    background-color: #fff;
    box-shadow: 4px 6px 16px #DFDFDF;
    margin: 7px 0 10px;
    padding: 30px 40px;
    min-height: 440px;
  }

  .serie-alu-hegn .serie-img {
    float: left;
    width: 46%;
    margin: 2%;
  }

  .serie-alu-hegn .serie-img img {
    width: 100%;
  }

  .site-content .container {
    width: 100%;
    padding: 0px;
  }

  @media screen and (max-width:1800px) {
    .df-row label {
      font-size: 14px;
      margin-bottom: 12px;
    }

    .df-row {
      width: 100%;
      float: left;
      padding: 0 9px;
    }

    .button-row button {
      font-size: 13px;
    }

    .ccb-text-box h2 {
      font-size: 26px;
    }

    .ccb-list-box h2 {
      font-size: 28px;
    }

    .show-3d h3 {
      font-size: 46px;
    }
  }

  @media screen and (max-width:600px) {
    .tbl_custom_data table {
      border: 0;
    }

    .tbl_custom_data table thead {
      display: none;
    }

    .tbl_custom_data table tr {
      margin-bottom: 10px;
      display: block;
      border-bottom: 2px solid #ddd;
    }

    .tbl_custom_data table td {
      display: block;
      text-align: right;
      font-size: 13px;
      border-bottom: 1px dotted #ccc;
    }

    .tbl_custom_data table td:last-child {
      border-bottom: 0;
    }

    .tbl_custom_data table td:before {
      content: attr(data-label);
      float: left;
      text-transform: uppercase;
      font-weight: bold;
    }
  }

  .header-h2 {
    font-size: 17px;
  }

  .addbtn {
    background-color: #464242;
    color: #fff;
    border-radius: 2px;
    outline: none;
    margin-top: 21px;
    padding: 5px;
  }

  .addbtn:hover {
    background-color: #ee8620;

  }

  .vaelg-form ul li {
    width: 49%;
    padding: 15px;
    float: left;
    border: 1px solid #ddd;
    margin: 2px;
  }

  .vaelg-form ul li:hover {
    /* border: 3px solid #000; */
    box-shadow: 0px 1px 1px 1px #5a5a5a8f;
  }

  .variation_ids {
    float: left;
    width: 125px;
    padding: 3px;
    border: 1px solid #e1e1e1;
    margin: 7px;
    position: relative;
  }

  @media screen and (max-width:1800px) {
    .df-row label {
      font-size: 14px;
      margin-bottom: 12px;
    }

    .df-row {
      width: 100%;
      float: left;
      padding: 0 9px;
    }

    .button-row button {
      font-size: 13px;
    }

    .ccb-text-box h2 {
      font-size: 26px;
    }

    .ccb-list-box h2 {
      font-size: 28px;
    }

    .show-3d h3 {
      font-size: 46px;
    }

    .select_product {
      float: left;
      min-height: 235px;
    }
  }

  @media screen and (max-width:1200px) {
    .col-8 {
      width: 58%;
    }

    .vaelg-form ul li {
      width: 32.23%;
    }

    .col-4 {
      width: 42%;
    }

    .indsaet-dimensioner {
      display: inline-block;
    }

    .button.btn.btn_nexttrigger {
      width: 90px !important
    }

    .vaelg-tilbehor-2 {
      display: inline-block;
      text-align: left;
      border: 1px solid #000 !important;
    }

    .vaelg-tilbehor-gup {
      width: 100%;
      float: left;
      border-right: none;
    }

    .indsaet-dimensioner_image_wrap {
      border: 1px solid #e1e1e1;
      margin: auto 10px;
      width: 100%;
    }

    .id-box-50.indsaet-dimensioner_input_wrap {
      width: 100% !important;
      /*padding-top: 40px*/
      ;
    }

    .vaelg-form ul li {
      /* width: 32.23%; */
      width: 48%;
    }

    .select_product {

      float: left;

      min-height: 225px;
    }

    .select_accessories {
      width: 50%;
    }

  }

  @media screen and (max-width:1100px) {
    .vaelg-tilbehor-2 {
      float: left;
      width: 100%;
      border: 1px solid #000;
      border-right: none;
      display: inline-block;
      padding: 20px 60px;
      text-align: left;
    }

  }

  @media screen and (max-width:900px) {
    .id-box-50 {
      width: 100%;
    }
  }

  @media screen and (max-width:767px) {
    .te-price span {
      font-size: 39px;
    }
  }

  @media screen and (max-width:767px) {

    .ui-dialog.ui-widget.ui-widget-content.ui-corner-all.ui-front.ui-draggable.ui-resizable {
      width: 275px !important;
      top: 2361px !important;
      left: 22px;
    }

    .col-4 {
      width: 100%;
      /*display: none;*/
    }

    #sendtopdf {
      float: left;
      margin: 0 3%;
      background: #e8e828;
      border: none;
      padding: 15px 10px;
      /* display: block !important;*/
      width: 100%;
    }

    #add_to_cart_btn {
      font-size: 14px;
      float: left;
      margin: 7px 0px 0px 6px;
      background: #e8e828;
      border: none;
      padding: 15px 10px;
      /* display: block !important;*/
      width: 100%;
    }

    .col-8 {
      width: 100%;
    }

    .row,
    .thumbnails {
      margin-left: 0;
      margin: 0;
    }

    .vaelg-form ul li {
      width: 31.23%;
    }

    .site-content {
      position: relative;
      margin: 0 0 20px;
    }

    .vaelg-tilbehor-1-img {
      width: 100%;
      float: left;
      text-align: center;
    }

    .modal-vo {
      display: block !important;
    }

    .desktop-vo {
      display: none !important;
    }

    .modal-vo .col-4 {
      width: 100%;
      display: block;
    }

    .calculator-contact-box {
      display: inline-block
    }

    .button-row button {
      width: 100%;
    }

    .vaelg-form ul li {
      width: 48%;
    }

    .calculator-box.calculator-2 .id-box-50 img {
      width: 60%;
    }

    .calculator-box.calculator-3 .id-box-50 {
      width: 100%;
    }

    .nextBtn_form {
      /* width: 33% !important;*/
    }

    #vindues_table tr td .w-100 span {
      display: none;
      height: 24px;
    }

    #vindues_table tr td .w-100 input {
      width: 100%;
      height: 24px;
    }

    .tfoot td input {
      width: 30%;
      font-size: 8px;
    }

    .tfoot td .ingen_vindues {
      width: 35%;
      font-size: 8px;
    }

    .vaelg-tilbehor-1-img {
      width: 45%;
      float: left;
      text-align: center;
    }

    .ccb-list-box {
      width: 90%;
    }

    .te-price span {
      /*font-size: 0;*/
      padding: 0;
    }

    .button-row button {
      width: 100%;
      margin: 0;
    }

    .df-row .w-50 {
      width: 50%;
      padding: 0 4px;
    }

    .ccb-text-box h2 {
      font-size: 20px !important;
    }

    #Facade_div thead tr th {
      font-size: 11px !important;
    }

    #facade_stykke_table tr td {
      font-size: 11px !important;
    }

    #facade_stykke_table tr td input {
      /* height: 25px !important;*/
    }

    #facade_stykke_table tr td span {
      /* height: 25px !important;
      line-height: 24px !important;*/
      width: 15%;
      font-size: 14px;
    }

    #Gavl_div thead tr th {
      font-size: 11px !important;
    }

    #Gavl_div tr td {
      font-size: 11px !important;
    }

    #Gavl_div tr td input {
      height: 25px !important;
    }

    #Gavl_div tr td span {
      height: 25px !important;
      line-height: 24px !important;
    }

    .nextBtn_formvindues {
      /* padding: 5px 5px 5px 5px !important;
      font-size: 13px !important;
      width: 30% !important;
    margin-top: 10px;*/
    }

    .calculator-box.calculator-4 .id-box-50 {
      width: 50%;
    }

    .vaelg-tilbehor-1 {
      padding: 0 0;
    }

    .vaelg-tilbehor-1-img p {
      font-size: 14px;
    }

    .tbl_custom_data p {
      font-size: 14px;
    }

    .ccb-text-box h2 {
      margin: 40px 0 10px;
    }

    .back-button {
      padding: 6px 7px 6px 7px;
      background: #ee8620;
      /*color: #fff;*/
    }

    a#back_id_type8 {
      /* float: left; */
      width: 20%;
      margin: 8px auto;
      display: table;
    }

  }

  @media screen and (max-width:600px) {

    .vaelg-profil div div {
      width: 95% !important;
      background: #fff;
      height: auto !important;
    }

    .vaelg-profil div div img {
      width: 79% !important;
      margin: 0 auto !important;
    }

    .vaelg-tilbehor div {
      width: 95% !important;
      background: #fff;
    }

    .vaelg-tilbehor-3 {
      background: #fff0 !important;
    }

    .vaelg-tilbehor div img {
      width: 60% !important;
      margin: 0px auto;
      height: 60% !important;
    }

    .vaelg-tilbehor div center input {
      bottom: 8px !important;
    }

    /*tr td:first-child,
tr td:last-child {
  color: #359900;
  font-weight: bold;
}*/
    #mydiv table tbody tr td:first-child {
      width: 100% !important;
    }

    #mydiv table tbody tr td:nth-child(2) {
      display: none;
    }

    #mydiv table tbody tr td:nth-child(4) {
      display: none;
    }

    .totalll {
      display: none !important;
    }

    .tbl_custom_data table {
      border: 0;
    }

    .tbl_custom_data table thead {
      display: none;
    }

    .tbl_custom_data table tr {
      margin-bottom: 10px;
      display: block;
      border-bottom: 2px solid #ddd;
    }

    .tbl_custom_data table td {
      display: block;
      text-align: right;
      font-size: 13px;
      border-bottom: 1px dotted #ccc;
    }

    .tbl_custom_data table td:last-child {
      border-bottom: 0;
    }

    .tbl_custom_data table td:before {
      content: attr(data-label);
      float: left;
      text-transform: uppercase;
      font-weight: bold;
    }

    .ccb-text-box {
      width: 90%;
    }

    .tbl_custom_data th,
    .tbl_custom_data td {
      /*border-bottom: 1px solid #999;*/
      text-align: left;
      padding: 11px 0;
      font-size: 0;
      width: 100%;
    }

    .vaelg-tilbehor div.variation_ids {
      width: 47% !important;
      background: #fff;
      height: 100px;
    }

    .vaelg-tilbehor .variation_ids img {
      width: 100% !important;
      height: 91px !important;
    }
  }

  @media screen and (max-width:547px) {
    .vaelg-tilbehor div.variation_ids {
      width: 45% !important;
      background: #fff;
      height: 100px;
    }

    .vaelg-tilbehor .variation_ids img {
      width: 100% !important;
      height: 91px !important;
    }
  }

  .bootstrap-dialog.type-primary .modal-header {
    background-color: #abab04;
  }

  .bootstrap-dialog .bootstrap-dialog-close-button {
    font-size: 20px;
    float: right;
    opacity: .9;
    filter: alpha(opacity=90);
  }

  .bootstrap-dialog .bootstrap-dialog-title {
    color: #fff;
    display: inline-block;
    font-size: 16px;
  }

  .modal-body {
    padding-top: 0px;
  }

  .cursurpointer {
    cursor: pointer;
  }

  .ccb-text .ccb-text-box .indsaet-dimensioner {
    /* padding: 100px 0px 0px 0px;*/
  }

  .indsaet-dimensioner {
    /* display: flex;*/
    align-items: center;
    justify-content: center;
  }

  .indsaet-dimensioner_image_wrap {
    border: 1px solid #e1e1e1;
    margin: auto 10px;
  }

  .id-box-50.indsaet-dimensioner_input_wrap {
    /* width: 50%;*/
  }

  .indsaet-dimensioner_input_wrap {
    margin: auto 10px;
  }

  .calculator-3 .id-box-50 img {
    /*  width: 80%;*/
  }

  @media screen and (max-width: 1800px) {
    .df-row {
      width: 70%;
      /* width: 100%; */
      float: left;
      padding: 0 9px;
    }

    .profile_selection_step_wrap .select_product {

      padding: 15px;
    }
  }

  @media screen and (max-width: 1400px) {
    .df-row {
      padding: 0 6px;

    }

    table#Facade_div {
      width: 100%;
    }

    .calculator-7 .col-4 {
      /*min-width: 588px;*/
    }

    .profile_selection_step_wrap .select_product {
      width: 33.33%;
      padding: 15px;
    }

  }

  .dimention {
    width: 21%;
    font-size: 10px;
    margin: 0;
  }

  .dimention1 {
    width: 21%;
    font-size: 10px;
    margin: 0;
  }

  .calculator-4 .ccb-text .ccb-text-box .dimensioner-form {
    padding: 100px 0px 0px 0px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  @media screen and (max-width: 1800px) {
    .df-row {

      /* width: 100%; */
      float: left;
      padding: 0 9px;
    }

    .calculator-7 .col-4 {
      /* min-width: 588px;*/
    }

    .ccb-list .ccb-list-box ul {
      padding: 60px 60px 0 60px;
    }
  }

  @media screen and (max-width: 1400px) {
    .df-row {
      padding: 0 6px;
    }

    .ccb-list .ccb-list-box ul {
      padding: 60px 49px 0 49px;
    }
  }

  .calculator-box.calculator-5 .ccb-text-box .vaelg-profil {
    /*margin-top: 70px;*/
  }

  .profile_selection_step_wrap {
    margin: 0 auto;
    float: unset;
    /* width: 75%;*/
  }

  .calculator-66 .calculator-contact-box .ccb-text-box {
    /* margin: 22px 5px 14px 285px;*/
  }

  @media screen and (max-width: 1800px) {
    /*.calculator-66 .calculator-contact-box .ccb-text-box {
    margin: 22px 5px 14px 200px;
}*/
  }

  @media screen and (max-width: 1400px) {
    .calculator-66 .calculator-contact-box .ccb-text-box {
      margin: auto;
      /*22px 5px 14px 170px;*/
    }
  }

  .calculator-6 .calculator-contact-box .ccb-text-box {
    margin: auto;
    /*22px 5px 14px 285px;*/
  }

  @media screen and (max-width: 1800px) {
    /*.calculator-6 .calculator-contact-box .ccb-text-box {
    margin: 22px 5px 14px 200px;
}*/
  }

  @media screen and (max-width: 1400px) {
    .calculator-6 .calculator-contact-box .ccb-text-box {
      margin: auto;
      /*22px 5px 14px 170px;*/
    }
  }

  .calculator-box.calculator-6 .select_accessories img.fenceAccessories {
    margin: 15px auto;

  }

  @media screen and (max-width: 1800px) {
    .ccb-list .ccb-list-box ul {
      padding: 60px 60px 0 60px;
    }
  }

  @media screen and (min-width: 1800px) {
    .ccb-list .ccb-list-box ul {
      padding: 15px 45px 0 45px;
    }

    .ccb-list-box ul li span {
      font-size: 20px;
    }

    .ccb-list-box ul li {
      height: 74px;
    }

    .profile_selection_step_wrap>.select_product {
      padding: 45px;
      float: left;
      min-height: 330px;
    }

    .select_accessories {
      min-height: 250px;
    }
  }

  .ccb-list .ccb-list-box ul {

    margin-top: 15px;
    margin-bottom: 15px;
  }

  @media screen and (max-width: 1400px) {
    /*.ccb-list .ccb-list-box ul {
    padding: 0px 0px 0 0px;
}*/
  }

  @media screen and (min-width: 1400px) {
    .calculator-6 .select_accessories {
      min-height: 298px;
    }

    .select_product {
      min-height: 268px
    }

    .calculator-66 .calculator-contact-box .ccb-text-box {
      margin: 0 auto;
    }
  }

  @media screen and (max-width: 1200px) {
    .ccb-list .ccb-list-box ul {
      padding: 48px 29px 0 29px;
    }

    .profile_selection_step_wrap .select_product {
      width: 50%;
      padding: 15px;
    }

    /*.calculator-6 .calculator-contact-box .ccb-text-box {
    margin: 22px 5px 14px 126px;
}*/
    /*.calculator-66 .calculator-contact-box .ccb-text-box {
    margin: 22px 5px 14px 126px;
}*/

  }

  .button-row #print_send {
    width: 43%;
    float: left;
    margin: 0px 1%;
    background: #FFF;
    border: none;
    padding: 15px 0;
    font-size: 16px;
    box-shadow: 0 6px 5px #dfdfdf;
  }

  .button-row #testdemo {
    width: 43%;
    float: left;
    margin: 20px 1%;
    background: #FFF;
    border: none;
    padding: 15px 0;
    font-size: 16px;
    box-shadow: 0 6px 5px #dfdfdf;
  }

  .button-row #button_hide_show {
    width: 43%;
    float: left;
    margin: 20px 1%;
    background: #FFF;
    border: none;
    padding: 15px 0;
    font-size: 16px;
    box-shadow: 0 6px 5px #dfdfdf;
  }

  .button-row #fuldskaerm {
    width: 31%;
    float: left;
    margin: 0px 1%;
    background: #FFF;
    border: none;
    padding: 15px 0;
    font-size: 16px;
    box-shadow: 0 6px 5px #dfdfdf;
  }

  .button-row #nulstil {
    width: 20%;
    float: left;
    margin: 0px 1%;
    background: #FFF;
    border: none;
    padding: 15px 0;
    font-size: 16px;
    box-shadow: 0 6px 5px #dfdfdf;
  }

  /*.back-button{
  padding: 6px 7px 6px 7px;
    background: #000;
    color: #fff;
}*/
  @media screen and (max-width: 900px) {
    .calculator-66 .calculator-contact-box .ccb-text-box {
      margin: 0 auto;
    }

    .ccb-list .ccb-list-box ul {
      padding: 48px 29px 0 29px;
    }

    .profile_selection_step_wrap {
      margin: 0 auto;
      float: unset;
      width: 100%;
    }

    .calculator-6 .calculator-contact-box .ccb-text-box {
      margin: 0 auto;
    }

    .calculator-6 .vaelg-tilbehor .vaelg-tilbehor-1 div {

      /*height: 325px !important;*/
    }
  }

  .calculator-box .col-4 h2 {
    display: none;
  }

  @media screen and (max-width: 900px) and (min-width: 768px) {
    .vaelg-tilbehor-1 {
      width: 100%;
      padding: 0 30px;
      float: left;
      margin: 50px 0;
      display: contents;
    }

    .select_product {
      float: left;
      min-height: 238px;
    }

    img.fenceAccessories {

      height: 62px;

    }
  }

  @media screen and (max-width: 480px) {
    .select_product {
      float: left;
      min-height: 262px;
    }
  }

  .calculator-4 .calculator-contact-box .col-8 .dimensioner-form .df-row {
    width: 75%;
  }

  .select_product {
    width: 33.33%;

    display: table;
  }

  .select_product img {
    /*margin: 40px auto;*/
    margin-bottom: 4px;
    /* mix-blend-mode: multiply; */
    mix-blend-mode: darken;
  }

  .select_accessories {
    width: 33.33%;
    float: left;
    display: table;
    margin-bottom: 50px;
  }

  .select_accessories img {
    margin: 40px auto;
    margin-bottom: 4px;
  }

  .profile_selection_step_wrap>.select_accessories {
    padding: 15px;
  }

  img.fenceAccessories {
    width: 150px;
    height: 120px;
    mix-blend-mode: darken;
  }

  .ccb-text-box .vaelg-tilbehor {
    /*margin-top: 70px;*/
  }

  label {
    font-weight: unset;
  }

  @media screen and (max-width: 768px) {
    img.fenceAccessories {

      height: 62px;

    }
  }

  @media screen and (max-width: 1200px) {
    img.fenceAccessories {

      height: 60px;


    }

    .df-row {
      width: 36%;

    }
  }

  @media screen and (max-width: 980px) {
    img.fenceAccessories {

      height: 60px;
      width: 70px;

    }

    .calculator-66 .calculator-contact-box .ccb-text-box {
      margin: 21px 5px 14px 61px;
    }

    .select_product {
      float: left;
      min-height: 271px;
    }
  }

  tbody#facade_stykke_table label {
    display: block;
    margin-bottom: 2px;
    font-size: 11px !important;
    color: #000;
  }

  table#Facade_div {
    width: 100% !important;
  }

  tbody#facade_stykke_table td {
    display: block;
  }

  @media screen and (max-width: 1400px) {

    table#Facade_div {
      width: 100% !important;
    }

    .calculator-box.calculator-3 .ccb-text-box img,
    .calculator-box.calculator-4 .ccb-text-box img,
    .calculator-box.calculator-5 .ccb-text-box img,
    .calculator-box.calculator-6 .ccb-text-box img {
      height: 100% !important;
    }
  }

  @media screen and (max-width: 768px) {
    .df-row {

      width: 100%;
    }

    .df-row .form-control {
      width: 60%;
    }
  }

  .calculator-box.calculator-7 ul.all-data-list-finel {
    padding: 0px 49px 0 49px;
  }

  @media screen and (max-width:768px) {
    .ccb-list .ccb-list-box ul {
      padding: 60px 0px 0 0px;
    }

    .modal-vo .df-row {
      width: 50%;
    }

    .calculator-66 .calculator-contact-box .ccb-text-box {
      margin: 21px 5px 14px 25px;
    }
  }
</style>
<link rel="stylesheet" href="https://fibrotech.it/wp-content/themes/kallyas-child/css/jquery-ui.css" />
<script src="https://fibrotech.it/wp-content/themes/kallyas-child/js/jquery-1.10.2.js"></script>
<script src="https://fibrotech.it/wp-content/themes/kallyas-child/js/jquery-ui.js"></script>
<script src="https://fibrotech.it/wp-content/themes/kallyas-child/js/jquery.form.js"></script>
<!--<link rel="stylesheet" href="/css/foundation.css"/>
<link rel="stylesheet" href="/css/wbs.css"/>-->
<div id="dialog" style="display: none;"></div>
<div id="map_div" style="height: 800px;display:none;">
  <input id="color" type="hidden" value="" />
  <input id="model" type="hidden" value="" />
  <input id="topmodel" type="hidden" value="" />
  <input id="post" type="hidden" value="" />
  <input id="led" type="hidden" value="" />
  <input id="skruer" type="hidden" value="" />
  <input id="postsize" type="hidden" value="" />
  <input id="endekap" type="hidden" value="" /> <!-- HIDDEN INPUT TYPE TOTAL-->
  <input type="hidden" id="fencetype" name="fencetype" value="" />
  <input type="hidden" id="msgarr" name="msgarr" value="" />
  <input id="fencetype1" name="fencetype1" type="hidden" value="" />
  <input id="clips_type" name="clips_type" type="hidden" value="" /> <!-- HIDDEN INPUT TYPE topprofile-->
  <input id="topprofiletype1" name="topprofiletype1" type="hidden" value="" /> <!-- HIDDEN INPUT TYPE postsize-->
  <input id="postsize1" name="postsize1" type="hidden" value="" /> <!-- HIDDEN INPUT TYPE endekaptype-->
  <input id="endekaptype1" name="endekaptype1" type="hidden" value="" />
  <div id="forms_table" style="display: none;"></div>
</div>
<div class="calculator-box calculator-1">
  <div class="calculator-contact-box">
    <div class="col-8">
      <div class="ccb-text">
        <div class="ccb-text-box">
          <h2>Vælg type</h2>



          <div class="vaelg-form">
            <ul>
              <li data_id="1" data-method="1"><img src="https://fibrotech.it/wp-content/themes/kallyas-child/image/firkant.png"
                  alt="" title="">
                <input class="hidFirst" type="hidden" value="Firkant">
              </li>
                          </ul>
          </div>
        </div>
      </div>
    </div>
    <div class="col-4">
      <div class="ccb-list">
        <div class="ccb-list-box">
          <h2>DIT VALG</h2>
          <ul>
            <li class="active-list"><span>1. Serie / Akustikpaneler</span>
              <!--<img src="https://kirkedalkomposit.dk/wp-content/uploads/2020/12/Web_DSC_4795.jpg" alt="" title="">-->
            </li>
            <li id="Volgform"><span class="sidebar_calc_box1">2. Vælg form</span> <img
                src="https://kirkedalkomposit.dk/wp-content/uploads/2020/12/Web_DSC_4795.jpg" alt="" title=""></li>
            <li><span>3. Gavl trekant</span> <img
                src="https://kirkedalkomposit.dk/wp-content/uploads/2020/12/Web_DSC_4795.jpg" alt="" title=""></li>
            <li><span>4. Loft/Væg</span> <img
                src="https://kirkedalkomposit.dk/wp-content/uploads/2020/12/Web_DSC_4795.jpg" alt="" title=""></li>
            <li><span>5. Vindues- / dørhuller (- areal)</span> <img
                src="https://kirkedalkomposit.dk/wp-content/uploads/2020/12/Web_DSC_4795.jpg" alt="" title=""></li>
            <li><span>6. Vælg produkt</span> <img
                src="https://kirkedalkomposit.dk/wp-content/uploads/2020/12/Web_DSC_4795.jpg" alt="" title=""></li>
            <li><span>7. Farve</span> <img src="https://kirkedalkomposit.dk/wp-content/uploads/2020/12/Web_DSC_4795.jpg"
                alt="" title=""></li>
            <li><span>8. Tilbehør</span>
              <!--<img src="https://kirkedalkomposit.dk/wp-content/uploads/2020/12/Web_DSC_4795.jpg" alt="" title="">-->
            </li>
          </ul>
        </div>
      </div>
    </div>
  </div>
</div>
<div class="calculator-box calculator-2" id='accordion' style="display:none">
  <div class="calculator-contact-box">
    <div class="col-8">
      <div class="ccb-text">
        <div class="ccb-text-box">
          <h2>Gavl trekant</h2>
          <!--  <a href="javascript:void(0)" class="back-button" id="back_id_type2" style="display: none;">Tilbage</a>-->
          <div class="indsaet-dimensioner">
            <div class="id-box-50 indsaet-dimensioner_image_wrap"> <img
                src="https://kirkedalkomposit.dk/wp-content/images/form3.jpg" alt="" title=""> </div>
            <div class="id-box-50 indsaet-dimensioner_input_wrap">
              <div class="dimensioner-form">
                <div class="df-row">
                  <table style="width: 100%;" id="Gavl_div">
                    <thead>
                      <tr>
                        <th style="width:30%;">Gavl trekant</th>
                        <th style="width:35%;">Længde</th>
                        <th style="width:35%;">Højde</th>

                      </tr>
                    </thead>
                    <tbody style="width:100%" id="gavl_trekant_table">
                      <tr id="Gavl1">
                        <td>Gavl 1a</td>
                        <td>
                          <div class="w-100">
                            <input type="number" class="form-control" min="0" name="Gavl1AL" id="Gavl1AL">
                            <span>mtr</span>
                          </div>
                        </td>
                        <td>
                          <div class="w-100">
                            <input type="number" class="form-control" min="0" name="Gavl1AW" id="Gavl1AW">
                            <span>mtr</span>
                          </div>
                        </td>
                      </tr>
                    </tbody>
                    <tr>
                      <td colspan="4">
                        <input type="button" onclick="addGavl()" class="addbtn" value="Tilføj Gavl"
                          style="display:none;" />
                        &nbsp;
                        <input type="button" onclick="removeGavl()" class="addbtn" style="display:none;"
                          value="Fjern Gavl" id="removeGavlBtn" />
                      </td>
                    </tr>
                  </table>
                </div>


              </div>
            </div>
          </div>
          <ul style="    max-width: 300px;    margin: auto;    display: table;    margin-top: 37px;">
            <li style="float: left; margin-right: 20px;"><a href="javascript:void(0)" class="button btn back-button"
                id="back_id_type" style="    float: left;    background: #fff;    border: 1px solid #e1e1e1 !important;    padding: 8px 11px 11px 10px;    width: 120px;    border-radius: 0px;    font-weight: 700;">Tilbage</a></li>
            <li style="float: left; margin-right: 20px;"><a href="javascript:void(0)" class="button btn btn_nexttrigger"
                style="    float: left;    background: #fff;    border: 1px solid #e1e1e1 !important;    padding: 8px 11px 11px 10px;    width: 120px;    border-radius: 0px;    font-weight: 700;">Næste</a></li>
          </ul>
          <!--<a href="javascript:void(0)" class="button btn btn_nexttrigger" style="    float: right;background: #fff;border: 1px solid #000 !important;padding: 8px 11px 11px 10px;width: 15%;    border-radius: 0px;font-weight: 700;">Næste</a>-->
        </div>
      </div>
    </div>
    <div class="col-4">
      <div class="ccb-list">
        <div class="ccb-list-box">
          <h2>DIT VALG</h2>

          <ul>
            <li class="active-list"><span>1. Serie / Akustikpaneler</span>
              <!--<img src="https://kirkedalkomposit.dk/wp-content/uploads/2020/12/Web_DSC_4795.jpg" alt="" title="">-->
            </li>
            <li class="active-list sidebar_calc_box1"><span>2. Vælg form</span> <img
                src="https://kirkedalkomposit.dk/wp-content/images/form3.jpg" alt="" title=""></li>
            <li><span>3. Gavl trekant</span>
              <!--<img src="https://kirkedalkomposit.dk/wp-content/uploads/2020/12/Web_DSC_4795.jpg" alt="" title="">-->
            </li>
            <li><span>4. Loft/Væg</span> <img
                src="https://kirkedalkomposit.dk/wp-content/uploads/2020/12/Web_DSC_4795.jpg" alt="" title=""></li>
            <li><span>5. Vindues- / dørhuller (- areal)</span> <img
                src="https://kirkedalkomposit.dk/wp-content/uploads/2020/12/Web_DSC_4795.jpg" alt="" title=""></li>
            <li><span>6. Vælg produkt</span> <img
                src="https://kirkedalkomposit.dk/wp-content/uploads/2020/12/Web_DSC_4795.jpg" alt="" title=""></li>
            <li><span>7. Farve</span> <img src="https://kirkedalkomposit.dk/wp-content/uploads/2020/12/Web_DSC_4795.jpg"
                alt="" title=""></li>
            <li><span>8.
                Tilbehør</span><!-- <img src="https://kirkedalkomposit.dk/wp-content/uploads/2020/12/Web_DSC_4795.jpg" alt="" title="">-->
            </li>
          </ul>
        </div>
      </div>
    </div>
  </div>
  <button class="button btn btn_next" style="display: none;">Next</button>
</div>
<div class="calculator-box calculator-3" style="display:none">
  <div class="calculator-contact-box">
    <div class="col-8">
      <div class="ccb-text">
        <div class="ccb-text-box">
          <h2>Loft/Væg</h2>

          <div class="indsaet-dimensioner">
            <div class="id-box-50 indsaet-dimensioner_image_wrap"> <img
                src="https://kirkedalkomposit.dk/wp-content/images/form3.jpg" alt="" title=""> </div>
            <div class="id-box-50 indsaet-dimensioner_input_wrap">
              <div class="dimensioner-form">
                <div class="df-row">
                  <table style="width: 100%;" id="Facade_div">
                    <thead>

                    </thead>
                    <tbody style="width:100%" id="facade_stykke_table">
                      <tr id="Facade1">
                        <!--<td >Areal A</td>-->
                        <td>

                          <div class="w-100">
                            <label style="font-size: 12px;">Længde</label>
                            <input type="number" class="form-control" name="Gavl1AL" min="0" id="FacadeAL">
                            <span>mtr</span>
                          </div>
                        </td>
                        <td>

                          <div class="w-100">
                            <label style="font-size: 12px;">Højde</label>

                            <input type="number" class="form-control" name="Gavl1AW" min="0" id="FacadeAW">
                            <span>mtr</span>
                          </div>
                        </td>

                      </tr>

                    </tbody>
                    <tr>
                      <td colspan="4">
                        <input type="button" onclick="addFacade()" class="addbtn" value="Tilføj Areal"
                          style="display:none;" />
                        &nbsp;
                        <input type="button" onclick="removeFacade()" class="addbtn" style="display:none;"
                          value="Fjern Areal" id="removeFacadeBtn" />
                      </td>
                    </tr>
                  </table>

                </div>


              </div>
            </div>
          </div>
          <div class="btn-center" style="    float: left;    width: 100%;">
            <ul style="    max-width: 300px;    margin: auto;    display: table;    margin-top: 37px;">
              <li style="float: left; margin-right: 20px;">
                <a href="javascript:void(0)" class="button btn back-button" id="back_id_type3" style="    float: left;    background: #fff;    border: 1px solid #e1e1e1 !important;    padding: 8px 11px 11px 10px;    width: 120px;    border-radius: 0px;    font-weight: 700;">Tilbage</a>
              </li>
              <li style="float: left;">
                <a href="javascript:void(0)" class="button btn nextBtn_form nextBtn_form2" style="    float: left;    background: #fff;    border: 1px solid #e1e1e1 !important;    padding: 8px 11px 11px 10px;    width: 120px;    border-radius: 0px;    font-weight: 700;">Næste</a>
              </li>
            </ul>
          </div>

        </div>
      </div>
    </div>

    <div class="col-4">
      <div class="ccb-list">
        <div class="ccb-list-box">
          <h2>DIT VALG</h2>
          <ul>
            <li class="active-list"><span>1. Serie / Akustikpaneler</span>
              <!--<img src="https://kirkedalkomposit.dk/wp-content/uploads/2020/12/Web_DSC_4795.jpg" alt="" title="">-->
            </li>
            <li class="active-list sidebar_calc_box1"><span>2. Vælg form</span> <img
                src="https://kirkedalkomposit.dk/wp-content/images/form3.jpg" alt="" title=""></li>
            <li class="active-list sidebar_calc_box2"><span>3. Gavl trekant</span>
              <!--<img src="https://kirkedalkomposit.dk/wp-content/uploads/2020/12/Web_DSC_4795.jpg" alt="" title="">-->
            </li>
            <li><span>4. Loft/Væg</span> <img
                src="https://kirkedalkomposit.dk/wp-content/uploads/2020/12/Web_DSC_4795.jpg" alt="" title=""></li>
            <li><span>5. Vindues- / dørhuller (- areal)</span> <img
                src="https://kirkedalkomposit.dk/wp-content/uploads/2020/12/Web_DSC_4795.jpg" alt="" title=""></li>
            <li><span>6. Vælg produkt</span> <img
                src="https://kirkedalkomposit.dk/wp-content/uploads/2020/12/Web_DSC_4795.jpg" alt="" title=""></li>
            <li><span>7. Farve</span> <img src="https://kirkedalkomposit.dk/wp-content/uploads/2020/12/Web_DSC_4795.jpg"
                alt="" title=""></li>
            <li><span>8. Tilbehør</span>
              <!--<img src="https://kirkedalkomposit.dk/wp-content/uploads/2020/12/Web_DSC_4795.jpg" alt="" title="">-->
            </li>
          </ul>
        </div>
      </div>
    </div>
  </div>
  </div>
<div class="calculator-box calculator-4" style="display:none">
  <div class="calculator-contact-box">
    <div class="col-8">
      <div class="ccb-text">
        <div class="ccb-text-box">
          <h2>Vindues- / dørhuller (- areal)</h2>
          <!-- <a href="javascript:void(0)" class="back-button" id="back_id_type4" style="display: none;">Tilbage</a>-->
          <div class="dimensioner-form">
            <div class="df-row">
              <table style="width: 100%;" id="Vindues_div">
                <thead>
                  <tr>
                    <th width="100"></th>
                    <th width="150">Antal</th>
                    <th width="150">Bredde</th>
                    <th width="150">Højde</th>

                  </tr>
                </thead>
                <tbody style="width:100%" id="vindues_table">
                  <tr id="Type1">
                    <td width="100">Type 1</td>
                    <td width="150">
                      <div class="w-100">
                        <input type="number" class="form-control" min="0" name="vdT1S" id="vdT1S">
                        <span>m</span>
                      </div>
                    </td>
                    <td width="150">
                      <div class="w-100">
                        <input type="number" class="form-control" min="0" name="vdT1L" id="vdT1L">
                        <span>m</span>
                      </div>
                    </td>
                    <td width="150">
                      <div class="w-100">
                        <input type="number" class="form-control" min="0" name="vdT1H" id="vdT1H">
                        <span>m</span>
                      </div>
                    </td>
                  </tr>
                </tbody>
                <tr class="tfoot">
                  <td colspan="4">
                    <input type="button" onclick="addVindue()" class="addbtn" value="Tilføj Type" />
                    &nbsp;
                    <input type="button" onclick="removeVindue()" class="addbtn" style="display:none;"
                      value="Fjern Type" id="removeVindueBtn" />
                    <input class="ingen_vindues" style="background-color: #f45f45; color: #fffdfd; border-radius: 2px;    padding: 7px;    border: none;" type="button" value="Ingen minus areal">
                  </td>

                </tr>
              </table>

            </div>


          </div>
          <div class="btn-center" style="    float: left;    width: 100%;">
            <ul style="    max-width: 300px;    margin: auto;    display: table;    margin-top: 37px;">
              <li style="float: left; margin-right: 20px;">
                <a href="javascript:void(0)" class="button btn btn_tilbage_pre" id="back_id_type4" style="    float: left;    background: #fff;    border: 1px solid #e1e1e1 !important;    padding: 8px 11px 11px 10px;    width: 120px;    border-radius: 0px;    font-weight: 700;">Tilbage</a>
              </li>
              <li style="float: left;">
                <a href="javascript:void(0)" class="button btn nextBtn_formvindues" style="    float: left;    background: #fff;    border: 1px solid #e1e1e1 !important;    padding: 8px 11px 11px 10px;    width: 120px;    border-radius: 0px;    font-weight: 700;">Næste</a>
              </li>
            </ul>
          </div>


          <!--<div class="vaelg-profil">
            <div class="id-box-50 product_item"> <img class="fencePostsize wqs_size1" color_val="alu" src="https://kirkedalkomposit.dk/wp-content/uploads/2021/07/vaelg-stolpestorrelse1.jpg" alt="" title=""> 
              <input class="hidPostsize1" type="hidden" value="80x80mm"  />
            </div>
            <div class="id-box-50 product_item"> <img class="fencePostsize wqs_size1" color_val="black"src="https://kirkedalkomposit.dk/wp-content/uploads/2021/07/vaelg-stolpestorrelse2.jpg" alt="" title=""> 
              <input class="hidPostsize1" type="hidden" value="80x80mm" />
            </div>
          </div>-->
        </div>
      </div>
    </div>
    <div class="col-4">
      <div class="ccb-list">
        <div class="ccb-list-box">
          <h2>DIT VALG</h2>
          <ul>
            <li class="active-list"><span>1. Serie / Akustikpaneler</span>
              <!--<img src="https://kirkedalkomposit.dk/wp-content/uploads/2020/12/Web_DSC_4795.jpg" alt="" title="">-->
            </li>
            <li class="active-list sidebar_calc_box1"><span>2. Vælg form</span> <img
                src="https://kirkedalkomposit.dk/wp-content/images/form3.jpg" alt="" title=""></li>
            <li class="active-list sidebar_calc_box2"><span>3. Gavl trekant</span>
              <!--<img src="https://kirkedalkomposit.dk/wp-content/uploads/2020/12/Web_DSC_4795.jpg" alt="" title="">-->
            </li>
            <li class="active-list sidebar_calc_box3"><span>4. Loft/Væg</span> <b class="dimention" style="  ">A:5X6 B:
                5X4 A:5X6 B: 5X4 A:5X6 B: 5X4</b></li>
            <li><span>5. Vindues- / dørhuller (- areal)</span> <img
                src="https://kirkedalkomposit.dk/wp-content/uploads/2020/12/Web_DSC_4795.jpg" alt="" title=""></li>
            <li><span>6. Vælg produkt</span> <img
                src="https://kirkedalkomposit.dk/wp-content/uploads/2020/12/Web_DSC_4795.jpg" alt="" title=""></li>
            <li><span>7. Farve</span> <img src="https://kirkedalkomposit.dk/wp-content/uploads/2020/12/Web_DSC_4795.jpg"
                alt="" title=""></li>
            <li><span>8. Tilbehør</span>
              <!--<img src="https://kirkedalkomposit.dk/wp-content/uploads/2020/12/Web_DSC_4795.jpg" alt="" title="">-->
            </li>
          </ul>
        </div>
      </div>
    </div>
  </div>
</div>
<div class="calculator-box calculator-5" style="display:none">
  <div class="calculator-contact-box">
    <div class="col-8">
      <div class="ccb-text">
        <div class="ccb-text-box">
          <h2>Vælg produkt</h2>
          <!--  <a href="javascript:void(0)" class="back-button" id="back_id_type5" style="display: none;">Tilbage</a>-->
          <div class="vaelg-profil col-md-12 profile_selection_step_wrap">
            <style type="text/css">
              .select_product:hover {
                /*border: 2px solid rgb(129, 126, 126);*/
              }
            </style>
                          <div style="" class="select_product select_product_1824"
                data-product_id="1824" data-product_price="101.95">
                <img class="topFence" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2021/06/600x600-pixel-BASIC-PROFF-FRONT-PICTURE-all-panels-1.jpg" alt="" />                <input class="hidTop" type="hidden" value="Retning3" />
                <p>
                  BASIC akustikpanel 22 x 605 x 2440 mm                </p>
              </div>
                            <div style="" class="select_product select_product_1532"
                data-product_id="1532" data-product_price="101.95">
                <img class="topFence" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2021/02/600x600-pixel-UNIKA-35-FRONT-PICTURE-one-panel.jpg" alt="" />                <input class="hidTop" type="hidden" value="Retning3" />
                <p>
                  UNIKA35 Akustikpanel 2440 mm                </p>
              </div>
                            <div style="" class="select_product select_product_1520"
                data-product_id="1520" data-product_price="101.95">
                <img class="topFence" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2021/02/600x600-pixel-UNIKA-25-FRONT-PICTURE-all-panels.jpg" alt="" />                <input class="hidTop" type="hidden" value="Retning3" />
                <p>
                  UNIKA25 Akustikpanel 2440 mm                </p>
              </div>
                            <div style="" class="select_product select_product_1325"
                data-product_id="1325" data-product_price="133.95">
                <img class="topFence" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2021/01/600x600-pixel-BASIC-PROFF-FRONT-PICTURE-all-panels-3.jpg" alt="" />                <input class="hidTop" type="hidden" value="Retning3" />
                <p>
                  PROFF Basic Akustik Panel 3000 mm                </p>
              </div>
                            <div style="" class="select_product select_product_937"
                data-product_id="937" data-product_price="133.95">
                <img class="topFence" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2020/12/PROFF-Signatur-udsnit-Light-Oak-1.jpg" alt="" />                <input class="hidTop" type="hidden" value="Retning3" />
                <p>
                  PROFF Signatur Akustik Panel Light Oak                </p>
              </div>
                            <div style="" class="select_product select_product_3347"
                data-product_id="3347" data-product_price="67.95">
                <img class="topFence" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2024/08/Treetops13912-scaled.jpg" alt="" />                <input class="hidTop" type="hidden" value="Retning3" />
                <p>
                  FibroTech FireGuard Polyester White                </p>
              </div>
                            <div style="" class="select_product select_product_3058"
                data-product_id="3058" data-product_price="74.95">
                <img class="topFence" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2023/07/QUANTI-Oiled-Oak-udsnit-low-res.jpg" alt="" />                <input class="hidTop" type="hidden" value="Retning3" />
                <p>
                  Quanti Pannello Acustico 18x520x2440mm                </p>
              </div>
                            <div style="" class="select_product select_product_2900"
                data-product_id="2900" data-product_price="40.95">
                <img class="topFence" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2023/01/Hvid-sofa-med-52x52-cm-paneler-ASH-Printfile.jpg" alt="" />                <input class="hidTop" type="hidden" value="Retning3" />
                <p>
                  Square Pannello Acustico 520x520 mm                </p>
              </div>
                        </div>
        </div>
      </div>
    </div>
    <div class="col-4">
      <div class="ccb-list">
        <div class="ccb-list-box">
          <h2>DIT VALG</h2>
          <ul>
            <li class="active-list"><span>1. Serie / Akustikpaneler</span>
              <!--<img src="https://kirkedalkomposit.dk/wp-content/uploads/2020/12/Web_DSC_4795.jpg" alt="" title="">-->
            </li>
            <li class="active-list sidebar_calc_box1"><span>2. Vælg form</span> <img
                src="https://kirkedalkomposit.dk/wp-content/images/form3.jpg" alt="" title=""></li>
            <li class="active-list sidebar_calc_box2"><span>3. Gavl
                trekant</span><!-- <img src="https://kirkedalkomposit.dk/wp-content/uploads/2020/12/Web_DSC_4795.jpg" alt="" title="">-->
            </li>
            <li class="active-list sidebar_calc_box3"><span>4. Loft/Væg</span> <b class="dimention" style="  ">A:5X6 B:
                5X4 A:5X6 B: 5X4 A:5X6 B: 5X4</b></li>
            <li class="active-list sidebar_calc_box4"><span>5.Vindues- / dørhuller (- areal)</span> <b
                class="dimention1" style="  ">A:5X6 B: 5X4 A:5X6 B: 5X4 A:5X6 B: 5X4</b></li>
            <li><span>6. Vælg produkt</span> <img
                src="https://kirkedalkomposit.dk/wp-content/uploads/2020/12/Web_DSC_4795.jpg" alt="" title=""></li>
            <li><span>7. Farve</span> <img src="https://kirkedalkomposit.dk/wp-content/uploads/2020/12/Web_DSC_4795.jpg"
                alt="" title=""></li>
            <li><span>8.
                Tilbehør</span><!-- <img src="https://kirkedalkomposit.dk/wp-content/uploads/2020/12/Web_DSC_4795.jpg" alt="" title="">-->
            </li>
          </ul>
        </div>
      </div>
    </div>
  </div>
</div>
<div class="calculator-box calculator-66" style="display:none">
  <div class="calculator-contact-box">
    <div class="col-8">
      <div class="ccb-text">
        <div class="ccb-text-box">
          <h2>farve</h2>
          <!--<a href="javascript:void(0)" class="back-button" id="back_id_type6" style="display: none;">Tilbage</a>-->
          <input type="hidden" name="variation_idd">
          <div class="vaelg-tilbehor col-md-12 farve profile_selection_step_wrap">
            
                    <div style="" class="select_accessories" data-selected="0" attribut_id='67'
                      data-tilbehor_product_id="1824"
                      data-tilbehor_product_price="">
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2023/07/500-x-500-pixel-ASH-BasicProff.jpg" alt="" />
                      <p style="text-align: center;">Ash</p>
                      <input class="hidAccessories" type="hidden" value="acc1" />
                                            <input class="hid_color" type="hidden" value="Ash" />

                    </div>

                    
                    <div style="" class="select_accessories" data-selected="0" attribut_id='73'
                      data-tilbehor_product_id="1824"
                      data-tilbehor_product_price="">
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2023/07/500-x-500-pixel-BLACK-OAK-BasicProff.jpg" alt="" />
                      <p style="text-align: center;">Black Oak</p>
                      <input class="hidAccessories" type="hidden" value="acc1" />
                                            <input class="hid_color" type="hidden" value="Black_Oak" />

                    </div>

                    
                    <div style="" class="select_accessories" data-selected="0" attribut_id='68'
                      data-tilbehor_product_id="1824"
                      data-tilbehor_product_price="">
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2023/07/500-x-500-pixel-GREY-OAK-BasicProff.jpg" alt="" />
                      <p style="text-align: center;">Grey Oak</p>
                      <input class="hidAccessories" type="hidden" value="acc1" />
                                            <input class="hid_color" type="hidden" value="Grey_Oak" />

                    </div>

                    
                    <div style="" class="select_accessories" data-selected="0" attribut_id='69'
                      data-tilbehor_product_id="1824"
                      data-tilbehor_product_price="">
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2023/07/500-x-500-pixel-LIGHT-OAK-BasicProff.jpg" alt="" />
                      <p style="text-align: center;">Light Oak</p>
                      <input class="hidAccessories" type="hidden" value="acc1" />
                                            <input class="hid_color" type="hidden" value="Light_Oak" />

                    </div>

                    
                    <div style="" class="select_accessories" data-selected="0" attribut_id='70'
                      data-tilbehor_product_id="1824"
                      data-tilbehor_product_price="">
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2023/07/500-x-500-pixel-OILED-OAK-BasicProff.jpg" alt="" />
                      <p style="text-align: center;">Olied Oak</p>
                      <input class="hidAccessories" type="hidden" value="acc1" />
                                            <input class="hid_color" type="hidden" value="Olied_Oak" />

                    </div>

                    
                    <div style="" class="select_accessories" data-selected="0" attribut_id='71'
                      data-tilbehor_product_id="1824"
                      data-tilbehor_product_price="">
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2023/07/500-x-500-pixel-SMOKED-OAK-BasicProff.jpg" alt="" />
                      <p style="text-align: center;">Smoked Oak</p>
                      <input class="hidAccessories" type="hidden" value="acc1" />
                                            <input class="hid_color" type="hidden" value="Smoked_Oak" />

                    </div>

                    
                    <div style="" class="select_accessories" data-selected="0" attribut_id='72'
                      data-tilbehor_product_id="1824"
                      data-tilbehor_product_price="">
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2023/07/500-x-500-pixel-WALNUT-BasicProff.jpg" alt="" />
                      <p style="text-align: center;">Walnut</p>
                      <input class="hidAccessories" type="hidden" value="acc1" />
                                            <input class="hid_color" type="hidden" value="Walnut" />

                    </div>

                    
                    <div style="" class="select_accessories" data-selected="0" attribut_id='75'
                      data-tilbehor_product_id="1532"
                      data-tilbehor_product_price="">
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2021/11/Black_oak_2.jpg" alt="" />
                      <p style="text-align: center;">Black Oak</p>
                      <input class="hidAccessories" type="hidden" value="acc1" />
                                            <input class="hid_color" type="hidden" value="Black_Oak" />

                    </div>

                    
                    <div style="" class="select_accessories" data-selected="0" attribut_id='76'
                      data-tilbehor_product_id="1532"
                      data-tilbehor_product_price="">
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2021/11/25mm_unika_grey_2.jpg" alt="" />
                      <p style="text-align: center;">Grey</p>
                      <input class="hidAccessories" type="hidden" value="acc1" />
                                            <input class="hid_color" type="hidden" value="Grey" />

                    </div>

                    
                    <div style="" class="select_accessories" data-selected="0" attribut_id='77'
                      data-tilbehor_product_id="1532"
                      data-tilbehor_product_price="">
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2021/11/UnikaLightoak25_2.jpg" alt="" />
                      <p style="text-align: center;">Light Oak</p>
                      <input class="hidAccessories" type="hidden" value="acc1" />
                                            <input class="hid_color" type="hidden" value="Light_Oak" />

                    </div>

                    
                    <div style="" class="select_accessories" data-selected="0" attribut_id='78'
                      data-tilbehor_product_id="1532"
                      data-tilbehor_product_price="">
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2021/11/Closeup-Oiled-Oak-25-mm-UNIKA.jpg" alt="" />
                      <p style="text-align: center;">Oiled Oak</p>
                      <input class="hidAccessories" type="hidden" value="acc1" />
                                            <input class="hid_color" type="hidden" value="Oiled_Oak" />

                    </div>

                    
                    <div style="" class="select_accessories" data-selected="0" attribut_id='79'
                      data-tilbehor_product_id="1532"
                      data-tilbehor_product_price="">
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2021/11/Closeup-UNIKA-25-mm-Smoked-Oak.jpg" alt="" />
                      <p style="text-align: center;">Smoked Oak</p>
                      <input class="hidAccessories" type="hidden" value="acc1" />
                                            <input class="hid_color" type="hidden" value="Smoked_Oak" />

                    </div>

                    
                    <div style="" class="select_accessories" data-selected="0" attribut_id='80'
                      data-tilbehor_product_id="1532"
                      data-tilbehor_product_price="">
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2021/11/25-mm-Walnut.jpg" alt="" />
                      <p style="text-align: center;">Walnut</p>
                      <input class="hidAccessories" type="hidden" value="acc1" />
                                            <input class="hid_color" type="hidden" value="Walnut" />

                    </div>

                    
                    <div style="" class="select_accessories" data-selected="0" attribut_id='91'
                      data-tilbehor_product_id="1532"
                      data-tilbehor_product_price="">
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2021/11/UnikaLightoak35_2.jpg" alt="" />
                      <p style="text-align: center;">Light Oak</p>
                      <input class="hidAccessories" type="hidden" value="acc1" />
                                            <input class="hid_color" type="hidden" value="Light_Oak" />

                    </div>

                    
                    <div style="" class="select_accessories" data-selected="0" attribut_id='59'
                      data-tilbehor_product_id="1520"
                      data-tilbehor_product_price="">
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2022/11/500-x-500-pixel-BLACK-OAK-UNIKA.jpg" alt="" />
                      <p style="text-align: center;">Black Oak</p>
                      <input class="hidAccessories" type="hidden" value="acc1" />
                                            <input class="hid_color" type="hidden" value="Black_Oak" />

                    </div>

                    
                    <div style="" class="select_accessories" data-selected="0" attribut_id='60'
                      data-tilbehor_product_id="1520"
                      data-tilbehor_product_price="">
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2022/11/500-x-500-pixel-GREY-OAK-UNIKA.jpg" alt="" />
                      <p style="text-align: center;">Grey Oak</p>
                      <input class="hidAccessories" type="hidden" value="acc1" />
                                            <input class="hid_color" type="hidden" value="Grey_Oak" />

                    </div>

                    
                    <div style="" class="select_accessories" data-selected="0" attribut_id='61'
                      data-tilbehor_product_id="1520"
                      data-tilbehor_product_price="">
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2022/11/500-x-500-pixel-LIGHT-OAK-UNIKA.jpg" alt="" />
                      <p style="text-align: center;">Light Oak</p>
                      <input class="hidAccessories" type="hidden" value="acc1" />
                                            <input class="hid_color" type="hidden" value="Light_Oak" />

                    </div>

                    
                    <div style="" class="select_accessories" data-selected="0" attribut_id='62'
                      data-tilbehor_product_id="1520"
                      data-tilbehor_product_price="">
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2022/11/500-x-500-pixel-OILED-OAK-UNIKA.jpg" alt="" />
                      <p style="text-align: center;">Oiled Oak</p>
                      <input class="hidAccessories" type="hidden" value="acc1" />
                                            <input class="hid_color" type="hidden" value="Oiled_Oak" />

                    </div>

                    
                    <div style="" class="select_accessories" data-selected="0" attribut_id='63'
                      data-tilbehor_product_id="1520"
                      data-tilbehor_product_price="">
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2022/11/500-x-500-pixel-SMOKED-OAK-UNIKA.jpg" alt="" />
                      <p style="text-align: center;">Smoked Oak</p>
                      <input class="hidAccessories" type="hidden" value="acc1" />
                                            <input class="hid_color" type="hidden" value="Smoked_Oak" />

                    </div>

                    
                    <div style="" class="select_accessories" data-selected="0" attribut_id='64'
                      data-tilbehor_product_id="1520"
                      data-tilbehor_product_price="">
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2022/11/500-x-500-pixel-WALNUT-UNIKA.jpg" alt="" />
                      <p style="text-align: center;">Walnut</p>
                      <input class="hidAccessories" type="hidden" value="acc1" />
                                            <input class="hid_color" type="hidden" value="Walnut" />

                    </div>

                    
                    <div style="" class="select_accessories" data-selected="0" attribut_id='116'
                      data-tilbehor_product_id="1520"
                      data-tilbehor_product_price="">
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2022/11/500-x-500-pixel-WHITE-UNIKA.jpg" alt="" />
                      <p style="text-align: center;">White Platinum</p>
                      <input class="hidAccessories" type="hidden" value="acc1" />
                                            <input class="hid_color" type="hidden" value="White_Platinum" />

                    </div>

                    
                    <div style="" class="select_accessories" data-selected="0" attribut_id='46'
                      data-tilbehor_product_id="1325"
                      data-tilbehor_product_price="">
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2021/01/FOTO-KOMMER-SNART-5.jpg" alt="" />
                      <p style="text-align: center;">Ash</p>
                      <input class="hidAccessories" type="hidden" value="acc1" />
                                            <input class="hid_color" type="hidden" value="Ash" />

                    </div>

                    
                    <div style="" class="select_accessories" data-selected="0" attribut_id='45'
                      data-tilbehor_product_id="1325"
                      data-tilbehor_product_price="">
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2020/12/PROFF-Signatur-close-up-Light-Oak2-2.jpg" alt="" />
                      <p style="text-align: center;">Light Oak</p>
                      <input class="hidAccessories" type="hidden" value="acc1" />
                                            <input class="hid_color" type="hidden" value="Light_Oak" />

                    </div>

                    
                    <div style="" class="select_accessories" data-selected="0" attribut_id='51'
                      data-tilbehor_product_id="1325"
                      data-tilbehor_product_price="">
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2021/01/FOTO-KOMMER-SNART-5.jpg" alt="" />
                      <p style="text-align: center;">Black Oak</p>
                      <input class="hidAccessories" type="hidden" value="acc1" />
                                            <input class="hid_color" type="hidden" value="Black_Oak" />

                    </div>

                    
                    <div style="" class="select_accessories" data-selected="0" attribut_id='47'
                      data-tilbehor_product_id="1325"
                      data-tilbehor_product_price="">
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2021/01/FOTO-KOMMER-SNART-5.jpg" alt="" />
                      <p style="text-align: center;">Grey Oak</p>
                      <input class="hidAccessories" type="hidden" value="acc1" />
                                            <input class="hid_color" type="hidden" value="Grey_Oak" />

                    </div>

                    
                    <div style="" class="select_accessories" data-selected="0" attribut_id='48'
                      data-tilbehor_product_id="1325"
                      data-tilbehor_product_price="">
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2021/01/FOTO-KOMMER-SNART-5.jpg" alt="" />
                      <p style="text-align: center;">Oiled Oak</p>
                      <input class="hidAccessories" type="hidden" value="acc1" />
                                            <input class="hid_color" type="hidden" value="Oiled_Oak" />

                    </div>

                    
                    <div style="" class="select_accessories" data-selected="0" attribut_id='49'
                      data-tilbehor_product_id="1325"
                      data-tilbehor_product_price="">
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2021/01/FOTO-KOMMER-SNART-5.jpg" alt="" />
                      <p style="text-align: center;">Smoked Oak</p>
                      <input class="hidAccessories" type="hidden" value="acc1" />
                                            <input class="hid_color" type="hidden" value="Smoked_Oak" />

                    </div>

                    
                    <div style="" class="select_accessories" data-selected="0" attribut_id='50'
                      data-tilbehor_product_id="1325"
                      data-tilbehor_product_price="">
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2021/01/FOTO-KOMMER-SNART-5.jpg" alt="" />
                      <p style="text-align: center;">Walnut</p>
                      <input class="hidAccessories" type="hidden" value="acc1" />
                                            <input class="hid_color" type="hidden" value="Walnut" />

                    </div>

                    
                    <div style="" class="select_accessories" data-selected="0" attribut_id='150'
                      data-tilbehor_product_id="1325"
                      data-tilbehor_product_price="">
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2023/07/500-x-500-pixel-ASH-BasicProff-1.jpg" alt="" />
                      <p style="text-align: center;">Ash</p>
                      <input class="hidAccessories" type="hidden" value="acc1" />
                                            <input class="hid_color" type="hidden" value="Ash" />

                    </div>

                    
                    <div style="" class="select_accessories" data-selected="0" attribut_id='151'
                      data-tilbehor_product_id="1325"
                      data-tilbehor_product_price="">
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2023/07/500-x-500-pixel-BLACK-OAK-BasicProff-1.jpg" alt="" />
                      <p style="text-align: center;">Black Oak</p>
                      <input class="hidAccessories" type="hidden" value="acc1" />
                                            <input class="hid_color" type="hidden" value="Black_Oak" />

                    </div>

                    
                    <div style="" class="select_accessories" data-selected="0" attribut_id='152'
                      data-tilbehor_product_id="1325"
                      data-tilbehor_product_price="">
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2023/07/500-x-500-pixel-GREY-OAK-BasicProff-1.jpg" alt="" />
                      <p style="text-align: center;">Grey Oak</p>
                      <input class="hidAccessories" type="hidden" value="acc1" />
                                            <input class="hid_color" type="hidden" value="Grey_Oak" />

                    </div>

                    
                    <div style="" class="select_accessories" data-selected="0" attribut_id='153'
                      data-tilbehor_product_id="1325"
                      data-tilbehor_product_price="">
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2023/07/500-x-500-pixel-LIGHT-OAK-BasicProff-1.jpg" alt="" />
                      <p style="text-align: center;">Light Oak</p>
                      <input class="hidAccessories" type="hidden" value="acc1" />
                                            <input class="hid_color" type="hidden" value="Light_Oak" />

                    </div>

                    
                    <div style="" class="select_accessories" data-selected="0" attribut_id='154'
                      data-tilbehor_product_id="1325"
                      data-tilbehor_product_price="">
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2023/07/500-x-500-pixel-OILED-OAK-BasicProff-1.jpg" alt="" />
                      <p style="text-align: center;">Olied Oak</p>
                      <input class="hidAccessories" type="hidden" value="acc1" />
                                            <input class="hid_color" type="hidden" value="Olied_Oak" />

                    </div>

                    
                    <div style="" class="select_accessories" data-selected="0" attribut_id='155'
                      data-tilbehor_product_id="1325"
                      data-tilbehor_product_price="">
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2023/07/500-x-500-pixel-SMOKED-OAK-BasicProff-1.jpg" alt="" />
                      <p style="text-align: center;">Smoked Oak</p>
                      <input class="hidAccessories" type="hidden" value="acc1" />
                                            <input class="hid_color" type="hidden" value="Smoked_Oak" />

                    </div>

                    
                    <div style="" class="select_accessories" data-selected="0" attribut_id='156'
                      data-tilbehor_product_id="1325"
                      data-tilbehor_product_price="">
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2023/07/500-x-500-pixel-WALNUT-BasicProff-1.jpg" alt="" />
                      <p style="text-align: center;">Walnut</p>
                      <input class="hidAccessories" type="hidden" value="acc1" />
                                            <input class="hid_color" type="hidden" value="Walnut" />

                    </div>

                    
                    <div style="" class="select_accessories" data-selected="0" attribut_id='67'
                      data-tilbehor_product_id="3058"
                      data-tilbehor_product_price="">
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2023/07/500-x-500-pixel-ASH-BasicProff.jpg" alt="" />
                      <p style="text-align: center;">Ash</p>
                      <input class="hidAccessories" type="hidden" value="acc1" />
                                            <input class="hid_color" type="hidden" value="Ash" />

                    </div>

                    
                    <div style="" class="select_accessories" data-selected="0" attribut_id='73'
                      data-tilbehor_product_id="3058"
                      data-tilbehor_product_price="">
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2023/07/500-x-500-pixel-BLACK-OAK-BasicProff.jpg" alt="" />
                      <p style="text-align: center;">Black Oak</p>
                      <input class="hidAccessories" type="hidden" value="acc1" />
                                            <input class="hid_color" type="hidden" value="Black_Oak" />

                    </div>

                    
                    <div style="" class="select_accessories" data-selected="0" attribut_id='68'
                      data-tilbehor_product_id="3058"
                      data-tilbehor_product_price="">
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2023/07/500-x-500-pixel-GREY-OAK-BasicProff.jpg" alt="" />
                      <p style="text-align: center;">Grey Oak</p>
                      <input class="hidAccessories" type="hidden" value="acc1" />
                                            <input class="hid_color" type="hidden" value="Grey_Oak" />

                    </div>

                    
                    <div style="" class="select_accessories" data-selected="0" attribut_id='69'
                      data-tilbehor_product_id="3058"
                      data-tilbehor_product_price="">
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2023/07/500-x-500-pixel-LIGHT-OAK-BasicProff.jpg" alt="" />
                      <p style="text-align: center;">Light Oak</p>
                      <input class="hidAccessories" type="hidden" value="acc1" />
                                            <input class="hid_color" type="hidden" value="Light_Oak" />

                    </div>

                    
                    <div style="" class="select_accessories" data-selected="0" attribut_id='70'
                      data-tilbehor_product_id="3058"
                      data-tilbehor_product_price="">
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2023/07/500-x-500-pixel-OILED-OAK-BasicProff.jpg" alt="" />
                      <p style="text-align: center;">Olied Oak</p>
                      <input class="hidAccessories" type="hidden" value="acc1" />
                                            <input class="hid_color" type="hidden" value="Olied_Oak" />

                    </div>

                    
                    <div style="" class="select_accessories" data-selected="0" attribut_id='71'
                      data-tilbehor_product_id="3058"
                      data-tilbehor_product_price="">
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2023/07/500-x-500-pixel-SMOKED-OAK-BasicProff.jpg" alt="" />
                      <p style="text-align: center;">Smoked Oak</p>
                      <input class="hidAccessories" type="hidden" value="acc1" />
                                            <input class="hid_color" type="hidden" value="Smoked_Oak" />

                    </div>

                    
                    <div style="" class="select_accessories" data-selected="0" attribut_id='72'
                      data-tilbehor_product_id="3058"
                      data-tilbehor_product_price="">
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2023/07/500-x-500-pixel-WALNUT-BasicProff.jpg" alt="" />
                      <p style="text-align: center;">Walnut</p>
                      <input class="hidAccessories" type="hidden" value="acc1" />
                                            <input class="hid_color" type="hidden" value="Walnut" />

                    </div>

                    
                    <div style="" class="select_accessories" data-selected="0" attribut_id='67'
                      data-tilbehor_product_id="2900"
                      data-tilbehor_product_price="">
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2023/07/500-x-500-pixel-ASH-BasicProff.jpg" alt="" />
                      <p style="text-align: center;">Ash</p>
                      <input class="hidAccessories" type="hidden" value="acc1" />
                                            <input class="hid_color" type="hidden" value="Ash" />

                    </div>

                    
                    <div style="" class="select_accessories" data-selected="0" attribut_id='73'
                      data-tilbehor_product_id="2900"
                      data-tilbehor_product_price="">
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2023/07/500-x-500-pixel-BLACK-OAK-BasicProff.jpg" alt="" />
                      <p style="text-align: center;">Black Oak</p>
                      <input class="hidAccessories" type="hidden" value="acc1" />
                                            <input class="hid_color" type="hidden" value="Black_Oak" />

                    </div>

                    
                    <div style="" class="select_accessories" data-selected="0" attribut_id='68'
                      data-tilbehor_product_id="2900"
                      data-tilbehor_product_price="">
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2023/07/500-x-500-pixel-GREY-OAK-BasicProff.jpg" alt="" />
                      <p style="text-align: center;">Grey Oak</p>
                      <input class="hidAccessories" type="hidden" value="acc1" />
                                            <input class="hid_color" type="hidden" value="Grey_Oak" />

                    </div>

                    
                    <div style="" class="select_accessories" data-selected="0" attribut_id='69'
                      data-tilbehor_product_id="2900"
                      data-tilbehor_product_price="">
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2023/07/500-x-500-pixel-LIGHT-OAK-BasicProff.jpg" alt="" />
                      <p style="text-align: center;">Light Oak</p>
                      <input class="hidAccessories" type="hidden" value="acc1" />
                                            <input class="hid_color" type="hidden" value="Light_Oak" />

                    </div>

                    
                    <div style="" class="select_accessories" data-selected="0" attribut_id='70'
                      data-tilbehor_product_id="2900"
                      data-tilbehor_product_price="">
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2023/07/500-x-500-pixel-OILED-OAK-BasicProff.jpg" alt="" />
                      <p style="text-align: center;">Olied Oak</p>
                      <input class="hidAccessories" type="hidden" value="acc1" />
                                            <input class="hid_color" type="hidden" value="Olied_Oak" />

                    </div>

                    
                    <div style="" class="select_accessories" data-selected="0" attribut_id='71'
                      data-tilbehor_product_id="2900"
                      data-tilbehor_product_price="">
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2023/07/500-x-500-pixel-SMOKED-OAK-BasicProff.jpg" alt="" />
                      <p style="text-align: center;">Smoked Oak</p>
                      <input class="hidAccessories" type="hidden" value="acc1" />
                                            <input class="hid_color" type="hidden" value="Smoked_Oak" />

                    </div>

                    
                    <div style="" class="select_accessories" data-selected="0" attribut_id='72'
                      data-tilbehor_product_id="2900"
                      data-tilbehor_product_price="">
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2023/07/500-x-500-pixel-WALNUT-BasicProff.jpg" alt="" />
                      <p style="text-align: center;">Walnut</p>
                      <input class="hidAccessories" type="hidden" value="acc1" />
                                            <input class="hid_color" type="hidden" value="Walnut" />

                    </div>

                    

          </div>
        </div>
      </div>
    </div>
    <div class="col-4">
      <div class="ccb-list">
        <div class="ccb-list-box">
          <h2>DIT VALG</h2>
          <ul>
            <li class="active-list"><span>1. Serie / Akustikpaneler</span>
              <!--<img src="https://kirkedalkomposit.dk/wp-content/uploads/2020/12/Web_DSC_4795.jpg" alt="" title="">-->
            </li>
            <li class="active-list sidebar_calc_box1"><span>2. Vælg form</span> <img
                src="https://kirkedalkomposit.dk/wp-content/images/form3.jpg" alt="" title=""></li>
            <li class="active-list sidebar_calc_box2"><span>3. Gavl trekant</span>
              <!--<img src="https://kirkedalkomposit.dk/wp-content/uploads/2020/12/Web_DSC_4795.jpg" alt="" title="">-->
            </li>
            <li class="active-list sidebar_calc_box3"><span>4. Loft/Væg</span><b class="dimention" style="  ">A:5X6 B:
                5X4 A:5X6 B: 5X4 A:5X6 B: 5X4</b></li>
            <li class="active-list sidebar_calc_box4"><span>5. Vindues- / dørhuller (- areal)</span> <b
                class="dimention1" style="  ">A:5X6 B: 5X4 A:5X6 B: 5X4 A:5X6 B: 5X4</b></li>
            <li class="active-list sidebar_calc_box5"><span>6. Vælg produkt</span> <img
                src="https://kirkedalkomposit.dk/wp-content/uploads/2021/07/vaelg-topprofil.jpg" alt="" title=""></li>
            <li class=""><span>7. Farve</span> <img
                src="https://kirkedalkomposit.dk/wp-content/uploads/2020/12/Web_DSC_4795.jpg" alt="" title=""></li>
            <li class="Vælgtilbehor"><span>8.
                Tilbehør</span><!-- <img style="display:none;" src="https://kirkedalkomposit.dk/wp-content/uploads/2020/12/Web_DSC_4795.jpg" alt="" title="">-->
            </li>
          </ul>
        </div>
      </div>
    </div>
  </div>
</div>
<style>
  input.Tilbehørcheckbox {
    margin-right: 5px;
    width: 20px;
    height: 20px;
    /* display: none;*/
  }

  .chekacc {
    text-align: end;
  }
</style>
<div class="calculator-box calculator-6" style="display:none">
  <div class="calculator-contact-box">
    <div class="col-8">
      <div class="ccb-text">
        <div class="ccb-text-box">
          <h2>Tilbehør</h2>
          <!-- <a href="javascript:void(0)" class="back-button" id="back_id_type7" style="display: none;">Tilbage</a>-->
          <div class="vaelg-tilbehor">
            <div class="vaelg-tilbehor-1 col-md-12">

                                <div style="" class="select_accessories product_item 936" data-selected="0"
                    datakey="2">
                    <div style=" " class="chekacc"><input type="checkbox" id="Acc"
                        name="Acc" class="Tilbehørcheckbox"></div>
                    <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2021/01/FibroTech-montagelim-spand-PM-2023-NETFIL-150x150.jpg" alt="" />
                    <input class="hidAccessories" type="hidden" value="acc1" />
                    <label style="display: block;text-align: center;" for="Acc1">
                      Montagelim                    </label>
                    <center>
                      <!--
                                                    <label style="position:absolute; left:20px;right:20px;bottom:50px;;" for="Acc1">Amount</label>
                                                    -->
                      <input value="0" id="Acc1" style="width: 120px; height: 40px;" name="Acc1"
                        type="number" min="0" data-tilbehor_product_id="936"
                        data-tilbehor_product_price="52.95"
                        data-tilbehor_product_sku="2119001" data-tilbehor_product_variation_id="0"
                        oninput="this.value = Math.abs(this.value)" />
                    </center>
                  </div>
                                    <div style="" class="select_accessories product_item 935" data-selected="0"
                    datakey="2">
                    <div style=" " class="chekacc"><input type="checkbox" id="Acc1"
                        name="Acc1" class="Tilbehørcheckbox"></div>
                    <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2020/12/montagelim-150x150.jpg" alt="" />
                    <input class="hidAccessories" type="hidden" value="acc1" />
                    <label style="display: block;text-align: center;" for="Acc1">
                      Montagelim                    </label>
                    <center>
                      <!--
                                                    <label style="position:absolute; left:20px;right:20px;bottom:50px;;" for="Acc1">Amount</label>
                                                    -->
                      <input value="0" id="Acc11" style="width: 120px; height: 40px;" name="Acc1"
                        type="number" min="0" data-tilbehor_product_id="935"
                        data-tilbehor_product_price="16.95"
                        data-tilbehor_product_sku="2119000" data-tilbehor_product_variation_id="0"
                        oninput="this.value = Math.abs(this.value)" />
                    </center>
                  </div>
                                    <div style="" class="select_accessories product_item 930" data-selected="0"
                    datakey="0">
                    <div style=" " class="chekacc"><input type="checkbox" id="Acc2"
                        name="Acc2" class="Tilbehørcheckbox"></div>
                    <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2021/01/ReparationsSpray-Sort-traebeton-nov-2022-150x150.jpg" alt="" />
                    <input class="hidAccessories" type="hidden" value="acc1" />
                    <label style="display: block;text-align: center;" for="Acc1">
                      FibroTech Rep. maling til træbeton, Sort - RAL 9005                    </label>
                    <center>
                      <!--
                                                    <label style="position:absolute; left:20px;right:20px;bottom:50px;;" for="Acc1">Amount</label>
                                                    -->
                      <input value="0" id="Acc12" style="width: 120px; height: 40px;" name="Acc1"
                        type="number" min="0" data-tilbehor_product_id="930"
                        data-tilbehor_product_price="24.25"
                        data-tilbehor_product_sku="2122783" data-tilbehor_product_variation_id="0"
                        oninput="this.value = Math.abs(this.value)" />
                    </center>
                  </div>
                                    <div style="" class="select_accessories product_item 929" data-selected="0"
                    datakey="1">
                    <div style=" " class="chekacc"><input type="checkbox" id="Acc3"
                        name="Acc3" class="Tilbehørcheckbox"></div>
                    <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2021/01/ReparationsSpray-Hvid-traebeton-nov.-2022-150x150.jpg" alt="" />
                    <input class="hidAccessories" type="hidden" value="acc1" />
                    <label style="display: block;text-align: center;" for="Acc1">
                      FibroTech Rep. maling til træbeton, Hvid - RAL 9003                    </label>
                    <center>
                      <!--
                                                    <label style="position:absolute; left:20px;right:20px;bottom:50px;;" for="Acc1">Amount</label>
                                                    -->
                      <input value="0" id="Acc13" style="width: 120px; height: 40px;" name="Acc1"
                        type="number" min="0" data-tilbehor_product_id="929"
                        data-tilbehor_product_price="24.25"
                        data-tilbehor_product_sku="2122782" data-tilbehor_product_variation_id="0"
                        oninput="this.value = Math.abs(this.value)" />
                    </center>
                  </div>
                                    <div style="" class="select_accessories product_item 2747" data-selected="0"
                    datakey="2">
                    <div style=" " class="chekacc"><input type="checkbox" id="Acc4"
                        name="Acc4" class="Tilbehørcheckbox"></div>
                    <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2022/11/Fibrotech-sort-150x150.jpg" alt="" />
                    <input class="hidAccessories" type="hidden" value="acc1" />
                    <label style="display: block;text-align: center;" for="Acc1">
                      FibroTech Panelskrue Black - Tx. 20                    </label>
                    <center>
                      <!--
                                                    <label style="position:absolute; left:20px;right:20px;bottom:50px;;" for="Acc1">Amount</label>
                                                    -->
                      <input value="0" id="Acc14" style="width: 120px; height: 40px;" name="Acc1"
                        type="number" min="0" data-tilbehor_product_id="2747"
                        data-tilbehor_product_price="20.95"
                        data-tilbehor_product_sku="2297827" data-tilbehor_product_variation_id="0"
                        oninput="this.value = Math.abs(this.value)" />
                    </center>
                  </div>
                                    <div style="" class="select_accessories product_item 3208" data-selected="0"
                    datakey="2">
                    <div style=" " class="chekacc"><input type="checkbox" id="Acc5"
                        name="Acc5" class="Tilbehørcheckbox"></div>
                    <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.it/wp-content/uploads/2023/12/FibroTech-panel-screw-black-2395799-150x150.jpg" alt="" />
                    <input class="hidAccessories" type="hidden" value="acc1" />
                    <label style="display: block;text-align: center;" for="Acc1">
                      FibroTech Panelskrue Black - Tx. 20                    </label>
                    <center>
                      <!--
                                                    <label style="position:absolute; left:20px;right:20px;bottom:50px;;" for="Acc1">Amount</label>
                                                    -->
                      <input value="0" id="Acc15" style="width: 120px; height: 40px;" name="Acc1"
                        type="number" min="0" data-tilbehor_product_id="3208"
                        data-tilbehor_product_price="13.95"
                        data-tilbehor_product_sku="2395799" data-tilbehor_product_variation_id="0"
                        oninput="this.value = Math.abs(this.value)" />
                    </center>
                  </div>
                              </div>
            <div class="vaelg-tilbehor-3">
              <p style="text-align: center;margin: 4px 0;opacity: 0.8;font-size: 14px;padding: 0; display:none;">
                Beregningen er kun vejledende og med forbehold for faktorer der påvirker udfaldet af beregningen. Det er
                på kundens eget ansvar at tjekke beregningen/antal</p>
              <!--   <p>Du kan forlade dette uden valg eller en indtil alle</p>-->
              <button class="btn_beregn" style="background: #fff;    border: 1px solid #e1e1e1 !important;    padding: 12px 11px 12px 10px;    width: 129px;    border-radius: 0px;    font-weight: 700;    font-size: 14px;" id="submitBtn">beregn</button>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="col-4">
      <div class="ccb-list">
        <div class="ccb-list-box">
          <h2>DIT VALG</h2>
          <ul>
            <li class="active-list"><span>1. Serie / Akustikpaneler</span>
              <!--<img src="https://kirkedalkomposit.dk/wp-content/uploads/2020/12/Web_DSC_4795.jpg" alt="" title="">-->
            </li>
            <li class="active-list sidebar_calc_box1"><span>2. Vælg form</span> <img
                src="https://kirkedalkomposit.dk/wp-content/images/form3.jpg" alt="" title=""></li>
            <li class="active-list sidebar_calc_box2"><span>3. Gavl trekant</span>
              <!--<img src="https://kirkedalkomposit.dk/wp-content/uploads/2020/12/Web_DSC_4795.jpg" alt="" title="">-->
            </li>
            <li class="active-list sidebar_calc_box3"><span>4. Loft/Væg</span><b class="dimention" style="  ">A:5X6 B:
                5X4 A:5X6 B: 5X4 A:5X6 B: 5X4</b></li>
            <li class="active-list sidebar_calc_box4"><span>5. Vindues- / dørhuller (- areal)</span> <b
                class="dimention1" style="  ">A:5X6 B: 5X4 A:5X6 B: 5X4 A:5X6 B: 5X4</b></li>
            <li class="active-list sidebar_calc_box5"><span>6. Vælg produkt</span> <img
                src="https://kirkedalkomposit.dk/wp-content/uploads/2021/07/vaelg-topprofil.jpg" alt="" title=""></li>
            <li class="active-list sidebar_calc_box66"><span>7. Farve</span> <img
                src="https://kirkedalkomposit.dk/wp-content/uploads/2020/12/Web_DSC_4795.jpg" alt="" title=""></li>
            <li class="Vælgtilbehor"><span>8. Tilbehør</span> <img style="display:none;" src="" alt="" title=""></li>
          </ul>
        </div>
      </div>
    </div>
  </div>
</div>
<div class="calculator-box calculator-7" style="display:none">
  <div class="calculator-contact-box desktop-vo">
    <div class="col-4 desktop-vo resizeing">
      <div class="ccb-list">
        <div class="ccb-list-box">
          <h2>DIT VALG</h2>
          <div class="dit-veg-mag">
            <ul>
              <li class="active-list down-arrow-list"><span>Rediger</span> <img
                  src="https://kirkedalkomposit.dk/wp-content/uploads/2022/02/free-arrow-down-icon-3101-thumb.png"
                  alt="" title="" style="height: 50%;    margin: auto 0 auto 0px;"></li>
            </ul>



          </div>
          <ul class="all-data-list-finel" style="display:none">
            <li class="active-list"><span>1. Serie / Akustikpaneler</span>
              <!--<img src="https://kirkedalkomposit.dk/wp-content/uploads/2020/12/Web_DSC_4795.jpg" alt="" title="">-->
            </li>
            <li class="active-list sidebar_calc_box1"><span>2. Vælg form</span> <img
                src="https://kirkedalkomposit.dk/wp-content/images/form3.jpg" alt="" title=""></li>
            <li class="active-list sidebar_calc_box2"><span>3. Gavl trekant</span>
              <!--<img src="https://kirkedalkomposit.dk/wp-content/uploads/2020/12/Web_DSC_4795.jpg" alt="" title="">-->
            </li>
            <li class="active-list sidebar_calc_box3"><span>4. Loft/Væg</span> <b class="dimention" style="  ">A:5X6 B:
                5X4 A:5X6 B: 5X4 A:5X6 B: 5X4</b></li>
            <li class="active-list sidebar_calc_box4"><span>5. Vindues- / dørhuller (- areal)</span> <b
                class="dimention1" style="  ">A:5X6 B: 5X4 A:5X6 B: 5X4 A:5X6 B: 5X4</b></li>
            <li class="active-list sidebar_calc_box5"><span>6. Vælg produkt</span> <img
                src="https://kirkedalkomposit.dk/wp-content/uploads/2021/07/vaelg-topprofil.jpg" alt="" title=""></li>
            <li class="active-list sidebar_calc_box66"><span>7. Farve</span> <img
                src="https://kirkedalkomposit.dk/wp-content/uploads/2020/12/Web_DSC_4795.jpg" alt="" title=""></li>
            <li class="active-list sidebar_calc_box6"><span>8. Tilbehør</span> <img src="" alt="" title=""></li>
          </ul>
        </div>
        <div class="total-row">
          <style>
            .tbl_custom_data2 table {

              border-collapse: collapse;
              width: 100%;
            }

            .tbl_custom_data2 td {
              border: 1px solid #dddddd;
              text-align: left;
              padding: 8px;
            }

            .tbl_custom_data2 th {
              border: 1px solid #dddddd;
              text-align: left;
              padding: 8px;
              color: #333;
            }

            .tbl_custom_data2 tr.frist-tr {
              background-color: #dddddd !important;
            }

            .tbl_custom_data2 td:nth-child(3) {
              text-align: right !important;
            }

            .tbl_custom_data2 tr:nth-child(2n+1) {
              background: rgb(245, 245, 245);
            }

            @media (min-width: 1200px) {
              .row {
                margin-left: -30px;

              }
            }
          </style>
          <div class="tbl_custom_data tbl_custom_data2" id="mydiv">
            <table id="" style="width:100%;" cellspacing="0" cellpadding="5" border="0">
              <thead>
                <tr class="frist-tr">
                  <th>Beskrivelse</th>
                  <!--<th>Antal </th>-->
                  <th>Antal</th>
                  <th>Pris </th>
                  <!--<th>Total</th>-->
                </tr>
              </thead>
              <tbody>
                <tr>
                  <td data-label="Beskrivelse" style="">Loft/væg</td>
                  <!--<td data-label="Antal" style=""> :</td>-->
                  <td data-label="Antal" style="" align="left" width="">
                                        <span id="total_area"></span> m2
                  </td>
                  <td data-label="Pris" style=""> </td>
                </tr>
                <tr>
                  <td data-label="Beskrivelse" style="">Vinduer / døre</td>
                  <!--<td data-label="Antal" style=""> :</td>-->
                  <td data-label="Antal" style="" align="left" width="">
                                        <span id="vinduer_area"></span> m2
                  </td>
                  <td data-label="Pris" style=""> </td>
                </tr>
                <tr>
                  <td data-label="Beskrivelse" style=""> <span id="product_titel_td"></span> <br /> <span
                      id="product_sku_td"></span> </td>
                  <!--<td data-label="Antal" style=""> :</td>-->
                  <td data-label="Antal" style="" align="left" width="">
                    <!-- <input id="product_title" style="width: 100px;" name="product_title" readonly type="number" />-->
                    <span id="product_title"></span> stk. a <br /> <span id="product_price"></span>
                  </td>
                  <td data-label="Pris" style=""> <span id="product_price_total"></span> </td>
                </tr>
                <tr style="display:none;">
                  <td data-label="Beskrivelse" style=""> <span id="screw_title_td"></span> <br /> <span
                      id="screw_sku"></span> </td>
                  <!--<td data-label="Antal" style=""> :</td>-->
                  <td data-label="Antal" style="text-align: bottom;" align="left" width="">
                    <!--<input id="screw_title" style="width: 100px;" name="screw_title" readonly type="number" />-->
                    <span id="screw_title"></span> stk. a <br /> <span id="screw_price"></span>
                  </td>
                  <td data-label="Pris" style=""> <span id="screw_price_total"></span> </td>
                </tr>
                <tr id="accessories_information1">
                  <td id="accessories_information" colspan="4"></td>

                                  </tr>
                <tr>
                  <td data-label="Beskrivelse" style="" width="">Forskalling er ikke inkluderet i prisen</td>
                  <!--<td data-label="Antal" style=""> :</td>-->
                  <td data-label="Antal" style="" align="left" width="">
                    <!-- <input id="klemlister_title" style="width: 100px;" name="klemlister_title" readonly type="number" />-->
                    <span id="klemlister_title"></span> mtr. <br /> <span id="klemlister_price"></span>
                  </td>
                  <td data-label="Pris" style=""> <span id="klemlister_price_total"></span> </td>
                </tr>
                <tr>
                  <td data-label="Total" class="totalll" style="font-weight: bold;" width="200">Total</td>
                  <!--<td data-label="Antal" style=""> :</td>-->
                  <td data-label="Pris" style="font-weight: bold; text-align: end;" colspan="2"> <span
                      id="total_price"></span>, <span style="font-weight:normal;">inkl. moms</span></td>
                </tr>
              </tbody>
            </table>
            <p style="display:none;">Beregningen er kun vejledende og med forbehold for faktorer der påvirker udfaldet
              af beregningen. Det er på kundens eget ansvar at tjekke beregningen/antal.<br>
              Fragtpriser: Ab butik - 812,50 kr. Leveret til kantsten - 1.625,00 kr.</p>

                        <form action="https://fibrotech.it/da/beregner_pdf/pdf/terrasse.php/" method="post" name="form" data-trp-original-action="https://fibrotech.it/beregner_pdf/pdf/terrasse.php">
              <input id="pdfarea" name="pdfarea" type="hidden" value="" />
              <input id="pdfhojde" name="pdfhojde" type="hidden" value="" />
              <input id="pdflangde" name="pdflangde" type="hidden" value="" />
              <input id="pdfterrasse" name="pdfterrasse" type="hidden" value="" />
              <input id="pdfstroe" name="pdfstroe" type="hidden" value="" />
              <input id="pdfclips" name="pdfclips" type="hidden" value="" />
              <input id="pdfafslutning" name="pdfafslutning" type="hidden" value="" />
              <input id="pdfstartbeslag" name="pdfstartbeslag" type="hidden" value="" />
              <input id="pdfslutbeslag" name="pdfslutbeslag" type="hidden" value="" />
              <input id="pdffarve" name="pdffarve" type="hidden" value="" />
              <input id="pdftotal" name="pdftotal" type="hidden" value="" />
              <input id="pdftypeterrasse" name="pdftypeterrasse" type="hidden" value="" />
              <input id="pdfclips_type" name="pdfclips_type" type="hidden" value="" />
              <input id="pdftypeafslutning" name="pdftypeafslutning" type="hidden" value="" />
              <input id="pdf_acc1_cnt" name="pdf_acc1_cnt" type="hidden" value="" />
              <input id="pdf_acc2_cnt" name="pdf_acc2_cnt" type="hidden" value="" />
              <input id="pdf_acc3_cnt" name="pdf_acc3_cnt" type="hidden" value="" />
              <input id="pdf_acc4_cnt" name="pdf_acc4_cnt" type="hidden" value="" />
              <input id="pdf_acc5_cnt" name="pdf_acc5_cnt" type="hidden" value="" />
              <input style="font-size:14px;display: none;" type="button" id="sendtopdf" value="Print/Send beregningen"
                onclick="send_to_pdf()" />
              <input style="font-size:14px;display: none;" type="button" value="Tilføj indkøbskurven"
                id="add_to_cart_btn" onclick="add_to_cart();" />
            <input type="hidden" name="trp-form-language" value="da"/></form>

            <script type="text/javascript">
              jQuery("#facade_stykke_table #FacadeAL").change(function () {
                jQuery("#threedcreate").val(0);

              });
              jQuery("#facade_stykke_table #FacadeAW").change(function () {
                jQuery("#threedcreate").val(0);

              });

              jQuery('.select_accessories').click(function () {
                jQuery("#threedcreate").val(0);
              });

              var $dialog;
              var ready_for_pdf = false;
              var pdfemail = '';
              var pdfphone = '';
              var pdfagree = 0;
              var labels = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';
              var lengths_heights = [];
              var lengths_heights_w = [];
              var selected_method = "";
              var selected_product_id = 0;
              var screw_product_id = 0;
              var selected_screw_id = 0;
              var selected_screw_price = 0;
              var selected_product_price = 0;
              var selected_product_area = 0;
              var accessories_amounts = [];
              var band_id = 50;//EPDB band
              var klemlister_id = 530;//klemlister

              var form_lengths = [];
              var form_widths = [];
              var selected_form_id = "";
              var switch_map_val = "0";
              var map_init = false;

              jQuery("#submitBtn").click(function () {
                jQuery('.all-data-list-finel').hide();
                jQuery("#back_id_type8").show();
                var area_gavl = 0;
                var area_facade = 0;
                var area_vinduer = 0;
                lengths_heights = [];
                lengths_heights_w = [];

                if (selected_method == 1) {
                  jQuery("#facade_stykke_table tr").each(function () {
                    var cnt = 0;
                    var length = 0;
                    var height = 0;
                    jQuery(this).find("td").each(function () {
                      cnt++;
                      let val = parseFloat(jQuery(this).find("input[type=number]").val()) || 0;
                      if (cnt == 1) length = val;
                      if (cnt == 2) height = val;
                    });
                    var length_height = { length: length, height: height };
                    lengths_heights.push(length_height);
                    area_facade += length * height;
                  });
                }
                else if (selected_method == 2) {
                  jQuery("#gavl_trekant_table tr").each(function () {
                    var cnt = 0;
                    var length = 0;
                    var height = 0;
                    jQuery(this).find("td").each(function () {
                      cnt++;
                      let val = parseFloat(jQuery(this).find("input[type=number]").val()) || 0;
                      if (cnt == 1) length = val;
                      if (cnt == 2) height = val;
                    });
                    var length_height = { length: length, height: height };
                    lengths_heights.push(length_height);
                    area_gavl += length * height * 0.5;
                  });
                }
                //  if(area_gavl== '0'){
                //         area_gavl += 1;
                //  }
                console.log(area_gavl);
                jQuery("#vindues_table tr").each(function () {
                  var cnt = 0;
                  var width = 0;
                  var height = 0;
                  var qty = 0;
                  jQuery(this).find("td").each(function () {
                    cnt++;
                    var val = jQuery(this).find("input[type=number]").val();
                    val = parseFloat(val);
                    val = isNaN(val) ? 0 : val; // If val is not a number, fallback to 0

                    if (cnt == 2) qty = val;
                    if (cnt == 3) width = val;
                    if (cnt == 4) height = val;
                  });
                  var length_height = { amount: qty, length: width, height: height };
                  lengths_heights_w.push(length_height);
                  area_vinduer += qty * width * height;
                });

                calc_accessories();

                var hid_color = jQuery(".active-list.sidebar_calc_box66 img").attr("hid_color");
                var hid_id = jQuery(".active-list.sidebar_calc_box66 img").attr("hid_id");
                product_ids = jQuery("#model").val();
                if (product_ids == selected_product_id) {
                  var threedcreate = jQuery("#threedcreate").val();
                } else {
                  var threedcreate = 0;
                }

                if (threedcreate == "1") {
                  jQuery("#hid_color").val(hid_color);
                  jQuery('.calculator-box').hide();
                  jQuery('.calculator-box.calculator-7').show();

                  myfunction();
                } else {

                  jQuery.ajax({
                    type: "POST",
                    dataType: 'json',
                    url: "/wp-content/themes/kallyas-child/templates/calculationter_new.php",
                    data: {
                      "area_gavl": area_gavl,
                      "area_facade": area_facade,
                      "area_vinduer": area_vinduer,
                      "product_id": selected_product_id,
                      "product_area": selected_product_area,
                      "product_price": selected_product_price,
                      "accessories_amounts": accessories_amounts,
                      "lengths_heights": lengths_heights,
                      "lengths_heights_w": lengths_heights_w,
                      "screw_id": selected_screw_id,
                      "screw_price": selected_screw_price,
                      "hid_color": hid_color
                    },
                    success: function (msg) {
                      setTimeout(function () {
                        console.log("scroll");
                        $('html, body').animate({
                          scrollTop: $("#renderCanvas").offset().top
                        }, 2000);
                      }, 1000);
                      /*var $accordion = jQuery("#accordion").accordion();
                      var current = $accordion.accordion("option","active"),
                          maximum = $accordion.find("h3").length,
                          next = current+1 === maximum ? 0 : current+1;
                      $accordion.accordion("option","active",next);*/
                      //do something - show results


                      /*console.log(jQuery("#mydiv").offset().top);
  
                      setTimeout(function()
                      {
                          jQuery('html, body').animate({
                              scrollTop: jQuery("#mydiv").offset().top-150
                          }, 500);
                      },1000);*/

                      var results = msg;
                      if (results.product_ids == "2900") {
                        jQuery("#button_hide_show").show();
                        jQuery("#testdemo").hide();
                      } else {
                        jQuery("#button_hide_show").hide();
                        jQuery("#testdemo").show();
                      }
                      jQuery("#total_area").text(results.total_area);
                      //jQuery("#gavl_area").val(results.gavl_area);
                      //jQuery("#facade_area").val(results.facade_area);
                      jQuery("#vinduer_area").text(results.vinduer_area);
                      //jQuery("#product_title").closest('tr').find('td:first').text(jQuery('*[data-product_id="'+selected_product_id+'"] label').text());
                      rep_color = results.hid_color;
                      coclor = rep_color.replace("_", " ");
                      if (results.product_ids == "3347") {
                        jQuery("#product_title").closest('tr').find('#product_titel_td').text(results.product_titel);
                      } else {
                        jQuery("#product_title").closest('tr').find('#product_titel_td').text(results.product_titel + " " + coclor);
                      }
                      jQuery("#product_title").closest('tr').find('#product_sku_td').text("DB " + results.product_sku);
                      currency = (results.product_price * results.product_pieces).toFixed(2);

                      jQuery("#product_title").closest('tr').find('#product_price_total').text(new Intl.NumberFormat('de-DE', { style: 'currency', currency: 'EUR' }).format(currency));
                      jQuery("#product_title").text(results.product_pieces);
                      jQuery("#product_price").text(new Intl.NumberFormat('de-DE', { style: 'currency', currency: 'EUR' }).format(results.product_price));

                      jQuery("#total_price").text(new Intl.NumberFormat('de-DE', { style: 'currency', currency: 'EUR' }).format(results.total_price));
                      jQuery("#totaltotl2").text(new Intl.NumberFormat('de-DE', { style: 'currency', currency: 'EUR' }).format(results.total_price));
                      jQuery("#totaltotl").html(results.total_price);
                      if (results.screws_count == 0) {
                        jQuery("#screw_title").closest('tr').css("display", 'none');
                      }
                      jQuery("#screw_title").text(results.screws_count);
                      jQuery("#screw_title").closest('tr').find('#screw_title_td').text(results.screw_title);
                      jQuery("#screw_title").closest('tr').find('#screw_sku').text("DB " + results.screw_sku);
                      jQuery("#screw_title").closest('tr').find('#screw_price').text(new Intl.NumberFormat('de-DE', { style: 'currency', currency: 'EUR' }).format(results.screws_price));
                      screws = (results.screws_price * results.screws_count).toFixed(2);


                      jQuery("#screw_title").closest('tr').find('#screw_price_total').text(new Intl.NumberFormat('de-DE', { style: 'currency', currency: 'EUR' }).format(screws));
                      jQuery("#epdm_band_title").val(results.band_amount);

                      if (results.screws_product_id == "2185") {
                        jQuery("#klemlister_title").parent('td').parent('tr').css("display", 'none');
                      } else {
                        jQuery("#klemlister_title").parent('td').parent('tr').css("display", 'none');
                        jQuery("#klemlister_title").text(results.klemlister_amount);
                      }

                      screw_product_id = results.screws_product_id;

                      //var html = '<table>';
                      jQuery(".accessories_information2").remove();
                      var html = '';
                      for (var i = 0; i < accessories_amounts.length; i++) {
                        var total_price2 = parseFloat(Math.round(accessories_amounts[i].price * accessories_amounts[i].amount * 100) / 100).toFixed(2);
                        total_price = new Intl.NumberFormat('de-DE', { style: 'currency', currency: 'EUR' }).format(total_price2);

                        acc_price = new Intl.NumberFormat('de-DE', { style: 'currency', currency: 'EUR' }).format(accessories_amounts[i].price);

                        html += '<tr class = "accessories_information2">';
                        html += '<td data-label="Beskrivelse"  style="">' + accessories_amounts[i].title + '<br> DB ' + accessories_amounts[i].sku_p + '</td>'
                        html += '<!--<td data-label="Antal" style=""> :</td>-->';
                        html += '<td data-label="Antal" style="" align="left" width="25%"><span id="accessory_' + i + '">' + accessories_amounts[i].amount + ' stk. a</span><br><span id="accessory_price_' + i + '">' + acc_price + ' </span></td>';
                        html += '<td data-label="Pris" style="">' + total_price + '</td>';
                        html += '</tr>';
                      }
                      //html += '</table>';
                      console.log(html);
                      //jQuery("#accessories_information").html(html);
                      //jQuery(".accessories_information2").remove();
                      jQuery(html).insertAfter("#accessories_information1");
                      jQuery("#accessories_information1").hide();
                      //topprofile();
                      jQuery('.calculator-box').hide();
                      jQuery('.calculator-box.calculator-7').show();




                      //pdf1();

                      jQuery("#model").val(results.product_ids);
                      msg[49] = results.fence_array;

                      myJsonStrings = JSON.stringify((results.fence_array));

                      jQuery("#msgarr").val(myJsonStrings);
                      jQuery("#instanceCounti").val(msg[49][0]['length']);

                      jQuery("#fencetype").val(myJsonStrings);
                      jQuery("#hid_color").val(results.hid_color);

                      jQuery("#threedcreate").val(1);
                      fencerowheight = jQuery("#fencetype").val();
                      if (fencerowheight != '') {
                        myfunction();
                      }
                    }
                  });
                }



              });

              function PrintElem(elem) {
                Popup(jQuery(elem).html());
              }
              function Popup(data) {
                var mywindow = window.open('', 'my div', 'height=400,width=600');
                mywindow.document.write('<html><head><title>my div</title>');
                mywindow.document.write('</head><body >');
                mywindow.document.write(data);
                mywindow.document.write('</body></html>');
                mywindow.document.close(); // necessary for IE >= 10
                mywindow.focus(); // necessary for IE >= 10
                mywindow.print();
                mywindow.close();
                return true;
              }


              function calc_accessories() {
                accessories_amounts = [];

                jQuery(".select_accessories input[type=number]").each(function () {
                  console.log(selected_product_id);
                  var product_id = jQuery(this).data("tilbehor_product_id");

                  if (product_id == "936" || product_id == "935") {
                    if ((selected_product_id == "913" || selected_product_id == "910" || selected_product_id == "914" || selected_product_id == "912" || selected_product_id == "911" || selected_product_id == "909" || selected_product_id == "934" || selected_product_id == "933" || selected_product_id == "932" || selected_product_id == "931") && (product_id == "936" || product_id == "935")) {
                      if (jQuery(this).parent('center').parent('.product_item').hasClass('active')) {
                        var product_id = jQuery(this).data("tilbehor_product_id");
                        var variation_id = jQuery(this).data("tilbehor_product_variation_id");
                        var price = jQuery(this).data("tilbehor_product_price");
                        var sku_p = jQuery(this).data("tilbehor_product_sku");
                        var amount = jQuery(this).val();
                        console.log(amount);
                        var accessory = {};
                        if (amount > 0) {
                          accessory.product_id = product_id;
                          accessory.variation_id = variation_id;
                          accessory.price = price;
                          accessory.amount = amount;
                          accessory.sku_p = sku_p;
                          accessory.title = jQuery(this).closest("div").text();
                          accessories_amounts.push(accessory);
                        }
                      }
                    }

                  } else {
                    if (jQuery(this).parent('center').parent('.product_item').hasClass('active')) {
                      var product_id = jQuery(this).data("tilbehor_product_id");
                      var variation_id = jQuery(this).data("tilbehor_product_variation_id");
                      var price = jQuery(this).data("tilbehor_product_price");
                      var sku_p = jQuery(this).data("tilbehor_product_sku");
                      var amount = jQuery(this).val();
                      console.log(amount);
                      var accessory = {};
                      if (amount > 0) {
                        accessory.product_id = product_id;
                        accessory.variation_id = variation_id;
                        accessory.price = price;
                        accessory.amount = amount;
                        accessory.sku_p = sku_p;
                        accessory.title = jQuery(this).closest("div").text();
                        accessories_amounts.push(accessory);

                      }
                    }
                  }


                });
                console.log(accessories_amounts);
              }
              function guid() {
                function s4() {
                  return Math.floor((1 + Math.random()) * 0x10000)
                    .toString(16)
                    .substring(1);
                }
                return s4() + s4() + '-' + s4() + '-' + s4() + '-' +
                  s4() + '-' + s4() + s4() + s4();
              }
              function send_to_pdf() {
                calc_accessories();
                if (!ready_for_pdf) {

                  jQuery("#dialog").html('');
                  var url = '/wp-content/themes/kallyas-child/templates/email_dialog.php?unique=' + guid();
                  //console.log(url);
                  jQuery("#dialog").load(url, function (data) {
                    $dialog = jQuery('<div></div>').html(data).dialog({ autoOpen: false, modal: true, height: 400, width: 600, title: "Invia PDF" });
                    $dialog.dialog('open');
                    jQuery("div.ui-dialog button.ui-dialog-titlebar-close").each(function () {
                      console.log(jQuery(this));
                      jQuery(this).html("x")
                    });
                  });
                  return false;
                }

                jQuery.ajax({
                  type: "POST",
                  dataType: 'json',
                  url: "/create_pdf.php",
                  data: {
                    "product_id": selected_product_id,
                    "product_amount": jQuery("#product_title").text(),
                    "screws_product_id": screw_product_id,
                    "screws_amount": jQuery("#screw_title").text(),
                    "accessories_amounts": accessories_amounts,
                    "total_area": jQuery("#total_area").text(),
                    "gavl_area": jQuery("#gavl_area").text(),
                    "facade_area": jQuery("#facade_area").text(),
                    "vinduer_area": jQuery("#vinduer_area").text(),
                    "total_price": jQuery("#total_price").text(),
                    "band_id": band_id,
                    "band_amount": jQuery("#epdm_band_title").text(),
                    "klemlister_id": klemlister_id,
                    "klemlister_amount": jQuery("#klemlister_title").text(),
                    "products_sku": jQuery("#product_sku_td").text(),
                    "pdfemail": pdfemail,
                    "pdfphone": pdfphone,
                    "pdfagree": pdfagree,
                    'page_name': 'akustikpanel',
                  },
                  success: function (msg) {
                    var results = msg;
                    console.log(msg);
                    console.log(msg.pdf_link);
                    /*var link = document.createElement('a');
                    link.href = results.pdf_link;
                    link.download = results.pdf_link;
                    link.dispatchEvent(new MouseEvent('click'));
                    */
                    window.open(results.pdf_link, '_blank');
                    $dialog.dialog("close");
                  }
                });
              }
              function add_to_cart() {
                calc_accessories();
                jQuery.ajax({
                  type: "POST",
                  dataType: 'json',
                  url: "/wp-content/themes/kallyas-child/templates/add_to_cart.php",
                  data: {
                    "product_id": selected_product_id,
                    "product_amount": jQuery("#product_title").val(),
                    "screws_product_id": screw_product_id,
                    "screws_amount": jQuery("#screw_title").val(),
                    "accessories_amounts": accessories_amounts,
                    "band_id": band_id,
                    "band_amount": jQuery("#epdm_band_title").val(),
                    //"klemlister_id": klemlister_id,
                    //"klemlister_amount": jQuery("#klemlister_title").val()
                  },
                  success: function (msg) {
                    var results = msg;

                    window.location.href = "/kurv/";
                  }
                });
              }
            </script>

          </div>
          <div class="button-row">
            <button type="button" id="print_send">Print/Send beregningen</button>
            <button type="button" id="fuldskaerm">Fuldskærm 3D</button>
            <button type="button" id="nulstil">Nulstil</button>
            <button type="button" id="addtocart" style="display:none;">Tilføj indkøbskurven</button>
            <button type="button" id="testdemo">Skift retning </button>
            <button type="button" id="button_hide_show">Skjul skift retning </button>
          </div>
          <p style="text-align: center;margin: 4px 0;opacity: 0.8;padding:0;font-size:14px;display: inline-block;">
            Beregningen er kun vejledende og med forbehold for faktorer der påvirker udfaldet af beregningen. Det er på
            kundens eget ansvar at tjekke beregningen/antal</p>
        </div>

      </div>
    </div>
    <script>
      // $(".all-data-list-finel").hide();	
      /*$("li.down-arrow-list").click(function(){
    
        $(".all-data-list-finel").toggle();	
        });*/

      jQuery('#testdemo').click(function () {
        jQuery("#threedcreate").val(0);
        jQuery(".renderCanvas").remove();

        jQuery(".show-3d-box").after('<canvas class="renderCanvas" id="renderCanvas" touch-action="none" style=" width: 100% !important;"></canvas>');

        flipfance = jQuery('#flipfance').val();
        if (flipfance == 0) {
          jQuery('input#flipfance').val(1);
          jQuery('.btn_beregn').trigger('click');
        } else {
          jQuery('input#flipfance').val(0);
          jQuery('.btn_beregn').trigger('click');
        }
      });

      jQuery("#button_hide_show").click(function () {

        button_hide_show = jQuery("#all_canvas_button_hide_show").find("#canvas_button_hide_show").val();
        if (button_hide_show == "1") {
          jQuery("#all_canvas_button_hide_show").find("#canvas_button_hide_show").val(0);
          jQuery(this).text("Skift retning");
        } else {
          jQuery("#all_canvas_button_hide_show").find("#canvas_button_hide_show").val(1);
          jQuery(this).text("Skjul skift retning");
        }

        jQuery(".renderCanvas").remove();

        jQuery(".show-3d-box").after('<canvas class="renderCanvas" id="renderCanvas" touch-action="none" style=" width: 100% !important;"></canvas>');
        setTimeout(function () {
          jQuery('.btn_beregn').trigger('click');
        }, 1500);

      });
    </script>
    <div class="col-8 fullwidth">
      <div class="ccb-text">
        <div class="ccb-text-box">

          <div class="show-3d">
            <!--<a href="javascript:void(0)" class="back-button" id="back_id_type8" style="display: none;">Tilbage</a>-->
                        <div class="show-3d-box">
                            <img class="minimizebutton" src="https://kirkedalkomposit.dk/wp-content/uploads/2022/02/minimize.png"
                alt="" title="" style="display: none;">
              <img class="mouse_gest"
                src="https://kirkedalkomposit.dk/wp-content/themes/kallyas-child/image/mouse-gestures.png" alt=""
                title="" width="50px">
            </div>
            <canvas class="renderCanvas" id="renderCanvas" touch-action="none"
              style=" width: 100% !important; "></canvas>
          </div>
        </div>
      </div>
    </div>
  </div>
  <style type="text/css">
    .minimizebutton {
      width: 4%;
      top: 22px;
      /* float: left; */
      padding-left: 21px;
      position: absolute;
      z-index: 99999;
      left: 30px;
    }

    .show-3d .show-3d-box .mouse_gest {
      position: absolute;
      right: 50px;
      top: 30px;

    }
  </style>
  <style type="text/css">
    .show-3d .show-3d-box .mouse_gest {
      position: absolute;
      right: 50px;
      top: 30px;

    }

    .tbl_custom_data span {
      padding: 0 0;
      /* font-size: 18px;*/
    }
  </style>
  <div class="calculator-contact-box modal-vo">
    <div class="col-8 fullwidth">
      <div class="ccb-text">
        <div class="ccb-text-box">

          <div class="show-3d">
            <!--<a href="javascript:void(0)" class="back-button" id="back_id_type8" style="display: none;">Tilbage</a>-->
                        <div class="show-3d-box">
                            <img class="minimizebutton" src="https://kirkedalkomposit.dk/wp-content/uploads/2022/02/minimize.png"
                alt="" title="" style="display: none;">
              <img class="mouse_gest"
                src="https://kirkedalkomposit.dk/wp-content/themes/kallyas-child/image/mouse-gestures.png" alt=""
                title="" width="50px">
            </div>
            <canvas class="renderCanvas" id="renderCanvas" touch-action="none"
              style=" width: 100% !important; "></canvas>
          </div>
        </div>
      </div>
    </div>
    <div class="col-4">
      <div class="ccb-list">
        <div class="ccb-list-box">
          <h2>DIT VALG</h2>
          <ul>
            <li class="active-list"><span>1. Serie / Akustikpaneler</span>
              <!--<img src="https://kirkedalkomposit.dk/wp-content/uploads/2020/12/Web_DSC_4795.jpg" alt="" title="">-->
            </li>
            <li class="active-list sidebar_calc_box1"><span>2. Vælg form</span> <img
                src="https://kirkedalkomposit.dk/wp-content/images/form3.jpg" alt="" title=""></li>
            <li class="active-list sidebar_calc_box2"><span>3. Gavl trekant</span>
              <!--<img src="https://kirkedalkomposit.dk/wp-content/uploads/2020/12/Web_DSC_4795.jpg" alt="" title="">-->
            </li>
            <li class="active-list sidebar_calc_box3"><span>4. Loft/Væg</span><b class="dimention" style="  ">A:5X6 B:
                5X4 A:5X6 B: 5X4 A:5X6 B: 5X4</b></li>
            <li class="active-list sidebar_calc_box4"><span>5. Vindues- / dørhuller (- areal)</span> <b
                class="dimention1" style="  ">A:5X6 B: 5X4 A:5X6 B: 5X4 A:5X6 B: 5X4</b></li>
            <li class="active-list sidebar_calc_box5"><span>6. Vælg produkt</span> <img
                src="https://kirkedalkomposit.dk/wp-content/uploads/2021/07/vaelg-topprofil.jpg" alt="" title=""></li>
            <li class="active-list sidebar_calc_box66"><span>7. Farve</span> <img
                src="https://kirkedalkomposit.dk/wp-content/uploads/2020/12/Web_DSC_4795.jpg" alt="" title=""></li>
            <li class="Vælgtilbehor"><span>8. Tilbehør</span> <img style="display:none;" src="" alt="" title=""></li>
          </ul>
        </div>
        <div class="total-row">
          <div class="te-price"> Total <br><span id="totaltotl2"></span> </div>
          <div class="button-row">
            <button type="button" id="print_send">Print/Send beregningen</button>
            <button type="button" id="fuldskaerm">Fuldskærm 3D</button>
            <button type="button" id="nulstil">Nulstil</button>
            <button type="button" id="addtocart" style="display:none;">Tilføj indkøbskurven</button>
            <button type="button" id="testdemo">Skift retning </button>
            <button type="button" id="button_hide_show">Skjul skift retning </button>
          </div>
        </div>
      </div>
      <script>
        // $(".all-data-list-finel").hide();	
        jQuery(document).on("click", 'li.down-arrow-list', function () {
          //$("li.down-arrow-list").click(function(){

          $(".all-data-list-finel").toggle();
        });
        /*jQuery(document).on("click",'#testdemo',function(){
        //jQuery('#testdemo').click(function(){
        jQuery(".modal-vo").find(".renderCanvas").remove();	
      
      jQuery(".modal-vo").find(".show-3d-box").after('<canvas class="renderCanvas" id="renderCanvas" touch-action="none" style=" width: 100% !important;"></canvas>');	
          
        flipfance = jQuery('#flipfance').val();
        if(flipfance == 0)
        {
        jQuery('input#flipfance').val(1);	
        jQuery('.btn_beregn').trigger('click');
        }else{
        jQuery('input#flipfance').val(0);
        jQuery('.btn_beregn').trigger('click');	
        }
        });*/
      </script>

    </div>

  </div>
</div>
<div class="calculator-box calculator-8" style="display:none">
  <div class="calculator-contact-box">
    <div class="col-4">
      <div class="ccb-list">
        <div class="ccb-list-box">
          <h2>DIT VALG</h2>
          <ul>
            <li class="active-list"><span>1. Serie / Akustikpaneler</span>
              <!--<img src="https://kirkedalkomposit.dk/wp-content/uploads/2020/12/Web_DSC_4795.jpg" alt="" title="">-->
            </li>
          </ul>
          <div class="serie-alu-hegn">
            <div class="serie-img"> <img src="https://kirkedalkomposit.dk/wp-content/uploads/2021/07/serie-1.jpg" alt=""
                title=""> </div>
            <div class="serie-img"> <img src="https://kirkedalkomposit.dk/wp-content/uploads/2021/07/serie-2.jpg" alt=""
                title=""> </div>
            <div class="serie-img"> <img src="https://kirkedalkomposit.dk/wp-content/uploads/2021/07/serie-3.jpg" alt=""
                title=""> </div>
            <div class="serie-img"> <img src="https://kirkedalkomposit.dk/wp-content/uploads/2021/07/serie-4.jpg" alt=""
                title=""> </div>
          </div>
        </div>
        <div class="total-row">
          <div class="te-price"> Total <span>26.244,60</span> </div>
          <div class="button-row">
            <button>Print/Send beregningen</button>
            <button>Tilføj indkøbskurven</button>
          </div>
        </div>
      </div>
    </div>
    <div class="col-8">
      <div class="ccb-text">
        <div class="ccb-text-box">

          <div class="show-3d">
                        <div class="show-3d-box"> <img src="https://kirkedalkomposit.dk/wp-content/uploads/2021/07/show-3d.jpg"
                alt="" title=""> </div>
          </div>
        </div>
      </div>
    </div>
  </div>
  <div class="tbl_custom_data">
    <table id="" style="width:100%;" cellspacing="0" cellpadding="5" border="0">
      <thead>
        <tr>
          <th>Beskrivelse</th>
          <th>Antal </th>
          <th>Antal</th>
          <th>Pris </th>
          <th>Total</th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <td data-label="Beskrivelse">Profil</td>
          <td data-label="Antal">132 stk. a K1</td>
          <th data-label="Antal"> 1826497</th>
          <td data-label="Pris"> 123,95 DDK</td>
          <td data-label="Total">16.757,40 EUR</td>
        </tr>
        <tr>
          <td data-label="Beskrivelse">Profil</td>
          <td data-label="Antal">132 stk. a K1</td>
          <th data-label="Antal"> 1826497</th>
          <td data-label="Pris"> 123,95 DDK</td>
          <td data-label="Total">16.757,40 EUR</td>
        </tr>
        <tr>
          <td data-label="Beskrivelse">Profil</td>
          <td data-label="Antal">132 stk. a K1</td>
          <th data-label="Antal"> 1826497</th>
          <td data-label="Pris"> 123,95 DDK</td>
          <td data-label="Total">16.757,40 EUR</td>
        </tr>
        <tr>
          <td data-label="Beskrivelse">Profil</td>
          <td data-label="Antal">132 stk. a K1</td>
          <th data-label="Antal"> 1826497</th>
          <td data-label="Pris"> 123,95 DDK</td>
          <td data-label="Total">16.757,40 EUR</td>
        </tr>
        <tr>
          <td data-label="Beskrivelse">Profil</td>
          <td data-label="Antal">132 stk. a K1</td>
          <th data-label="Antal"> 1826497</th>
          <td data-label="Pris"> 123,95 DDK</td>
          <td data-label="Total">16.757,40 EUR</td>
        </tr>
        <tr>
          <td data-label="Beskrivelse">Profil</td>
          <td data-label="Antal">132 stk. a K1</td>
          <th data-label="Antal"> 1826497</th>
          <td data-label="Pris"></td>
          <td data-label="Total">16.757,40 EUR</td>
        </tr>
        <tr>
          <td data-label="Beskrivelse">Profil</td>
          <td data-label="Antal">132 stk. a K1</td>
          <th data-label="Antal"> 1826497</th>
          <td data-label="Pris"> 123,95 DDK</td>
          <td data-label="Total">16.757,40 EUR</td>
        </tr>
        <tr>
          <td style="text-align: left;">Total</td>
          <td colspan="4" style="text-align: right;"><span>26.244,60</span> EUR inkl. moms</td>
        </tr>
      </tbody>
    </table>
    <p>Beregningen er kun vejledende og med forbehold for faktorer der påvirker udfaldet af beregningen. Det er på
      kundens eget ansvar at tjekke beregningen/antal.<br>
      Fragtpriser: Ab butik - 812,50 kr. Leveret til kantsten - 1.625,00 kr.<br>
      1 colli = 4 hegnsprofiler</p>
  </div>
</div>


<script>
  jQuery(document).ready(function () {

    jQuery("#back_id_type3").click(function () {
      jQuery('.calculator-box.calculator-3').hide();
      jQuery('.calculator-1').show();
      jQuery('#totop').click();
    });
    jQuery("#back_id_type").click(function () {
      jQuery('.calculator-box.calculator-2').hide();
      jQuery('.calculator-1').show();

    });
    jQuery("#back_id_type2").click(function () {

      jQuery('.calculator-box.calculator-2').hide();
      //	jQuery('.calculator-box.calculator-3').hide();
      jQuery('.calculator-1').show();
    });
    jQuery("#back_id_type4").click(function () {
      jQuery('.calculator-box.calculator-4').hide();
      jQuery('.calculator-box.calculator-3').show();
      jQuery('#totop').click();
    });
    jQuery("#back_id_type5").click(function () {
      jQuery('.calculator-box.calculator-5').hide();
      jQuery('.calculator-box.calculator-4').show();
    });
    jQuery("#back_id_type6").click(function () {

      jQuery('.calculator-box.calculator-66').hide();
      jQuery('.calculator-box.calculator-5').show();
    });
    jQuery("#back_id_type7").click(function () {

      jQuery('.calculator-box.calculator-6').hide();
      jQuery('.calculator-box.calculator-66').show();
    });
    jQuery('#back_id_type8').click(function () {
      jQuery('.calculator-box.calculator-7').hide();
      jQuery('.calculator-box.calculator-6').show();
    });
    vaelgform = jQuery('#Volgform img').attr('src');
    jQuery('.calculator-box.calculator-1 .vaelg-form ul li').click(function () {
      selected_method = jQuery(this).attr("data-method");
      row = selected_method;
      row_set = selected_method;

      console.log(selected_method);
      var delta = 1;
      if (selected_method == "1") delta = 2;
      if (delta == 2) {
        jQuery('.calculator-box').hide();
        jQuery('.calculator-box.calculator-3').show();
        jQuery('#back_id_type3').show();
        jQuery('#back_id_type2').hide();
      } else if (delta == 1) {
        jQuery('.calculator-box').hide();
        jQuery('.calculator-box.calculator-2').show();
        jQuery('#back_id_type2').show();
        jQuery('#back_id_type3').hide();
      }
      vaelgform = jQuery(this).find('img').attr('src');
      console.log(vaelgform);
      jQuery('#Volgform img').attr('src', vaelgform);
      jQuery('.sidebar_calc_box1').find('img').attr('src', vaelgform);
      jQuery('#Volgform img').show();
      jQuery('.indsaet-dimensioner').find('img').attr('src', vaelgform);


    });




    jQuery('.btn_next').click(function () {

      var delta = 1;
      if (jQuery("#gavl_trekant_table").parents("table").attr('id') == "Gavl_div" && selected_method == "2") delta = 2;

      var all_inputs_filled = true;
      //|| jQuery(this).parents("table").prev("div").attr("id") == "Facade_div" || jQuery(this).parents("table").prev("div").attr("id") == "Vindues_div"

      console.log(jQuery("#gavl_trekant_table").parents("table").attr('id'));
      if (jQuery("#gavl_trekant_table").parents("table").attr('id') == "Gavl_div") {
        jQuery("#gavl_trekant_table").parents("table").find("input[type=number]").each(function () {
          if (jQuery(this).val() == "" || jQuery(this).val() == undefined) {
            console.log(jQuery(this).val());
            jQuery(this).css("border", "1px solid red");

            all_inputs_filled = false;
          }
          else {
            console.log(jQuery(this).val());
            jQuery(this).css("border", "1px solid #cccccc");
          }
        });
      }
      console.log(all_inputs_filled);
      if (all_inputs_filled) {
        jQuery('.calculator-box').hide();
        jQuery(this).parent('.calculator-box').next('.calculator-box').next('.calculator-box').show();
      }
      console.log(delta);


    });

    jQuery('.nextBtn_form').click(function () {

      form_heights = [];
      form_lengths = [];
      i = 0;

      jQuery(".dimensioner-form #Facade_div #facade_stykke_table .form-control").each(function () {

        jQuery(this).css("border", "1px solid #ccc");
        if (jQuery(this).val() == "") {
          all_inputs_filled = false;
          jQuery(this).css("border", "1px solid red");
        }
        else {
          if (i === 0) {
            form_heights.push(jQuery(this).val().replace(',', '.'));
          }
          else if (i % 2 === 0) {
            form_heights.push(jQuery(this).val().replace(',', '.'))
          }
          else {
            form_lengths.push(jQuery(this).val().replace(',', '.'));
          }

        }
        //console.log(jQuery(this).val());
        /*if (all_inputs_filled)
         {
             var $accordion = jQuery("#accordion").accordion();

             var current = $accordion.accordion("option","active"),
                 maximum = $accordion.find("h3").length,
                 next = current+1 === maximum ? 0 : current+1;

             $accordion.accordion("option","active",next);
         }*/
        i++;
      });
      console.log("------");
      console.log(form_heights);
      console.log(form_lengths);
      console.log("------");

      var heightt_width_strr = new Array();
      var heightt_width_strer = new Array();
      var pdf_hidden_data = '';
      temp = new Array();
      h = form_heights.toString();
      temp = h.split(",");
      lengths = new Array();
      l = form_lengths.toString();
      //console.log(h);
      //console.log(l);
      lengths = l.split(",");
      console.log(lengths[0]);
      side_cnt = 0;
      cuuarray = ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H'];
      jQuery(".sidebar_calc_box3").find('.dimention').html('<ul class="myarraydata" style="padding:0;margin:0;"></ul>');
      jQuery.each(temp, function (key, value) {



        heightt_width_strr[key] = value + 'X' + lengths[key];
        //console.log(heightt_width_str);

        heightt_width_strer[key] = '<li style="height:unset;    margin: 0;background-color: #f4f4f4;    margin-top: -5px;box-shadow: none;">' + cuuarray[key] + ' : ' + value + 'X' + lengths[key] + '</li>';
        heightt_width_strerr = '<li style="height:unset;    margin: 0;background-color: #f4f4f4;    margin-top: -5px;box-shadow: none;">' + cuuarray[key] + ' : ' + value + 'X' + lengths[key] + '</li>';
        jQuery(".myarraydata").append(heightt_width_strerr);
        side_cnt++;

      });

      splitheight = heightt_width_strr.toString();
      /*datata = heightt_width_strer.toString();
      datata.replace(",","");
      //datata.replace(",", "");*/

      //heightt_width_strer.split(",");
      console.log(splitheight);
      //Vælgform = jQuery(".dimensioner-form .activee .hidPost").val();
      jQuery(".sidebar_calc_box3").find('span').attr("heightt_width_strr", splitheight);
      jQuery(".sidebar_calc_box3").find('span').attr("form_heights", form_heights);
      jQuery(".sidebar_calc_box3").find('span').attr("form_lengths", form_lengths);
      //jQuery(".sidebar_calc_box2").find('span').attr("Vælgform",Vælgform);
      //jQuery(".sidebar_calc_box2").find('.dimention').html('<ul class="myarraydata" style="padding:0;margin:0;">'+datata.replace(",","")+'</ul>');

      row_length = form_lengths;
      row_height = form_heights;

      jQuery('.calculator-box').hide();
      //console.log("hii");
      jQuery('.calculator-box.calculator-4').show();
      //jQuery(".ingen_vindues").trigger("click");


      //jQuery("#back_id_type4").show();
      //			var delta = 1;
      //          if (jQuery("#facade_stykke_table").parents("table").attr('id') == "Facade_div" && selected_method == "2") delta = 2;
      //
      //            var all_inputs_filled = true;
      //            //|| jQuery(this).parents("table").prev("div").attr("id") == "Facade_div" || jQuery(this).parents("table").prev("div").attr("id") == "Vindues_div"
      //          console.log(jQuery("#facade_stykke_table").parents("table").attr('id'));
      //        if (jQuery("#facade_stykke_table").parents("table").attr('id') == "Facade_div" )
      //            { 
      //                jQuery("#facade_stykke_table").parents("table").find("input[type=number]").each(function()
      //                {		
      //                    if (jQuery(this).val() == "" || jQuery(this).val() == undefined)
      //                    {
      //                    		console.log(jQuery(this).val());
      //                        jQuery(this).css("border","1px solid red");
      //
      //                        all_inputs_filled = false;
      //                    }
      //                    else{
      //                    	console.log(jQuery(this).val());
      //                    		jQuery(this).css("border","1px solid #cccccc");
      //                    } 
      //                });
      //            }
      //            console.log(all_inputs_filled);
      //            if (all_inputs_filled)
      //            {
      //               	jQuery('.calculator-box').hide();
      //				jQuery('.calculator-box.calculator-4').show();
      //            }

      jQuery('#totop').click();


    });
    jQuery(".btn_tilbage_pre").click(function () {
      jQuery(".active-list.sidebar_calc_box3").trigger("click");
    });
    jQuery('.nextBtn_formvindues').click(function () {
      form_antal = [];
      form_heights = [];
      form_lengths = [];
      i = 0;

      jQuery(".dimensioner-form #Vindues_div #vindues_table .form-control").each(function () {

        jQuery(this).css("border", "1px solid #ccc");
        if (jQuery(this).val() == "") {
          all_inputs_filled = false;
          jQuery(this).css("border", "1px solid red");
        }
        else {
          if (i <= 2) {
            if (i === 0) {
              form_antal.push(jQuery(this).val().replace(',', '.'));
            }
            else if (i % 2 === 0) {
              form_lengths.push(jQuery(this).val().replace(',', '.'))

            }
            else {
              form_heights.push(jQuery(this).val().replace(',', '.'));
            }
          }
          else {
            i = 0;
            if (i === 0) {
              form_antal.push(jQuery(this).val().replace(',', '.'));
            }
            else if (i % 2 === 0) {
              form_lengths.push(jQuery(this).val().replace(',', '.'))

            }
            else {
              form_heights.push(jQuery(this).val().replace(',', '.'));
            }

          }

        }
        //console.log(jQuery(this).val());
        /*if (all_inputs_filled)
         {
             var $accordion = jQuery("#accordion").accordion();

             var current = $accordion.accordion("option","active"),
                 maximum = $accordion.find("h3").length,
                 next = current+1 === maximum ? 0 : current+1;

             $accordion.accordion("option","active",next);
         }*/
        i++;
      });
      console.log("----");
      console.log(form_antal);
      console.log(form_heights);
      console.log(form_lengths);
      console.log("----");


      var heightt_width_strr = new Array();
      var heightt_width_strer = new Array();
      var pdf_hidden_data = '';
      temp = new Array();
      h = form_heights.toString();
      temp = h.split(",");
      lengths = new Array();
      l = form_lengths.toString();
      //console.log(h);
      //console.log(l);
      lengths = l.split(",");
      console.log(lengths[0]);
      antal = new Array();
      a = form_antal.toString();
      antals = a.split(",");
      antal = antals

      side_cnt = 0;
      cuuarray = ['A', 'B', 'C', 'D'];
      jQuery(".sidebar_calc_box4").find('.dimention1').html('<ul class="myarraydata1" style="padding:0;margin:0;"></ul>');
      jQuery.each(temp, function (key, value) {



        heightt_width_strr[key] = antal[key] + 'X' + value + 'X' + lengths[key];
        //console.log(heightt_width_str);
        heightt_width_strer[key] = '<li style="height:unset;    margin: 0;background-color: #f4f4f4;    margin-top: -5px;box-shadow: none;">' + cuuarray[key] + ' : ' + antal[key] + 'X' + value + 'X' + lengths[key] + '</li>';
        heightt_width_strerr = '<li style="height:unset;    margin: 0;background-color: #f4f4f4;    margin-top: -5px;box-shadow: none;">' + cuuarray[key] + ' : ' + antal[key] + 'X' + value + 'X' + lengths[key] + '</li>';
        jQuery(".myarraydata1").append(heightt_width_strerr);
        side_cnt++;

      });

      //	console.log(heightt_width_strr);
      splitheight = heightt_width_strr.toString();
      /*datata = heightt_width_strer.toString();
      datata.replace(",","");
      //datata.replace(",", "");*/

      //heightt_width_strer.split(",");
      console.log(splitheight);
      Vælgform = jQuery(".dimensioner-form .activee .hidPost").val();
      jQuery(".sidebar_calc_box4").find('span').attr("heightt_width_strr", splitheight);
      jQuery(".sidebar_calc_box4").find('span').attr("form_antal", form_antal);
      jQuery(".sidebar_calc_box4").find('span').attr("form_heights", form_heights);
      jQuery(".sidebar_calc_box4").find('span').attr("form_lengths", form_lengths);
      jQuery(".sidebar_calc_box4").find('span').attr("Vælgform", Vælgform);
      //jQuery(".sidebar_calc_box2").find('.dimention').html('<ul class="myarraydata" style="padding:0;margin:0;">'+datata.replace(",","")+'</ul>');

      row_length = form_lengths;
      row_height = form_heights;

      jQuery('.calculator-box').hide();
      jQuery('.calculator-box.calculator-5').show();

      //jQuery("#back_id_type5").show();
      //		 var delta = 1;
      //          if (jQuery("#vindues_table").parents("table").attr('id') == "Vindues_div" && selected_method == "2") delta = 2;
      //
      //            var all_inputs_filled = true;
      //            //|| jQuery(this).parents("table").prev("div").attr("id") == "Facade_div" || jQuery(this).parents("table").prev("div").attr("id") == "Vindues_div"
      //          console.log(jQuery("#vindues_table").parents("table").attr('id'));
      //        if (jQuery("#vindues_table").parents("table").attr('id') == "Vindues_div" )
      //            { 
      //                jQuery("#vindues_table").parents("table").find("input[type=number]").each(function()
      //                {		
      //                    if (jQuery(this).val() == "" || jQuery(this).val() == undefined)
      //                    {
      //                    		console.log(jQuery(this).val());
      //                        jQuery(this).css("border","1px solid red");
      //
      //                        all_inputs_filled = false;
      //                    }
      //                    else{
      //                    	console.log(jQuery(this).val());
      //                    		jQuery(this).css("border","1px solid #cccccc");
      //                    } 
      //                });
      //            }
      //            console.log(all_inputs_filled);
      //            if (all_inputs_filled)
      //            {
      //               jQuery('.calculator-box').hide();
      //								jQuery('.calculator-box.calculator-5').show();
      //            }

      jQuery('#totop').click();
    });
    jQuery(".ingen_vindues").click(function () {
      jQuery("#vindues_table input[type=number]").val("");
      jQuery('.calculator-box').hide();
      jQuery('.calculator-box.calculator-5').show();

    });

    jQuery(".select_product").click(function () {
      jQuery("#back_id_type6").show();
      selected_product_id = jQuery(this).data("product_id");
      selected_product_price = jQuery(this).data("product_price");
      selected_product_area = jQuery(this).data("product_area");
      img = jQuery(this).find('img').attr('src');

      jQuery(".sidebar_calc_box5").find('img').attr("src", img);
      console.log(selected_product_id);
      console.log(selected_product_price);
      console.log(selected_product_area);
      // if(selected_product_id == "2443",2440,2444,2442,2441,2409,3388,3387,3386,3372)
      if (selected_product_id == "913" || selected_product_id == "910" || selected_product_id == "914" || selected_product_id == "912" || selected_product_id == "911" || selected_product_id == "909" || selected_product_id == "934" || selected_product_id == "933" || selected_product_id == "932" || selected_product_id == "931") {
        jQuery("input[id='Acc1']").parent('center').parent('div').show();
        jQuery("input[id='Acc11']").parent('center').parent('div').show();
      } else {
        jQuery("input[id='Acc1']").parent('center').parent('div').hide();
        jQuery("input[id='Acc11']").parent('center').parent('div').hide();
      }


      area_facades = 0;
      jQuery("#facade_stykke_table tr").each(function () {
        var cnt = 0;
        var length = 0;
        var height = 0;
        jQuery(this).find("td").each(function () {
          cnt++;
          let val = parseFloat(jQuery(this).find("input[type=number]").val()) || 0;
          if (cnt == 1) length = val;
          if (cnt == 2) height = val;
        });

        area_facades += length * height;
      });

      if (selected_product_id == '1325' || selected_product_id == '937') {
        scr_val = area_facades * 10;
        console.log("scr_val" + scr_val);
        /*if(scr_val <= 100)
        {*/
        input_val = Math.ceil(scr_val / 100);
        console.log("area_facades" + area_facades);
        console.log("input_val" + input_val);
        jQuery(".calculator-box.calculator-6 .select_accessories #Acc14").val(input_val);
        jQuery(".calculator-box.calculator-6 .select_accessories #Acc15").val(input_val);
        jQuery(".calculator-box.calculator-6 .select_accessories #Acc16").val(input_val);


        /*}/*else if (scr_val > 100 && scr_val < 200 ){
          input_val = Math.ceil(scr_val/100);
          console.log("area_facades"+area_facades);
          console.log("input_val"+input_val);
          jQuery(".calculator-box.calculator-6 .select_accessories #Acc14").val(input_val);
          jQuery(".calculator-box.calculator-6 .select_accessories #Acc15").val(input_val);
          jQuery(".calculator-box.calculator-6 .select_accessories #Acc16").val(input_val);
          
          jQuery(".calculator-box.calculator-6 .select_accessories #Acc17").val(0);
          jQuery(".calculator-box.calculator-6 .select_accessories #Acc18").val(0);
          
        }else{*/

        input_vals = Math.ceil(scr_val / 250);

        jQuery(".calculator-box.calculator-6 .select_accessories #Acc17").val(input_vals);
        jQuery(".calculator-box.calculator-6 .select_accessories #Acc18").val(input_vals);


        /*}*/


      } else if (selected_product_id == '1824' || selected_product_id == '1532' || selected_product_id == '1520' || selected_product_id == '3058') {
        //scr_val = area_facades * 6;
        scr_val = area_facades * 15;
        input_val = Math.ceil(scr_val / 100);
        console.log("area_facades" + area_facades);
        console.log("input_val" + input_val);
        jQuery(".calculator-box.calculator-6 .select_accessories #Acc14").val(input_val);
        jQuery(".calculator-box.calculator-6 .select_accessories #Acc15").val(input_val);
        jQuery(".calculator-box.calculator-6 .select_accessories #Acc16").val(input_val);


        input_vals = Math.ceil(scr_val / 250);

        jQuery(".calculator-box.calculator-6 .select_accessories #Acc17").val(input_vals);
        jQuery(".calculator-box.calculator-6 .select_accessories #Acc18").val(input_vals);

      } else {

      }



      if (selected_product_id == '3347') {
        jQuery('.calculator-box').hide();
        jQuery('.calculator-box.calculator-6').show();
        jQuery('.sidebar_calc_box66').find('img').attr('src', img).attr("hid_color", "White");
        jQuery('.sidebar_calc_box66').find('img').attr('src', img).attr("hid_id", selected_product_id);
      } else {

        jQuery('.calculator-box').hide();
        jQuery('.calculator-box.calculator-66').show();
      }
      //jQuery('.calculator-box.calculator-6').show();
      //jQuery("#submitBtn").trigger("click");


      jQuery('.farve .select_accessories').each(function () {
        tilbehor_product_id = jQuery(this).attr('data-tilbehor_product_id');
        attribut_id = jQuery(this).attr('attribut_id');

        if (tilbehor_product_id == selected_product_id) {

          jQuery(this).show();
        } else {
          jQuery(this).hide();
        }

        if (tilbehor_product_id == "1532") {

          if (attribut_id == "91" || attribut_id == "75" || attribut_id == "76" || attribut_id == "78" || attribut_id == "79" || attribut_id == "80") {

            jQuery(this).hide();
          }

        }
        if (tilbehor_product_id == "1325") {

          if (attribut_id == "46" || attribut_id == "45" || attribut_id == "51" || attribut_id == "47" || attribut_id == "48" || attribut_id == "49" || attribut_id == "50") {

            jQuery(this).hide();
          }

        }

      });

      jQuery('#totop').click();
    });

    jQuery(".farve .select_accessories").click(function () {

      img = jQuery(this).find('img').attr('src');
      hid_color = jQuery(this).find('.hid_color').val();
      console.log(img);
      jQuery('.sidebar_calc_box66').find('img').attr('src', img).attr("hid_color", hid_color);
      jQuery('.calculator-66').hide();
      jQuery('.calculator-box.calculator-6').show();
      jQuery('#back_id_type7').show();
      jQuery('#totop').click();
    });



    jQuery(".select_product").mouseover(function () {
      //jQuery(this).css("border","2px solid #e1e1e1");
    });

    jQuery(".select_product").mouseout(function () {
      //jQuery(this).css("border","1px solid #e1e1e1");
    });
    jQuery(".select_accessories input[type=number]").focus(function () {
      //jQuery(this).closest('div.select_accessories').css("border","2px solid #e1e1e1");
    });
    jQuery(".select_accessories input[type=number]").blur(function () {
      // jQuery(this).closest('div.select_accessories').css("border","1px solid #e1e1e1");
    });
    /*jQuery('.calculator-box.calculator-5 .product_item').click(function(){
  
       topprofil = jQuery(this).find('img').attr('src');
       hidtop = jQuery(".hidTop").val();
       console.log(hidtop);
       jQuery(".sidebar_calc_box5").find('img').attr('src',topprofil);
       jQuery(".sidebar_calc_box5").find('img').attr('hidtop',hidtop);
  
      jQuery('.calculator-box').hide();
      jQuery('.calculator-box.calculator-6').show();
    }); */
    accs = {};
    jQuery('.calculator-box.calculator-6 .product_item').click(function (e) {

      acc = jQuery(this).find('center input').attr('id');
      acckey = jQuery(this).attr('datakey');

      if (jQuery(e.target).is('input[type="number"]')) {
        return; // Do nothing and exit the function if the click came from an input
      }


      if ($(this).hasClass("active")) {

        $(".select_accessories.product_item").each(function (index) {

          datakey = $(this).attr("datakey");

          if (datakey == 2) {
            $(this).removeClass("active");
            jQuery(this).css('border', '1px solid #f4f4f4');
            jQuery(this).find('.chekacc input[type="checkbox"]').prop("checked", false);
          }
        });

        $(this).removeClass("active");
        // jQuery(this).css('border', '1px solid #e1e1e1');
        jQuery(this).css('border', '1px solid #f4f4f4');
        jQuery(this).find('.chekacc input[type="checkbox"]').prop("checked", false);
        accs[acckey] = '';
      }

      else {
        $(".select_accessories.product_item").each(function (index) {
          datakey = $(this).attr("datakey");

          if (datakey == 2) {
            $(this).removeClass("active");
            jQuery(this).css('border', '1px solid #f4f4f4');
            jQuery(this).find('.chekacc input[type="checkbox"]').prop("checked", false);
          }
        });
        $(this).removeClass("active");
        $(this).addClass("active");
        jQuery(this).css('border', '1px solid #a9a9a9');
        jQuery(this).find('.chekacc input[type="checkbox"]').prop("checked", true);


        accs[acckey] = acc;
      }

      accessories = jQuery(this).find('img').attr('src');
      magicradio = jQuery(".magic-radio").val()
      jQuery(".sidebar_calc_box6").find('img').attr('src', accessories);
      jQuery(".sidebar_calc_box6").find('img').attr('led', magicradio);
      jQuery(".sidebar_calc_box6").find('img').attr('accs', JSON.stringify(accs));
      jQuery(".Vælgtilbehor").find('img').attr('src', accessories);
      jQuery(".Vælgtilbehor").find('img').attr('led', magicradio);
      jQuery(".Vælgtilbehor").find('img').attr('acc', acc);
      jQuery(".Vælgtilbehor").find('img').show();
      console.log(jQuery(".magic-radio").val());

      //jQuery('.calculator-box').hide();
      //jQuery('.calculator-box.calculator-7').show();
    });


    jQuery('.calculator-box.calculator-7 .btn_beregn').click(function () {
      jQuery('.calculator-box').hide();
      jQuery('.calculator-box.calculator-8').show();
    });

    jQuery('.active-list.sidebar_calc_box1').click(function () {
      jQuery('.calculator-box').hide(); jQuery('.calculator-box.calculator-1').show();
      jQuery('#totop').click();
    });
    jQuery('.active-list.sidebar_calc_box2').click(function () {
      jQuery('.calculator-box').hide(); jQuery('.calculator-box.calculator-2').show();
      jQuery('#totop').click();
    });
    jQuery('.active-list.sidebar_calc_box3').click(function () {
      jQuery('.calculator-box').hide(); jQuery('.calculator-box.calculator-3').show();
      jQuery('#totop').click();
    });
    jQuery('.active-list.sidebar_calc_box4').click(function () {
      jQuery('.calculator-box').hide(); jQuery('.calculator-box.calculator-4').show();
      jQuery('#totop').click();
    });
    jQuery('.active-list.sidebar_calc_box5').click(function () {
      jQuery('.calculator-box').hide(); jQuery('.calculator-box.calculator-5').show();
      jQuery('#totop').click();
    });
    jQuery('.active-list.sidebar_calc_box6').click(function () {
      jQuery('.calculator-box').hide(); jQuery('.calculator-box.calculator-6').show();
      jQuery('#totop').click();
    });
    jQuery('.active-list.sidebar_calc_box66').click(function () {
      jQuery('.calculator-box').hide(); jQuery('.calculator-box.calculator-66').show();
      jQuery('#totop').click();
    });
    jQuery('.active-list.sidebar_calc_box7').click(function () {
      jQuery('.calculator-box').hide(); jQuery('.calculator-box.calculator-7').show();
      jQuery('#totop').click();
    });






  });



  var labels = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';


  function addGavl() {
    var gavls_cnt = 1;
    gavls_cnt = jQuery("#gavl_trekant_table tr").length;
    console.log(gavls_cnt);
    gavls_cnt++;
    var new_gavl = '<tr id="Gavl1' + gavls_cnt + '"><td>Gavl ' + gavls_cnt + 'a</td><td><div class="w-100 "><input type="number" class="form-control" name="Gavl' + gavls_cnt + 'AL" id="Gavl' + gavls_cnt + 'AL"><span>m</span> </div></td><td><div class="w-100 "><input type="number" class="form-control" name="Gavl' + gavls_cnt + 'AW" id="Gavl' + gavls_cnt + 'AW"><span>m</span> </div></td></tr>';

    //var new_gavl = '<tr id="Gavl'+gavls_cnt+'"><td width="100">Gavl '+gavls_cnt+'a</td><td width="150"><input type="number" name="Gavl'+gavls_cnt+'AL" id="Gavl'+gavls_cnt+'AL"/></td><td width="150"><input type="number" name="Gavl'+gavls_cnt+'AW" id="Gavl'+gavls_cnt+'AW"/></td><td>&nbsp;m</td>td></tr>';
    jQuery("#gavl_trekant_table").append(new_gavl);
    jQuery("#removeGavlBtn").show();
  }
  function removeGavl() {
    var gavls_cnt = jQuery("#gavl_trekant_table tr").length;
    if (gavls_cnt > 1) jQuery("#gavl_trekant_table tr").last().remove();
    if (gavls_cnt <= 2) jQuery("#removeGavlBtn").hide();
  }

  function addFacade() {
    var facades_cnt = 1;
    facades_cnt = jQuery("#facade_stykke_table tr").length;
    facades_cnt++;

    var new_facade = '<tr id="Facade' + facades_cnt + '"><td>Areal ' + labels[facades_cnt - 1] + '</td><td><div class="w-100 "><input type="number" class="form-control" name="Facade' + labels[facades_cnt - 1] + 'L" id="Facade' + labels[facades_cnt - 1] + 'L"><span>m</span> </div></td><td><div class="w-100 "><input type="number" class="form-control" name="Facade' + labels[facades_cnt - 1] + 'W" id="Facade' + labels[facades_cnt - 1] + 'W"><span>m</span> </div></td></tr>';
    //var new_facade = '<tr id="Facade'+facades_cnt+'"><td width="100">Areal '+labels[facades_cnt-1]+'</td><td width="150"><input type="number" name="Facade'+labels[facades_cnt-1]+'L" id="Facade'+labels[facades_cnt-1]+'L"/></td><td width="150"><input type="number" name="Facade'+labels[facades_cnt-1]+'W" id="Facade'+labels[facades_cnt-1]+'W"/></td><td>&nbsp;m</td>td></tr>';
    jQuery("#facade_stykke_table").append(new_facade);
    jQuery("#removeFacadeBtn").show();
  }
  function removeFacade() {
    var facades_cnt = jQuery("#facade_stykke_table tr").length;
    if (facades_cnt > 1) jQuery("#facade_stykke_table tr").last().remove();
    if (facades_cnt <= 2) jQuery("#removeFacadeBtn").hide();
  }

  function addVindue() {
    var vindues_cnt = 1;
    vindues_cnt = jQuery("#vindues_table tr").length;
    vindues_cnt++;
    var new_vindue = '<tr  id="Type1"><td width="100">Type ' + vindues_cnt + '</td><td width="150"><div class="w-100 " ><input type="number" class="form-control" name="vdT' + vindues_cnt + 'S" id="vdT' + vindues_cnt + 'S"><span>m</span> </div></td><td width="150"><div class="w-100 "><input type="number" class="form-control" name="vdT' + vindues_cnt + 'L" id="vdT' + vindues_cnt + 'L"><span>m</span> </div></td><td width="150"><div class="w-100 "><input type="number" class="form-control" name="vdT' + vindues_cnt + 'H" id="vdT' + vindues_cnt + 'H"><span>m</span> </div></td></tr>';
    // var new_vindue = '<tr id="Type1"><td width="100">Type '+vindues_cnt+'</td><td width="150"><input type="number" name="vdT'+vindues_cnt+'S" id="vdT'+vindues_cnt+'S"/></td><td width="150"><input type="number" name="vdT'+vindues_cnt+'L" id="vdT'+vindues_cnt+'L"/></td><td width="150"><input type="number" name="vdT'+vindues_cnt+'H" id="vdT'+vindues_cnt+'H"/></td><td>&nbsp;m</td></tr>';
    jQuery("#vindues_table").append(new_vindue);
    jQuery("#removeVindueBtn").show();
  }

  function removeVindue() {
    var vindues_cnt = jQuery("#vindues_table tr").length;
    if (vindues_cnt > 1) jQuery("#vindues_table tr").last().remove();
    if (vindues_cnt <= 2) jQuery("#removeVindueBtn").hide();
  }



  jQuery(document).ready(function () {
    jQuery("#lengthsTable").css("display", "none");
    jQuery("div.select_product_1980").hide();
  });

</script>
<script type="text/javascript">

  jQuery(".btn_nexttrigger").click(function () {
    jQuery(".btn_next").trigger('click');
    jQuery(".ingen_vindues").trigger('click');

  });

  jQuery("#print_send").click(function () {
    jQuery("#sendtopdf").trigger('click');
  });
  jQuery("#addtocart").click(function () {
    jQuery("#add_to_cart_btn").trigger('click');
  });

</script>


<script>

  var scene = '';

  var scene_custom = '';








  function myfunction() {
    var canvas = document.getElementById("renderCanvas"); // Get the canvas element
    var engine = new BABYLON.Engine(canvas, true);




    var currentScene = null;
    // Generate the BABYLON 3D engine
    // Add your code here matching the playground format
    var createScene = function () {
      if (currentScene) {
        currentScene.dispose();
      }
      var scene = null;
      scene = new BABYLON.Scene(engine);
      currentScene = scene;

      var container = new BABYLON.AssetContainer(scene);

      let instanceCountiw = jQuery("#instanceCounti").val(); //17
      let instanceCountlw = jQuery("#instanceCountl").val(); //12
      let instanceCountuw = jQuery("#instanceCountu").val(); //3
      var msgarr = jQuery("#msgarr").val();

      width = 1;
      heightt = 1;
      positionx = 0;
      positionz = 0;




      //var camera = new BABYLON.ArcRotateCamera("camera1", 0, 0, 10, BABYLON.Vector3.Zero(), scene);
      var camera = new BABYLON.ArcRotateCamera("camera1", 0, 0, 10, BABYLON.Vector3.Zero(), scene);

      // camera.setPosition(new BABYLON.Vector3(5, 2.5, -7.5));



      //  camera.setPosition(new BABYLON.Vector3(5, 0, 0));
      // camera.upperRadiusLimit =30;
      camera.lowerRadiusLimit = 4;
      camera.upperRadiusLimit = 30;
      camera.attachControl(canvas, true);



      //mohit
      let instanceCounti = jQuery("#instanceCounti").val(); //17
      let instanceCountl = jQuery("#instanceCountl").val(); //12
      let instanceCountu = jQuery("#instanceCountu").val(); //3
      var msgarr = jQuery("#msgarr").val();
      var f_color = jQuery("#hid_color").val();
      var flipfance = jQuery("#flipfance").val();
      var f_type = jQuery("#model").val();
      if (flipfance == 0) {
        if (f_type == "3142") {
          camera.setPosition(new BABYLON.Vector3(20, 30, 0));
          camera.targetScreenOffset = new BABYLON.Vector2(-0.5, -1);

        } else {
          camera.setPosition(new BABYLON.Vector3(20, 10, 0));
          camera.targetScreenOffset = new BABYLON.Vector2(-0.5, 1);
        }
      } else {
        if (f_type == "3142") {
          camera.setPosition(new BABYLON.Vector3(20, 30, 0));
          camera.targetScreenOffset = new BABYLON.Vector2(-0.5, -1);
        } else {
          camera.setPosition(new BABYLON.Vector3(20, 10, 0));
          camera.targetScreenOffset = new BABYLON.Vector2(-1, 1);
        }
        //camera.targetScreenOffset = new BABYLON.Vector2(0, -2);	
      }
      var f_type = jQuery("#model").val();



      camera.beta = 0;


      if (f_type != "2900") {
        if (flipfance == "0") {
          camera.alpha = 0;
        } else {
          camera.alpha = 1.58;
        }
      }

      if (f_type == "3347") {
        //scene.clearColor = BABYLON.Color4(0.5, 0.8, 0.6, 0.8);
        scene.clearColor = new BABYLON.Color3(221 / 255, 221 / 255, 221 / 255);
        var light = new BABYLON.HemisphericLight("light1", new BABYLON.Vector3(0, 1, 0), scene);
        light.intensity = 1.0;
        var light2 = new BABYLON.HemisphericLight("light2", new BABYLON.Vector3(0, -1, 0), scene);
        light2.intensity = 1.0;
      } else {
        scene.clearColor = BABYLON.Color4(0.5, 0.8, 0.6, 0.8);
        var light = new BABYLON.HemisphericLight("light1", new BABYLON.Vector3(5, 1, 0), scene);
        light.intensity = 1;
      }


      let value = 99;
      var position = 0;
      // f_color = "black" ;f_type = "v22x130x6";
      if (scene_custom != '') {
        scene_custom.dispose();
      }
      data_id = 0;

      //	var Vælgform=jQuery('input#post').val();


      var index_value = 0
      //instanceCounti = instanceCounti/100;

      for (var index = 0; index < instanceCounti; index++) {


        var z = 0;
        var y = 0;
        const z1 = 0;
        const index_idz = index;
        index_value = index;
        var is_update_y = 0;


        msgarr_arr = JSON.parse(msgarr);
        msgarr_arr_l = msgarr_arr.length;
        //console.log(msgarr_arr);
        //console.log(msgarr_arr_l);
        var custom_arr1 = [];
        var last_height_count = 0;
        var last_height_val = 0;
        for (i = 0; i < msgarr_arr_l; i++) {
          if (f_type == "1824") {
            if (f_color == "Ask" || f_color == "Ash") {
              row_url_1 = "https://fibrotech.it/wp-content/themes/kallyas-child/image/3d/Ask_Basic_panel_605_2440/Ask_Basic_panel_605_2440_" + msgarr_arr[i].heights + ".glb";
            } else if (f_color == "Black_Oak") {

              row_url_1 = "https://fibrotech.it/wp-content/themes/kallyas-child/image/3d/Black_Basic_panel_605_2440/Black_Basic_panel_605_2440_" + msgarr_arr[i].heights + ".glb";
            } else if (f_color == "Grey") {
              row_url_1 = "https://fibrotech.it/wp-content/themes/kallyas-child/image/3d/Grey_Basic_panel_605_2440/Grey_Basic_panel_605_2440_" + msgarr_arr[i].heights + ".glb";
            } else if (f_color == "Light_oak") {
              row_url_1 = "https://fibrotech.it/wp-content/themes/kallyas-child/image/3d/Light_oak_Basic_panel_605_2440/Light_oak_Basic_panel_605_2440_" + msgarr_arr[i].heights + ".glb";
            } else if (f_color == "Olied_Oak") {
              row_url_1 = "https://fibrotech.it/wp-content/themes/kallyas-child/image/3d/Oiled_oak_Basic_panel_605_2440/Oiled_oak_Basic_panel_605_2440_" + msgarr_arr[i].heights + ".glb";
            } else if (f_color == "Smoked_Oak") {
              row_url_1 = "https://fibrotech.it/wp-content/themes/kallyas-child/image/3d/Smoked_oak_Basic_panel_605_2440/Smoked_oak_Basic_panel_605_2440_" + msgarr_arr[i].heights + ".glb";
            } else if (f_color == "Walnut") {
              row_url_1 = "https://fibrotech.it/wp-content/themes/kallyas-child/image/3d/walnut_Basic_panel_605_2440/walnut_Basic_panel_605_2440_" + msgarr_arr[i].heights + ".glb";
            }



          } else if (f_type == "3058") {

            if (f_color == "Ask" || f_color == "Ash") {
                                row_url_1 = "https://fibrotech.it/wp-content/themes/kallyas-child/image/3d/Quanti_ash_520_2440/Quanti_ash_520_2440_" + msgarr_arr[i].heights + ".glb";
                          } else if (f_color == "Black_Oak") {

              row_url_1 = "https://fibrotech.it/wp-content/themes/kallyas-child/image/3d/Quanti_black_520_2440/Quanti_black_520_2440_" + msgarr_arr[i].heights + ".glb";
            } else if (f_color == "Grey_Oak") {
              row_url_1 = "https://fibrotech.it/wp-content/themes/kallyas-child/image/3d/Quanti_grey_520_2440/Quanti_grey_520_2440_" + msgarr_arr[i].heights + ".glb";
            } else if (f_color == "Light_Oak") {
              row_url_1 = "https://fibrotech.it/wp-content/themes/kallyas-child/image/3d/Quanti_light_520_2440/Quanti_light_520_2440_" + msgarr_arr[i].heights + ".glb";
            } else if (f_color == "Olied_Oak") {
              row_url_1 = "https://fibrotech.it/wp-content/themes/kallyas-child/image/3d/Quanti_oiled_520_2440/Quanti_oiled_520_2440_" + msgarr_arr[i].heights + ".glb";
            } else if (f_color == "Smoked_Oak") {
              row_url_1 = "https://fibrotech.it/wp-content/themes/kallyas-child/image/3d/Quanti_smoked_520_2440/Quanti_smoked_520_2440_" + msgarr_arr[i].heights + ".glb";
            } else if (f_color == "Walnut") {
              row_url_1 = "https://fibrotech.it/wp-content/themes/kallyas-child/image/3d/Quanti_walnut_520_2440/Quanti_walnut_520_2440_" + msgarr_arr[i].heights + ".glb";
            }
            else if (f_color == "Light_Oak_m.grå_polyester") {
              row_url_1 = "https://fibrotech.it/wp-content/themes/kallyas-child/image/3d/Quanti_light_grey_520_2440/Quanti_light_grey_520_2440_" + msgarr_arr[i].heights + ".glb";
            }



          }

          else if (f_type == "1325") {
            if (f_color == "Ask" || f_color == "Ash") {

              row_url_1 = "https://fibrotech.it/wp-content/themes/kallyas-child/image/3d/Ask_Proff_Basic_panel_605_3000/Ask_Proff_Basic_panel_605_3000_" + msgarr_arr[i].heights + ".glb";
            } else if (f_color == "Black_Oak") {

              row_url_1 = "https://fibrotech.it/wp-content/themes/kallyas-child/image/3d/Black_Proff_Basic_panel_605_3000/Black_Proff_Basic_panel_605_3000_" + msgarr_arr[i].heights + ".glb";
            } else if (f_color == "Grey") {
              row_url_1 = "https://fibrotech.it/wp-content/themes/kallyas-child/image/3d/Grey_Proff_Basic_panel_605_3000/Grey_Proff_Basic_panel_605_3000_" + msgarr_arr[i].heights + ".glb";
            } else if (f_color == "Light_oak") {
              row_url_1 = "https://fibrotech.it/wp-content/themes/kallyas-child/image/3d/Light_oak_Proff_Basic_panel_605_3000/Light_oak_Proff_Basic_panel_605_3000_" + msgarr_arr[i].heights + ".glb";
            } else if (f_color == "Olied_Oak") {
              row_url_1 = "https://fibrotech.it/wp-content/themes/kallyas-child/image/3d/Oiled_oak_Proff_Basic_panel_605_3000/Oiled_oak_Proff_Basic_panel_605_3000_" + msgarr_arr[i].heights + ".glb";
            } else if (f_color == "Walnut") {
              row_url_1 = "https://fibrotech.it/wp-content/themes/kallyas-child/image/3d/walnut_Proff_Basic_panel_605_3000/walnut_Proff_Basic_panel_605_3000_" + msgarr_arr[i].heights + ".glb";
            } else if (f_color == "Smoked_Oak") {
              row_url_1 = "https://fibrotech.it/wp-content/themes/kallyas-child/image/3d/Smoked_oak_Proff_Basic_panel_605_3000/Smoked_oak_Proff_Basic_panel_605_3000_" + msgarr_arr[i].heights + ".glb";
            }


          }

          else if (f_type == "1520") {
            if (f_color == "Black_Oak") {

              row_url_1 = "https://fibrotech.it/wp-content/themes/kallyas-child/image/3d/Unika_25_Oak_Black/Unika_25_Oak_Black_" + msgarr_arr[i].heights + ".glb";
            } else if (f_color == "Grey") {

              row_url_1 = "https://fibrotech.it/wp-content/themes/kallyas-child/image/3d/Unika_25_Oak_grey/Unika_25_Oak_grey_" + msgarr_arr[i].heights + ".glb";
            } else if (f_color == "Light_Oak") {
              row_url_1 = "https://fibrotech.it/wp-content/themes/kallyas-child/image/3d/Unika_25_Oak_light/Unika_25_Oak_light_" + msgarr_arr[i].heights + ".glb";
            } else if (f_color == "Oiled_Oak") {
              row_url_1 = "https://fibrotech.it/wp-content/themes/kallyas-child/image/3d/Unika_25_Oak_oiled/Unika_25_Oak_oiled_" + msgarr_arr[i].heights + ".glb";
            } else if (f_color == "Smoked_Oak") {
              row_url_1 = "https://fibrotech.it/wp-content/themes/kallyas-child/image/3d/Unika_25_Oak_Smoked/Unika_25_Oak_Smoked_" + msgarr_arr[i].heights + ".glb";
            } else if (f_color == "Walnut") {
              row_url_1 = "https://fibrotech.it/wp-content/themes/kallyas-child/image/3d/Unika_25_Walnut/Unika_25_Walnut_" + msgarr_arr[i].heights + ".glb";
            } else if (f_color == "White_Platinum") {
              row_url_1 = "https://fibrotech.it/wp-content/themes/kallyas-child/image/3d/unika-25-white/unika-25-white_" + msgarr_arr[i].heights + ".glb";
            }


          }
          else if (f_type == "1532") {
            //if(f_color == "Light_Oak")
            //						   {

            row_url_1 = "https://fibrotech.it/wp-content/themes/kallyas-child/image/3d/Unika_35_Oak_Light/Unika_35_Oak_Light_" + msgarr_arr[i].heights + ".glb";
            //}


          }
          else if (f_type == "937") {
            //if(f_color == "Light_Oak")
            //						   {

            row_url_1 = "https://fibrotech.it/wp-content/themes/kallyas-child/image/3d/Light_oak_PROFF_signature_605_3000/Light_oak_PROFF_605_3000_" + msgarr_arr[i].heights + ".glb";
            //}


          } if (f_type == "2900") {

            if (f_color == "Ask" || f_color == "Ash") {
              row_url_1 = "https://fibrotech.it/wp-content/themes/kallyas-child/image/3d/Square_Akustikpanel_520_520/square-ash-520.glb";
            } else if (f_color == "Black_Oak") {

              row_url_1 = "https://fibrotech.it/wp-content/themes/kallyas-child/image/3d/Square_Akustikpanel_520_520/square-black_520.glb";
            } else if (f_color == "Grey_Oak") {
              row_url_1 = "https://fibrotech.it/wp-content/themes/kallyas-child/image/3d/Square_Akustikpanel_520_520/square_grey_panel_520.glb";
            } else if (f_color == "Light_Oak") {
              row_url_1 = "https://fibrotech.it/wp-content/themes/kallyas-child/image/3d/Square_Akustikpanel_520_520/Square_Light_oak_panel.glb";
            } else if (f_color == "Olied_Oak") {
              row_url_1 = "https://fibrotech.it/wp-content/themes/kallyas-child/image/3d/Square_Akustikpanel_520_520/Square_Oiled_oak_panel.glb";
            } else if (f_color == "Smoked_Oak") {
              row_url_1 = "https://fibrotech.it/wp-content/themes/kallyas-child/image/3d/Square_Akustikpanel_520_520/square_Smoked_oak_panel.glb";
            } else if (f_color == "Walnut") {
              row_url_1 = "https://fibrotech.it/wp-content/themes/kallyas-child/image/3d/Square_Akustikpanel_520_520/square_walnut_oak_panel.glb";
            }



          }

          if (f_type == "3347") {
            row_url_1 = "https://fibrotech.it/wp-content/themes/kallyas-child/image/3d/fireguard-polyester-white/fireguard-polyester-white-" + msgarr_arr[i].heights + ".glb";
          }

          glb_data1 = row_url_1;
          //console.log(glb_data1);
          var glbdatasplit = glb_data1.split('/');
          const getimagename = glbdatasplit[8];
          const counttt = glbdatasplit[9].split('_').slice(-1);
          url = glbdatasplit.slice(0, -1);
          seturl = url.join('/') + '/';
          filenameee = glbdatasplit[9];
          const arr_hight = msgarr_arr[i].position;
          //console.log(arr_hight);	
          custom_arr1.push(arr_hight);
          const key_val = i;

          BABYLON.SceneLoader.ImportMesh("", "", glb_data1, scene, function (newMeshes) {

            var mesh1 = null;
            var mesh1 = newMeshes[1];

            mesh1.isVisible = false;
            if (f_type == "3058") {
              if (newMeshes[2]) {
                newMeshes[2].isVisible = false;
              }
            }
            var newInstance = mesh1.createInstance("fence_" + key_val + "_" + index_idz);
            flipfance = jQuery('#flipfance').val();

            console.log("flipfance" + flipfance);
            //newInstance.rotate(new BABYLON.Vector3(0, 160, 0), 1.5);
            //newInstance.rotate(new BABYLON.Vector3(1, 0, 1), 1.5);

            if (f_type != "3058" && f_type != "3347") {
              //if(flipfance == 0)
              {

                if (index_idz == 0) {
                  z = 0;
                  newInstance.position.z = 0;
                } else {

                  if (parseFloat(newInstance.position.z) < 0) { newInstance.position.z = 0; }
                  newInstance.position.z = parseFloat(newInstance.position.z) + (0.594 * index_idz);

                }


                newInstance.position.y = arr_hight;
              }
            }


            if (f_type == "3347") {
              //if(flipfance == 0)
              {

                if (index_idz == 0) {
                  z = 0;
                  newInstance.position.z = 0;
                } else {

                  if (parseFloat(newInstance.position.z) < 0) { newInstance.position.z = 0; }
                  newInstance.position.z = parseFloat(newInstance.position.z) + (0.605 * index_idz);

                }


                newInstance.position.x = (1.205 * key_val);
              }
            }
            if (f_type == "3058") {


              //if(flipfance == 0)
              {

                //newInstance.rotate(new BABYLON.Vector3(1, 1, 1), Math.PI*0.667);	
                if (index_idz == 0) {
                  z = 0;
                  newInstance.position.z = 0;
                } else {

                  if (parseFloat(newInstance.position.z) < 0) { newInstance.position.z = 0; }
                  newInstance.position.z = parseFloat(newInstance.position.z) + (0.594 * index_idz);

                }


                newInstance.position.x = -(arr_hight);
              }


              if (index_idz == 0) {
                z = 0;
                newInstance.position.z = 0;
              } else {

                if (parseFloat(newInstance.position.z) < 0) { newInstance.position.z = 0; }
                newInstance.position.z = (0.52 * index_idz);
              }

            }





            if (f_type == "2900") { } else {
              newInstance.position.y = 0;
            }

            if (f_type == "2900") {

              ro_fence = jQuery("#append_all_heden_input").find('input#ro_fence_' + key_val + '_' + index_idz).val();
              console.log(ro_fence + "----");

              if (key_val % 2 === 0) {
                // Even number
                if (index_idz % 2 === 0) {


                  if (ro_fence == "1") {
                    newInstance.rotate(BABYLON.Axis.Y, (Math.PI / 2));
                    //newInstance.rotate(BABYLON.Axis.X,Math.PI / 2);
                    //newInstance.rotate(BABYLON.Axis.Y, Math.PI);
                    //newInstance.rotate(BABYLON.Axis.Z, Math.PI / 2);								

                  } else {
                    newInstance.rotate(BABYLON.Axis.Y, 0);
                    //newInstance.rotate(BABYLON.Axis.X,0);
                    //newInstance.rotate(BABYLON.Axis.Y, Math.PI);
                    //newInstance.rotate(BABYLON.Axis.Z, Math.PI / 2);
                    if (typeof ro_fence === "undefined") {
                      jQuery("#append_all_heden_input").append('<input type="hidden" id="ro_fence_' + key_val + '_' + index_idz + '" value="0">');
                    }
                  }
                } else {

                  if (ro_fence == "0") {
                    newInstance.rotate(BABYLON.Axis.Y, 0);
                    //newInstance.rotate(BABYLON.Axis.X,0);
                    //newInstance.rotate(BABYLON.Axis.Y, Math.PI);
                    //newInstance.rotate(BABYLON.Axis.Z, Math.PI / 2);
                  } else {
                    newInstance.rotate(BABYLON.Axis.Y, (Math.PI / 2));
                    //newInstance.rotate(BABYLON.Axis.X,Math.PI / 2);
                    //newInstance.rotate(BABYLON.Axis.Y, Math.PI);
                    //newInstance.rotate(BABYLON.Axis.Z, Math.PI / 2);

                    if (typeof ro_fence === "undefined") {
                      jQuery("#append_all_heden_input").append('<input type="hidden" id="ro_fence_' + key_val + '_' + index_idz + '" value="1">');
                    }
                  }
                }


              } else {

                // Odd number
                if (index_idz % 2 === 0) {
                  if (ro_fence == "0") {
                    newInstance.rotate(BABYLON.Axis.Y, (Math.PI));
                    //newInstance.rotate(BABYLON.Axis.X,0);
                    //newInstance.rotate(BABYLON.Axis.Y, Math.PI);
                    //newInstance.rotate(BABYLON.Axis.Z, Math.PI / 2);
                  } else {
                    newInstance.rotate(BABYLON.Axis.Y, -(Math.PI / 2));
                    //newInstance.rotate(BABYLON.Axis.X,Math.PI / 2);
                    //newInstance.rotate(BABYLON.Axis.Y, Math.PI);
                    //newInstance.rotate(BABYLON.Axis.Z, Math.PI / 2);
                    if (typeof ro_fence === "undefined") {
                      jQuery("#append_all_heden_input").append('<input type="hidden" id="ro_fence_' + key_val + '_' + index_idz + '" value="1">');
                    }
                  }

                } else {
                  if (ro_fence == "1") {
                    newInstance.rotate(BABYLON.Axis.Y, -(Math.PI / 2));
                    //newInstance.rotate(BABYLON.Axis.X,Math.PI / 2);
                    //newInstance.rotate(BABYLON.Axis.Y, Math.PI);
                    //newInstance.rotate(BABYLON.Axis.Z, Math.PI / 2);								

                  } else {
                    newInstance.rotate(BABYLON.Axis.Y, (Math.PI));
                    //newInstance.rotate(BABYLON.Axis.X,0);
                    //newInstance.rotate(BABYLON.Axis.Y, Math.PI);
                    //newInstance.rotate(BABYLON.Axis.Z, Math.PI / 2);
                    if (typeof ro_fence === "undefined") {
                      jQuery("#append_all_heden_input").append('<input type="hidden" id="ro_fence_' + key_val + '_' + index_idz + '" value="0">');
                    }
                  }
                }

              }

              //newInstance.rotate(new BABYLON.Vector3(0, 1, 1), Math.PI*0.900);	

                              //newInstance.rotate(new BABYLON.Vector3(1, 1, 1),2.094338);
                            if (index_idz == 0) {
                z = 0;
                newInstance.position.z = 0;
                newInstance.position.x = (0.51 * key_val);
                newInstance.position.y = 0;
              } else {

                if (parseFloat(newInstance.position.z) < 0) { newInstance.position.z = 0; }
                newInstance.position.x = (0.51 * key_val);
                newInstance.position.z = (0.51 * index_idz);
                newInstance.position.y = 0;
              }


              button_hide_show = jQuery("#all_canvas_button_hide_show").find("#canvas_button_hide_show").val();

              if (button_hide_show == "1") {


                var guiPlane = BABYLON.MeshBuilder.CreatePlane("guiPlane", { size: 1 }); // Adjust size as needed
                guiPlane.position = newInstance.position.clone();
                guiPlane.parent = newInstance;
                guiPlane.scaling = new BABYLON.Vector3(0.1, 0.1, 1);
                if (key_val % 2 === 0) {
                  // Even number
                  if (index_idz % 2 === 0) {

                    guiPlane.rotate(BABYLON.Axis.Y, Math.PI / 2, BABYLON.Space.LOCAL);
                    guiPlane.rotate(BABYLON.Axis.X, Math.PI / 2, BABYLON.Space.LOCAL);
                    guiPlane.rotate(BABYLON.Axis.Z, 0, BABYLON.Space.LOCAL);

                    guiPlane.position.z = 0;
                    guiPlane.position.x = 0;
                    guiPlane.position.y = 0.03;
                  } else {

                    guiPlane.rotate(BABYLON.Axis.X, Math.PI / 2);
                    guiPlane.rotate(BABYLON.Axis.Y, 0);
                    guiPlane.rotate(BABYLON.Axis.Z, 0);

                    guiPlane.position.z = 0;
                    guiPlane.position.x = 0;
                    guiPlane.position.y = 0.03;


                  }


                } else {
                  // Odd number
                  if (index_idz % 2 === 0) {

                    guiPlane.rotate(BABYLON.Axis.X, Math.PI / 2);
                    guiPlane.rotate(BABYLON.Axis.Y, 0);
                    guiPlane.rotate(BABYLON.Axis.Z, 0);

                    guiPlane.position.z = 0;
                    guiPlane.position.x = 0;
                    guiPlane.position.y = 0.03;

                  } else {


                    guiPlane.rotate(BABYLON.Axis.Y, Math.PI / 2, BABYLON.Space.LOCAL);
                    guiPlane.rotate(BABYLON.Axis.X, Math.PI / 2, BABYLON.Space.LOCAL);
                    guiPlane.rotate(BABYLON.Axis.Z, 0, BABYLON.Space.LOCAL);

                    guiPlane.position.z = 0;
                    guiPlane.position.x = 0;
                    guiPlane.position.y = 0.03;

                  }

                }
                // Create a GUI image
                var guiImage = new BABYLON.GUI.Image("guiImage", "https://fibrotech.it/wp-content/themes/kallyas-child/image/3d/rotetimage.png");
                guiImage.width = "100px";
                guiImage.height = "100px";

                // Create an advanced dynamic texture for the GUI plane
                var advancedTexture = BABYLON.GUI.AdvancedDynamicTexture.CreateForMesh(guiPlane);
                advancedTexture.addControl(guiImage);

                // Create a material for the GUI plane
                var mat = new BABYLON.StandardMaterial("dog", scene);
                mat.diffuseTexture = new BABYLON.Texture("https://fibrotech.it/wp-content/themes/kallyas-child/image/3d/rotetimage.png", scene);
                mat.diffuseTexture.hasAlpha = true;
                mat.backFaceCulling = false;
                mat.emissiveColor = new BABYLON.Color3(1, 1, 1); // Set emissive color to white
                guiPlane.material = mat;

                // Make the GUI plane pickable
                guiPlane.isPickable = true;

                // Add a pointer down event listener for the plane
                guiPlane.actionManager = new BABYLON.ActionManager(scene);
                guiPlane.actionManager.registerAction(
                  new BABYLON.ExecuteCodeAction(
                    BABYLON.ActionManager.OnPickTrigger,
                    function (event) {
                      //load_service_PopupBox1(key_val, index_idz);
                      ro_fence1 = jQuery("#append_all_heden_input").find('input#ro_fence_' + key_val + '_' + index_idz).val();
                      if (ro_fence1 == "0") {
                        jQuery("#append_all_heden_input").find('input#ro_fence_' + key_val + '_' + index_idz).val(1);
                        ro_fence = 1;
                      } else {
                        jQuery("#append_all_heden_input").find('input#ro_fence_' + key_val + '_' + index_idz).val(0);
                        ro_fence = 0;
                      }

                      //newInstance.rotate(BABYLON.Axis.Y, 0);
                      setTimeout(function () {
                        console.log(key_val + "-" + index_idz);
                        console.log(ro_fence);
                        newInstance.rotation = BABYLON.Vector3.Zero();
                        if (key_val % 2 === 0) {
                          // Even number
                          if (index_idz % 2 === 0) {


                            if (ro_fence == "1") {
                              newInstance.rotate(BABYLON.Axis.Y, (Math.PI / 2));
                              console.log(Math.PI / 2);

                            } else {
                              newInstance.rotate(BABYLON.Axis.Y, 0);
                              console.log(0);
                            }
                          } else {

                            if (ro_fence == "0") {
                              newInstance.rotate(BABYLON.Axis.Y, 0);
                              console.log(0);
                            } else {
                              newInstance.rotate(BABYLON.Axis.Y, (Math.PI / 2));
                              console.log(Math.PI / 2);
                            }
                          }


                        } else {

                          // Odd number
                          if (index_idz % 2 === 0) {
                            if (ro_fence == "0") {
                              newInstance.rotate(BABYLON.Axis.Y, (Math.PI));
                              console.log(Math.PI);
                            } else {
                              newInstance.rotate(BABYLON.Axis.Y, -(Math.PI / 2));
                              console.log(-(Math.PI / 2));

                            }

                          } else {
                            if (ro_fence == "1") {
                              newInstance.rotate(BABYLON.Axis.Y, -(Math.PI / 2));
                              console.log(-(Math.PI / 2));

                            } else {
                              newInstance.rotate(BABYLON.Axis.Y, (Math.PI));
                              console.log(Math.PI);

                            }
                          }

                        }
                      }, 500);

                    }
                  )
                );


              }

            }



          });


        }




      }








      scene.debugLayer.show({
        embedMode: true,
        //embedMode: false,
      });
      //scene.debugLayer.show();



      return scene;

    };
    //fencecolor

    const scene = createScene(); //Call the createScene function
    // Register a render loop to repeatedly render the scene

    engine.runRenderLoop(function () {
      scene.render();
    });



    // Watch for browser/canvas resize events
    window.addEventListener("resize", function () {
      engine.resize();


    });
    jQuery("ul li.sidebar_calc_box1,.sidebar_calc_box2,.sidebar_calc_box3,.sidebar_calc_box4,.sidebar_calc_box5").click(function () {
      scene.dispose();






      var custom_type = 'fence';


      jQuery("#instanceCounti").val('0');
      jQuery("#instanceCountl").val('0');
      jQuery("#instanceCountu").val('0');

      jQuery("#fencetype").val('');


    });

    jQuery("ul li.sidebar_calc_box6").click(function () {
      scene.dispose();





      var custom_type = 'fence';



      jQuery("#fencetype").val('');

    });
    jQuery("ul li.sidebar_calc_box66").click(function () {
      scene.dispose();



    });

  }


  jQuery("#nulstil").click(function () {

    setTimeout(function () {

      location.reload();

    }, 500);



  });



</script>


<script>









  if (jQuery(window).width() < 767) {
    jQuery(".desktop-vo").find(".renderCanvas").removeAttr('id');
    jQuery(".desktop-vo").find("#printpdf").removeAttr('id');
    jQuery(".desktop-vo").find("#fuldskaerm").removeAttr('id');
    jQuery(".desktop-vo").find("#nulstil").removeAttr('id');
    jQuery(".desktop-vo").find("#addtocart").removeAttr('id');
    jQuery(".desktop-vo").find("#testdemo").removeAttr('id');
    jQuery(".desktop-vo").find("#testroter").removeAttr('id');
    //jQuery('.renderCanvas').css('heights','350px');
    // change functionality for smaller screens
  } else {
    jQuery(".modal-vo").find(".renderCanvas").removeAttr('id');
    jQuery(".modal-vo").find("#printpdf").removeAttr('id');
    jQuery(".modal-vo").find("#fuldskaerm").removeAttr('id');
    jQuery(".modal-vo").find("#nulstil").removeAttr('id');
    jQuery(".modal-vo").find("#addtocart").removeAttr('id');
    jQuery(".modal-vo").find("#testdemo").removeAttr('id');
    jQuery(".modal-vo").find("#testroter").removeAttr('id');
    //jQuery(".desktop-vo").find(".renderCanvas").removeAttr('id');
    // document.body.style.overflow = 'hidden';
  }




  jQuery('.renderCanvas').hover(function () {
    if (jQuery(window).width() < 767) {
      //jQuery('.renderCanvas').css('heights','350px');
      // change functionality for smaller screens
    } else {
      document.body.style.overflow = 'hidden';
    }

  }, function () {
    document.body.style.overflow = 'scroll';
  });



  jQuery("#fuldskaerm").click(function () {
    if (jQuery(window).width() > 767) {
      jQuery(".calculator-7 .col-4.desktop-vo.resizeing").css("display", "none !important");
      jQuery(".resizeing").css("width", "0px");
      jQuery(".resizeing").css("min-width", "0px");
      jQuery(".fullwidth").css("width", "100%");
      jQuery(".renderCanvas").css("position", "absolute");
      jQuery("html, body").animate({ scrollTop: 180 });
      jQuery(".minimizebutton").show();
    }
  });

  jQuery(".minimizebutton").click(function () {
    jQuery(".calculator-7 .col-4.desktop-vo.resizeing").css("display", "");
    jQuery(".resizeing").css("width", "35%");
    jQuery(".resizeing").css("min-width", "588px");
    jQuery(".fullwidth").css("width", "65%");
    jQuery(".renderCanvas").css("position", "");

    jQuery(".minimizebutton").hide();
  });

  $('body').on('mouseover', '#renderCanvas', function () {
    $('body, html').css('overflow', 'hidden');
  }).on('mouseout', '#renderCanvas', function () {
    $('body, html').css('overflow', 'auto');
  });

  $(".select_product_937").hide();
  $(".select_accessories.product_item.930").hide();
  $(".select_accessories.product_item.929").hide();
</script>{"id":2113,"date":"2021-10-01T12:36:28","date_gmt":"2021-10-01T12:36:28","guid":{"rendered":"https:\/\/fibrotech.it\/?page_id=2113"},"modified":"2021-10-21T06:44:19","modified_gmt":"2021-10-21T06:44:19","slug":"akustikpanel-beregner","status":"publish","type":"page","link":"https:\/\/fibrotech.it\/da\/akustikpanel-beregner\/","title":{"rendered":"akustikpanel beregner"},"content":{"rendered":"\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-2113","page","type-page","status-publish","hentry","prodpage-classic"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v28.2 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>FibroTech - Beregner til dine akustikpaneler<\/title>\n<meta name=\"description\" content=\"Med vores fibrotech beregner kan du ud fra st\u00f8rrelser og m\u00e5l finde frem til din pris for akustikpaneler - det giver overblik over dine \u00f8nsker.\" \>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \>\n<link rel=\"canonical\" href=\"https:\/\/fibrotech.it\/da\/akustikpanel-beregner\/\" \>\n<meta property=\"og:locale\" content=\"da_DK\" \>\n<meta property=\"og:type\" content=\"article\" \>\n<meta property=\"og:title\" content=\"FibroTech - beregner til dine akustikpaneler\" \>\n<meta property=\"og:description\" content=\"Med vores fibrotech beregner kan du ud fra st\u00f8rrelser og m\u00e5l finde frem til din pris for akustikpaneler - det giver overblik over dine \u00f8nsker.\" \>\n<meta property=\"og:url\" content=\"https:\/\/fibrotech.it\/da\/akustikpanel-beregner\/\" \>\n<meta property=\"og:site_name\" content=\"Fibrotech\" \>\n<meta property=\"article:modified_time\" content=\"2021-10-21T06:44:19+00:00\" \>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/fibrotech.it\\\/it\\\/akustikpanel-beregner\\\/\",\"url\":\"https:\\\/\\\/fibrotech.it\\\/it\\\/akustikpanel-beregner\\\/\",\"name\":\"FibroTech - Beregner til dine akustikpaneler\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/fibrotech.it\\\/it\\\/#website\"},\"datePublished\":\"2021-10-01T12:36:28+00:00\",\"dateModified\":\"2021-10-21T06:44:19+00:00\",\"description\":\"Med vores FibroTech beregner kan du ud fra st\u00f8rrelser og m\u00e5l finde frem til din pris for akustikpaneler - det giver overblik over dine \u00f8nsker.\",\"inLanguage\":\"da-DK\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/fibrotech.it\\\/it\\\/akustikpanel-beregner\\\/\"]}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/fibrotech.it\\\/it\\\/#website\",\"url\":\"https:\\\/\\\/fibrotech.it\\\/it\\\/\",\"name\":\"Fibrotech\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/fibrotech.it\\\/it\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"da-DK\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"FibroTech - Beregner til dine akustikpaneler","description":"Med vores FibroTech beregner kan du ud fra st\u00f8rrelser og m\u00e5l finde frem til din pris for akustikpaneler - det giver overblik over dine \u00f8nsker.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/fibrotech.it\/da\/akustikpanel-beregner\/","og_locale":"da_DK","og_type":"article","og_title":"FibroTech - Beregner til dine akustikpaneler","og_description":"Med vores FibroTech beregner kan du ud fra st\u00f8rrelser og m\u00e5l finde frem til din pris for akustikpaneler - det giver overblik over dine \u00f8nsker.","og_url":"https:\/\/fibrotech.it\/da\/akustikpanel-beregner\/","og_site_name":"Fibrotech","article_modified_time":"2021-10-21T06:44:19+00:00","twitter_card":"summary_large_image","schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/fibrotech.it\/it\/akustikpanel-beregner\/","url":"https:\/\/fibrotech.it\/it\/akustikpanel-beregner\/","name":"FibroTech - Beregner til dine akustikpaneler","isPartOf":{"@id":"https:\/\/fibrotech.it\/it\/#website"},"datePublished":"2021-10-01T12:36:28+00:00","dateModified":"2021-10-21T06:44:19+00:00","description":"Med vores FibroTech beregner kan du ud fra st\u00f8rrelser og m\u00e5l finde frem til din pris for akustikpaneler - det giver overblik over dine \u00f8nsker.","inLanguage":"da-DK","potentialAction":[{"@type":"ReadAction","target":["https:\/\/fibrotech.it\/it\/akustikpanel-beregner\/"]}]},{"@type":"WebSite","@id":"https:\/\/fibrotech.it\/it\/#website","url":"https:\/\/fibrotech.it\/it\/","name":"Fibrotech","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/fibrotech.it\/it\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"da-DK"}]}},"_links":{"self":[{"href":"https:\/\/fibrotech.it\/da\/wp-json\/wp\/v2\/pages\/2113","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/fibrotech.it\/da\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/fibrotech.it\/da\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/fibrotech.it\/da\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/fibrotech.it\/da\/wp-json\/wp\/v2\/comments?post=2113"}],"version-history":[{"count":2,"href":"https:\/\/fibrotech.it\/da\/wp-json\/wp\/v2\/pages\/2113\/revisions"}],"predecessor-version":[{"id":2567,"href":"https:\/\/fibrotech.it\/da\/wp-json\/wp\/v2\/pages\/2113\/revisions\/2567"}],"wp:attachment":[{"href":"https:\/\/fibrotech.it\/da\/wp-json\/wp\/v2\/media?parent=2113"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}