/******************************************************************
  Template Name: Artnation
  Description:  Artnation Music HTML Template
  Author: Colorlib
  Author URI: https://colorlib.com
  Version: 1.0
  Created: Colorlib
******************************************************************/

/*------------------------------------------------------------------
[Table of contents]

1.  Template default CSS
	1.1	Variables
	1.2	Mixins
	1.3	Flexbox
	1.4	Reset
2.  Helper Css
3.  Header Section
4.  Hero Section
5.  Services Section
6.  Track Section
7.  Countdown Section
8.  Team Section
9.  Contact
10.  Footer Style
-------------------------------------------------------------------*/

/*----------------------------------------*/

/* Template default CSS
/*----------------------------------------*/

html,
body {
    height: 100%;
    font-family: "Now Regular", sans-serif;
    -webkit-font-smoothing: antialiased;
    scroll-behavior: smooth;
    /* overflow-x: hidden; */
}

h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 0;
    color: #111111;
    font-weight: 700;
    font-family: "Rajdhani", sans-serif;
}

h1 {
    font-size: 70px;
}

h2 {
    font-size: 36px;
}

h3 {
    font-size: 30px;
}

h4 {
    font-size: 24px;
}

h5 {
    font-size: 18px;
}

h6 {
    font-size: 16px;
}

p {
    font-size: 15px;
    font-family: "Now Regular", sans-serif;
    color: #444444;
    font-weight: 500;
    line-height: 26px;
    margin: 0 0 15px 0;
}

img {
    max-width: 100%;
}

input:focus,
select:focus,
button:focus,
textarea:focus {
    outline: none;
}

a:hover,
a:focus {
    text-decoration: none;
    outline: none;
    color: #ffffff;
}

ul,
ol {
    padding: 0;
    margin: 0;
}

/*---------------------
  Music Collection
-----------------------*/
.music-collection {
    color: white;
}

.section-header h2 {
    font-size: 24px;
    font-weight: 700;
    color: #111111;
    margin-bottom: 0;
}

.section-header a {
    font-size: 14px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.section-header a:hover {
    color: white;
}

.language-switcher a {
    font-size: 14px;
    font-weight: 500;
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.music-card {
    position: relative;
    transition: all 0.3s ease;
    background: #181818;
    padding: 16px;
    border-radius: 8px;
}

.music-card-img {
    position: relative;
    margin-bottom: 16px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.5);
}

.music-card-img img {
    width: 100%;
    border-radius: 4px;
}

.play-hover {
    position: absolute;
    bottom: 8px;
    right: 8px;
    background: #1db954;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    opacity: 0;
    transform: translateY(8px);
    transition: all 0.3s ease;
    cursor: pointer;
}

.music-card:hover .play-hover {
    opacity: 1;
    transform: translateY(0);
}

.music-card-content h5 {
    color: white;
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 8px;
}

.music-card-content p {
    color: #b3b3b3;
    font-size: 14px;
    margin: 0;
}

.artist-card {
    position: relative;
    transition: all 0.3s ease;
    background: #181818;
    padding: 16px;
    border-radius: 8px;
}

.artist-card:hover {
    background: #282828;
}

.artist-card-img {
    position: relative;
    margin-bottom: 16px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.5);
}

.artist-card-img img {
    width: 100%;
    aspect-ratio: 1;
    object-fit: cover;
}

.artist-card-content h5 {
    color: white;
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 8px;
}

.artist-card-content p {
    color: #b3b3b3;
    font-size: 14px;
    margin: 0;
}

/*---------------------
  Helper CSS
-----------------------*/

/* Promotion Section Styles */
.promotion-hero {
    padding: 80px 0;
    background-color: #fff;
    font-family: "Now Regular", sans-serif;
    font-size: 16px;
    line-height: 1.6;
}

.partnership-section {
    padding: 80px 0;
    background-color: #fff;
    font-family: "Now Regular", sans-serif;
    line-height: 1.6;
}

.partnership-section .section-title {
    margin-bottom: 40px;
}

.partnership-section .title {
    margin-bottom: 20px;
    color: #111111;
    line-height: 1.2;
    font-family: "Now Regular", sans-serif;
}

.partnership-section .description {
    font-size: 16px;
    line-height: 1.8;
    max-width: 800px;
    margin: 0 auto;
    color: #444444;
}

.partner-logos .col-lg-3 {
    padding: 15px;
}

.partner-item {
    background: #111111;
    border-radius: 10px;
    padding: 25px;
    height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    border: 1px solid #eee;
}

.partner-item:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    transform: translateY(-5px);
}

.partner-item img {
    max-height: 50px;
    width: auto;
    opacity: 0.8;
    transition: all 0.3s ease;
}

.partner-item:hover img {
    opacity: 1;
}

.partner-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
    border-color: transparent;
}

.partner-item img {
    max-height: 50px;
    width: auto;
    opacity: 0.8;
    transition: all 0.3s ease;
}

.partner-item:hover img {
    opacity: 1;
    filter: brightness(1);
    transform: scale(1.05);
}

@media (max-width: 991px) {
    .partner-item {
        height: 120px;
        padding: 20px;
    }

    .partner-item img {
        max-height: 40px;
    }
}

@media (max-width: 767px) {
    .partnership-section {
        padding: 60px 0;
    }

    .partner-item {
        height: 100px;
        padding: 15px;
    }

    .partner-item img {
        max-height: 35px;
    }
}

/* How it works section */
.how-it-works {
    position: relative;
    overflow: hidden;
}

.how-it-works .section-title h2 {
    font-size: 42px;
    font-weight: 700;
    margin-bottom: 25px;
    color: #1ed760;
}

.how-it-works .btn-apply {
    display: inline-block;
    font-size: 15px;
    text-transform: uppercase;
    padding: 14px 25px 12px;
    color: #111111 !important;
    background: #1ed760;
    border: 1px solid #1ed760;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
}

.process-steps {
    position: relative;
    z-index: 1;
}

.process-steps::before {
    content: "";
    position: absolute;
    top: 40px;
    left: 25%;
    width: 50%;
    height: 2px;
    border-top: 2px dashed rgba(255, 255, 255, 0.3);
    z-index: -1;
}

.process-step {
    position: relative;
    padding: 0 20px;
}

.step-icon {
    width: 80px;
    height: 80px;
    background: #1ed760;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
    position: relative;
    z-index: 2;
}

.step-icon i {
    font-size: 32px;
    color: #fff;
}

.process-step h4 {
    color: #fff;
    font-size: 24px;
    margin: 20px 0 15px;
    font-weight: 600;
}

.process-step p {
    color: rgba(255, 255, 255, 0.8);
    font-size: 16px;
    line-height: 1.6;
    margin: 0;
}

@media (max-width: 991px) {
    .process-steps::before {
        display: none;
    }

    .process-step {
        margin-bottom: 40px;
    }

    .process-step:last-child {
        margin-bottom: 0;
    }
}

.section-title {
    margin-bottom: 40px;
    position: relative;
    z-index: 1;
}

.section-title.center-title {
    text-align: center;
}

.section-title h2 {
    font-size: 42px;
    color: #111111;
    font-weight: 700;
    text-transform: uppercase;
}

.section-title h1 {
    font-size: 100px;
    color: #f2f2f2;
    font-family: "Rockville Solid Regular";
    position: absolute;
    left: 0;
    top: -45px;
    width: 100%;
    z-index: -1;
}

.set-bg {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: top center;
}

.spad {
    padding-top: 100px;
    padding-bottom: 50px;
}

.text-white h1,
.text-white h2,
.text-white h3,
.text-white h4,
.text-white h5,
.text-white h6,
.text-white p,
.text-white span,
.text-white li,
.text-white a {
    color: #fff;
}

.text-dark h1,
.text-dark h2,
.text-dark h3,
.text-dark h4,
.text-dark h5,
.text-dark h6,
.text-dark p,
.text-dark span,
.text-dark li,
.text-dark a {
    color: #000000 !important;
}

/* buttons */

.btn-white {
    display: inline-block;
    font-size: 15px;
    text-transform: uppercase;
    padding: 14px 25px 12px;
    color: black !important;
    background: white;
    letter-spacing: 2px;
    font-weight: 600;
}

.btn-white:hover {
    background: black;
    color: white !important;
}

.btn-white.active {
    background: transparent;
    color: #111111;
    border: 2px solid #111111;
}

.primary-btn {
    display: inline-block;
    font-size: 15px;
    text-transform: uppercase;
    padding: 14px 25px 12px;
    color: #000000 !important;
    background: #ffffff !important;
    letter-spacing: 2px;
    border: 2px solid #000000;
    text-decoration: none;
    font-weight: 600;
    transition: all 0.3s ease;
}

.primary-btn:hover {
    transform: translateY(-2px);
    background: #000000 !important;
    color: #ffffff !important;
    text-decoration: none;
}

@media (max-width: 576px) {
    .primary-btn {
        width: auto;
        min-width: 120px;
        padding: 10px 15px;
        font-size: 0.85rem;
        text-align: center;
    }
}

.site-btn {
    font-size: 15px;
    color: #ffffff;
    background: black;
    font-weight: 700;
    letter-spacing: 2px;
    border: none;
    text-transform: uppercase;
    display: inline-block;
    padding: 14px 30px;
    width: 100%;
}

/* Preloder */

#preloder {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 999999;
    background: #000;
}

.loader {
    width: 40px;
    height: 40px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -13px;
    margin-left: -13px;
    border-radius: 60px;
    animation: loader 0.8s linear infinite;
    -webkit-animation: loader 0.8s linear infinite;
}

@keyframes loader {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
        border: 4px solid #f44336;
        border-left-color: transparent;
    }
    50% {
        -webkit-transform: rotate(180deg);
        transform: rotate(180deg);
        border: 4px solid #673ab7;
        border-left-color: transparent;
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
        border: 4px solid #f44336;
        border-left-color: transparent;
    }
}

@-webkit-keyframes loader {
    0% {
        -webkit-transform: rotate(0deg);
        border: 4px solid #f44336;
        border-left-color: transparent;
    }
    50% {
        -webkit-transform: rotate(180deg);
        border: 4px solid #673ab7;
        border-left-color: transparent;
    }
    100% {
        -webkit-transform: rotate(360deg);
        border: 4px solid #f44336;
        border-left-color: transparent;
    }
}

/*---------------------
  Header
-----------------------*/

.header {
    background: black;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    z-index: 9;
    border-bottom: 0.05rem solid #fff;
}

.header.header--normal {
    position: relative;
    background: black;
}

.header__logo {
    padding: 20px 0 25px;
    width: 200px;
}

.header__logo a {
    display: inline-block;
}

.header__nav {
    text-align: right;
}

.header__menu {
    padding: 31px 0 27px;
    display: inline-block;
    margin-right: 45px;
}

.header__menu ul li {
    list-style: none;
    display: inline-block;
    margin-right: 45px;
    position: relative;
}

.header__menu ul li.active a:after {
    opacity: 1;
}

.header__menu ul li:hover a:after {
    opacity: 1;
}

.header__menu ul li:hover .dropdown {
    top: 34px;
    opacity: 1;
    visibility: visible;
}

.header__menu ul li:last-child {
    margin-right: 0;
}

.header__menu ul li .dropdown {
    position: absolute;
    left: 0;
    top: 56px;
    width: 150px;
    background: #111111;
    text-align: left;
    padding: 2px 0;
    z-index: 9;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all, 0.3s;
    -o-transition: all, 0.3s;
    transition: all, 0.3s;
}

.header__menu ul li .dropdown li {
    display: block;
    margin-right: 0;
}

.header__menu ul li .dropdown li a {
    font-size: 14px;
    color: #ffffff;
    font-weight: 600;
    padding: 8px 20px;
    text-transform: capitalize;
}

.header__menu ul li .dropdown li a:after {
    display: none;
}

.header__menu ul li a {
    font-size: 15px;
    text-transform: uppercase;
    color: #ffffff;
    display: block;
    padding: 6px 0;
    position: relative;
}

.header__menu ul li a:after {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    background: #ffffff;
    content: "";
    -webkit-transition: all, 0.5s;
    -o-transition: all, 0.5s;
    transition: all, 0.5s;
    opacity: 0;
}

.header__right__social {
    display: inline-block;
}

.header__right__social a {
    display: inline-block;
    color: #ffffff;
    margin-right: 5px;
}

.header__right__social a:last-child {
    margin-right: 0;
}

.artist__social__links a {
    font-size: 6px;
    color: #000000;
    margin-right: 16px;
}

.artist__social__links a:last-child {
    margin-right: 0;
}

.slicknav_menu {
    display: none;
}

/* Custom Mobile Menu Styles */
.custom-mobile-menu {
    position: relative;
    width: 100%;
    height: 100%;
}

body.menu-open {
    overflow: hidden;
}

@media (max-width: 767px) {
    .mobile-menu-content {
        position: fixed;
        top: 70px;
        left: 0;
        right: 0;
        width: 100%;
    }
}

/* Media Query for Tablet */
@media (min-width: 768px) and (max-width: 991px) {
    .header__nav {
        display: block !important;
    }

    .header__menu {
        display: none !important;
    }

    .header__right__social {
        display: flex;
        justify-content: flex-end;
    }

    #mobile-menu-wrap {
        display: none !important;
    }

    #mobile-menu-wrap.active {
        display: block !important;
    }
}

/* Media Query for Mobile */
@media (max-width: 767px) {
    .header__nav {
        display: none !important;
    }

    #mobile-menu-wrap {
        display: block !important;
    }
}

.mobile-menu-toggle {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    height: 100%;
    padding: 0;
    cursor: pointer;
    z-index: 10000;
    position: relative;
    float: right;
}

.mobile-menu-toggle i {
    font-size: 24px;
    color: #000000;
    background: rgba(255, 255, 255, 0.8);
    width: 40px;
    height: 40px;
    border-radius: 3px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s;
}

.mobile-menu-toggle i:hover {
    background: rgb(255, 255, 255);
    color: #000000;
}

.mobile-menu-content {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background: #111111;
    z-index: 9999;
    padding: 70px 20px 20px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-10px);
    transition: all 0.3s ease;
    overflow-y: auto;
}

.mobile-menu-close {
    position: absolute;
    top: 20px;
    right: 20px;
    cursor: pointer;
}

.mobile-menu-close i {
    font-size: 24px;
    color: #ffffff;
    background: rgba(229, 54, 55, 0.8);
    width: 40px;
    height: 40px;
    border-radius: 3px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s;
}

.mobile-menu-close i:hover {
    background: rgba(229, 54, 55, 1);
}

.mobile-menu-content.active {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.mobile-menu-content ul {
    list-style: none;
    max-width: 300px;
    margin: 0 auto;
}

.mobile-menu-content ul li {
    margin-bottom: 15px;
}

.mobile-menu-content ul li a {
    color: #ffffff;
    font-size: 16px;
    text-transform: uppercase;
    transition: all 0.3s;
    display: block;
    padding: 8px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    position: relative;
    font-weight: 600;
}

.mobile-menu-content ul li:last-child a {
    border-bottom: none;
}

.mobile-menu-content ul li.active a {
    color: #e53637;
}

.mobile-menu-content ul li.active a:before {
    content: "";
    position: absolute;
    left: -10px;
    top: 50%;
    transform: translateY(-50%);
    width: 5px;
    height: 5px;
    background: #e53637;
    border-radius: 50%;
}

.mobile-menu-content ul li a:hover {
    color: #e53637;
    padding-left: 5px;
}

.mobile-menu-social {
    margin-top: 20px;
    display: flex;
    justify-content: center;
    padding-top: 15px;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    max-width: 300px;
    margin-left: auto;
    margin-right: auto;
}

.mobile-menu-language {
    margin-top: 20px;
    display: flex;
    justify-content: center;
    padding-top: 15px;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    max-width: 300px;
    margin-left: auto;
    margin-right: auto;
}

.mobile-menu-social a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    margin-right: 15px;
    font-size: 16px;
    width: 36px;
    height: 36px;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 50%;
    transition: all 0.3s;
}

.mobile-menu-social a:hover {
    background: #e53637;
    transform: translateY(-3px);
}

.mobile-menu-social a:last-child {
    margin-right: 0;
}

/*---------------------
  Hero
-----------------------*/

.hero {
    padding-top: 150px;
    padding-bottom: 200px;
    position: relative;
}

.hero__text {
    text-align: center;
}

.hero__text span {
    color: #ffffff;
    text-transform: uppercase;
    letter-spacing: 6px;
    font-weight: 600;
}

.hero__text h1 {
    font-size: 110px;
    font-family: "Rockville Solid Regular";
    color: #ffffff;
    margin-bottom: 20px;
    margin-top: 22px;
}

.hero__text p {
    color: #ffffff;
    margin-bottom: 20px;
    font-weight: 500;
}

.hero__text .play-btn {
    font-size: 26px;
    color: black;
    height: 90px;
    width: 90px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.3);
    display: inline-block;
    line-height: 90px;
    text-align: center;
    position: relative;
    z-index: 1;
}

.hero__text .play-btn i {
    position: relative;
    top: 2px;
    left: 2px;
}

.hero__text .play-btn:after {
    position: absolute;
    left: 15px;
    top: 15px;
    height: 60px;
    width: 60px;
    background: #ffffff;
    border-radius: 50%;
    content: "";
    z-index: -1;
}

.linear__icon {
    position: absolute;
    left: 50%;
    bottom: 0;
    margin-left: -16px;
    -webkit-animation: mymove 0.5s infinite alternate;
    animation: mymove 0.5s infinite alternate;
}

.linear__icon i {
    font-size: 50px;
    color: black;
}

.social-icon {
    font-size: 3em;
    border: 1px solid black;
    padding: 10px;
    display: inline-block;
    text-align: center;
    line-height: 1;
    border-radius: 20%;
    transition: all 0.3s;
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.social-icon:hover {
    background: black;
    border-color: white;
}

.artist-social-icon {
    font-size: 1.5rem;
    color: black;
    transition: color 0.3s;
    display: inline-block;
    margin-right: 0.5rem;
    border: 1px solid black;
    padding: 10px;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    line-height: 1;
}

.artist-social-icon:hover {
    background: black;
    color: white;
    border-color: white;
}

.featured-social-icon {
    font-size: 1.5rem;
    color: black;
    transition: color 0.3s;
    display: inline-block;
    margin-right: 2px;
    border: 1px solid black;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    line-height: 1;
}

.featured-social-icon:hover {
    background: black;
    color: white;
    border-color: white;
}

@-webkit-keyframes mymove {
    0% {
        bottom: 0;
    }
    100% {
        bottom: -10px;
    }
}

@keyframes mymove {
    0% {
        bottom: 0;
    }
    100% {
        bottom: -10px;
    }
}

/*---------------------
  Events
-----------------------*/

.event {
    padding-bottom: 60px;
}

.event .section-title {
    margin-bottom: 10px;
    position: relative;
}

.event .section-title:after {
    position: absolute;
    right: 46px;
    top: 25px;
    height: 2px;
    width: 775px;
    background: rgba(225, 225, 225, 0.3);
    content: "";
    z-index: -1;
}

.event__slider .col-lg-4 {
    max-width: 100%;
}

.event__slider.owl-carousel .owl-stage-outer {
    padding-top: 30px;
    padding-bottom: 40px;
}

.event__slider.owl-carousel .owl-nav {
    position: absolute;
    right: 15px;
    top: -50px;
}

.event__slider.owl-carousel .owl-nav button {
    font-size: 22px;
    color: #111111;
    opacity: 0.5;
    margin-right: 10px;
}

.event__slider.owl-carousel .owl-nav button:last-child {
    margin-right: 0;
}

.event__item {
    -webkit-box-shadow: 0px 3px 15px rgba(22, 41, 124, 0.1);
    box-shadow: 0px 3px 15px rgba(22, 41, 124, 0.1);
}

.event__item__pic {
    height: 360px;
    position: relative;
    border-bottom: 3px solid #000000;
}

.event__item__pic .tag-date {
    position: absolute;
    left: 0;
    bottom: -21px;
    width: 100%;
    text-align: center;
}

.event__item__pic .tag-date span {
    font-size: 15px;
    color: #ffffff;
    display: inline-block;
    background: black;
    padding: 12px 8px 9px 20px;
}

.event__item__text {
    text-align: center;
    padding: 45px 10px 25px;
}

.event__item__text h4 {
    font-size: 26px;
    font-weight: 700;
    color: #111111;
    margin-bottom: 10px;
}

.event__item__text p {
    color: #888888;
    margin-bottom: 0;
}

.event__item__text p i {
    color: black;
    margin-right: 8px;
    font-size: 17px;
}

/*---------------------
  Track
-----------------------*/

.track {
    padding-top: 120px;
    padding-bottom: 40px;
    overflow: hidden;
}

.track .section-title {
    margin-bottom: 105px;
}

.track__content {
    height: 502px;
    overflow-y: auto;
}

.track__all {
    text-align: right;
    margin-bottom: 100px;
}

.jp-play {
    position: relative;
    height: 50px;
    width: 50px;
    background: transparent;
    border: 3px solid #e1e1e1;
    border-radius: 50%;
}

.jp-play:after {
    position: absolute;
    display: block;
    left: 17px;
    top: 12px;
    width: 16px;
    height: 20px;
    background: url(../img/play-default.png);
    content: "";
}

.jp-state-playing .jp-play {
    background: #5c00ce !important;
    border-color: #5c00ce !important;
}

.jp-state-playing .jp-play:after {
    background: url(../img/pause.png) !important;
    left: 15px;
    top: 12px;
}

.jp-audio .jp-play:focus {
    background: #5c00ce !important;
    border-color: #5c00ce !important;
}

.jp-audio .jp-play:focus:after {
    background: url(../img/play.png);
}

.jp-seek-bar > div {
    height: 5px;
    background: #e1e1e1;
    cursor: pointer;
    width: 245px;
}

.player_bars {
    width: 350px;
    display: table;
    padding-left: 50px;
    position: relative;
    padding-top: 25px;
    float: left;
    margin-right: 30px;
}

.jp-play-bar {
    position: relative;
    height: 100%;
    background: black;
    overflow: visible !important;
}

.jp-current-time {
    font-size: 15px;
    color: #111111;
    position: absolute;
    left: -50px;
    top: -9px;
}

.jp-duration {
    font-size: 15px;
    color: #111111;
    position: absolute;
    right: 0;
    top: 16px;
}

.player_controls_box {
    width: 50px;
    float: left;
    margin-right: 20px;
}

.jp-mute {
    font-size: 18px;
    border: none;
    background: none;
    color: #111111;
    position: absolute;
    left: 0;
    top: 13px;
}

.jp-volume-bar {
    height: 5px;
    width: 70px;
    background: #e1e1e1;
    cursor: pointer;
}

.jp-volume-bar-value {
    background: black;
    height: 100%;
}

.jp-volume-controls {
    position: relative;
    width: 95px;
    float: left;
    padding-left: 30px;
    padding-top: 25px;
}

.single_player_container {
    overflow: hidden;
    margin-bottom: 40px;
}

.single_player_container:last-child {
    margin-bottom: 0;
}

.single_player_container h4 {
    font-size: 26px;
    color: #111111;
    font-weight: 700;
    margin-bottom: 20px;
    text-transform: uppercase;
}

.track__pic {
    position: relative;
    z-index: 1;
}

.track__pic:after {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: #f5f5f5;
    content: "";
    z-index: -1;
}

.track__pic img {
    position: relative;
    top: -50px;
    width: calc(100% - 40px);
    margin-left: 40px;
    height: 502px;
}

/*---------------------
  Youtube
-----------------------*/

.youtube {
    padding-bottom: 50px;
}

.youtube .section-title {
    text-align: center;
}

.youtube .section-title h1 {
    font-size: 90px;
}

.youtube__item {
    -webkit-transition: all, 0.3s;
    -o-transition: all, 0.3s;
    transition: all, 0.3s;
    margin-bottom: 30px;
}

.youtube__item:hover {
    -webkit-box-shadow: 0px 3px 30px rgba(22, 41, 124, 0.1);
    box-shadow: 0px 3px 30px rgba(22, 41, 124, 0.1);
}

.youtube__item__pic {
    height: 240px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.youtube__item__pic .play-btn {
    font-size: 16px;
    color: black;
    height: 60px;
    width: 60px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.3);
    display: inline-block;
    line-height: 60px;
    text-align: center;
    position: relative;
    z-index: 1;
}

.youtube__item__pic .play-btn i {
    position: relative;
    top: 2px;
    left: 2px;
}

.youtube__item__pic .play-btn:after {
    position: absolute;
    left: 10px;
    top: 10px;
    height: 40px;
    width: 40px;
    background: #ffffff;
    border-radius: 50%;
    content: "";
    z-index: -1;
}

.youtube__item__text {
    padding: 25px 30px 20px;
    background: #ffffff;
}

.youtube__item__text h4 {
    font-size: 26px;
    color: #111111;
    line-height: 34px;
    font-weight: 700;
}

/*---------------------
  Countdown
-----------------------*/

.countdown {
    padding-bottom: 560px;
}

.countdown.countdown--page {
    padding-top: 150px;
    padding-bottom: 150px;
}

.countdown__text {
    text-align: center;
    margin-bottom: 36px;
}

.countdown__text h1 {
    font-size: 90px;
    color: #ffffff;
    font-family: "Rockville Solid Regular";
    color: #ffffff;
    margin-bottom: 25px;
}

.countdown__text h4 {
    font-size: 26px;
    font-family: "Now Regular", sans-serif;
    color: #ffffff;
    text-transform: uppercase;
    letter-spacing: 4px;
}

.countdown__timer {
    text-align: center;
    margin-bottom: 30px;
}

.countdown__item {
    display: inline-block;
    margin-right: 80px;
    margin-bottom: 30px;
}

.countdown__item:last-child {
    margin-right: 0;
}

.countdown__item span {
    font-size: 90px;
    font-family: "Now Regular", sans-serif;
    font-weight: 700;
    color: #ffffff;
    display: block;
    line-height: 100px;
}

.countdown__item p {
    color: #ffffff;
    letter-spacing: 4px;
    text-transform: uppercase;
    margin-bottom: 0;
}

.buy__tickets {
    text-align: center;
}

/*---------------------
  Discography
-----------------------*/

.discography {
    padding-bottom: 40px;
    padding-top: 120px;
    overflow: hidden;
}

.discography .section-title {
    margin-bottom: 90px;
}

.discography__item {
    margin-bottom: 45px;
    -webkit-box-shadow: 0px 5px 10px rgba(22, 41, 124, 0.1);
    box-shadow: 0px 5px 10px rgba(22, 41, 124, 0.1);
}

.discography__item__pic img {
    min-width: 100%;
    border-radius: 0.2rem;
}

.discography__item__text {
    background-color: #f0f0f0;
    padding: 25px 30px 35px;
    text-align: center;
}

.discography__item__text span {
    font-size: 18px;
    color: black;
    font-weight: 700;
}

.discography__item__text h4 {
    font-size: 22px;
    text-transform: uppercase;
    color: #111111;
    margin-top: 10px;
    margin-bottom: 25px;
}

.discography__item__text a {
    display: inline-block;
    margin-right: 10px;
}

.discography__item__text a:last-child {
    margin-right: 0;
}

.pagination__links {
    text-align: center;
    padding-top: 10px;
}

.pagination__links.blog__pagination {
    text-align: left;
}

.pagination__links a {
    display: inline-block;
    font-size: 15px;
    color: #111111;
    text-transform: uppercase;
    letter-spacing: 2px;
    background: #f2f2f2;
    -webkit-transition: all, 0.3s;
    -o-transition: all, 0.3s;
    transition: all, 0.3s;
    margin-right: 6px;
    margin-bottom: 5px;
    padding: 14px 22px 12px;
}

.pagination__links a:last-child {
    margin-right: 0;
}

.pagination__links a:hover {
    background: black;
    color: #ffffff;
}

/* Gradient text animation */
.gradient-text {
    background: linear-gradient(
        45deg,
        #ff00ff,
        #00ffff,
        #ffff00,
        #ff8000,
        #8000ff,
        #ff0080
    );
    background-size: 400% 400%;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: gradientShift 4s ease-in-out infinite;
    font-weight: bold;
}

@keyframes gradientShift {
    0% {
        background-position: 0% 50%;
    }

    50% {
        background-position: 100% 50%;
    }

    100% {
        background-position: 0% 50%;
    }
}

/*---------------------
  Footer
-----------------------*/

.footer {
    padding-top: 300px;
    padding-bottom: 60px;
}

.footer__address {
    margin-bottom: 50px;
}

.footer__address ul li {
    list-style: none;
    padding-left: 70px;
    position: relative;
    margin-bottom: 30px;
}

.footer__address ul li:last-child {
    margin-bottom: 0;
}

.footer__address ul li i {
    font-size: 18px;
    color: black;
    height: 50px;
    width: 50px;
    background: #ffffff;
    border-radius: 50%;
    line-height: 50px;
    text-align: center;
    position: absolute;
    left: 0;
    top: 0;
}

.footer__address ul li p {
    color: #ffffff;
    opacity: 0.7;
    margin-bottom: 8px;
}

.footer__address ul li h6 {
    font-size: 15px;
    font-weight: 700;
    color: #ffffff;
}

.footer__social {
    text-align: center;
    position: relative;
    margin-bottom: 50px;
}

.footer__social::before {
    position: absolute;
    left: -46px;
    top: 3px;
    width: 1px;
    height: 130px;
    background: rgba(255, 255, 255, 0.2);
    content: "";
}

.footer__social::after {
    position: absolute;
    right: -50px;
    top: 3px;
    width: 1px;
    height: 130px;
    background: rgba(255, 255, 255, 0.2);
    content: "";
}

.footer__social h2 {
    color: #ffffff;
    font-weight: 700;
    margin-bottom: 25px;
}

.footer__social .footer__social__links a {
    font-size: 18px;
    color: black;
    height: 50px;
    width: 50px;
    background: #ffffff;
    border-radius: 50%;
    line-height: 50px;
    text-align: center;
    display: inline-block;
    margin-right: 10px;
}

.footer__social .footer__social__links a:last-child {
    margin-right: 0;
}

.footer__newslatter {
    margin-bottom: 50px;
}

.footer__newslatter h4 {
    font-size: 26px;
    color: #ffffff;
    font-weight: 700;
    margin-bottom: 30px;
}

.footer__newslatter form {
    position: relative;
}

.footer__newslatter form input {
    height: 50px;
    font-size: 15px;
    color: #ffffff;
    width: 100%;
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.2);
    padding-left: 20px;
}

.footer__newslatter form input::-webkit-input-placeholder {
    color: #ffffff;
}

.footer__newslatter form input::-moz-placeholder {
    color: #ffffff;
}

.footer__newslatter form input:-ms-input-placeholder {
    color: #ffffff;
}

.footer__newslatter form input::-ms-input-placeholder {
    color: #ffffff;
}

.footer__newslatter form input::placeholder {
    color: #ffffff;
}

.footer__newslatter form button {
    font-size: 18px;
    color: black;
    position: absolute;
    right: 0;
    top: 0;
    height: 100%;
    padding: 0 16px;
    background: #ffffff;
    border: none !important;
}

.footer__copyright__text {
    text-align: center;
}

.footer__copyright__text p {
    color: #999999;
}

.footer__copyright__text a {
    color: #999999;
    text-decoration: underline;
}

.footer__copyright__text a:hover {
    color: black;
}

.footer__copyright__text i {
    color: #c11;
}

/*---------------------
  Breadcrumb
-----------------------*/

.breadcrumb-option {
    padding-top: 35px;
}

.breadcrumb__links a {
    font-size: 15px;
    color: #111111;
    margin-right: 18px;
    display: inline-block;
    position: relative;
}

.breadcrumb__links a:after {
    position: absolute;
    right: -14px;
    top: 0;
    content: "|";
    color: #888888;
}

.breadcrumb__links a i {
    margin-right: 5px;
}

.breadcrumb__links span {
    font-size: 15px;
    color: #888888;
    display: inline-block;
}

/*---------------------
  About
-----------------------*/

.about {
    padding-top: 0;
}

.about.about--page {
    padding-top: 80px;
    padding-bottom: 80px;
}

.about.about--page .section-title {
    margin-bottom: 28px;
}

.about.about--page .section-title h2 {
    line-height: 55px;
}

.about.about--page .about__text {
    padding-top: 15px;
}

.about.about--page .about__text p {
    color: #111111;
}

.about__text {
    padding-top: 30px;
}

.about__text p {
    margin-bottom: 35px;
}

/* music */

.music {
    padding-bottom: 0;
    padding-top: 150px;
}

.music__content {
    background: black;
    height: 500px;
    padding: 100px 70px 60px;
}

.music__content .section-title h2 {
    color: #ffffff;
}

.music__content .section-title h1 {
    color: #ffffff;
    opacity: 0.1;
    text-align: center;
}

.music__content p {
    color: #ffffff;
    margin-bottom: 32px;
}

/*---------------------
  Skills
-----------------------*/

.skills {
    padding-bottom: 0;
    padding-top: 150px;
}

.skills__content {
    background: black;
    height: 500px;
    padding: 100px 70px 60px;
}

.skills__content .section-title h2 {
    color: #ffffff;
}

.skills__content .section-title h1 {
    color: #ffffff;
    opacity: 0.1;
    text-align: center;
}

.skills__content p {
    color: #ffffff;
    margin-bottom: 32px;
}

.skill__bar__item {
    margin-bottom: 20px;
}

.skill__bar__item p {
    font-size: 15px;
    font-weight: 500;
    color: #ffffff;
    margin-bottom: 10px;
}

.skill__bar__item .barfiller {
    width: 100%;
    height: 5px;
    background: rgba(255, 255, 255, 0.2);
    border: none;
    margin-bottom: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.skill__bar__item .barfiller .tip {
    margin-top: -32px;
    padding: 0;
    font-size: 15px;
    color: #fff;
    background: transparent;
}

.skill__bar__item .barfiller .tip:after {
    display: none;
}

.skills__video {
    height: 500px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.skills__video .play-btn {
    font-size: 26px;
    color: black;
    height: 90px;
    width: 90px;
    border-radius: 50%;
    background: rgba(117, 31, 221, 0.3);
    display: inline-block;
    line-height: 90px;
    text-align: center;
    position: relative;
    z-index: 1;
}

.skills__video .play-btn i {
    position: relative;
    top: 2px;
    left: 2px;
}

.skills__video .play-btn:after {
    position: absolute;
    left: 15px;
    top: 15px;
    height: 60px;
    width: 60px;
    background: #ffffff;
    border-radius: 50%;
    content: "";
    z-index: -1;
}

/*---------------------
  About Pic
-----------------------*/

.about-pic {
    overflow: hidden;
}

.about-pic .container-fluid {
    padding-right: 0;
}

.about-pic img {
    min-width: 100%;
    margin-bottom: 10px;
    padding-right: 10px;
}

/*---------------------
  About Services
-----------------------*/

.about-services {
    padding-bottom: 50px;
}

.about-services .section-title {
    margin-bottom: 60px;
}

.about__services__item {
    -webkit-transition: all, 0.3s;
    -o-transition: all, 0.3s;
    transition: all, 0.3s;
}

.about__services__item:hover {
    -webkit-box-shadow: 0px 3px 30px rgba(22, 41, 124, 0.1);
    box-shadow: 0px 3px 30px rgba(22, 41, 124, 0.1);
}

.about__services__item__pic {
    height: 240px;
    position: relative;
}

.about__services__item__pic .icon {
    height: 50px;
    width: 50px;
    background: black;
    border-radius: 50%;
    line-height: 50px;
    text-align: center;
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    bottom: -25px;
}

.about__services__item__text {
    text-align: center;
    padding: 50px 10px 30px;
}

.about__services__item__text h4 {
    font-size: 26px;
    color: #111111;
    font-weight: 700;
    margin-bottom: 12px;
}

.about__services__item__text p {
    margin-bottom: 0;
}

/*---------------------
  Feature
-----------------------*/

.feature {
    padding-bottom: 70px;
}

.feature.feature--about .section-title span {
    color: #0071e4;
}

.feature.feature--about .feature__item {
    background: #f5f5f5;
}

.feature.feature--about .feature__item h5 {
    color: #111111;
}

.feature__text {
    padding-top: 80px;
}

.feature__text .section-title {
    margin-bottom: 20px;
}

.feature__text p {
    margin-bottom: 26px;
}

.feature__item {
    background: #0c2b4b;
    text-align: center;
    padding: 40px 10px 35px;
    margin-bottom: 30px;
}

.feature__item.right-column {
    margin-top: 120px;
}

.feature__item h5 {
    font-weight: 700;
    text-transform: uppercase;
    color: #ffffff;
    margin-top: 25px;
}

/*---------------------
  Services
-----------------------*/

.services {
    overflow: hidden;
}

.services__left {
    height: 640px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.services__left .play-btn {
    font-size: 26px;
    color: #ffffff;
    height: 90px;
    width: 90px;
    border-radius: 50%;
    background: -webkit-gradient(
        linear,
        left top,
        right top,
        from(rgba(127, 0, 173, 0.3)),
        to(rgba(93, 0, 206, 0.3))
    );
    background: -o-linear-gradient(
        left,
        rgba(127, 0, 173, 0.3),
        rgba(93, 0, 206, 0.3)
    );
    background: linear-gradient(
        to right,
        rgba(127, 0, 173, 0.3),
        rgba(93, 0, 206, 0.3)
    );
    display: inline-block;
    line-height: 90px;
    text-align: center;
    position: relative;
    z-index: 1;
}

.services__left .play-btn i {
    position: relative;
    top: 2px;
    left: 2px;
}

.services__left .play-btn:after {
    position: absolute;
    left: 15px;
    top: 15px;
    height: 60px;
    width: 60px;
    background: -webkit-gradient(
        linear,
        left top,
        right top,
        from(#000000),
        to(#141414)
    );
    background: -o-linear-gradient(left, #000000, #141414);
    background: linear-gradient(to right, #000000, #141414);
    border-radius: 50%;
    content: "";
    z-index: -1;
}

.services__list {
    margin: 0;
}

.service__item {
    background: black;
    height: 270px;
    padding: 70px 40px 40px 70px;
}

.service__item.deep-bg {
    background: black;
}

.service__item h4 {
    font-size: 26px;
    color: #ffffff;
    font-weight: 700;
    margin-top: 25px;
    margin-bottom: 10px;
}

.service__item p {
    color: #ffffff;
    margin-bottom: 0;
}

/*---------------------
  Tours
-----------------------*/

.tours {
    padding-top: 150px;
    padding-bottom: 60px;
}

.tours__item__text {
    padding-right: 30px;
    margin-bottom: 100px;
}

.tours__item__text.tours__item__text--right {
    padding-left: 30px;
    padding-right: 0;
}

.tours__item__text h2 {
    font-size: 42px;
    color: #111111;
    text-transform: uppercase;
    margin-bottom: 24px;
}

.tours__item__text .tours__text__widget {
    overflow: hidden;
    border-bottom: 2px solid #f2f2f2;
    padding-bottom: 38px;
}

.tours__item__text .tours__text__widget ul {
    float: left;
}

.tours__item__text .tours__text__widget ul li {
    list-style: none;
    font-size: 15px;
    color: #111111;
    padding-left: 35px;
    position: relative;
    margin-bottom: 10px;
}

.tours__item__text .tours__text__widget ul li:last-child {
    margin-bottom: 0;
}

.tours__item__text .tours__text__widget ul li i {
    color: black;
    position: absolute;
    left: 0;
    top: 3px;
}

.tours__item__text .tours__text__widget ul li span {
    display: inline-block;
    padding-right: 8px;
    position: relative;
    margin-right: 5px;
}

.tours__item__text .tours__text__widget ul li span:last-child {
    padding-right: 0;
    margin-right: 0;
}

.tours__item__text .tours__text__widget ul li span:last-child:after {
    display: none;
}

.tours__item__text .tours__text__widget ul li span:after {
    position: absolute;
    right: 0;
    top: 0;
    content: "|";
}

.tours__item__text .tours__text__widget .price {
    font-size: 18px;
    color: #ffffff;
    font-weight: 700;
    display: inline-block;
    padding: 14px 25px 12px 30px;
    background: black;
}

.tours__item__text .tours__text__desc {
    padding-top: 40px;
    margin-bottom: 65px;
}

.tours__item__text .tours__text__desc p {
    color: #111111;
    margin-bottom: 20px;
}

.tours__item__text .tours__text__desc p:last-child {
    margin-bottom: 0;
}

.tours__item__pic {
    position: relative;
    z-index: 1;
    padding-right: 50px;
    margin-bottom: 110px;
    padding-left: 30px;
}

.tours__item__pic.tours__item__pic--left {
    padding-left: 50px;
    padding-right: 0;
}

.tours__item__pic.tours__item__pic--last {
    margin-bottom: 0;
}

.tours__item__pic:after {
    position: absolute;
    left: 50px;
    top: -50px;
    width: calc(100% - 50px);
    height: 100%;
    border: 20px solid rgba(9, 53, 247, 0.1);
    content: "";
    z-index: -1;
}

.tours__item__pic img {
    min-width: 100%;
}

/*---------------------
  Videos
-----------------------*/

.videos {
    padding-bottom: 90px;
}

.videos .section-title {
    margin-bottom: 70px;
}

.videos__large__item {
    height: 585px;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-bottom: 30px;
}

.videos__large__item .play-btn {
    height: 50px;
    width: 50px;
    background: black;
    border-radius: 50%;
    font-size: 18px;
    line-height: 50px;
    text-align: center;
    display: inline-block;
    color: #ffffff;
}

.videos__large__item__text {
    background: rgba(7, 14, 38, 0.7);
    padding: 25px 30px 25px;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
}

.videos__large__item__text h4 {
    color: #ffffff;
    font-weight: 700;
}

.videos__large__item__text ul li {
    font-size: 13px;
    list-style: none;
    display: inline-block;
    margin-right: 18px;
    color: #ffffff;
    position: relative;
}

.videos__large__item__text ul li:after {
    position: absolute;
    right: -12px;
    top: 2px;
    height: 17px;
    width: 1px;
    background: #ffffff;
    content: "";
}

.videos__large__item__text ul li:last-child {
    margin-right: 0;
}

.videos__large__item__text ul li:last-child:after {
    display: none;
}

.videos__item__pic {
    height: 180px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border-bottom: 3px solid #000000;
}

.videos__item__pic .play-btn {
    height: 40px;
    width: 40px;
    background: black;
    border-radius: 50%;
    font-size: 16px;
    line-height: 40px;
    text-align: center;
    display: inline-block;
    color: #ffffff;
}

.videos__item__text {
    padding-top: 20px;
    margin-left: 10px;
}

.videos__item__text h5 {
    color: #111111;
    font-weight: 700;
    line-height: 26px;
    margin-bottom: 5px;
}

.videos__item__text ul li {
    font-size: 13px;
    list-style: none;
    display: inline-block;
    margin-right: 18px;
    color: black;
    position: relative;
}

.videos__item__text ul li:after {
    position: absolute;
    right: -12px;
    top: 2px;
    height: 17px;
    width: 1px;
    background: #888888;
    content: "";
}

.videos__item__text ul li:last-child {
    margin-right: 0;
    color: #888888;
}

.videos__item__text ul li:last-child:after {
    display: none;
}

.videos__slider .col-lg-3 {
    max-width: 100%;
}

.videos__slider.owl-carousel .owl-nav button {
    font-size: 18px;
    color: #888888;
    height: 50px;
    width: 25px;
    background: #ffffff;
    line-height: 50px;
    position: absolute;
    left: 15px;
    top: 22%;
}

.videos__slider.owl-carousel .owl-nav button.owl-next {
    left: auto;
    right: 15px;
}

/*---------------------
    Blog
-----------------------*/
.blog__large {
    margin-bottom: 45px;
    -webkit-box-shadow: 0px 3px 10px rgba(22, 41, 124, 0.1);
    box-shadow: 0px 3px 10px rgba(22, 41, 124, 0.1);
    margin-bottom: 50px;
}

.blog__large__pic {
    position: relative;
}

.blog__large__pic a {
    font-size: 16px;
    height: 40px;
    width: 40px;
    background: rgba(245, 245, 245, 0.3);
    border-radius: 50%;
    color: #ffffff;
    line-height: 40px;
    text-align: center;
    display: inline-block;
    position: absolute;
    right: 12px;
    bottom: 12px;
}

.blog__large__text {
    background: #ffffff;
    text-align: center;
}

.blog__large__text span {
    font-size: 13px;
    text-transform: uppercase;
    color: black;
}

.blog__large__text h4 {
    color: #111111;
    font-weight: 700;
    line-height: 31px;
    margin-top: 5px;
    margin-bottom: 5px;
}

.blog__large__text p {
    margin-bottom: 20px;
}

.blog__large__widget {
    border-top: 1px solid #f2f2f2;
    padding: 15px 0 20px;
    text-align: left;
    margin: 0 30px;
}

.blog__large__widget .right__widget {
    text-align: right;
}

.blog__large__widget ul li {
    font-size: 13px;
    color: #888888;
    display: inline-block;
    list-style: none;
    margin-right: 20px;
    position: relative;
}

.blog__large__widget ul li span {
    color: #111111;
}

.blog__large__widget ul li:after {
    position: absolute;
    right: -14px;
    top: -2px;
    content: "|";
}

.blog__large__widget ul li:last-child {
    margin-right: 0;
}

.blog__large__widget ul li:last-child:after {
    display: none;
}

.blog__item {
    -webkit-box-shadow: 0px 3px 10px rgba(22, 41, 124, 0.1);
    box-shadow: 0px 3px 10px rgba(22, 41, 124, 0.1);
    margin-bottom: 50px;
}

.blog__item__pic img {
    min-width: 100%;
}

.blog__item__text {
    text-align: center;
    background: #f0f0f0;
    padding: 20px 20px 25px;
}

.blog__item__text span {
    font-size: 13px;
    text-transform: uppercase;
    color: black;
}

.blog__item__text h5 {
    color: #111111;
    font-weight: 700;
    line-height: 26px;
    font-size: 20px;
    margin-top: 10px;
    margin-bottom: 12px;
}

.blog__item__text ul li {
    font-size: 13px;
    color: #888888;
    display: inline-block;
    list-style: none;
    margin-right: 20px;
    position: relative;
}

.blog__item__text ul li span {
    color: #111111;
}

.blog__item__text ul li:after {
    position: absolute;
    right: -14px;
    top: -2px;
    content: "|";
}

.blog__item__text ul li:last-child {
    margin-right: 0;
}

.blog__item__text ul li:last-child:after {
    display: none;
}

/*---------------------
  Blog Sidebar
-----------------------*/

.blog__sidebar__item {
    text-align: center;
    margin-bottom: 65px;
}

.blog__sidebar__item:last-child {
    margin-bottom: 0;
}

.blog__sidebar__item form input {
    height: 50px;
    font-size: 15px;
    color: #444444;
    padding-left: 20px;
    border: 1px solid #e1e1e1;
    width: 100%;
    margin-bottom: 20px;
}

.blog__sidebar__item form input::-webkit-input-placeholder {
    color: #444444;
}

.blog__sidebar__item form input::-moz-placeholder {
    color: #444444;
}

.blog__sidebar__item form input:-ms-input-placeholder {
    color: #444444;
}

.blog__sidebar__item form input::-ms-input-placeholder {
    color: #444444;
}

.blog__sidebar__item form input::placeholder {
    color: #444444;
}

.blog__sidebar__title {
    text-align: center;
    margin-bottom: 35px;
}

.blog__sidebar__title h4 {
    color: #111111;
    font-weight: 700;
    position: relative;
    padding-bottom: 20px;
}

.blog__sidebar__title h4::before {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 5px;
    width: 70px;
    background: #e1e1e1;
    content: "";
    margin: 0 auto;
}

.blog__sidebar__social a {
    display: inline-block;
    font-size: 18px;
    color: #111111;
    width: 50px;
    height: 50px;
    background: #f2f2f2;
    border-radius: 50%;
    line-height: 50px;
    text-align: center;
    margin-right: 6px;
    margin-bottom: 5px;
}

.blog__sidebar__social a:last-child {
    margin-right: 6px;
}

.recent__item {
    display: flex;
    align-items: center;
    margin: 5px 0;
    text-align: left;
}

.recent__item__pic {
    flex: 0 0 auto;
    margin-right: 15px;
    width: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.recent__item__text {
    flex: 1;
}

.recent__item__text h6 {
    color: #111111;
    line-height: 1.3;
    font-size: 14px;
    font-weight: 700;
    margin-bottom: 5px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.recent__item__text span {
    font-size: 11px;
    color: #888888;
    display: block;
}

/*---------------------
  Blog Details
-----------------------*/
.blog__details__item {
    margin-bottom: 32px;
}

.blog__details__item__pic {
    position: relative;
}

.blog__details__item__pic a {
    font-size: 16px;
    height: 40px;
    width: 40px;
    background: rgba(245, 245, 245, 0.3);
    border-radius: 50%;
    color: #ffffff;
    line-height: 40px;
    text-align: center;
    display: inline-block;
    position: absolute;
    right: 12px;
    bottom: 12px;
}

.blog__details__item__pic img {
    width: 100%;
}

.blog__details__item__text {
    background: #ffffff;
    padding-top: 30px;
}

.blog__details__item__text span {
    font-size: 13px;
    text-transform: uppercase;
    color: black;
}

.blog__details__item__text h3 {
    color: #111111;
    font-weight: 700;
    line-height: 31px;
    margin-top: 5px;
    margin-bottom: 15px;
}

.blog__details__item__text p {
    margin-bottom: 40px;
}

.blog__details__item__widget {
    border-top: 1px solid #f2f2f2;
    padding-top: 15px;
    text-align: left;
}

.blog__details__item__widget ul li {
    font-size: 13px;
    color: #888888;
    display: inline-block;
    list-style: none;
    margin-right: 20px;
    position: relative;
}

.blog__details__item__widget ul li span {
    color: #111111;
}

.blog__details__item__widget ul li:after {
    position: absolute;
    right: -14px;
    top: -2px;
    content: "|";
}

.blog__details__item__widget ul li:last-child {
    margin-right: 0;
}

.blog__details__item__widget ul li:last-child:after {
    display: none;
}

.blog__details__desc {
    margin-bottom: 54px;
}

.blog__details__desc p {
    margin-bottom: 20px;
}

.blog__details__desc p:last-child {
    margin-bottom: 0;
}

.blog__details__desc iframe {
    max-width: 560px !important;
    max-height: 315px !important;
}

.blog__details__quote {
    border: 1px solid #e1e1e1;
    padding: 35px 40px 35px 40px;
    position: relative;
    margin-bottom: 35px;
}

.blog__details__quote p {
    font-size: 18px;
    color: #111111;
    line-height: 31px;
}

.blog__details__quote h6 {
    font-size: 15px;
    color: #888888;
    text-transform: uppercase;
}

.blog__details__quote i {
    font-size: 36px;
    color: black;
    position: absolute;
    right: 40px;
    bottom: 35px;
}

.blog__details__tags {
    padding-top: 20px;
    margin-bottom: 60px;
}

.blog__details__tags a {
    display: inline-block;
    font-size: 15px;
    color: #444444;
    padding: 12px 20px 10px;
    background: #f5f5f5;
    margin-right: 10px;
}

.blog__details__tags a:last-child {
    margin-right: 0;
}

.blog__details__option {
    margin-bottom: 60px;
}

.blog__option__btn {
    display: block;
    overflow: hidden;
}

.blog__option__btn.blog__option__btn--next {
    text-align: right;
}

.blog__option__btn.blog__option__btn--next .option__btn__name i {
    margin-right: 0;
    margin-left: 6px;
}

.blog__option__btn.blog__option__btn--next
    .blog__option__btn__item
    .blog__option__btn__pic {
    float: right;
    margin-right: 0;
    margin-left: 30px;
}

.blog__option__btn .option__btn__name {
    font-size: 15px;
    color: #444444;
    font-weight: 700;
    text-transform: uppercase;
    margin-bottom: 25px;
}

.blog__option__btn .option__btn__name i {
    font-size: 18px;
    font-weight: 700;
    margin-right: 6px;
}

.blog__option__btn__pic {
    float: left;
    margin-right: 26px;
}

.blog__option__btn__text {
    overflow: hidden;
}

.blog__option__btn__text h6 {
    color: #111111;
    font-weight: 700;
    line-height: 21px;
}

.blog__option__btn__text span {
    color: #888888;
    font-size: 13px;
}

.blog__details__services {
    margin-bottom: 30px;
}

.blog__details__services__title,
.blog__details__form__title {
    text-align: center;
    margin-bottom: 30px;
}

.blog__details__services__title h4,
.blog__details__form__title h4 {
    color: #111111;
    font-weight: 700;
    position: relative;
    padding-bottom: 20px;
    font-size: 26px;
}

.blog__details__services__title h4::before,
.blog__details__form__title h4::before {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 5px;
    width: 70px;
    background: #e1e1e1;
    content: "";
    margin: 0 auto;
}

.blog__details__services__item {
    -webkit-box-shadow: 0px 5px 15px rgba(0, 61, 85, 0.07);
    box-shadow: 0px 5px 15px rgba(0, 61, 85, 0.07);
    margin-bottom: 30px;
}

.blog__details__services__item__pic img {
    min-width: 100%;
}

.blog__details__services__item__text {
    padding: 15px 20px 10px;
}

.blog__details__services__item__text h6 a {
    font-size: 17px;
    color: #111111;
    font-weight: 700;
    line-height: 22px;
}

.blog__details__services__item__text span {
    color: #888888;
    font-size: 13px;
}

.blog__details__form form .input__list,
.contact__form form .input__list {
    margin-right: -20px;
    overflow: hidden;
}

.blog__details__form form .input__list input,
.contact__form form .input__list input {
    height: 50px;
    font-size: 13px;
    color: #666666;
    padding-left: 20px;
    border: 1px solid #e1e1e1;
    width: calc(33.33% - 20px);
    margin-bottom: 20px;
    margin-right: 16px;
}

.blog__details__form form .input__list input::-webkit-input-placeholder,
.contact__form form .input__list input::-webkit-input-placeholder {
    color: #666666;
}

.blog__details__form form .input__list input::-moz-placeholder,
.contact__form form .input__list input::-moz-placeholder {
    color: #666666;
}

.blog__details__form form .input__list input:-ms-input-placeholder,
.contact__form form .input__list input:-ms-input-placeholder {
    color: #666666;
}

.blog__details__form form .input__list input::-ms-input-placeholder,
.contact__form form .input__list input::-ms-input-placeholder {
    color: #666666;
}

.blog__details__form form .input__list input::placeholder,
.contact__form form .input__list input::placeholder {
    color: #666666;
}

.blog__details__form form textarea,
.contact__form form textarea {
    height: 120px;
    font-size: 13px;
    color: #666666;
    padding-left: 20px;
    padding-top: 12px;
    border: 1px solid #e1e1e1;
    width: 100%;
    margin-bottom: 14px;
    resize: none;
}

.blog__details__form form textarea::-webkit-input-placeholder,
.contact__form form textarea::-webkit-input-placeholder {
    color: #666666;
}

.blog__details__form form textarea::-moz-placeholder,
.contact__form form textarea::-moz-placeholder {
    color: #666666;
}

.blog__details__form form textarea:-ms-input-placeholder,
.contact__form form textarea:-ms-input-placeholder {
    color: #666666;
}

.blog__details__form form textarea::-ms-input-placeholder,
.contact__form form textarea::-ms-input-placeholder {
    color: #666666;
}

.blog__details__form form textarea::placeholder,
.contact__form form textarea::placeholder {
    color: #666666;
}

/*---------------------
  Map
-----------------------*/

.map {
    height: 585px;
    margin-top: 60px;
}

.map iframe {
    width: 100%;
}

/*---------------------
  Contact
-----------------------*/

.contact {
    padding-top: 70px;
    padding-bottom: 50px;
}

.contact__address .section-title {
    margin-bottom: 10px;
}

.contact__address .section-title h2 {
    text-transform: none;
}

.contact__address p {
    margin-bottom: 34px;
}

.contact__address ul li {
    list-style: none;
    padding-left: 100px;
    position: relative;
    margin-bottom: 30px;
}

.contact__address ul li:last-child {
    margin-bottom: 0;
}

.contact__address ul li i {
    font-size: 30px;
    height: 70px;
    width: 70px;
    background: #f5f5f5;
    border-radius: 50%;
    line-height: 70px;
    text-align: center;
    color: black;
    position: absolute;
    left: 0;
    top: -4px;
}

.contact__address ul li h5 {
    font-size: 20px;
    color: #111111;
    font-weight: 700;
    margin-bottom: 10px;
}

.contact__address ul li p {
    margin-bottom: 0;
}

.contact__address ul li span {
    font-size: 15px;
    color: #111111;
    display: inline-block;
    margin-right: 25px;
    position: relative;
}

.contact__address ul li span:after {
    position: absolute;
    right: -20px;
    top: -1px;
    content: ".";
    font-size: 39px;
    line-height: 0;
    border-radius: 50%;
}

.contact__address ul li span:last-child {
    margin-right: 0;
}

.contact__address ul li span:last-child:after {
    display: none;
}

.contact__form .section-title {
    margin-bottom: 10px;
}

.contact__form .section-title h2 {
    text-transform: none;
}

.contact__form p {
    margin-bottom: 34px;
}

/* Gallery Styles */
.gallery-item {
    position: relative;
    overflow: hidden;
    cursor: pointer;
}

.gallery-image {
    transition: transform 0.3s ease;
}

.gallery-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.7);
    opacity: 0;
    transition: opacity 0.3s ease;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    color: #fff;
    cursor: pointer;
}

.gallery-item:hover .gallery-overlay {
    opacity: 1;
}

/* Show overlay on mobile and tablet devices */
@media (max-width: 991px) {
    .gallery-overlay {
        opacity: 0.9;
        animation: pulse-overlay 2s infinite;
        transform: translateY(0); /* Keep overlay visible */
        z-index: 1; /* Lower z-index than the link */
        pointer-events: none; /* Allow clicks to pass through to the link */
    }

    .gallery-item a {
        position: relative;
        z-index: 2; /* Ensure the link is above the overlay */
        display: block;
    }

    @keyframes pulse-overlay {
        0% {
            opacity: 0.7;
        }
        50% {
            opacity: 1;
        }
        100% {
            opacity: 0.7;
        }
    }
}

.zoom-icon {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 50px;
    height: 50px;
    background: rgba(255, 255, 255, 0.9);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1;
    pointer-events: none;
}

.zoom-icon i {
    color: #000;
    font-size: 20px;
}

.modal-content {
    background-color: #fff;
    border: none;
}

.modal-body {
    padding: 20px;
    position: relative;
    background-color: #fff;
    border-radius: 10px;
    width: 100%;
    height: 100%;
}

.modal .close {
    position: absolute;
    right: 10px;
    top: 10px;
    color: #000000;
    opacity: 1;
    text-shadow: none;
    z-index: 1;
}

.modal-dialog-centered {
    display: flex;
    align-items: center;
    min-height: calc(100% - 1rem);
}

.recent-post {
    max-width: 100%;
    height: auto;
    object-fit: cover;
    border-radius: 4px;
    display: block;
    margin: auto;
    border: 1px solid #000000;
}

.pagination__links a.active {
    background: #000000;
    border-color: #000000;
    color: #ffffff;
}

.suggest-blog-image {
    max-height: 200px;
    min-height: 200px;
}

.blog__details__services__item__text h6 {
    color: #111111;
    font-weight: 700;
    line-height: 26px;
    font-size: 20px;
    margin-top: 10px;
    margin-bottom: 12px;
}

@media (min-width: 576px) {
    .modal-dialog-centered {
        min-height: calc(100% - 3.5rem);
    }
}

/*--------------------------------- Responsive Media Quaries -----------------------------*/

@media only screen and (min-width: 1200px) {
    .container {
        max-width: 1170px;
    }
}

/* Medium Device = 1200px */

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .header__menu ul li {
        margin-right: 18px;
    }
    .header__menu {
        margin-right: 30px;
    }
    .service__item {
        padding: 40px 30px 30px 40px;
    }
    .skills__content {
        padding: 60px 40px 40px;
    }
    .discography__item__text a {
        margin-right: 0;
        text-align: center;
        margin-bottom: 10px;
    }
}

/* Tablet Device = 768px */

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .slicknav_btn {
        position: absolute;
        right: 15px;
        top: 25px;
        margin: 0;
        border-radius: 0;
        padding: 12px 15px;
        float: none;
        background: black;
    }

    .slicknav_menu {
        display: block;
        font-size: 16px;
        background: #4c4c4c;
        padding: 0;
    }

    .header__nav {
        display: none;
    }
    .header__menu {
        margin-right: 0;
    }
    .header__menu ul li {
        margin-right: 15px;
    }
    .event .section-title:after {
        width: 560px;
    }
    .track__all {
        text-align: left;
        margin-bottom: 60px;
    }
    .track__content {
        margin-bottom: 120px;
    }
    .track__pic img {
        height: auto;
    }

    .about.about--page .about__text {
        padding-top: 30px;
    }
    .discography__item__text a {
        margin-right: 0;
        text-align: center;
        margin-bottom: 10px;
    }
    .blog__sidebar {
        padding-top: 50px;
    }
    .contact__address {
        margin-bottom: 40px;
    }
    .footer__social::before {
        display: none;
    }
    .footer__social::after {
        display: none;
    }
    .tours__item__pic {
        margin-bottom: 50px;
    }
    .tours__item__text {
        padding-right: 0;
    }
    .countdown {
        padding-bottom: 776px;
    }
    .footer {
        background-position: top 0 left 19%;
    }
}

/* Wide Mobile = 480px */

@media only screen and (max-width: 767px) {
    .hero {
        padding-top: 100px;
        padding-bottom: 125px;
    }
    .event .section-title:after {
        display: none;
    }
    .track__all {
        text-align: left;
        margin-bottom: 60px;
    }
    .track__content {
        margin-bottom: 120px;
    }
    .track .p-0 {
        padding: 0 15px !important;
    }
    .track__pic img {
        height: auto;
    }
    .discography__item__text a {
        margin-right: 0;
        text-align: center;
        margin-bottom: 10px;
    }
    .blog__sidebar {
        padding-top: 50px;
    }
    .contact__address {
        margin-bottom: 40px;
    }
    .footer {
        height: auto;
        padding-top: 100px;
        padding-bottom: 10px;
    }
    .footer__social::before {
        display: none;
    }
    .footer__social::after {
        display: none;
    }
    .player_bars {
        width: 240px;
        margin-right: 20px;
    }
    .jp-seek-bar > div {
        width: 140px;
    }
    .countdown__item {
        margin-right: 0;
        margin-bottom: 30px;
        width: 50%;
        float: left;
    }
    .footer__social {
        text-align: left;
    }
    .skills__content {
        height: auto;
    }
    .about.about--page .about__text {
        padding-top: 30px;
    }
    .tours__item__pic {
        margin-bottom: 50px;
    }
    .blog__large__widget ul {
        text-align: center;
    }
    .blog__large__widget .right__widget {
        text-align: center;
    }
    .blog__option__btn {
        margin-bottom: 30px;
    }
    .blog__details__form form .input__list,
    .contact__form form .input__list {
        margin-right: 0;
        overflow: visible;
    }
    .blog__details__form form .input__list input,
    .contact__form form .input__list input {
        width: 100%;
        margin-right: 0;
    }
    .header__nav {
        display: none;
    }
    .header .container {
        position: relative;
    }
    .slicknav_btn {
        position: absolute;
        right: 15px;
        top: 25px;
        margin: 0;
        border-radius: 0;
        padding: 12px 15px;
        float: none;
        background: black;
    }
    .slicknav_nav {
        position: absolute;
        left: 0;
        top: 85px;
        background: #222;
        width: 100%;
    }
    .slicknav_menu {
        background: transparent;
        padding: 0;
        display: block;
    }
    .slicknav_nav ul {
        margin: 0;
        padding: 5px 0;
    }
    .slicknav_nav .slicknav_row,
    .slicknav_nav a {
        padding: 10px 28px;
        margin: 0;
    }
    .slicknav_nav a:hover {
        border-radius: 0;
        background: black;
        color: #ffffff;
    }
    .slicknav_nav .slicknav_row:hover {
        border-radius: 0;
        background: black;
        color: #ffffff;
    }
    .service__item {
        height: auto;
    }
    .tours__item__text {
        padding-right: 0;
    }
    .countdown {
        padding-bottom: 940px;
    }
    .footer {
        background-position: top 0 left 19%;
    }
}

/* Small Device = 320px */
@media only screen and (max-width: 479px) {
    .section-title h1 {
        top: -40px;
        font-size: 79px;
        line-height: 0.8;
    }
    .hero__text h1 {
        font-size: 70px;
    }
    .videos {
        padding-bottom: 0;
    }
    .countdown__text h1 {
        font-size: 50px;
    }
    .single_player_container h4 {
        font-size: 16px;
    }
    .player_bars {
        width: 150px;
        margin-right: 10px;
    }
    .player_controls_box {
        margin-right: 10px;
    }
    .jp-volume-controls {
        width: 68px;
        padding-left: 23px;
    }
    .jp-volume-bar {
        width: 42px;
    }
    .jp-seek-bar > div {
        width: 55px;
    }
    .service__item {
        height: auto;
        padding: 40px 40px 40px 40px;
    }
    .skills__content {
        height: auto;
        padding: 80px 25px 40px;
    }
    .tours__item__text .tours__text__widget ul {
        float: none;
        margin-bottom: 30px;
    }
    .tours__item__text .tours__text__widget .price {
        float: none;
    }
    .tours__item__pic {
        padding-left: 0;
    }
    .tours__item__text.tours__item__text--right {
        padding-left: 0;
    }
    .blog__large__text {
        padding: 0;
    }
    .blog__large__widget {
        margin: 0;
    }
    .blog__details__tags a {
        margin-bottom: 10px;
    }
    .countdown {
        padding-bottom: 980px;
    }
    .footer {
        background-position: top 0 left 19%;
    }
}

.biography-text {
    font-size: 16px;
    line-height: 1.8;
    color: #444444;
    margin-bottom: 30px;
}

.artist-profile-border {
    border: 3px solid #000000;
    background-color: #f9f9f9;
    border-radius: 50%;
}

.title-text {
    height: 1.5em; /* Fixed height for 2 lines of text */
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    white-space: nowrap;
    -webkit-line-clamp: 2; /* Limit to 2 lines */
    -webkit-box-orient: vertical;
    line-height: 1.5em;
}

.recent-blogs {
    background-color: #f9f9f9;
}

.featured-artists {
    margin-top: 70px;
}

.link-hover {
    color: #007bff !important;
    text-decoration: none;
}

.link-hover:hover {
    text-decoration: underline !important;
    color: #0056b3 !important;
}

.purpose-hero {
    padding-top: 100px;
}

.purpose-hero .title {
    font-size: 3.5rem;
    font-weight: 700;
    color: #000000;
    margin-bottom: 20px;
}

.purpose-hero .subtitle {
    font-size: 1.25rem;
    color: #000000;
}

.service-card {
    background: #ffffff;
    padding: 30px;
    transition: all 0.3s ease;
    height: 100%;
    border: 1px solid #000000;
    text-align: center;
}

.service-card:hover {
    border: 3px solid #000000;
}

.service-card h4 {
    font-size: 1.5rem;
    font-weight: 600;
    color: #000000;
    margin-bottom: 15px;
}

.service-card p {
    color: #000000;
    line-height: 1.6;
    margin-bottom: 0;
}

.artist-management {
    background: #ffffff;
}

.artist-management .title {
    font-size: 2.5rem;
    font-weight: 700;
    color: #000000;
    margin-bottom: 15px;
}

.artist-management .subtitle {
    font-size: 1.25rem;
    color: #000000;
    margin-bottom: 20px;
    font-weight: 600;
}

.artist-management .description {
    font-size: 1rem;
    color: #000000;
    line-height: 1.7;
    margin-bottom: 30px;
}

.quote-section .blockquote {
    border-left: 4px solid #000000;
    padding-left: 20px;
    margin-bottom: 30px;
}

.quote-section .blockquote p {
    font-size: 1.5rem;
    font-style: italic;
    font-weight: 500;
}

.services-list h3 {
    font-size: 1.75rem;
    font-weight: 600;
    color: #000000;
    margin-bottom: 25px;
}

.services-list ul li {
    font-size: 1rem;
    color: #000000;
    padding: 8px 0;
}

.services-list ul li:last-child {
    border-bottom: none;
}

.music-distribution {
    padding: 50px 0;
    background: #ffffff;
    color: #000000;
}

.music-distribution .title {
    font-size: 2.5rem;
    font-weight: 700;
    margin-bottom: 15px;
}

.music-distribution .subtitle {
    font-size: 1.25rem;
    margin-bottom: 10px;
    opacity: 0.9;
}

.music-distribution .description {
    font-size: 1rem;
    line-height: 1.7;
    opacity: 0.8;
}

.music-distribution h3 {
    font-size: 1.75rem;
    font-weight: 600;
    margin-bottom: 25px;
}

.music-distribution p {
    color: #000000 !important;
}

.music-distribution ul li {
    font-size: 1rem;
    padding: 8px 0;
    opacity: 0.9;
}

.music-production {
    background: #ffffff;
}

.music-production .title {
    font-size: 2.5rem;
    font-weight: 700;
    color: #000000;
    margin-bottom: 30px;
}

.video-production {
    background: #ffffff;
    color: #000000;
}

.video-production .blockquote p {
    font-size: 2rem;
    font-weight: 600;
    margin-bottom: 20px;
}

.video-production .description {
    font-size: 1.1rem;
    line-height: 1.7;
    opacity: 0.9;
}

.video-production h3 {
    font-size: 1.75rem;
    font-weight: 600;
    margin-bottom: 25px;
}

.video-production p {
    color: #000000 !important;
}

.video-production ul li {
    font-size: 1rem;
    padding: 8px 0;
    opacity: 0.9;
}

.youtube-management {
    background: #ffffff;
}

.youtube-management .title {
    font-size: 2.5rem;
    font-weight: 700;
    color: #000000;
    margin-bottom: 15px;
}

.youtube-management .subtitle {
    font-size: 1.25rem;
    color: #000000;
    margin-bottom: 20px;
    font-weight: 600;
}

.youtube-management .description {
    font-size: 1rem;
    color: #000000;
    line-height: 1.7;
}

.youtube-management h3 {
    font-size: 1.75rem;
    font-weight: 600;
    color: #000000;
    margin-bottom: 25px;
}

.youtube-management ul li {
    font-size: 1rem;
    color: #000000;
    padding: 8px 0;
    border-bottom: 1px solid #ffffff;
}

.concert-management {
    background: #ffffff;
    color: #000000;
}

.concert-management .title {
    font-size: 2.5rem;
    font-weight: 700;
    margin-bottom: 15px;
}

.concert-management .subtitle {
    font-size: 1.25rem;
    margin-bottom: 20px;
    opacity: 0.9;
}

.concert-management .description {
    font-size: 1rem;
    line-height: 1.7;
    opacity: 0.8;
}

.concert-management h3 {
    font-size: 1.75rem;
    font-weight: 600;
    margin-bottom: 25px;
}

.concert-management p {
    color: #000000 !important;
}

.concert-management .service-card h4 {
    color: #000000;
}

.concert-management .service-card p {
    color: #000000;
}

.why-choose-artnation {
    background: #ffffff;
}

/* Service Gallery Styles */
.service-gallery {
    background: #ffffff;
}

.gallery-item {
    position: relative;
    overflow: hidden;
    border-radius: 10px;
    cursor: pointer;
}

.gallery-item img {
    width: 100%;
    height: 200px;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.gallery-item:hover img {
    transform: scale(1.05);
}

.gallery-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(0, 0, 0, 0.7);
    color: #ffffff;
    padding: 20px;
    transform: translateY(100%);
    transition: transform 0.3s ease;
    pointer-events: none; /* Allow clicks to pass through to the anchor link */
}

.gallery-item:hover .gallery-overlay {
    transform: translateY(0);
}

/* Animation for mobile and tablet devices */
@media (max-width: 991px) {
    .gallery-overlay {
        transform: translateY(0);
        opacity: 0.9;
        animation: pulse 2s infinite;
        z-index: 1; /* Lower z-index than the link */
        pointer-events: none; /* Allow clicks to pass through to the link */
    }

    .gallery-item a {
        position: relative;
        z-index: 2; /* Ensure the link is above the overlay */
        display: block;
    }

    @keyframes pulse {
        0% {
            opacity: 0.7;
        }
        50% {
            opacity: 1;
        }
        100% {
            opacity: 0.7;
        }
    }
}

.gallery-overlay h4 {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: #ffffff !important;
}

/* Video Showcase Styles */
.video-showcase {
    background: #ffffff;
}

.video-slider {
    position: relative;
    overflow: hidden;
}

.slider-item {
    position: relative;
    border-radius: 15px;
    overflow: hidden;
    margin: 0 15px;
}

.slider-item img {
    width: 100%;
    height: 500px;
    object-fit: cover;
}

.slider-caption {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.8), transparent);
    color: #ffffff;
    padding: 30px 20px;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.slider-item:hover .slider-caption {
    opacity: 1;
}

/* Show slider caption on mobile and tablet devices */
@media (max-width: 991px) {
    .slider-caption {
        opacity: 0.9;
        animation: pulse-overlay 2s infinite;
        z-index: 1; /* Lower z-index than the link */
        pointer-events: none; /* Allow clicks to pass through to the link */
    }

    .slider-item a {
        position: relative;
        z-index: 2; /* Ensure the link is above the caption */
        display: block;
    }
}

.slider-caption h4 {
    margin: 0 0 10px;
    font-size: 1.5rem;
    font-weight: 600;
    color: #ffffff !important;
}

.slider-caption p {
    margin: 0;
    font-size: 1rem;
    opacity: 0.9;
    color: #ffffff !important;
}

/* Event Gallery Styles */
.event-gallery {
    background: #ffffff;
}

.masonry-grid {
    display: flex;
    flex-wrap: wrap;
    margin: -10px;
}

.masonry-item {
    position: relative;
    overflow: hidden;
    border-radius: 10px;
    margin: 10px;
    cursor: pointer;
}

.masonry-item img {
    width: 100%;
    height: 300px;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.masonry-item.tall img {
    height: 450px;
}

.masonry-item:hover img {
    transform: scale(1.05);
}

.masonry-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(0, 0, 0, 0.7);
    color: #ffffff;
    padding: 20px;
    transform: translateY(100%);
    transition: transform 0.3s ease;
}

.masonry-item:hover .masonry-overlay {
    transform: translateY(0);
}

/* Show masonry overlay on mobile and tablet devices */
@media (max-width: 991px) {
    .masonry-overlay {
        opacity: 0.9;
        animation: pulse-overlay 2s infinite;
        transform: translateY(0); /* Keep overlay visible */
        z-index: 1; /* Lower z-index than the link */
        pointer-events: none; /* Allow clicks to pass through to the link */
    }

    .masonry-item a {
        position: relative;
        z-index: 2; /* Ensure the link is above the overlay */
        display: block;
    }
}

.masonry-overlay h4 {
    margin: 0 0 10px;
    font-size: 1.25rem;
    font-weight: 600;
    color: #ffffff !important;
}

.masonry-overlay p {
    margin: 0;
    font-size: 0.9rem;
    opacity: 0.9;
    color: #ffffff !important;
}

@media (max-width: 768px) {
    .masonry-item.tall img {
        height: 300px;
    }

    /* Font size adjustments for mobile */
    .purpose-hero .title {
        font-size: 2.5rem;
    }

    .purpose-hero .subtitle {
        font-size: 1rem;
    }

    .service-card h4 {
        font-size: 1.2rem;
    }

    .service-card p {
        font-size: 0.9rem;
    }

    .artist-management .title,
    .music-distribution .title,
    .video-production .title,
    .youtube-management .title,
    .concert-management .title,
    .why-choose-artnation .title {
        font-size: 2rem;
    }

    .artist-management .subtitle,
    .music-distribution .subtitle,
    .youtube-management .subtitle,
    .concert-management .subtitle {
        font-size: 1rem;
    }

    .artist-management .description,
    .music-distribution .description,
    .video-production .description,
    .youtube-management .description,
    .concert-management .description {
        font-size: 0.9rem;
    }

    .quote-section .blockquote p {
        font-size: 1.2rem;
    }

    .services-list h3 {
        font-size: 1.5rem;
    }

    .services-list ul li {
        font-size: 0.9rem;
    }

    .gallery-overlay h4 {
        font-size: 1rem;
    }

    .gallery-overlay {
        padding: 10px;
    }

    .slider-caption h4 {
        font-size: 1.2rem;
    }

    .slider-caption p {
        font-size: 0.9rem;
    }

    .masonry-overlay h4 {
        font-size: 1rem;
    }

    .masonry-overlay p {
        font-size: 0.8rem;
    }
}

.why-choose-artnation {
    font-size: 2.5rem;
    font-weight: 700;
    color: #212529;
}

/* Extra small devices */
@media (max-width: 576px) {
    .purpose-hero .title {
        font-size: 2rem;
    }

    .artist-management .title,
    .music-distribution .title,
    .video-production .title,
    .youtube-management .title,
    .concert-management .title,
    .why-choose-artnation .title {
        font-size: 1.75rem;
    }

    .services-list h3 {
        font-size: 1.3rem;
    }

    .slider-item img {
        height: 350px;
    }

    .gallery-item img,
    .masonry-item img,
    .masonry-item.tall img {
        height: 200px;
    }

    .section-padding {
        padding: 40px 0;
    }

    /* Additional spacing adjustments */
    .row {
        margin-left: -10px;
        margin-right: -10px;
    }

    .col,
    .col-1,
    .col-10,
    .col-11,
    .col-12,
    .col-2,
    .col-3,
    .col-4,
    .col-5,
    .col-6,
    .col-7,
    .col-8,
    .col-9,
    .col-auto,
    .col-lg,
    .col-lg-1,
    .col-lg-10,
    .col-lg-11,
    .col-lg-12,
    .col-lg-2,
    .col-lg-3,
    .col-lg-4,
    .col-lg-5,
    .col-lg-6,
    .col-lg-7,
    .col-lg-8,
    .col-lg-9,
    .col-lg-auto,
    .col-md,
    .col-md-1,
    .col-md-10,
    .col-md-11,
    .col-md-12,
    .col-md-2,
    .col-md-3,
    .col-md-4,
    .col-md-5,
    .col-md-6,
    .col-md-7,
    .col-md-8,
    .col-md-9,
    .col-md-auto,
    .col-sm,
    .col-sm-1,
    .col-sm-10,
    .col-sm-11,
    .col-sm-12,
    .col-sm-2,
    .col-sm-3,
    .col-sm-4,
    .col-sm-5,
    .col-sm-6,
    .col-sm-7,
    .col-sm-8,
    .col-sm-9,
    .col-sm-auto,
    .col-xl,
    .col-xl-1,
    .col-xl-10,
    .col-xl-11,
    .col-xl-12,
    .col-xl-2,
    .col-xl-3,
    .col-xl-4,
    .col-xl-5,
    .col-xl-6,
    .col-xl-7,
    .col-xl-8,
    .col-xl-9,
    .col-xl-auto {
        padding-left: 10px;
        padding-right: 10px;
    }

    /* Improved button styling for mobile */

    /* Improved spacing for mobile */
    .container {
        padding-left: 15px;
        padding-right: 15px;
    }

    .service-card {
        margin-bottom: 15px;
        padding: 15px;
    }

    .blockquote p {
        font-size: 1.1rem !important;
    }

    /* Reduce spacing between sections */
    section {
        padding-bottom: 30px;
    }

    /* Adjust list spacing */
    .services-list ul li {
        margin-bottom: 10px !important;
        padding-left: 20px;
        text-indent: -20px;
    }
}

/* Very small devices */
@media (max-width: 375px) {
    .purpose-hero .title {
        font-size: 1.75rem;
    }

    .artist-management .title,
    .music-distribution .title,
    .video-production .title,
    .youtube-management .title,
    .concert-management .title,
    .why-choose-artnation .title {
        font-size: 1.5rem;
    }

    .services-list h3 {
        font-size: 1.2rem;
    }

    .service-card h4 {
        font-size: 1.1rem;
    }

    .service-card p {
        font-size: 0.8rem;
    }

    .slider-caption h4 {
        font-size: 1rem;
    }

    .slider-caption p {
        font-size: 0.8rem;
    }

    .gallery-overlay h4 {
        font-size: 0.9rem;
    }

    .masonry-overlay h4 {
        font-size: 0.9rem;
    }

    .masonry-overlay p {
        font-size: 0.75rem;
    }
}

@media (max-width: 768px) {
    .purpose-hero .title {
        font-size: 2rem;
    }

    .artist-management .title,
    .music-distribution .title,
    .music-production .title,
    .youtube-management .title,
    .concert-management .title,
    .why-choose-artnation .title {
        font-size: 2rem;
    }

    .service-card {
        margin-bottom: 30px;
    }

    .video-production .blockquote p {
        font-size: 1.5rem;
    }

    .carousel-item .col-lg-6 {
        justify-content: center;
        display: flex;
    }

    .spad {
        padding-top: 50px;
        padding-bottom: 30px;
    }

    .header__logo img {
        width: 180px;
    }

    .videos__large__item {
        height: 300px;
        object-fit: cover;
        width: 100%;
    }

    .blog__details__desc iframe {
        max-width: 100% !important;
        max-height: 315px !important;
    }
}

.page-link {
    color: #000000;
}

.page-item.active .page-link {
    background-color: #000000;
    color: #ffffff;
    border-color: #000000;
}

.img-border {
    border: 3px solid #000000;
    border-radius: 10px;
    padding: 10px;
}

.art-border {
    border: 3px solid #000000;
    transition: all 0.3s ease;
}

.art-border img {
    border-bottom: 3px solid #000000;
}

.card.art-border:hover {
    transform: translateY(-3px);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

.music-image-border {
    border-radius: 10px;
    border: 1px solid #ffffff;
}

input[name="search"] {
    border: 3px solid #000000;
}

.music-collection,
.artist-collection {
    padding-top: 100px;
    padding-bottom: 0px;
}

.slicknav_menu .active {
    background-color: #000000;
}

/* Solution page image border */
.solution-page-image-border {
    border: 3px solid #000000;
    border-radius: 10px;
}

.footer-icon {
    width: 15px;
    height: 15px;
}

.instagram-icon-color {
    color: #e4405f;
}

/* Shake animation */
.shake {
    transition: transform 0.2s ease-in-out;
}

form button {
    border: 3px solid #000000 !important;
}

.footer-icon {
    border-radius: 50px;
    padding: 5px;
    font-size: 20px;
    background-color: #ffffff;
    width: 35px;
    height: 35px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}