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







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

<script src="https://fibrotech.se/wp-content/themes/kallyas-child/babylonjs/babylonjs.materials.min.js"></script>
<script src="https://fibrotech.se/wp-content/themes/kallyas-child/babylonjs/babylonjs.proceduralTextures.min.js"></script>
<script src="https://fibrotech.se/wp-content/themes/kallyas-child/babylonjs/babylonjs.postProcess.min.js"></script>
<script src="https://fibrotech.se/wp-content/themes/kallyas-child/babylonjs/babylonjs.loaders.js"></script>
<script src="https://fibrotech.se/wp-content/themes/kallyas-child/babylonjs/babylonjs.serializers.min.js"></script>
<script src="https://fibrotech.se/wp-content/themes/kallyas-child/babylonjs/babylon.gui.min.js"></script>
<script src="https://fibrotech.se/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" />
  <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;
    }

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

    @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.se/wp-content/themes/kallyas-child/css/jquery-ui.css" />
  <script src="https://fibrotech.se/wp-content/themes/kallyas-child/js/jquery-1.10.2.js"></script>
  <script src="https://fibrotech.se/wp-content/themes/kallyas-child/js/jquery-ui.js"></script>
  <script src="https://fibrotech.se/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.se/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_1662" data-product_id="1662" data-product_price="101.95">
                  <img class="topFence" style="cursor: pointer;" src="https://fibrotech.se/wp-content/uploads/2021/06/600x600-pixel-BASIC-PROFF-FRONT-PICTURE-all-panels-1.jpg" alt="" />                  <input class="hidTop" type="hidden" value="Retning3" />
                  <p>
                    PREMIUM akustikpanel 22 x 605 x 2440 mm                  </p>
                </div>
                              <div style="" class="select_product select_product_1640" data-product_id="1640" data-product_price="101.95">
                  <img class="topFence" style="cursor: pointer;" src="https://fibrotech.se/wp-content/uploads/2021/06/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_1641" data-product_id="1641" data-product_price="101.95">
                  <img class="topFence" style="cursor: pointer;" src="https://fibrotech.se/wp-content/uploads/2021/06/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_22794" data-product_id="22794" data-product_price="67.95">
                  <img class="topFence" style="cursor: pointer;" src="https://fibrotech.se/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_3030" data-product_id="3030" data-product_price="74.95">
                  <img class="topFence" style="cursor: pointer;" src="https://fibrotech.se/wp-content/uploads/2023/07/QUANTI-Oiled-Oak-udsnit-low-res.jpg" alt="" />                  <input class="hidTop" type="hidden" value="Retning3" />
                  <p>
                    Quanti Akustikpanel 18x520x2440mm                  </p>
                </div>
                              <div style="" class="select_product select_product_2913" data-product_id="2913" data-product_price="40.95">
                  <img class="topFence" style="cursor: pointer;" src="https://fibrotech.se/wp-content/uploads/2023/01/Hvid-sofa-med-52x52-cm-paneler-ASH-Printfile.jpg" alt="" />                  <input class="hidTop" type="hidden" value="Retning3" />
                  <p>
                    Square Akustikpanel 520x520mm                  </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.se/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_1325" data-product_id="1325" data-product_price="133.95">
                  <img class="topFence" style="cursor: pointer;" src="https://fibrotech.se/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 Premium Akustik Panel 3000 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='54' data-tilbehor_product_id="1662" data-tilbehor_product_price="">
                        <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.se/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='55' data-tilbehor_product_id="1662" data-tilbehor_product_price="">
                        <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.se/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='56' data-tilbehor_product_id="1662" data-tilbehor_product_price="">
                        <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.se/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='57' data-tilbehor_product_id="1662" data-tilbehor_product_price="">
                        <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.se/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='58' data-tilbehor_product_id="1662" data-tilbehor_product_price="">
                        <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.se/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='59' data-tilbehor_product_id="1662" data-tilbehor_product_price="">
                        <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.se/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='73' data-tilbehor_product_id="1662" data-tilbehor_product_price="">
                        <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.se/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='39' data-tilbehor_product_id="1640" data-tilbehor_product_price="">
                        <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.se/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='40' data-tilbehor_product_id="1640" data-tilbehor_product_price="">
                        <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.se/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='41' data-tilbehor_product_id="1640" data-tilbehor_product_price="">
                        <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.se/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='42' data-tilbehor_product_id="1640" data-tilbehor_product_price="">
                        <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.se/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='43' data-tilbehor_product_id="1640" data-tilbehor_product_price="">
                        <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.se/wp-content/uploads/2022/11/500-x-500-pixel-WALNUT-UNIKA1.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='44' data-tilbehor_product_id="1640" data-tilbehor_product_price="">
                        <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.se/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='104' data-tilbehor_product_id="1640" data-tilbehor_product_price="">
                        <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.se/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='61' data-tilbehor_product_id="1641" data-tilbehor_product_price="">
                        <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.se/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='62' data-tilbehor_product_id="1641" data-tilbehor_product_price="">
                        <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.se/wp-content/uploads/2021/11/25mm_unika_grey_2.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='63' data-tilbehor_product_id="1641" data-tilbehor_product_price="">
                        <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.se/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='64' data-tilbehor_product_id="1641" data-tilbehor_product_price="">
                        <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.se/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='65' data-tilbehor_product_id="1641" data-tilbehor_product_price="">
                        <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.se/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='66' data-tilbehor_product_id="1641" data-tilbehor_product_price="">
                        <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.se/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='76' data-tilbehor_product_id="1641" data-tilbehor_product_price="">
                        <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.se/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='139' data-tilbehor_product_id="3030" data-tilbehor_product_price="">
                        <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.se/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='140' data-tilbehor_product_id="3030" data-tilbehor_product_price="">
                        <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.se/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='141' data-tilbehor_product_id="3030" data-tilbehor_product_price="">
                        <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.se/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='142' data-tilbehor_product_id="3030" data-tilbehor_product_price="">
                        <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.se/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='146' data-tilbehor_product_id="3030" data-tilbehor_product_price="">
                        <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.se/wp-content/uploads/2023/07/QUANTI-Light-Oak-GREY-Polyester-close-up-low-res-2.jpeg" alt="" />
                        <p style="text-align: center;">Light Oak m.grå polyester</p>
                        <input class="hidAccessories" type="hidden" value="acc1" />
                                                <input class="hid_color" type="hidden" value="Light_Oak_m.grå_polyester" />

                      </div>

              
                      <div style="" class="select_accessories" data-selected="0" attribut_id='143' data-tilbehor_product_id="3030" data-tilbehor_product_price="">
                        <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.se/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='144' data-tilbehor_product_id="3030" data-tilbehor_product_price="">
                        <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.se/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='145' data-tilbehor_product_id="3030" data-tilbehor_product_price="">
                        <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.se/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='54' data-tilbehor_product_id="2913" data-tilbehor_product_price="">
                        <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.se/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='55' data-tilbehor_product_id="2913" data-tilbehor_product_price="">
                        <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.se/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='56' data-tilbehor_product_id="2913" data-tilbehor_product_price="">
                        <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.se/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='57' data-tilbehor_product_id="2913" data-tilbehor_product_price="">
                        <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.se/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='58' data-tilbehor_product_id="2913" data-tilbehor_product_price="">
                        <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.se/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='59' data-tilbehor_product_id="2913" data-tilbehor_product_price="">
                        <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.se/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='73' data-tilbehor_product_id="2913" data-tilbehor_product_price="">
                        <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.se/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='46' data-tilbehor_product_id="1325" data-tilbehor_product_price="">
                        <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.se/wp-content/uploads/2021/02/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.se/wp-content/uploads/2021/02/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.se/wp-content/uploads/2021/02/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.se/wp-content/uploads/2021/02/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.se/wp-content/uploads/2021/02/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.se/wp-content/uploads/2021/02/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.se/wp-content/uploads/2021/02/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='147' data-tilbehor_product_id="1325" data-tilbehor_product_price="">
                        <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.se/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='148' data-tilbehor_product_id="1325" data-tilbehor_product_price="">
                        <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.se/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='149' data-tilbehor_product_id="1325" data-tilbehor_product_price="">
                        <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.se/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='150' data-tilbehor_product_id="1325" data-tilbehor_product_price="">
                        <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.se/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='151' data-tilbehor_product_id="1325" data-tilbehor_product_price="">
                        <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.se/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='152' data-tilbehor_product_id="1325" data-tilbehor_product_price="">
                        <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.se/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='153' data-tilbehor_product_id="1325" data-tilbehor_product_price="">
                        <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.se/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="Acc0" name="Acc0" class="Tilbehørcheckbox"></div>
                      <img class="fenceAccessories" style="cursor: pointer;" src="https://fibrotech.se/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="Acc10" 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.se/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.se/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.se/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 2761" 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.se/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="2761" 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 22678" 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.se/wp-content/uploads/2023/12/FibroTech-Panelskrue-Sort-2395799-150x150.jpg" alt="" />
                      <input class="hidAccessories" type="hidden" value="acc1" />
                      <label style="display: block;text-align: center;" for="Acc1">
                        FibroTech Panelskrue Sort - 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="22678" 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.se/da_dk/beregner_pdf/pdf/terrasse.php/" method="post" name="form" data-trp-original-action="https://fibrotech.se/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_dk"/></form>

              <script type="text/javascript">
                jQuery('.select_accessories').click(function() {
                  jQuery("#threedcreate").val(0);
                });
              </script>

              <script type="text/javascript">
                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 == "2913") {
                          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 == "22794") {
                          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: "Send 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,
                      "pagename": "akustisk"
                    },
                    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(".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>
            </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 == '1662' || selected_product_id == '1641' || selected_product_id == '1640' || selected_product_id == '3030') {
          //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 == '22794') {
          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 == "1641") {

            if (attribut_id == "91" || attribut_id == "61" || attribut_id == "62" || attribut_id == "64" || attribut_id == "65" || attribut_id == "66" || attribut_id == "76") {

              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);





      // Generate the BABYLON 3D engine
      // Add your code here matching the playground format
      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);
        var camera = new BABYLON.ArcRotateCamera("camera1", Math.PI / 2, Math.PI / 2, 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 == "3030") {
            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 == "3030") {
            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 != "2913") {
          if (flipfance == "0") {
            camera.alpha = 0;
          } else {
            camera.alpha = 1.58;
          }
        }

        if (f_type == "22794") {
          //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 == "1662") {
              if (f_color == "Ask" || f_color == "Ash") {
                row_url_1 = "https://fibrotech.se/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.se/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.se/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.se/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.se/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.se/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.se/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 == "1325") {
              if (f_color == "Ask" || f_color == "Ash") {

                row_url_1 = "https://fibrotech.se/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.se/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.se/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.se/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.se/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.se/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.se/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 == "1640") {
              if (f_color == "Black_Oak") {

                row_url_1 = "https://fibrotech.se/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.se/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.se/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.se/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.se/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.se/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.se/wp-content/themes/kallyas-child/image/3d/unika-25-white/unika-25-white_" + msgarr_arr[i].heights + ".glb";
              }


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

              row_url_1 = "https://fibrotech.se/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.se/wp-content/themes/kallyas-child/image/3d/Light_oak_PROFF_signature_605_3000/Light_oak_PROFF_605_3000_" + msgarr_arr[i].heights + ".glb";
              //}


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

              if (f_color == "Ask" || f_color == "Ash") {
                                  row_url_1 = "https://fibrotech.se/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.se/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.se/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.se/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.se/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.se/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.se/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.se/wp-content/themes/kallyas-child/image/3d/Quanti_light_grey_520_2440/Quanti_light_grey_520_2440_" + msgarr_arr[i].heights + ".glb";
              }



            }
            if (f_type == "2913") {

              if (f_color == "Ask" || f_color == "Ash") {
                row_url_1 = "https://fibrotech.se/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.se/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.se/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.se/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.se/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.se/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.se/wp-content/themes/kallyas-child/image/3d/Square_Akustikpanel_520_520/square_walnut_oak_panel.glb";
              }



            }

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

            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 == "3030") {
                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 != "3030" && f_type != "22794") {
                //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 == "22794") {
                //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 == "3030") {


                //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 == "2913") {} else {
                newInstance.position.y = 0;
              }

              if (f_type == "2913") {

                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.se/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.se/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(".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", "block");
      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":2291,"date":"2022-05-17T11:11:16","date_gmt":"2022-05-17T11:11:16","guid":{"rendered":"https:\/\/fibrotech.se\/?page_id=2291"},"modified":"2022-05-17T11:11:16","modified_gmt":"2022-05-17T11:11:16","slug":"akustikpanel-beregner","status":"publish","type":"page","link":"https:\/\/fibrotech.se\/da_dk\/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-2291","page","type-page","status-publish","hentry","prodpage-classic"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.9 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>akustikpanel beregner - Fibrotech - AkustiSKL\u00d6SNINGAR MED FOKUS P\u00c5 DESIGN OCH KVALITET<\/title>\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.se\/da_dk\/akustisk-panelraknare\/\" \>\n<meta property=\"og:locale\" content=\"da_DK\" \>\n<meta property=\"og:type\" content=\"article\" \>\n<meta property=\"og:title\" content=\"akustikpanel beregner - fibrotech akustiskl\u00d6sningar med fokus p\u00c5 design och kvalitet\" \>\n<meta property=\"og:url\" content=\"https:\/\/fibrotech.se\/da_dk\/akustisk-panelraknare\/\" \>\n<meta property=\"og:site_name\" content=\"Fibrotech - akustiskl\u00d6sningar med fokus p\u00c5 design och kvalitet\" \>\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.se\\\/akustisk-panelraknare\\\/\",\"url\":\"https:\\\/\\\/fibrotech.se\\\/akustisk-panelraknare\\\/\",\"name\":\"akustikpanel beregner - Fibrotech - AkustiSKL\u00d6SNINGAR MED FOKUS P\u00c5 DESIGN OCH KVALITET\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/fibrotech.se\\\/sv\\\/#website\"},\"datePublished\":\"2022-05-17T11:11:16+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/fibrotech.se\\\/akustisk-panelraknare\\\/#breadcrumb\"},\"inLanguage\":\"da-DK\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/fibrotech.se\\\/akustisk-panelraknare\\\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/fibrotech.se\\\/akustisk-panelraknare\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Hjem\",\"item\":\"https:\\\/\\\/fibrotech.se\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"akustikpanel beregner\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/fibrotech.se\\\/sv\\\/#website\",\"url\":\"https:\\\/\\\/fibrotech.se\\\/sv\\\/\",\"name\":\"Fibrotech - AkustiSKL\u00d6SNINGAR MED FOKUS P\u00c5 DESIGN OCH KVALITET\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/fibrotech.se\\\/sv\\\/?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":"akustikpanel beregner - Fibrotech - AkustiSKL\u00d6SNINGAR MED FOKUS P\u00c5 DESIGN OCH KVALITET","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.se\/da_dk\/akustisk-panelraknare\/","og_locale":"da_DK","og_type":"article","og_title":"akustikpanel beregner - Fibrotech - AkustiSKL\u00d6SNINGAR MED FOKUS P\u00c5 DESIGN OCH KVALITET","og_url":"https:\/\/fibrotech.se\/da_dk\/akustisk-panelraknare\/","og_site_name":"Fibrotech - AkustiSKL\u00d6SNINGAR MED FOKUS P\u00c5 DESIGN OCH KVALITET","twitter_card":"summary_large_image","schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/fibrotech.se\/akustisk-panelraknare\/","url":"https:\/\/fibrotech.se\/akustisk-panelraknare\/","name":"akustikpanel beregner - Fibrotech - AkustiSKL\u00d6SNINGAR MED FOKUS P\u00c5 DESIGN OCH KVALITET","isPartOf":{"@id":"https:\/\/fibrotech.se\/sv\/#website"},"datePublished":"2022-05-17T11:11:16+00:00","breadcrumb":{"@id":"https:\/\/fibrotech.se\/akustisk-panelraknare\/#breadcrumb"},"inLanguage":"da-DK","potentialAction":[{"@type":"ReadAction","target":["https:\/\/fibrotech.se\/akustisk-panelraknare\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/fibrotech.se\/akustisk-panelraknare\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Hjem","item":"https:\/\/fibrotech.se\/"},{"@type":"ListItem","position":2,"name":"akustikpanel beregner"}]},{"@type":"WebSite","@id":"https:\/\/fibrotech.se\/sv\/#website","url":"https:\/\/fibrotech.se\/sv\/","name":"Fibrotech - AkustiSKL\u00d6SNINGAR MED FOKUS P\u00c5 DESIGN OCH KVALITET","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/fibrotech.se\/sv\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"da-DK"}]}},"_links":{"self":[{"href":"https:\/\/fibrotech.se\/da_dk\/wp-json\/wp\/v2\/pages\/2291","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/fibrotech.se\/da_dk\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/fibrotech.se\/da_dk\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/fibrotech.se\/da_dk\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/fibrotech.se\/da_dk\/wp-json\/wp\/v2\/comments?post=2291"}],"version-history":[{"count":1,"href":"https:\/\/fibrotech.se\/da_dk\/wp-json\/wp\/v2\/pages\/2291\/revisions"}],"predecessor-version":[{"id":2292,"href":"https:\/\/fibrotech.se\/da_dk\/wp-json\/wp\/v2\/pages\/2291\/revisions\/2292"}],"wp:attachment":[{"href":"https:\/\/fibrotech.se\/da_dk\/wp-json\/wp\/v2\/media?parent=2291"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}