.tabacoslide{
    width: 1600px; height: 700px; margin: auto; 
    background-color: #131313;
    background-image: url("../../img/bg/fd4.png");
    background-blend-mode: overlay;
    background-repeat: no-repeat; /* Do not repeat the image */
    background-size: cover; /* Resize the background image to cover the entire container */

}
.imgtabslide{
    width: 1600px; height: 700px; position: absolute;
}
.posxab{position: absolute;}
.cuadrohoja{width: 300px; height: 330px; background-color: #7E6C3E; top: 250px; left: 420px;}
.cuadrohoja img{width: 280px; height: 310px; top:10px; left: 10px; position: absolute;}
.ladobdeltabaco{position: absolute; width: 400px; height: 400px; top: 180px;}
.cirxsld{width: 200px; height: 200px; top: 95px; left: 15px;}
.cirxxlsd1{
	width: 190px; height: 190px; border-radius: 1000px; 
	background-image: linear-gradient(70deg, #BFC8D8, #DAE6FA);
}
.cirxxlsd2{
	width: 150px; height: 150px; border-radius: 1000px; top: 20px; left: 20px;
	background-image: linear-gradient(80deg, #EBEBEB, white);
}
.cirxxlsd3{
	width: 230px; height: 230px; border-radius: 1000px; top:-20px; left: -20px; border: dashed 2px #B9B9B9;
}
.infogg{position: absolute; width: 700px; height: 600px; top: 30px; left: 620px;}
.recdeinf{width: 12px; height: 80px; }
.recdeinf1{top: 60px; left: 170px; transform: rotate(40deg); background-color: #E89C10;}
.recdeinf2{top: 115px; left: 205px; transform: rotate(64deg); background-color: #8BAF20;}
.recdeinf3{top: 200px; left: 210px; transform: rotate(120deg); background-color: #169BBC;}
.recdeinf4{top: 250px; left: 170px; transform: rotate(145deg); background-color: #F9C13E;}

.infoggxx{position: absolute; width: 700px; height: 600px; border: dashed 2px #68B920; top: 30px; left: 400px;}

.recdeinfxx{width: 30px; height: 30px; border-radius: 1000px; background-color: white; box-shadow: 0px 0px 1px 1px #c3c8d2;}
.recdeinf1xx{top: 60px; left: 185px;}
.recdeinf2xx{top: 120px; left: 240px;}
.recdeinf3xx{top: 245px; left: 240px;}
.recdeinf4xx{top: 310px; left: 185px;}

.derecdeifxx p{position: absolute; top: 4px; left: 8px; color: white;}

.derecdeifxx{width: 22px; height: 22px; border-radius: 1000px; left: 4px; top: 4px; text-align: center;}
.derecdeinf1xx{background-color: #E89C10;}
.derecdeinf2xx{background-color: #8BAF20;}
.derecdeinf3xx{background-color: #169BBC;}
.derecdeinf4xx{background-color: #F9C13E;}

.circuloal{
	position: absolute;
    width: 300px;
    height: 300px;
    border: 15px solid  #7e6c3e;
    top: 35px;
    left: -60px;
    border-radius: 1000px;
   
}
.cuadrooal{
	position: absolute;
    width: 200px;
    height: 350px;
   background-color:   #232323;
    top: 25px;
    left: -60px;
   
}

.infocompo{ width: 350px; height: 150px;}
.compopri1{width: 40px; height: 40px; border-radius: 1000px; left: 300px; top: 70px;}
.compciraa{width: 30px; height: 30px; background-color: white; border-radius: 1000px; top: 5px; left: 5px;}
.compciraabarra{width: 20px; height: 10px; left: 280px; top: 85px;}
.compopri2{width: 250px; height: 90px; left: 40px; top: 40px; border-radius: 100px;}
.compcirab{width: 240px; height: 80px; top: 5px; left: 5px; background-color: white; border-radius: 100px;}
.compcirab h1{margin-inline-start: 7px; margin-inline-end: 7px; text-align: justify; font-size: 15px; position: relative; top: 10px; left: 10px;}
.compcirab p{margin-inline-start: 7px; margin-inline-end: 7px; text-align: justify; font-size: 14px;position: relative; top: 15px;}
.compopri4{width: 60px; height: 60px; border-radius: 1000px; left: 10px; top: 5px;}
.compcirac{width: 40px; height: 40px; top: 10px; left: 10px; background-color: white; border-radius: 1000px;}
.compcirac p{position: relative; left: 12px; top: 5px; font-size: 30px;}

.compopri3 {
    width: 0px;
    height: 0px;
    border-left: 15px solid transparent;
    border-right: 15px solid transparent;
    border-top: 20px solid #eba810;
    top: 60px;
    left: 25px;
}

.infocompo1{left: 250px; top: 0px;}
.infocompo2{left: 350px; top: 150px;}
.infocompo3{left: 350px; top: 300px;}
.infocompo4{left: 280px; top: 480px;}

.infocompo1 .compopri1{background: linear-gradient(90deg, #d49219 0%, #e9a511 43%, #ffc30a 100%);}
.infocompo1 .compciraabarra{background: linear-gradient(90deg, #d49219 0%, #e9a511 43%, #ffc30a 100%);}
.infocompo1 .compopri2{background: linear-gradient(90deg, #d49219 0%, #e9a511 43%, #ffc30a 100%);}
.infocompo1 .compopri4{background: linear-gradient(90deg, #d49219 0%, #e9a511 43%, #ffc30a 100%);}
.infocompo1 .compopri3 {border-top: 20px solid #d49219;}

.infocompo2 .compopri1{background: linear-gradient(90deg, #8FC21F 0%, #A6DC25 43%, #AEE627 100%);}
.infocompo2 .compciraabarra{background: linear-gradient(90deg, #8FC21F 0%, #A6DC25 43%, #AEE627 100%);}
.infocompo2 .compopri2{background: linear-gradient(90deg, #8FC21F 0%, #A6DC25 43%, #AEE627 100%);}
.infocompo2 .compopri4{background: linear-gradient(90deg, #8FC21F 0%, #A6DC25 43%, #AEE627 100%);}
.infocompo2 .compopri3 {border-top: 20px solid #8FC21F;}

.infocompo3 .compopri1{background: linear-gradient(90deg, #1A89AD 0%, #1C99C3 43%, #0EA1E0 100%);}
.infocompo3 .compciraabarra{background: linear-gradient(90deg, #1A89AD 0%, #1C99C3 43%, #0EA1E0 100%);}
.infocompo3 .compopri2{background: linear-gradient(90deg, #1A89AD 0%, #1C99C3 43%, #0EA1E0 100%);}
.infocompo3 .compopri4{background: linear-gradient(90deg, #1A89AD 0%, #1C99C3 43%, #0EA1E0 100%);}
.infocompo3 .compopri3 {border-top: 20px solid #1A89AD;}

.infocompo4 .compopri1{background: linear-gradient(90deg, #E9C368 0%, #F2C456 43%, #F9C13E 100%);}
.infocompo4 .compciraabarra{background: linear-gradient(90deg, #E9C368 0%, #F2C456 43%, #F9C13E 100%);}
.infocompo4 .compopri2{background: linear-gradient(90deg, #E9C368 0%, #F2C456 43%, #F9C13E 100%);}
.infocompo4 .compopri4{background: linear-gradient(90deg, #E9C368 0%, #F2C456 43%, #F9C13E 100%);}
.infocompo4 .compopri3 {border-top: 20px solid #E9C368;}

.recta0{border: dashed 2px #B9B9B9;}
.recta1a{width: 150px; top:10px; left: 180px; transform: rotate(-50deg);}
.recta1b{width: 80px; top:142px; left: 225px; transform: rotate(-80deg); display: none;}
.recta2a{width: 150px; top:110px; left: 230px; transform: rotate(332deg);}
.recta3a{width: 120px; top:245px; left: 260px; transform: rotate(347deg);}
.recta3b{width: 80px; top:395px; left: 300px; transform: rotate(-60deg); display: none;}
.recta4a{width: 80px; top:350px; left: 215px; transform: rotate(21deg);}

.traccion{transition: all 1s}
.bordeaccion{border-radius: 0px !important;}