#ombra1 {

display: none;

position:fixed;

top: 158px;

left: 176px;

height: 255px;

width: 150px;

//clip-path: polygon(50% 10%, 100% 38%, 82% 100%, 18% 100%, 0% 38%); 

clip-path: polygon(50% 11%, 98% 39%, 80% 99%, 20% 99%, 2% 39%); 

transform-origin: bottom left;

transform: rotate(0deg);

background: white;

}

#ombra2 {

display: none;

position:fixed;

top: 412px;

left: 176px;

height: 253px;

width: 149px;

//clip-path: polygon(50% 5%, 100% 38%, 82% 100%, 18% 100%, 0% 38%);  

clip-path: polygon(50% 6%, 98% 38%, 81% 99%, 18% 99%, 2% 39%);  

transform: rotate(180deg);

background: white;

}

#box1 {

position:fixed;

top: 165px;

left: 181px;

height: 245px;

width: 140px;

clip-path: polygon(50% 10%, 100% 38%, 82% 100%, 18% 100%, 0% 38%); 

//background-image: url("../tessuti/tessuto_default.jpg");

background-size: cover;

//background-size: 100%;

transform-origin: bottom left;

transform: rotate(0deg);

background: white;

}

#box2 {

position:fixed;

top: 415px;

left: 180px;

height: 245px;

width: 140px;

clip-path: polygon(50% 5%, 100% 38%, 82% 100%, 18% 100%, 0% 38%);  

//background-image: url("../tessuti/tessuto_default.jpg");

background-size: cover;

transform: rotate(180deg);

background: white;

}



#right_panel{

position:fixed;

top:415px;

left: 252px;

height: 151px;

width: 69px;

clip-path: polygon(00% 0%, 65% 0%, 100% 100%, 0% 70%);

transform: rotate(0deg);

//background-image: url("../tessuti/tessuto_default.jpg");

background-size: 350%;

background: white;

}



#diamond{

position:fixed;

top:519px;

left: 190px;

width: 122px;

height: 112px;

clip-path: polygon(50% 0%, 100% 60%, 50% 100%, 0% 64%);

//background-image: url("../tessuti/tessuto_default.jpg");

//background-size: cover;

background-size: 200%;

transform: rotate(180deg);

background: white;

}



.vertical-line{

position:fixed;

top:415px;

left: 251px;

height: 105px;

width: 2px;

background: black;

}



.punta{

position:fixed;

top:631px;

left: 250px;

height: 16px;

width: 2px;

background: black;

transform: rotate(3deg);

}



.obliqua_sinistra{

position:fixed;

top:501px;

left: 216px;

height: 85px;

width: 2px;

background: black;

transform: rotate(55deg);

}



.obliqua_destra{

position:fixed;

top:501px;

left: 285px;

height: 83px;

width: 2px;

background: black;

transform: rotate(304deg);

}



.down_obliqua_sinistra{

position:fixed;

top:550px;

left: 280px;

height: 93px;

width: 2px;

background: black;

transform: rotate(41deg);

}



.down_obliqua_destra{

position:fixed;

top:550px;

left: 220px;

height: 93px;

width: 2px;

background: black;

transform: rotate(318deg);

}



#string_1{

position:fixed;

top:420px;

left: 256px;

height: 10px;

width: 3px;

//background: red;

//background-image: url("../tessuti/silk_string/tessuto_1.jpg");

background: black;

}



#string_2{

position:fixed;

top:440px;

left: 256px;

height: 10px;

width: 3px;

//background-image: url("../tessuti/silk_string/tessuto_1.jpg");

background: black;

}

#string_3{

position:fixed;

top:460px;

left: 256px;

height: 10px;

width: 3px;

//background-image: url("../tessuti/silk_string/tessuto_1.jpg");

background: black;

}

#string_4{

position:fixed;

top:480px;

left: 256px;

height: 10px;

width: 3px;

//background-image: url("../tessuti/silk_string/tessuto_1.jpg");

background: black;

}

#string_5{

position:fixed;

top:500px;

left: 256px;

height: 10px;

width: 3px;

//background-image: url("../tessuti/silk_string/tessuto_1.jpg");

background: black;

}



#details{

position:fixed;

top: 145px;

left: 200px;

height: 30px;

width: 150px;

background: grey;

border-radius: 10px 10px 10px 10px;

}



#scegli_il_tessuto{

position: fixed; 

top: 260px; 

left: 200px;

font-size: 14px;

font-weight: bold;

}

#finger_1{

display: block;

position:fixed;

top: 270px;

left: 235px;

}

#scegli_il_diamante{

display: none;

position:fixed;

top: 555px;

left: 202px;

font-size: 12px;

font-weight: bold;

}

#finger_2{

display: none;

position:fixed;

top: 560px;

left: 235px;

}

#combo_tessuti{

position: fixed; 

top: 140px; 

width: 180px; 

height: 40PX;

background: #85888C; 

font-size: 13px; 

font-weight: bold; 

border: 2px solid white;

text-decoration: none; 

color: black; 

}

#tessuto_scelto{

display: none;

margin-left: 1px; 

text-decoration: none; 

color: white; 

width: 390px; 

height: 10px; 

font-size: 12px;

font-weight: bold;

}

#cornice_arrow_1 {

display: none;

position:fixed;

top: 338px;

left: 120px;

height: 70px;

width: 70px;

background: none;

}

#arrow_1 {

display: none;

position:fixed;

top: 378px;

left: 160px;

height: 30px;

width: 30px;

background: grey;

clip-path: polygon(50% 0%, 10% 100%, 90% 100%);

}

#cornice_arrow_2 {

display: none;

position:fixed;

top: 423px;

left: 120px;

height: 70px;

width: 70px;

background: none;

}

#arrow_2 {

display: none;

position:fixed;

top: 423px;

left: 160px;

height: 30px;

width: 30px;

background: grey;

clip-path: polygon(90% 0, 9% 1%, 50% 100%);

}



#box1_gilet {

position: fixed;

top: 211px;

left: 181px; 

height: 350PX;

width: 270PX;

transform-origin: bottom left;

//transform: rotate(0deg);

transform: scaleX(1);

background: white;

//background-image: url("../tessuti/tessuto_default.jpg");

clip-path: polygon(12% 48%, 12% 90%, 23% 100%, 53% 95%, 60% 88%, 59% 64%, 60% 55%, 63% 44%, 54% 36%, 48% 25%, 48% 19%, 50% 12%, 30% 5%, 26% 18%, 22% 28%, 18% 38%);

}

#box1_gilet_border {

position: fixed;

top: 209px;

left: 180px; 

height: 354PX;

width: 272PX;

transform-origin: bottom left;

//transform: rotate(0deg);

transform: scaleX(1);

background: black;

clip-path: polygon(12% 48%, 12% 90%, 23% 100%, 53% 95%, 60% 88%, 59% 64%, 60% 55%, 63% 44%, 54% 36%, 48% 25%, 48% 19%, 50% 12%, 30% 5%, 26% 18%, 22% 28%, 18% 38%);

}

#box2_gilet {

position: fixed;

top: 211px;

left: 279px; 

height: 350PX;

width: 270PX;

transform-origin: bottom left;

//transform: rotate(0deg);

transform: scaleX(-1);

background: white;

//background-image: url("../tessuti/tessuto_default.jpg");

background: white;

clip-path: polygon(12% 48%, 12% 90%, 23% 100%, 53% 95%, 60% 88%, 59% 64%, 60% 55%, 63% 44%, 54% 36%, 48% 25%, 48% 19%, 50% 12%, 30% 5%, 26% 18%, 22% 28%, 18% 38%);

}

#box2_gilet_border {

position: fixed;

top: 209px;

left: 280px; 

height: 354PX;

width: 272PX;

transform-origin: bottom left;

//transform: rotate(0deg);

transform: scaleX(-1);

background: black;

//background-image: url("../tessuti/tessuto_default.jpg");

clip-path: polygon(12% 48%, 12% 90%, 23% 100%, 53% 95%, 60% 88%, 59% 64%, 60% 55%, 63% 44%, 54% 36%, 48% 25%, 48% 19%, 50% 12%, 30% 5%, 26% 18%, 22% 28%, 18% 38%);

}

#gilet_bottone_1 {

position: fixed;

top: 390px;

left: 230px; 

background: black;

border-radius: 50%;

width: 9px;

height: 9px;

}

#gilet_bottone_2 {

position: fixed;

top: 420px;

left: 230px; 

background: black;

border-radius: 50%;

width: 9px;

height: 9px;

}

#gilet_bottone_3 {

position: fixed;

top: 450px;

left: 230px; 

background: black;

border-radius: 50%;

width: 9px;

height: 9px;

}

#gilet_bottone_4 {

position: fixed;

top: 480px;

left: 230px; 

background: black;

border-radius: 50%;

width: 9px;

height: 9px;

}

#gilet_bottone_5 {

position: fixed;

top: 510px;

left: 230px; 

background: black;

border-radius: 50%;

width: 9px;

height: 9px;

}

#circonferenza_1 {

position: fixed;

top: 391px;

left: 231px; 

background: none;

border-radius: 50%;

width: 10px;

height: 10px;

}

#circonferenza_2 {

position: fixed;

top: 421px;

left: 231px; 

background: none;

border-radius: 50%;

width: 10px;

height: 10px;

}

#circonferenza_3 {

position: fixed;

top: 451px;

left: 231px; 

background: none;

border-radius: 50%;

width: 10px;

height: 10px;

}

#circonferenza_4 {

position: fixed;

top: 481px;

left: 231px; 

background: none;

border-radius: 50%;

width: 10px;

height: 10px;

}

#circonferenza_5 {

position: fixed;

top: 511px;

left: 231px; 

background: none;

border-radius: 50%;

width: 10px;

height: 10px;

}

#gilet_tasca_sx {

position: fixed;

top: 455px;

left: 120px; 

width: 100px;

height: 100px;

clip-path: polygon(16% 16%, 78% 37%, 78% 53%, 19% 33%);

background: black;

}

#gilet_tasca_dx {

position: fixed;

top: 455px;

left: 235px; 

width: 100px;

height: 100px;

clip-path: polygon(16% 16%, 78% 37%, 78% 53%, 19% 33%);

background: black;

transform: scaleX(-1);

}

#gilet_ombra_tasca_sx {

position: fixed;

top: 453px;

left: 119px; 

width: 101px;

height: 103px;

clip-path: polygon(16% 16%, 79% 38%, 79% 54%, 19% 34%);

background: black;

}

#gilet_ombra_tasca_dx {

position: fixed;

top: 453px;

left: 235px; 

width: 101px;

height: 103px;

clip-path: polygon(16% 16%, 79% 38%, 79% 54%, 19% 34%);

transform: scaleX(-1);

background: black;

}