/*
 Theme Name:     Astra Child
 Description:    Interaktivne obrazky motorov
 Template:       astra
 Version:        1.1
*/

.obr
{border-radius:50%;
width:70px;
height:70px;
position:relative;}

.obr span
{visibility:hidden;
position:absolute;
margin-left:35px;
margin-top:40px;
text-shadow: -2px -2px 10px #000, 2px -2px 10px #000, -2px 2px 10px #000, 2px 2px 10px #000;
color:#fff;
line-height: 1.3;
font-size: 1.15em;}

.obr1
{top:40%;
left:20%;}

.obr2
{top:39%;
left:25%;}

.obr3
{top:-4%;
left:29%;}

.obr4
{top:-4%;
left:41%;}

.obr5
{top:3%;
left:77%;}

.obr6
{top:23%;
left:53%;}

.obr:hover span
{visibility:visible;
transform-origin: top left;
transform-style: preserve-3D;
animation:super .5s linear;
min-width:200px;}

@keyframes super {
0% {transform:scale(0);}
100% {transform:scale(1);}
  }

.obr:before
{content: "";
    display: block;
    position: absolute;
    width: 9px;
    height: 9px;
    margin: 3px;
    top: 28px;
    left: 28px;
    border-radius: 16px;
    background-color: #ba0203;}

.obr:after
{content: "";
    display: block;
    position: relative;
    height: 71px;
    width: 71px;
    border-radius: 50%;
    background-color: rgba(186, 2, 3, 0.3);
    transition: .4s;
    pointer-events: none;
    animation: hostspot-large 2s infinite;}

@keyframes hostspot-large {
            0%, 100% { transform: scale(0.1); opacity: 0; }
            1% { opacity: 1; }
            30% { opacity: 1; }
            70% { transform: scale(1); opacity: 0; }
          }

.obr span:before
{    content: "";
    display: block;
    position: relative;
    width: 1px;
    background: #ba0203;
    transition: transform .5s linear;}

.obr1 span:before
{height:320px;}

.obr2 span:before
{height:260px;}

.obr6 span:before
{height:70px;}

.obr3 span:before
{height:1px;
width:400px;
top:-5px}

.obr4 span:before
{height:1px;
width:400px;
top:-5px}

.obr5 span:before
{height:230px;}

@media (max-width:800px) and (min-width:466px){
.obr1
{top:40%;}

.obr2
{top:39%;}

.obr5
{top:5%;
left:74%;}

.obr6
{top:8%;
	left:45%;}

.obr1 span:before
{height:220px;}

.obr2 span:before
{height:170px;}

.obr6 span:before
{height:90px;}

.obr5 span:before
{height:130px;}
}

@media (max-width:1320px){
  .obr3, .obr4, .obr7, .obr8, .obr9, .obr10, .obr11
  {visibility:hidden;}
}

@media (max-width:465px){
  .novobr
{height: 300px !important;}
  .obr1
{top:37%;
left:11%;}

.obr2
{top:19%;
left:20%;}

.obr5
{top:-58%;
left:70%;}

.obr6
{top:-57%;
left:45%;}

.obr1 span:before
{height:95px;}

.obr2 span:before
{height:90px;}

.obr6 span:before
{height:40px;}

.obr5 span:before
{height:70px;}
}

.novobr
{background-image:url(https://www.vyboelectric.pl/wp-content/uploads/2023/01/LC-elektromotoren.jpg);
background-repeat:no-repeat;
background-size: contain;
background-position:center;
height:750px;
padding-bottom:100px;
width:1000px;
max-width:100%;
margin:0 auto;
overflow-x:visible;}

.obral
{background-image:url(https://www.vyboelectric.pl/wp-content/uploads/2023/08/1AL-elektromotoren.jpg);}

.obrlc
{background-image:url(https://www.vyboelectric.pl/wp-content/uploads/2023/09/LC-motoren-int.jpg);}

.obrh17rl
{background-image:url(https://www.vyboelectric.pl/wp-content/uploads/2023/08/H17RL-motoren.jpg);}

.obrh17r
{background-image:url(https://www.vyboelectric.pl/wp-content/uploads/2023/09/h17r-inter.jpg);}

.obrh27r
{background-image:url(https://www.vyboelectric.pl/wp-content/uploads/2023/09/H27R-vybo.jpg);}

.obrh27sr
{background-image:url(https://www.vyboelectric.pl/wp-content/uploads/2023/09/SR-motoren.jpg);}

.obra550
{background-image:url(https://www.vyboelectric.pl/wp-content/uploads/2023/10/a550-vybo.jpg);}

.obrv800
{background-image:url(https://www.vyboelectric.pl/wp-content/uploads/2023/10/v800-vybo.jpg);}

.obrv810
{background-image:url(https://www.vyboelectric.pl/wp-content/uploads/2023/10/fmv810.jpg);}

.obrv900
{background-image:url(https://www.vyboelectric.pl/wp-content/uploads/2023/10/fmv900.jpg);}

.obrx550
{background-image:url(https://www.vyboelectric.pl/wp-content/uploads/2023/10/fmx550.jpg);}

.obr3 span:after
{content:"Żeliwna skrzynka przyłączeniowa";
float:right}

.obr3al span::after
{content:"Metalowa pokrywa skrzynki zaciskowej";
float:right}

.obr4 span:after
{content:"Maksymalna efektywność energetyczna";
float:right}

.obr4al span:after
{content:"Maksymalna jakość";
float:right}

.obr7
{top:-5%;
left:20%;}

.obr7 span:before
{height:120px;}

.obr8
{top:-38%;
left:38%;}

.obr8 span:before
{height:280px;}

.obr9
{top:-25%;
left:30%;}

.obr9 span:before
{height:120px;}

.obr10
{top:-70%;
left:28%;}

.obr10 span:before
{height:1px;
width:430px;
top:-5px}

.obr10 span:after
{content: "System dosmarowania łożysk";
float: right;}

.obr11
{top:-60%;
left:55%;}

.obr11 span:before
{height:200px;}

/* h17rl */
.obr1rl
{top: 21%;
left: 40%;}
.obr1rl span:before
{height:1px;
width:400px;
top:-5px}
.obr1rl span:after
{content:"Mosiężne dławiki kablowe";
float:right}
.obr2rl
{top: 46%;
left: 25%;}
.obr3rl
{top: -10%;
left: 32%;}
.obr3rl span:after
{content:"Żeliwna skrzynka T";
float:right}
.obr4rl
{top: 10%;
left: 51%;}
.obr4rl span:after
{content:"Bardzo wysoka wydajność";
float:right}
.obr5rl
{top: 20%;
left: 41%;}
.obr6rl
{top: 36%;
left: 48%;}
.obr7rl
{top: -25%;
left: 70%;}
.obr7rl span:before
{height:320px;}
.obr8rl
{top: -13%;
left: 75%;}
.obr8rl span:before
{height:180px;}
.obr9rl
{top: -22%;
left: 59%;}
.obr9rl span:before
{height:180px;}

/* h17r */
.obr1r
{top: 47%;
left: 37%;}
.obr1r span:before
{height: 260px;}
.obr2r
{top: 43%;
left: 27%;}
.obr2r span:before
{height: 220px;}
.obr3r
{top: 8%;
left: 31%;}
.obr3r span:after
{content:"Bardzo wysoka wydajność";
float:right}
.obr3r span:before
{height:1px;
width:300px;
top:-5px}
.obr4r
{top: -5%;
left: 42%;}
.obr4r span:after
{content:"Kompaktowa rama";
float:right}
.obr4r span:before
{height:1px;
width:300px;
top:-5px}
.obr5r
{top: 9%;
left: 42%;}
.obr6r
{top: -25%;
left: 72%;}
.obr6r span:before
{height:320px;}
.obr7r
{top: -16%;
left: 68%;}
.obr7r span:before
{height:200px;}
.obr8r
{top: -17%;
left: 61%;}
.obr8r span:before
{height:155px;}
.obr9r
{top: -40%;
left: 82%;}
.obr10r
{top: -27%;
left: 60%;}
.obr10r span:before
{height: 85px;}

/* h27r */
.obr12r
{top: 55%;
left: 26%;}
.obr12r span:before
{height: 280px;}
.obr22r
{top: 54%;
left: 24%;}
.obr22r span:before
{height: 220px;}
.obr32r
{top: 8%;
left: 31%;}
.obr32r span:after
{content:"Zoptymalizowany przepływ powietrza";
float:right}
.obr32r span:before
{height:1px;
width:400px;
top:-5px}
.obr42r
{top: 19%;
left: 41%;}
.obr42r span:after
{content:"Bardzo wysoka wydajność";
float:right}
.obr42r span:before
{height:1px;
width:300px;
top:-5px}
.obr52r
{top: 35%;
left: 32%;}
.obr52r span:before
{height:140px;}
.obr62r
{top: 18%;
left: 53%;}
.obr62r span:before
{height:160px;}
.obr72r
{top: -3%;
left: 57%;}
.obr72r span:before
{height:220px;}
.obr82r
{top: -3%;
left: 62%;}
.obr82r span:before
{height:130px;}
.obr92r
{top: -27%;
left: 73%;}
.obr92r span:before
{height:200px;}

/* h27r-sr */
.obr12sr
{top: 70%;
left: 43%;}
.obr12sr span:before
{height: 120px;}
.obr22sr
{top: 41%;
left: 42%;}
.obr22sr span:before
{height: 240px;}
.obr32sr
{top: 3%;
left: 41%;}
.obr32sr span:after
{content:"Maksymalna jakość";
float:right}
.obr32sr span:before
{height:1px;
width:350px;
top:-5px}
.obr42sr
{top: 6%;
left: 44%;}
.obr42sr span:after
{content:"Bardzo wysoka wydajność";
float:right}
.obr42sr span:before
{height:1px;
width:400px;
top:-5px}
.obr52sr
{top: 21%;
left: 53%;}
.obr52sr span:before
{height: 150px;}
.obr62sr
{top: -10%;
left: 71%;}
.obr62sr span:before
{height:260px;}

/* a550 */
.obr1a5
{top: 45%;
left: 41%;}
.obr1a5 span:before
{height:340px;}
.obr2a5
{top: 38%;
left: 30%;}
.obr2a5 span:before
{height: 300px;}
.obr3a5
{top: -6%;
left: 44%;}
.obr3a5 span:after
{content:"Zintegrowany wentylator";
float:right}
.obr3a5 span:before
{height:1px;
width:350px;
top:-5px}
.obr4a5
{top: 4%;
left: 37%;}
.obr4a5 span:after
{content:"Zintegrowany wyświetlacz";
float:right}
.obr4a5 span:before
{height:1px;
width:400px;
top:-5px}
.obr5a5
{top: 13%;
left: 57%;}
.obr5a5 span:before
{height: 210px;}

/* v800 */
.obr1v8
{top: 55%;
left: 31%;}
.obr1v8 span:before
{height:280px;}
.obr2v8
{top: 38%;
left: 55%;}
.obr2v8 span:before
{height: 300px;}
.obr3v8
{top: -12%;
left: 51%;}
.obr3v8 span:after
{content:"Wyrafinowany wentylator";
float:right}
.obr3v8 span:before
{height:1px;
width:350px;
top:-5px}
.obr4v8
{top: -8%;
left: 44%;}
.obr4v8 span:after
{content:"Zintegrowana jednostka hamująca do 45kW";
float:right}
.obr4v8 span:before
{height:1px;
width:410px;
top:-5px}
.obr5v8
{top: 23%;
left: 41%;}
.obr5v8 span:before
{height: 210px;}
.obr6v8
{top: 19%;
left: 31%;}
.obr6v8 span:before
{height: 170px;}
.obr7v8
{top: 6%;
left: 62%;}
.obr7v8 span:before
{height: 110px;}
.obr8v8
{top: 9%;
left: 42%;}
.obr8v8 span:before
{height: 90px;}

/* v810 */
.obr1v81
{top: 27%;
left: 36%;}
.obr1v81 span:before
{height:200px;}
.obr2v81
{top: 29%;
left: 47%;}
.obr2v81 span:before
{height: 370px;}
.obr3v81
{top: -14%;
left: 51%;}
.obr3v81 span:after
{content:"Maksymalna wentylacja";
float:right}
.obr3v81 span:before
{height:1px;
width:350px;
top:-5px}
.obr4v81
{top: -12%;
left: 67%;}
.obr4v81 span:after
{content:"Chłodnica metalowa";
float:right}
.obr4v81 span:before
{height:1px;
width:200px;
top:-5px}
.obr5v81
{top: 7%;
left: 40%;}
.obr5v81 span:before
{height: 300px;}
.obr6v81
{top: 4%;
left: 67%;}
.obr6v81 span:before
{height: 170px;}
.obr7v81
{top: 10%;
left: 34%;}
.obr7v81 span:before
{height: 110px;}

/* v900 */
.obr1v9
{top: 27%;
left: 33%;}
.obr1v9 span:before
{height:200px;}
.obr2v9
{top: 29%;
left: 45%;}
.obr2v9 span:before
{height: 390px;}
.obr3v9
{top: -14%;
left: 51%;}
.obr3v9 span:after
{content:"Maksymalna wentylacja";
float:right}
.obr3v9 span:before
{height:1px;
width:350px;
top:-5px}
.obr4v9
{top: -12%;
left: 67%;}
.obr4v9 span:after
{content:"Chłodnica metalowa";
float:right}
.obr4v9 span:before
{height:1px;
width:200px;
top:-5px}
.obr5v9
{top: 7%;
left: 37%;}
.obr5v9 span:before
{height: 320px;}
.obr6v9
{top: 4%;
left: 67%;}
.obr6v9 span:before
{height: 190px;}
.obr7v9
{top: 10%;
left: 28%;}
.obr7v9 span:before
{height: 110px;}
.obr8v9
{top: 10%;
left: 37%;}
.obr8v9 span:before
{height: 90px;}

/* x550 */
.obr1x5
{top: 43%;
left: 29%;}
.obr1x5 span:before
{height:270px;}
.obr2x5
{top: 31%;
left: 62%;}
.obr2x5 span:before
{height: 280px;}
.obr3x5
{top: 3%;
left: 40%;}
.obr3x5 span:after
{content:"Robustes Selbstkühlsystem aus Metall";
float:right}
.obr3x5 span:before
{height:1px;
width:400px;
top:-5px}
.obr4x5
{top: 3%;
left: 42%;}
.obr4x5 span:after
{content:"Modernes Design";
float:right}
.obr4x5 span:before
{height:1px;
width:250px;
top:-5px}
.obr5x5
{top: 7%;
left: 69%;}
.obr5x5 span:before
{height: 200px;}
.obr6x5
{top: 13%;
left: 66%;}
.obr6x5 span:before
{height: 110px;}
.obr7x5
{top: 10%;
left: 36%;}
.obr7x5 span:before
{height: 60px;}