section[data-cattype="501"].wrapper_middle{ z-index: 2; overflow: hidden; } [data-cattype="501"] h1{ color: #f87733; text-align: left; font-size: 45px; } [data-cattype="501"] p { text-align: left; color: #282828; } [data-cattype="501"] .right { background-position: 75%; background-repeat: no-repeat; background-size: inherit; position: relative; } [data-cattype="501"] .left { padding: 0 0 0 15%; } [data-cattype="501"] .rotate { animation: animName 4s linear infinite; } @keyframes animName { 0%{ transform: rotate(0deg); } 100%{ transform: rotate(360deg); } } [data-cattype="501"] .rotate-main { height: 650px; margin-top: -80px; margin-left: -100px; } [data-cattype="501"] .svg-inner { width: 850px; } [data-cattype="501"] #rectangle { animation: spin 3s infinite; transform-origin: 150px 100px; } @keyframes spin { 100% { transform: rotate(360deg) } } [data-cattype="501"] #turbine { animation: turbine 7s linear infinite; transform-origin: center 50%; transform-box: fill-box; } @keyframes turbine { to { transform: rotate(1turn); } } [data-cattype="501"] #turbine2 { animation: turbine2 10s linear infinite; transform-origin: center 50%; transform-box: fill-box; } @keyframes turbine2 { to { transform: rotate(-1turn); } } @media (min-width: 1200px) and (max-width: 1650px) { [data-cattype="501"] .svg-inner { width: 600px; } [data-cattype="501"] .rotate-main { height: 430px; margin-top: auto; margin-left: auto; } [data-cattype="501"] .right { background-position: right; } } @media (min-width: 768px) and (max-width: 980px) { [data-cattype="501"] .left { padding: 0px 20px; } [data-cattype="501"] .svg-inner { width: 650px; } [data-cattype="501"] .rotate-main { height: 650px; margin-top: -40px; margin-left: auto; } } @media (max-width: 767px) { } @media (max-width: 480px) { section[data-cattype="501"].wrapper_middle { z-index: 2; padding-top: 0px; } [data-cattype="501"] .left { padding: 0px 20px; } [data-cattype="501"] h1 { text-align: center; font-size: 27px; } [data-cattype="501"] p { text-align: center; } [data-cattype="501"] .svg-inner { width: 100%; } [data-cattype="501"] .rotate-main { margin-top: -50px; margin-left: auto; } [data-cattype="501"] .right { height: 36vh; } }