:root {
   --kl-color-1: #64B42D;
   --kl-color-2: #64B42D;
   --kl-color-3: #2C2C2C;
   --kl-bg-color: #FFFFFF;
   --kl-bg-color-2: #FFFFFF;
   --kl-text-color-dark: #000;
   --kl-text-color-light: #FFFFFF;
   --kl-color-gradient: #FFFFFF;

   --kl-border-radius: 8px;
}
body,
header,
footer,
player-view
{
   background: #080808;
}
player-view
{
   color: white;
}
header > .container > ul.menu > li.menu-item.active,
header > .container > ul.menu > li.menu-item:hover
{
   border-bottom: solid 4px #64B42D;
}
header > .container > ul.menu > li.menu-item a
{
   color: #64B42D;
}
@media screen and (min-width: 744px)
{
   header
   {
      border-bottom: solid 4px var(--kl-color-1);
   }
   header > .container > a.logo
   {
      width: 120px;
      height: 120px;
      margin-top: 36px;
   }
   footer
   {
      border-top: solid 4px var(--kl-color-1);
   }
}

error-view
{
   color: #FFF;
}
a
{
   color: #64B42D;
}
section-title > *
{
   color: #FFFFFF;
}
custom-grid[type="news"] > custom-grid-item,
teaser-item
{
   border-radius: 10px; 
   background-color: #E5007D;
}
custom-grid[type="news"] > custom-grid-item .action,
teaser-item .action-container > .action
{
   color: #FFFFFF;
}
custom-grid[type="news"] > custom-grid-item:not(:first-child) .action
{
   color: #64B42D;
}
custom-grid[type="news"] > custom-grid-item:not(:first-child)
{
   background-color: #212121;
}
custom-grid[type="news"] > custom-grid-item .action::after,
teaser-item > .info-container > .action-container > .action::after
{
   content: url('data:image/svg+xml,<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M15.0002 19.9999C15.0002 20.9204 14.254 21.6666 13.3335 21.6666C12.413 21.6666 11.6668 20.9204 11.6668 19.9999C11.6668 19.0794 12.413 18.3333 13.3335 18.3333C14.254 18.3333 15.0002 19.0794 15.0002 19.9999Z" fill="white"/><path d="M21.6668 19.9999C21.6668 20.9204 20.9206 21.6666 20.0002 21.6666C19.0797 21.6666 18.3335 20.9204 18.3335 19.9999C18.3335 19.0794 19.0797 18.3333 20.0002 18.3333C20.9206 18.3333 21.6668 19.0794 21.6668 19.9999Z" fill="white"/><path d="M26.6668 21.6666C27.5873 21.6666 28.3335 20.9204 28.3335 19.9999C28.3335 19.0794 27.5873 18.3333 26.6668 18.3333C25.7464 18.3333 25.0002 19.0794 25.0002 19.9999C25.0002 20.9204 25.7464 21.6666 26.6668 21.6666Z" fill="white"/><path fill-rule="evenodd" clip-rule="evenodd" d="M20.0002 2.08325C10.1051 2.08325 2.0835 10.1048 2.0835 19.9999C2.0835 29.895 10.1051 37.9166 20.0002 37.9166C29.8953 37.9166 37.9168 29.895 37.9168 19.9999C37.9168 10.1048 29.8953 2.08325 20.0002 2.08325ZM4.5835 19.9999C4.5835 11.4855 11.4858 4.58325 20.0002 4.58325C28.5146 4.58325 35.4168 11.4855 35.4168 19.9999C35.4168 28.5143 28.5146 35.4166 20.0002 35.4166C11.4858 35.4166 4.5835 28.5143 4.5835 19.9999Z" fill="white"/></svg>');
}
custom-grid[type="news"] > custom-grid-item:not(:first-child) .action::after
{
   content: url('data:image/svg+xml,<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M15.0002 19.9999C15.0002 20.9204 14.254 21.6666 13.3335 21.6666C12.413 21.6666 11.6668 20.9204 11.6668 19.9999C11.6668 19.0794 12.413 18.3333 13.3335 18.3333C14.254 18.3333 15.0002 19.0794 15.0002 19.9999Z" fill="%2364B42D"/><path d="M21.6668 19.9999C21.6668 20.9204 20.9206 21.6666 20.0002 21.6666C19.0797 21.6666 18.3335 20.9204 18.3335 19.9999C18.3335 19.0794 19.0797 18.3333 20.0002 18.3333C20.9206 18.3333 21.6668 19.0794 21.6668 19.9999Z" fill="%2364B42D"/><path d="M26.6668 21.6666C27.5873 21.6666 28.3335 20.9204 28.3335 19.9999C28.3335 19.0794 27.5873 18.3333 26.6668 18.3333C25.7464 18.3333 25.0002 19.0794 25.0002 19.9999C25.0002 20.9204 25.7464 21.6666 26.6668 21.6666Z" fill="%2364B42D"/><path fill-rule="evenodd" clip-rule="evenodd" d="M20.0002 2.08325C10.1051 2.08325 2.0835 10.1048 2.0835 19.9999C2.0835 29.895 10.1051 37.9166 20.0002 37.9166C29.8953 37.9166 37.9168 29.895 37.9168 19.9999C37.9168 10.1048 29.8953 2.08325 20.0002 2.08325ZM4.5835 19.9999C4.5835 11.4855 11.4858 4.58325 20.0002 4.58325C28.5146 4.58325 35.4168 11.4855 35.4168 19.9999C35.4168 28.5143 28.5146 35.4166 20.0002 35.4166C11.4858 35.4166 4.5835 28.5143 4.5835 19.9999Z" fill="%2364B42D"/></svg>');
}

footer > .social-media > .title
{
   color: #64B42D;
   -webkit-text-fill-color: unset;
}
footer > ul.list > li.list-item > a,
footer > .social-media > .copyright
{
   color: #64B42D;
}
footer > .legal
{
   width: unset;
}
footer > .legal > a
{
   color: #FFFFFF;
   margin: 0 10px;
}
footer > .social-media > ul.list > li.list-item > a.instagram
{
   background-image: url(/images/socials/instagram.svg);
}
footer > .social-media > ul.list > li.list-item > a.youtube
{
   background-image: url(/images/socials/youtube.svg);
}
footer > .social-media > ul.list > li.list-item > a.facebook
{
   background-image: url(/images/socials/facebook.svg);
}
footer > .social-media > ul.list > li.list-item > a.mail
{
   background-image: url(/images/socials/mail.svg);
}
footer > .social-media > ul.list > li.list-item > a.whatsapp
{
   background-image: url(/images/socials/whatsapp.svg);
}
@media screen and (max-width: 743px)
{
   footer
   {
      padding-left: 15px;
      padding-right: 15px;
      display: block;
      height: unset;
   }
   footer > .social-media
   {
      height: unset;
   }
   footer > ul.list
   {
      height: unset;
      display: grid;
      padding: 0;
      width: 100%;
   }
   footer > ul.list > li.list-item
   {
      margin: 0 !important;
   }
   footer > .social-media > .title
   {
      display: none;
   }
   footer > .legal
   {
      display: grid;
      justify-items: flex-start;
      width: 100%;
      row-gap: 5px;
   }
   footer > .legal > a
   {
      margin: 0;
   }
}


news-view > a:first-child
{
   display: none;
}

news-view .news-container
{
   background: #212121;
   color: #FFFFFF;
}
news-view .news-container > img
{
   border-bottom: 3px solid #64B42D;
}
news-view .action
{
   background: #E5007D;
}
news-view .action::after
{
   content: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M13.4697 5.46967C13.7626 5.17678 14.2374 5.17678 14.5303 5.46967L20.5303 11.4697C20.8232 11.7626 20.8232 12.2374 20.5303 12.5303L14.5303 18.5303C14.2374 18.8232 13.7626 18.8232 13.4697 18.5303C13.1768 18.2374 13.1768 17.7626 13.4697 17.4697L18.1893 12.75H4C3.58579 12.75 3.25 12.4142 3.25 12C3.25 11.5858 3.58579 11.25 4 11.25H18.1893L13.4697 6.53033C13.1768 6.23744 13.1768 5.76256 13.4697 5.46967Z" fill="white"/></svg>');
}
@media screen and (min-width: 744px)
{
   news-view .news-container
   {
      border-radius: 8px 8px 0px 0px; 
   }
}
custom-grid[type="news"] > custom-grid-item .info-container > .head-infos > .date-and-title > .date,
news-view .news-container > .info-container > .date
{
   display: none;
}
custom-grid[type="news"] > custom-grid-item .info-container > .head-infos > .date-and-title > .title,
news-view .news-container > .info-container > .title
{
   margin-top: 0;
}




playlist-item
{
   border-bottom: 1px solid #E5007D;
}
playlist-view .brand
{
   color: #E5007D;
}
@media screen and (min-width: 744px)
{
   playlist-view
   {
      border-radius: 4px;
      border: 4px solid #E5007D;
      background: transparent;
      color: #FFFFFF;
   }
   playlist-view > .search > .description
   {
      display: block;
   }
}
@media screen and (max-width: 743px)
{
   playlist-view > .search > .date-and-time > .time-container > .time
   {
      border: 2px solid #E5007D;
      color: #FFFFFF;
   }
   playlist-view .playlist-title
   {
      color: #2C2C2C;
      font-feature-settings: 'clig' off, 'liga' off;
      font-size: 24px;
      font-weight: 700;
      line-height: 130%;
      color: #FFFFFF;
   }
   playlist-view > .search > .date-and-time
   {
      margin-top: 16px;
   }
   playlist-item > .song-info > .title,
   playlist-item > .song-info > .artist,
   playlist-item > .time
   {
      color: #FFFFFF;
   }
}
playlist-view > .search > .date-and-time > .date-container > select.date option
{
   color: #64B42D;
}
playlist-view > .search > .date-and-time > .time-container > select.time option
{
   color: #E5007D;
}
playlist-view > .search > .date-and-time > .date-container > div.date
{
   background: #64B42D;
}
playlist-view > .search > .date-and-time > .time-container > .time
{
   background: #E5007D;
}
playlist-view > .search > .date-and-time > .date-container > .date > regular-icon,
playlist-view > .search > .date-and-time > .time-container > .time > regular-icon
{
   content: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M18.5303 13.4697C18.8232 13.7626 18.8232 14.2374 18.5303 14.5303L12.5303 20.5303C12.2374 20.8232 11.7626 20.8232 11.4697 20.5303L5.46967 14.5303C5.17678 14.2374 5.17678 13.7626 5.46967 13.4697C5.76256 13.1768 6.23744 13.1768 6.53033 13.4697L11.25 18.1893V4C11.25 3.58579 11.5858 3.25 12 3.25C12.4142 3.25 12.75 3.58579 12.75 4V18.1893L17.4697 13.4697C17.7626 13.1768 18.2374 13.1768 18.5303 13.4697Z" fill="white"/></svg>') !important;
}


now-playing > .vote,
now-playing > .song > img
{
   display: none;
}
now-playing > .song > .info > .title,
now-playing > .song > .info > .artist
{
   margin-left: 0;
   color: #FFFFFF;
}



mini-player img
{
   border-radius: 4px;
}
mini-player
{
   border-top: 2px solid #64B42D;
   background: rgba(8, 8, 8, 0.80); 
   backdrop-filter: blur(2px);
}
mini-player regular-icon[type="like"],
mini-player regular-icon[type="dislike"]
{
   display: none;
}

regular-icon[type="arrow-up"][color="gradient"]
{
   background-image: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M12 2.75C6.89137 2.75 2.75 6.89137 2.75 12C2.75 17.1086 6.89137 21.25 12 21.25C17.1086 21.25 21.25 17.1086 21.25 12C21.25 6.89137 17.1086 2.75 12 2.75ZM1.25 12C1.25 6.06294 6.06294 1.25 12 1.25C17.9371 1.25 22.75 6.06294 22.75 12C22.75 17.9371 17.9371 22.75 12 22.75C6.06294 22.75 1.25 17.9371 1.25 12ZM12 9.56066L9.53033 12.0303C9.23744 12.3232 8.76256 12.3232 8.46967 12.0303C8.17678 11.7374 8.17678 11.2626 8.46967 10.9697L11.4697 7.96967C11.7626 7.67678 12.2374 7.67678 12.5303 7.96967L15.5303 10.9697C15.8232 11.2626 15.8232 11.7374 15.5303 12.0303C15.2374 12.3232 14.7626 12.3232 14.4697 12.0303L12 9.56066ZM12 13.5607L9.53033 16.0303C9.23744 16.3232 8.76256 16.3232 8.46967 16.0303C8.17678 15.7374 8.17678 15.2626 8.46967 14.9697L11.4697 11.9697C11.7626 11.6768 12.2374 11.6768 12.5303 11.9697L15.5303 14.9697C15.8232 15.2626 15.8232 15.7374 15.5303 16.0303C15.2374 16.3232 14.7626 16.3232 14.4697 16.0303L12 13.5607Z" fill="%2364B42D"/></svg>');
}
regular-icon[type="arrow-down"][color="purple"]
{
   background-image: url('data:image/svg+xml,<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M15.9998 3.66675C9.18832 3.66675 3.6665 9.18857 3.6665 16.0001C3.6665 22.8116 9.18832 28.3334 15.9998 28.3334C22.8113 28.3334 28.3332 22.8116 28.3332 16.0001C28.3332 9.18857 22.8113 3.66675 15.9998 3.66675ZM1.6665 16.0001C1.6665 8.084 8.08376 1.66675 15.9998 1.66675C23.9159 1.66675 30.3332 8.084 30.3332 16.0001C30.3332 23.9162 23.9159 30.3334 15.9998 30.3334C8.08376 30.3334 1.6665 23.9162 1.6665 16.0001ZM11.2927 10.6263C11.6833 10.2358 12.3164 10.2358 12.7069 10.6263L15.9998 13.9192L19.2927 10.6263C19.6833 10.2358 20.3164 10.2358 20.7069 10.6263C21.0975 11.0168 21.0975 11.65 20.7069 12.0405L16.7069 16.0405C16.3164 16.431 15.6833 16.431 15.2927 16.0405L11.2927 12.0405C10.9022 11.65 10.9022 11.0168 11.2927 10.6263ZM11.2927 15.9596C11.6833 15.5691 12.3164 15.5691 12.7069 15.9596L15.9998 19.2525L19.2927 15.9596C19.6833 15.5691 20.3164 15.5691 20.7069 15.9596C21.0975 16.3502 21.0975 16.9833 20.7069 17.3739L16.7069 21.3739C16.3164 21.7644 15.6833 21.7644 15.2927 21.3739L11.2927 17.3739C10.9022 16.9833 10.9022 16.3502 11.2927 15.9596Z" fill="%2364B42D"/></svg>');
}








/* WORDPRESS RECODE */
.wp-block-media-text
{
   display: flex;
   column-gap: 20px;
   align-items: center;
   justify-content: space-between;
}
.wp-block-media-text img
{
   width: 146px;
   height: 146px;
   object-fit: cover;
   display: block;
}
.wp-block-media-text > div
{
   width: 100%;
}
@media screen and (max-width: 600px)
{
   .wp-block-media-text
   {
      flex-direction: column;
   }
   .wp-block-media-text img
   {
      width: 100%;
      height: auto;
   }
}