.jctkr-wrapper, .jctkr-wrapper *{ box-sizing: border-box; } .jctkr-wrapper{ position: relative; width: 100%; overflow: hidden; } .jctkr-wrapper ul { position: absolute; left: 0; top: 50%; margin: 0; padding: 0; list-style: none; white-space: nowrap; font-size: 0; opacity: 0; transform: translateY(-50%); -webkit-transition: opacity 1s; transition: opacity 1s; } .jctkr-wrapper.jctkr-initialized ul{ opacity: 1; } .jctkr-wrapper ul li{ display: inline-block; font-family: sans-serif; font-size: 16px; } .eplus-marquee * { letter-spacing: 0; } .eplus-marquee { display: flex; justify-content: space-between; align-items: center; overflow: hidden; flex-wrap: wrap; } .eplus-marquee-wrap { width: 84%; } .eplus-marquee .eplus-marquee-single { transition: 0.3s; margin-bottom: 0 !important; margin-left: 25px; padding-left: 25px; border-left: 1px solid #ccc; line-height: 1 !important; } .eplus-marquee .eplus-marquee-label { width: 14%; text-align: center; display: block; z-index: 1; } .eplus-marquee-1 .eplus-marquee-single { font-size: 19px; } .eplus-marquee-1 .eplus-marquee-label { font-size: 18px; padding: 8px 16px; background-color: #E91E63; color: #fff; font-weight: 600; background-image: linear-gradient( 120deg, #9C27B0 9.6%, #fd0157 96.1% ); border-radius: 3px; } .eplus-marquee-2 { border: 1px solid #eee; } .eplus-marquee-2 .eplus-marquee-single { font-size: 20px; } .eplus-marquee-2 .eplus-marquee-label { font-size: 19px; padding: 10px 17px; background: #F44336; color: #fff; font-weight: 600; margin: -1px 20px -1px -1px; } .eplus-marquee-3 { border: 1px solid #eee; padding: 15px; border-radius: 800px; } .eplus-marquee-3 .eplus-marquee-single { font-size: 20px; } .eplus-marquee-3 .eplus-marquee-label { font-size: 18px; padding: 10px 17px; box-shadow: 0 5px 20px rgba(255, 17, 0, 0.12); color: #f44336; background-color: #fff; font-weight: 600; margin: -15px; border-radius: 50px; } .eplus-marquee-4 .eplus-marquee-single { font-size: 18px; } .eplus-marquee-4 .eplus-marquee-label { background-color: #fff; font-size: 20px; padding: 8px 16px; border-left: 6px solid #f44336; font-weight: 600; color: #f44336; } .eplus-marquee-5 { background-color: #f44336; padding: 15px; background-image: linear-gradient( 30deg, #9C27B0 9.6%, #fd0157 96.1% ); box-shadow: 0 20px 40px rgba(0, 0, 0, 0.2); } .eplus-marquee-5 .eplus-marquee-single a { font-size: 20px; color: rgba(255, 255, 255, 0.55); } .eplus-marquee-5 .eplus-marquee-label { font-size: 19px; color: #fff; font-weight: 600; margin: -15px; border-radius: 0; padding: 13px 19px; background-color: #f44336; background-image: linear-gradient( -130deg, #9C27B0 9.6%, #fd0157 96.1% ); } @media ( max-width: 1170px ) and (min-width: 768px) { .eplus-marquee-wrap { width: 78%; } .eplus-marquee .eplus-marquee-label { width: 18%; } } @media ( max-width: 767px ) { .eplus-marquee-wrap { width: 100%; text-align: center; } .eplus-marquee-3 { border-radius: 4px; } .eplus-marquee .eplus-marquee-label { width: 100%; margin: 0 0 14px; } .eplus-marquee-2 { padding: 12px; } .eplus-marquee-4 .eplus-marquee-label { border-width: 0 6px; border-style: solid; background: #fff; box-shadow: 0 2px 20px rgba(0, 0, 0, 0.1); } .eplus-marquee.jctkr-wrapper ul { position: relative; transform: none; } }