.elementor-8953 .elementor-element.elementor-element-b49fcd2:not(.elementor-motion-effects-element-type-background), .elementor-8953 .elementor-element.elementor-element-b49fcd2 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-1143fb0 );}.elementor-8953 .elementor-element.elementor-element-b49fcd2{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;margin-top:0px;margin-bottom:0px;padding:0px 0px 0px 0px;}.elementor-8953 .elementor-element.elementor-element-b49fcd2 > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-8953 .elementor-element.elementor-element-64b17a1 > .elementor-element-populated{margin:0px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;padding:0px 0px 0px 0px;}.elementor-8953 .elementor-element.elementor-element-5ae7af0{--swiper-slides-to-display:1;--swiper-slides-gap:0px;--arrow-prev-left-align:0%;--arrow-prev-translate-x:0px;--arrow-prev-left-position:25px;--arrow-prev-top-align:50%;--arrow-prev-translate-y:-50%;--arrow-prev-top-position:0px;--arrow-next-right-align:0%;--arrow-next-translate-x:0%;--arrow-next-right-position:25px;--arrow-next-top-align:50%;--arrow-next-translate-y:-50%;--arrow-next-top-position:0px;--arrow-size:100%;--arrow-normal-color:var( --e-global-color-1143fb0 );--arrow-hover-color:var( --e-global-color-1143fb0 );}.elementor-8953 .elementor-element.elementor-element-5ae7af0 .swiper-slide > .elementor-element{height:100%;}.elementor-8953 .elementor-element.elementor-element-c4742eb{margin-top:50px;margin-bottom:0px;padding:0px 25px 0px 25px;}.elementor-bc-flex-widget .elementor-8953 .elementor-element.elementor-element-4ec5050.elementor-column .elementor-widget-wrap{align-items:flex-end;}.elementor-8953 .elementor-element.elementor-element-4ec5050.elementor-column.elementor-element[data-element_type="column"] > .elementor-widget-wrap.elementor-element-populated{align-content:flex-end;align-items:flex-end;}.elementor-8953 .elementor-element.elementor-element-4ec5050 > .elementor-widget-wrap > .elementor-widget:not(.elementor-widget__width-auto):not(.elementor-widget__width-initial):not(:last-child):not(.elementor-absolute){margin-block-end:0px;}.elementor-8953 .elementor-element.elementor-element-4ec5050 > .elementor-element-populated{margin:0px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;padding:0px 0px 0px 0px;}.elementor-8953 .elementor-element.elementor-element-bff0ff0{width:auto;max-width:auto;}.elementor-8953 .elementor-element.elementor-element-bff0ff0 .elementor-heading-title{font-family:"Helvetica", Helvetica;font-size:2rem;font-weight:900;text-transform:uppercase;letter-spacing:-1px;color:var( --e-global-color-d65dc1f );}.elementor-8953 .elementor-element.elementor-element-7187ccd{width:auto;max-width:auto;}.elementor-8953 .elementor-element.elementor-element-7187ccd > .elementor-widget-container{margin:0px 0px 2.5px 10px;padding:0px 0px 0px 0px;}.elementor-8953 .elementor-element.elementor-element-7187ccd .elementor-heading-title{font-family:"Helvetica", Helvetica;font-size:1rem;font-weight:400;text-transform:uppercase;text-decoration:none;letter-spacing:-1px;-webkit-text-stroke-color:#000;stroke:#000;color:var( --e-global-color-c752689 );}.elementor-8953 .elementor-element.elementor-element-7187ccd .elementor-heading-title a:hover, .elementor-8953 .elementor-element.elementor-element-7187ccd .elementor-heading-title a:focus{color:var( --e-global-color-d65dc1f );}.elementor-8953 .elementor-element.elementor-element-ae72b86{--grid-columns:4;--grid-row-gap:25px;--grid-column-gap:25px;}.elementor-8953 .elementor-element.elementor-element-ae72b86 > .elementor-widget-container{margin:25px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-8953 .elementor-element.elementor-element-ae72b86 .elementor-loop-container{grid-auto-rows:1fr;}.elementor-8953 .elementor-element.elementor-element-ae72b86 .e-loop-item > .elementor-section, .elementor-8953 .elementor-element.elementor-element-ae72b86 .e-loop-item > .elementor-section > .elementor-container, .elementor-8953 .elementor-element.elementor-element-ae72b86 .e-loop-item > .e-con, .elementor-8953 .elementor-element.elementor-element-ae72b86 .e-loop-item .elementor-section-wrap > .e-con{height:100%;}.elementor-8953 .elementor-element.elementor-element-1dab2d8{margin-top:50px;margin-bottom:0px;padding:0px 25px 0px 25px;}.elementor-bc-flex-widget .elementor-8953 .elementor-element.elementor-element-3a8940c.elementor-column .elementor-widget-wrap{align-items:flex-end;}.elementor-8953 .elementor-element.elementor-element-3a8940c.elementor-column.elementor-element[data-element_type="column"] > .elementor-widget-wrap.elementor-element-populated{align-content:flex-end;align-items:flex-end;}.elementor-8953 .elementor-element.elementor-element-3a8940c > .elementor-widget-wrap > .elementor-widget:not(.elementor-widget__width-auto):not(.elementor-widget__width-initial):not(:last-child):not(.elementor-absolute){margin-block-end:0px;}.elementor-8953 .elementor-element.elementor-element-3a8940c > .elementor-element-populated{margin:0px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;padding:0px 0px 0px 0px;}.elementor-8953 .elementor-element.elementor-element-1bbdd07{width:auto;max-width:auto;}.elementor-8953 .elementor-element.elementor-element-1bbdd07 .elementor-heading-title{font-family:"Helvetica", Helvetica;font-size:2rem;font-weight:900;text-transform:uppercase;letter-spacing:-1px;color:var( --e-global-color-d65dc1f );}.elementor-8953 .elementor-element.elementor-element-3ab8d5b > .elementor-widget-container{margin:25px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-8953 .elementor-element.elementor-element-cb28cb8{margin-top:50px;margin-bottom:0px;padding:0px 25px 0px 25px;}.elementor-bc-flex-widget .elementor-8953 .elementor-element.elementor-element-93d6ec8.elementor-column .elementor-widget-wrap{align-items:flex-end;}.elementor-8953 .elementor-element.elementor-element-93d6ec8.elementor-column.elementor-element[data-element_type="column"] > .elementor-widget-wrap.elementor-element-populated{align-content:flex-end;align-items:flex-end;}.elementor-8953 .elementor-element.elementor-element-93d6ec8 > .elementor-widget-wrap > .elementor-widget:not(.elementor-widget__width-auto):not(.elementor-widget__width-initial):not(:last-child):not(.elementor-absolute){margin-block-end:0px;}.elementor-8953 .elementor-element.elementor-element-93d6ec8 > .elementor-element-populated{margin:0px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;padding:0px 0px 0px 0px;}.elementor-8953 .elementor-element.elementor-element-061598b{width:auto;max-width:auto;}.elementor-8953 .elementor-element.elementor-element-061598b .elementor-heading-title{font-family:"Helvetica", Helvetica;font-size:2rem;font-weight:900;text-transform:uppercase;letter-spacing:-1px;color:var( --e-global-color-d65dc1f );}.elementor-8953 .elementor-element.elementor-element-a36b475{width:auto;max-width:auto;}.elementor-8953 .elementor-element.elementor-element-a36b475 > .elementor-widget-container{margin:0px 0px 2.5px 10px;padding:0px 0px 0px 0px;}.elementor-8953 .elementor-element.elementor-element-a36b475 .elementor-heading-title{font-family:"Helvetica", Helvetica;font-size:1rem;font-weight:400;text-transform:uppercase;text-decoration:none;letter-spacing:-1px;-webkit-text-stroke-color:#000;stroke:#000;color:var( --e-global-color-c752689 );}.elementor-8953 .elementor-element.elementor-element-a36b475 .elementor-heading-title a:hover, .elementor-8953 .elementor-element.elementor-element-a36b475 .elementor-heading-title a:focus{color:var( --e-global-color-d65dc1f );}.elementor-8953 .elementor-element.elementor-element-a195396{margin-top:25px;margin-bottom:0px;padding:0px 25px 0px 25px;}.elementor-8953 .elementor-element.elementor-element-29bb55f > .elementor-widget-wrap > .elementor-widget:not(.elementor-widget__width-auto):not(.elementor-widget__width-initial):not(:last-child):not(.elementor-absolute){margin-block-end:0px;}.elementor-8953 .elementor-element.elementor-element-29bb55f > .elementor-element-populated{margin:0px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;padding:0px 0px 0px 0px;}.elementor-8953 .elementor-element.elementor-element-5da4bd7 > .elementor-widget-container{padding:0px 0px 0px 0px;}.elementor-8953 .elementor-element.elementor-element-5da4bd7 img{width:100%;}.elementor-8953 .elementor-element.elementor-element-25626b4 > .elementor-widget-wrap > .elementor-widget:not(.elementor-widget__width-auto):not(.elementor-widget__width-initial):not(:last-child):not(.elementor-absolute){margin-block-end:0px;}.elementor-8953 .elementor-element.elementor-element-25626b4 > .elementor-element-populated{margin:0px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;padding:0px 0px 0px 0px;}.elementor-8953 .elementor-element.elementor-element-4648ef8 > .elementor-widget-container{padding:0px 0px 0px 0px;}.elementor-8953 .elementor-element.elementor-element-4648ef8 img{width:100%;}.elementor-8953 .elementor-element.elementor-element-8ab6b66 > .elementor-widget-wrap > .elementor-widget:not(.elementor-widget__width-auto):not(.elementor-widget__width-initial):not(:last-child):not(.elementor-absolute){margin-block-end:0px;}.elementor-8953 .elementor-element.elementor-element-8ab6b66 > .elementor-element-populated{margin:0px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;padding:0px 0px 0px 0px;}.elementor-8953 .elementor-element.elementor-element-119ccc8 > .elementor-widget-container{padding:0px 0px 0px 0px;}.elementor-8953 .elementor-element.elementor-element-119ccc8 img{width:100%;}.elementor-8953 .elementor-element.elementor-element-42ab330 > .elementor-widget-wrap > .elementor-widget:not(.elementor-widget__width-auto):not(.elementor-widget__width-initial):not(:last-child):not(.elementor-absolute){margin-block-end:0px;}.elementor-8953 .elementor-element.elementor-element-42ab330 > .elementor-element-populated{margin:0px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;padding:0px 0px 0px 0px;}.elementor-8953 .elementor-element.elementor-element-56d7241 > .elementor-widget-container{padding:0px 0px 0px 0px;}.elementor-8953 .elementor-element.elementor-element-56d7241 img{width:100%;}.elementor-8953 .elementor-element.elementor-element-ce27997 .elementor-button{background-color:#0000FF;font-family:"Helvetica", Helvetica;font-size:1rem;font-weight:900;text-transform:uppercase;text-decoration:none;letter-spacing:-1px;fill:var( --e-global-color-1143fb0 );color:var( --e-global-color-1143fb0 );border-style:none;border-radius:0px 0px 0px 0px;padding:15px 25px 15px 025px;}.elementor-8953 .elementor-element.elementor-element-ce27997 .elementor-button:hover, .elementor-8953 .elementor-element.elementor-element-ce27997 .elementor-button:focus{background-color:var( --e-global-color-d65dc1f );color:var( --e-global-color-1143fb0 );}.elementor-8953 .elementor-element.elementor-element-ce27997 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}body:not(.rtl) .elementor-8953 .elementor-element.elementor-element-ce27997{right:0px;}body.rtl .elementor-8953 .elementor-element.elementor-element-ce27997{left:0px;}.elementor-8953 .elementor-element.elementor-element-ce27997{bottom:0px;}.elementor-8953 .elementor-element.elementor-element-ce27997 .elementor-button-content-wrapper{flex-direction:row-reverse;}.elementor-8953 .elementor-element.elementor-element-ce27997 .elementor-button .elementor-button-content-wrapper{gap:10px;}.elementor-8953 .elementor-element.elementor-element-ce27997 .elementor-button:hover svg, .elementor-8953 .elementor-element.elementor-element-ce27997 .elementor-button:focus svg{fill:var( --e-global-color-1143fb0 );}:root{--page-title-display:none;}@media(max-width:1024px){.elementor-8953 .elementor-element.elementor-element-b49fcd2{padding:0px 0px 0px 0px;}.elementor-8953 .elementor-element.elementor-element-5ae7af0{--swiper-slides-to-display:1;}.elementor-8953 .elementor-element.elementor-element-bff0ff0 .elementor-heading-title{font-size:15px;}.elementor-8953 .elementor-element.elementor-element-7187ccd .elementor-heading-title{font-size:15px;}.elementor-8953 .elementor-element.elementor-element-ae72b86{--grid-columns:2;}.elementor-8953 .elementor-element.elementor-element-1bbdd07 .elementor-heading-title{font-size:15px;}.elementor-8953 .elementor-element.elementor-element-061598b .elementor-heading-title{font-size:15px;}.elementor-8953 .elementor-element.elementor-element-a36b475 .elementor-heading-title{font-size:15px;}.elementor-8953 .elementor-element.elementor-element-ce27997 .elementor-button{font-size:15px;}}@media(max-width:767px){.elementor-8953 .elementor-element.elementor-element-b49fcd2{padding:0px 0px 0px 0px;}.elementor-8953 .elementor-element.elementor-element-5ae7af0{--swiper-slides-to-display:1;--arrow-prev-left-position:15px;--arrow-next-right-position:15px;}.elementor-8953 .elementor-element.elementor-element-c4742eb{margin-top:30px;margin-bottom:0px;padding:0px 015px 0px 15px;}.elementor-8953 .elementor-element.elementor-element-bff0ff0 .elementor-heading-title{font-size:1.15rem;}.elementor-8953 .elementor-element.elementor-element-7187ccd .elementor-heading-title{font-size:15px;}.elementor-8953 .elementor-element.elementor-element-ae72b86{--grid-columns:1;--grid-row-gap:15px;--grid-column-gap:15px;}.elementor-8953 .elementor-element.elementor-element-ae72b86 > .elementor-widget-container{margin:015px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-8953 .elementor-element.elementor-element-1dab2d8{margin-top:30px;margin-bottom:0px;padding:0px 15px 0px 15px;}.elementor-8953 .elementor-element.elementor-element-1bbdd07 .elementor-heading-title{font-size:1.15rem;}.elementor-8953 .elementor-element.elementor-element-3ab8d5b > .elementor-widget-container{margin:16px 0px 0px 0px;}.elementor-8953 .elementor-element.elementor-element-cb28cb8{margin-top:30px;margin-bottom:0px;padding:0px 15px 0px 15px;}.elementor-8953 .elementor-element.elementor-element-061598b .elementor-heading-title{font-size:1.15rem;}.elementor-8953 .elementor-element.elementor-element-a36b475 .elementor-heading-title{font-size:15px;}.elementor-8953 .elementor-element.elementor-element-a195396{margin-top:15px;margin-bottom:0px;padding:0px 15px 0px 15px;}.elementor-8953 .elementor-element.elementor-element-29bb55f > .elementor-element-populated{padding:0px 0px 0px 0px;}.elementor-8953 .elementor-element.elementor-element-25626b4 > .elementor-element-populated{padding:0px 0px 0px 0px;}.elementor-8953 .elementor-element.elementor-element-8ab6b66 > .elementor-widget-wrap > .elementor-widget:not(.elementor-widget__width-auto):not(.elementor-widget__width-initial):not(:last-child):not(.elementor-absolute){margin-block-end:0px;}.elementor-8953 .elementor-element.elementor-element-8ab6b66 > .elementor-element-populated{margin:0px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;padding:0px 0px 0px 0px;}.elementor-8953 .elementor-element.elementor-element-42ab330 > .elementor-widget-wrap > .elementor-widget:not(.elementor-widget__width-auto):not(.elementor-widget__width-initial):not(:last-child):not(.elementor-absolute){margin-block-end:0px;}.elementor-8953 .elementor-element.elementor-element-42ab330 > .elementor-element-populated{margin:0px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;padding:0px 0px 0px 0px;}.elementor-8953 .elementor-element.elementor-element-ce27997 .elementor-button{font-size:0.75rem;padding:12.5px 10px 12.5px 10px;}}/* Start custom CSS for loop-carousel, class: .elementor-element-5ae7af0 *//* 1. Make the widget container the positioning context */
.elementor-widget-loop-carousel > .elementor-widget-container {
position: relative;
}
/* 2. Hard reset Elementor arrow positioning */
.elementor-widget-loop-carousel .elementor-swiper-button {
position: absolute !important;
top: auto !important;
bottom: 25px !important;
left: auto !important;
transform: none !important;
margin: 0 !important;
z-index: 50;
background: white;
padding-left: 5px;
padding-right: 5px;
padding-top: 5px;
padding-bottom: 5px;
}
.elementor-widget-loop-carousel .elementor-swiper-button:hover {
position: absolute !important;
top: auto !important;
bottom: 25px !important;
left: auto !important;
transform: none !important;
margin: 0 !important;
z-index: 50;
background: black;
padding-left: 5px;
padding-right: 5px;
padding-top: 5px;
padding-bottom: 5px;
}
.elementor-widget-loop-carousel .elementor-swiper-button.elementor-swiper-button-next svg, .elementor-widget-loop-carousel .elementor-swiper-button.elementor-swiper-button-prev svg {
fill: black!important;
}
.elementor-widget-loop-carousel .elementor-swiper-button.elementor-swiper-button-next svg:hover, .elementor-widget-loop-carousel .elementor-swiper-button.elementor-swiper-button-prev svg:hover {
fill: white!important;
}
/* 3. Place them next to each other, bottom-right */
.elementor-widget-loop-carousel .elementor-swiper-button-next {
right: 25px !important;
}
.elementor-widget-loop-carousel .elementor-swiper-button-prev {
right: 55px !important;
}
@media (max-width: 767px) {
.elementor-widget-loop-carousel .elementor-swiper-button {
opacity: 0 !important;
pointer-events: none;
}
}/* End custom CSS */
/* Start custom CSS for heading, class: .elementor-element-bff0ff0 */@media screen and (max-width: 768px) {
.elementor-8953 .elementor-element.elementor-element-bff0ff0 * {
font-size: 1.15rem!important;
}
}/* End custom CSS */
/* Start custom CSS for heading, class: .elementor-element-7187ccd */@media screen and (max-width: 768px) {
.elementor-8953 .elementor-element.elementor-element-7187ccd * {
font-size: 0.75rem!important;
margin-bottom: 1.5px!important;
}
}
}/* End custom CSS */
/* Start custom CSS for loop-grid, class: .elementor-element-ae72b86 *//* Mobile horizontal slider - only on section with class homePageArchive */
@media (max-width: 767px) {
.homePageArchive .elementor-loop-container.elementor-grid {
display: flex !important; /* make items in a row */
overflow-x: auto!important; /* allow horizontal scroll */
scroll-snap-type: x mandatory!important; /* snap scrolling */
-webkit-overflow-scrolling: touch!important; /* smooth on iOS */
gap: 15px!important; /* spacing between items */
}
.homePageArchive .elementor-loop-container.elementor-grid > * {
flex: 0 0 80%!important; /* width of each "slide" */
scroll-snap-align: start!important;
}
/* Optional: hide scrollbar for a cleaner look */
.homePageArchive .elementor-loop-container.elementor-grid::-webkit-scrollbar {
display: none!important;
}
}/* End custom CSS */
/* Start custom CSS for heading, class: .elementor-element-1bbdd07 */@media screen and (max-width: 768px) {
.elementor-8953 .elementor-element.elementor-element-1bbdd07 * {
font-size: 1.15rem!important;
}
}/* End custom CSS */
/* Start custom CSS for heading, class: .elementor-element-061598b */@media screen and (max-width: 768px) {
.elementor-8953 .elementor-element.elementor-element-061598b * {
font-size: 1.15rem!important;
}
}/* End custom CSS */
/* Start custom CSS for heading, class: .elementor-element-a36b475 */@media screen and (max-width: 768px) {
.elementor-8953 .elementor-element.elementor-element-a36b475 * {
font-size: 0.75rem!important;
margin-bottom: 1.5px!important;
}
}
}/* End custom CSS */
/* Start custom CSS for image, class: .elementor-element-5da4bd7 */.playlistPic {
position: relative;
display: inline-block;
width: 200px; /* Set your desired width */
aspect-ratio: 1 / 1; /* Keep it square */
overflow: hidden;
transition: transform 0.3s ease;
}
.playlistPic img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center center;
display: block;
cursor: pointer;
}
/* Red overlay */
.playlistPic::after {
content: "";
position: absolute;
top: 0; left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.5); /* red overlay */
opacity: 0;
transition: opacity 0.3s ease;
z-index: 1;
pointer-events: none;
}
.playlistPic:hover::after {
opacity: 1;
}
/* Play button */
.playlistPic::before {
content: url("data:image/svg+xml;utf8,\
");
position: absolute;
top: 50%; left: 50%;
transform: translate(-50%, -50%) scale(1);
opacity: 0;
transition: opacity 0.3s ease, transform 0.3s ease;
z-index: 2;
pointer-events: none;
}
.playlistPic:hover::before {
opacity: 1;
transform: translate(-50%, -50%) scale(1.2);
}
@media screen and (max-width: 768px) {
.playlistPic::before {
content: url("data:image/svg+xml;utf8,\
");
}
}/* End custom CSS */
/* Start custom CSS for image, class: .elementor-element-4648ef8 */.playlistPic {
position: relative;
display: inline-block;
width: 200px; /* Set your desired width */
aspect-ratio: 1 / 1; /* Keep it square */
overflow: hidden;
transition: transform 0.3s ease;
}
.playlistPic img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center center;
display: block;
cursor: pointer;
}
/* Red overlay */
.playlistPic::after {
content: "";
position: absolute;
top: 0; left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.5); /* red overlay */
opacity: 0;
transition: opacity 0.3s ease;
z-index: 1;
pointer-events: none;
}
.playlistPic:hover::after {
opacity: 1;
}
/* Play button */
.playlistPic::before {
content: url("data:image/svg+xml;utf8,\
");
position: absolute;
top: 50%; left: 50%;
transform: translate(-50%, -50%) scale(1);
opacity: 0;
transition: opacity 0.3s ease, transform 0.3s ease;
z-index: 2;
pointer-events: none;
}
.playlistPic:hover::before {
opacity: 1;
transform: translate(-50%, -50%) scale(1.2);
}
@media screen and (max-width: 768px) {
.playlistPic::before {
content: url("data:image/svg+xml;utf8,\
");
}
}/* End custom CSS */
/* Start custom CSS for image, class: .elementor-element-119ccc8 */.playlistPic {
position: relative;
display: inline-block;
width: 200px; /* Set your desired width */
aspect-ratio: 1 / 1; /* Keep it square */
overflow: hidden;
transition: transform 0.3s ease;
}
.playlistPic img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center center;
display: block;
cursor: pointer;
}
/* Red overlay */
.playlistPic::after {
content: "";
position: absolute;
top: 0; left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.5); /* red overlay */
opacity: 0;
transition: opacity 0.3s ease;
z-index: 1;
pointer-events: none;
}
.playlistPic:hover::after {
opacity: 1;
}
/* Play button */
.playlistPic::before {
content: url("data:image/svg+xml;utf8,\
");
position: absolute;
top: 50%; left: 50%;
transform: translate(-50%, -50%) scale(1);
opacity: 0;
transition: opacity 0.3s ease, transform 0.3s ease;
z-index: 2;
pointer-events: none;
}
.playlistPic:hover::before {
opacity: 1;
transform: translate(-50%, -50%) scale(1.2);
}
@media screen and (max-width: 768px) {
.playlistPic::before {
content: url("data:image/svg+xml;utf8,\
");
}
}/* End custom CSS */
/* Start custom CSS for image, class: .elementor-element-56d7241 */.playlistPic {
position: relative;
display: inline-block;
width: 200px; /* Set your desired width */
aspect-ratio: 1 / 1; /* Keep it square */
overflow: hidden;
transition: transform 0.3s ease;
}
.playlistPic img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center center;
display: block;
cursor: pointer;
}
/* Red overlay */
.playlistPic::after {
content: "";
position: absolute;
top: 0; left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.5); /* red overlay */
opacity: 0;
transition: opacity 0.3s ease;
z-index: 1;
pointer-events: none;
}
.playlistPic:hover::after {
opacity: 1;
}
/* Play button */
.playlistPic::before {
content: url("data:image/svg+xml;utf8,\
");
position: absolute;
top: 50%; left: 50%;
transform: translate(-50%, -50%) scale(1);
opacity: 0;
transition: opacity 0.3s ease, transform 0.3s ease;
z-index: 2;
pointer-events: none;
}
.playlistPic:hover::before {
opacity: 1;
transform: translate(-50%, -50%) scale(1.2);
}
@media screen and (max-width: 768px) {
.playlistPic::before {
content: url("data:image/svg+xml;utf8,\
");
}
}/* End custom CSS */
/* Start custom CSS for section, class: .elementor-element-a195396 */.elementor-8953 .elementor-element.elementor-element-a195396 > .elementor-container {
display: flex;
gap: 25px;
}
@media screen and (max-width: 768px) {
.elementor-8953 .elementor-element.elementor-element-a195396 > .elementor-container {
gap: 15px;
}
}
}/* End custom CSS */
/* Start custom CSS for button, class: .elementor-element-ce27997 */@media screen and (max-width: 768px) {
.elementor-8953 .elementor-element.elementor-element-ce27997 * {
font-size: 0.75rem!important;
}
}/* End custom CSS */
/* Start custom CSS */.home {
overflow-x: hidden!important;
}x/* End custom CSS */