/*
 * Basic CSS starts 
 */
 
@import url('https://fonts.googleapis.com/css?family=Open Sans:300,400,400i,700');

body{
	color: #252c37;
	font-family: 'Open Sans;', sans-serif;
	font-weight: 400;
	-webkit-font-smoothing: antialiased;
}

h1,h2,h3,h4,h5,h6{
	font-family: 'goergia;', sans-serif;
	font-weight: 700;
}

p{
	margin:0;
	padding:0;
	font-size: 14px;
	line-height: 24px;
}

a{
	text-decoration: none;
}

a:hover{
	text-decoration: none;
}

a:hover,a:active,a:focus {
	outline: 0;
	text-decoration: none;
}

hr{

}

:active {
	outline: none;
}
:focus {
	outline:none;
	outline-width: 0;
}

::-moz-focus-inner {
	border:0;
}
.btn, .form-control,
.form-control:focus {
	border-radius: 0px !important;
	box-shadow: none !important;
	outline: none !important;
}

.btn-lg, .btn-group-lg > .btn {
	padding: 12px 32px;
	font-size: 18px;
}


.pad {padding: 130px 0px;}

.parallax-one { background: url('../img/promo/p1.jpg') fixed 50%;}
.parallax-two { background: url('../img/background/overlay.png'), url('../img/promo/p2.jpg') fixed 50%;}
.parallax-three { background: url('../img/background/overlay.png'), url('../img/promo/p3.jpg') fixed 50%;}
.parallax-four { background: url('../img/background/overlay.png'), url('../img/promo/p4.jpg') fixed 50%;}

/* 
 * Basic CSS ends 
 */
 
/* header */
/* navigation */

.navbar {
	margin-top: 40px;
	font-family: Open Sans;
	border: 0;
	border-radius:0;
	box-shadow: none;
	background: rgba(0,0,0,0.25);
	-webkit-transition: all 0.25s ease;
	-moz-transition: all 0.25s ease;
	-ms-transition: all 0.25s ease;
	-o-transition: all 0.25s ease;
	transition: all 0.25s ease;
}

.navbar.comeup {margin-top: 0;background: rgba(0,0,0,0.9);}
.navbar-default .navbar-nav>li>a {
	padding: 25px 20px;
	font-size: 15px;
	font-weight: 700;
}

.navbar-default .navbar-toggle .icon-bar {background: #eeeeee;}
.navbar-default .navbar-toggle {border-radius: 0;}
.navbar-default .navbar-toggle:hover, 
.navbar-default .navbar-toggle:focus{background: transparent;}

.navbar-brand>img {
	width: 100%;
	max-width: 130px;
}

/* secondary menu */

.secondary-menu {
	position: fixed;
	z-index: 99999;
	width: 100%;
	background: rgba(0,0,0,0.9);
}
.secondary-menu .sm-left {
	float: left;
	text-align: left;
	font-family: Open Sans;
}

.secondary-menu .sm-left a {
	color: #ccc;
}

.secondary-menu .sm-right {
	float: right;
	text-align: right;
}

.secondary-menu .sm-left,
.secondary-menu .sm-right {
	line-height: 40px;
	color: #fff;
}

.secondary-menu .sm-social-link a {
	display: inline-block;
	width: 40px;
	height: 40px;
	line-height: 40px;
	font-size: 14px;
	color: #fff;
	text-align: center;
	background: rgba(0,0,0,0.3);
}

/* banner */

/* banner slider */

.banner .carousel .item{
  -webkit-animation-duration: 5s;
  -webkit-animation-delay: 0.5s;
  -moz-animation-duration: 5s;
  -moz-animation-delay: 0.5s;
  -ms-animation-duration: 5s;
  -ms-animation-delay: 0.5s;
  -o-animation-duration: 5s;    
  -o-animation-delay: 0.5s;    
  animation-duration:5s;
  animation-delay:0.5s;
}
.banner .carousel .carousel-caption h2,
.banner .carousel .carousel-caption h3 {
  -webkit-animation-duration: 5s;
  -webkit-animation-delay: 3s;
  -moz-animation-duration: 5s;
  -moz-animation-delay: 3s;
  -ms-animation-duration: 5s;
  -ms-animation-delay: 5s;
  -o-animation-duration: 5s;    
  -o-animation-delay: 3s;    
  animation-duration:2s;
  animation-delay:1s;
}

.banner .carousel .carousel-caption h2 i {
	font-size: 64px;
  display: inline-block;
  margin-left: -150px;
}

.banner .carousel .carousel-caption p{
  -webkit-animation-duration: 2s;
  -webkit-animation-delay: 1s;
  -moz-animation-duration: 2s;
  -moz-animation-delay: 1s;
  -ms-animation-duration: 2s;
  -ms-animation-delay: 1s;
  -o-animation-duration: 2s;    
	-o-animation-delay: 1s;      
  animation-duration:2s;
  animation-delay:1s;
}

.banner .carousel .carousel-caption .btn{
  -webkit-animation-duration: 2s;
  -webkit-animation-delay: 2.5s;
  -moz-animation-duration: 2s;
  -moz-animation-delay: 2.5s;
  -ms-animation-duration: 2s;
  -ms-animation-delay: 2.5s;
  -o-animation-duration: 2s;    
  -o-animation-delay: 2.5s;    
  animation-duration:2s;
  animation-delay:2.5s;
}

.banner .carousel .carousel-control{
	position: absolute;
	top: 50%;
	margin-top: -25px;
	display: inline-block;
	font-size: 18px;
	font: fantasy;
	text-align: center;
	background: none;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)" !important;
	border:0;
	opacity: 1;
	text-shadow: none;
}

.banner .carousel .carousel-control span {
	width: 50px;
	height: 50px;
	line-height: 52px;
	font-size: 22px;
}

.banner .slide-one, .banner .slide-two {
	bottom: inherit;
	top: 250px;
	text-align: left;
}
.banner .slide-one h2, .banner .slide-two h2 {
	margin-bottom: 15px;
	font-size: 52px;
	line-height: 42px;
	font-weight: 300;
	color: #fff;
}

.banner .slide-one h3, .banner .slide-two h3 {
	font-size: 24px;
	line-height: 32px;
	font-weight: 400;
	padding-left: -150px;
}

.banner .slide-one .btn,
.banner .slide-two .btn {
	display: inline-block;
	margin-top: 15px;
	padding: 12px 32px;
	font-size: 16px;
}

/* default heading */

.default-heading,
.default-heading-shadow {
	text-align: center;
	margin-bottom: 40px;
}

.default-heading h2,
.default-heading-shadow h2 {
	position: relative;
	display: inline-block;
	margin-top: 0;
	margin-bottom: 30px;
	padding: 25px 30px;
	font-size: 45px;
	text-transform: uppercase;
}

.default-heading h2:after,
.default-heading-shadow h2:after{
	top: 100%;
	left: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: rgba(240, 253, 255, 0);
	border-width: 20px;
	margin-left: -20px;
}

.default-heading-shadow h2 {color: #fff;}

@-webkit-keyframes rotating /* Safari and Chrome */ {
  from {
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@keyframes rotating {
  from {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -ms-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

.rotating {
  -webkit-animation: rotating 8s linear infinite;
  -moz-animation: rotating 8s linear infinite;
  -ms-animation: rotating 8s linear infinite;
  -o-animation: rotating 8s linear infinite;
  animation: rotating 8s linear infinite;
}

/* hero */

.hero .hero-content {
	text-align: center;
}

.hero-content h2 {
	margin-top: 0;
	margin-bottom: 0;
	font-size: 45px;
}

.hero-content hr {
	max-width: 450px;
	margin: 20px auto;
	border-top: 1px solid #ddd;
}

.hero-content p {
	font-size: 20px;
	line-height: 28px;
}

.hero-playlist {
	margin-top: 50px;
}

.hero-playlist .figure {
	position: relative;
	max-width: 450px;
	margin: 0 auto;
}

.hero-playlist .figure .disk {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 200px;
	height: 200px;
	margin-top: -100px;
	margin-left: -100px;
	opacity: 0.5;
}

.hero-playlist .album-details {
	max-width: 450px;
	margin: 0 auto;
	margin-top: 30px;
	margin-bottom: 30px;
	text-align: center;
	letter-spacing: 0.1em;
}

.hero-playlist .album-details h4 {
	font-size: 22px;
	line-height: 32px;
	text-transform: uppercase;
}

.hero-playlist .album-details h5 {
	margin-top: 15px;
	margin-bottom: 20px;
	font-size: 18px;
	font-weight: 400;
	color: #aaa;
}

.hero-playlist .album-details p {
	margin-bottom: 30px;
	font-size: 15px;
	line-height: 30px;
}

.playlist-content .playlist-number {
	margin-bottom: 10px;
	padding: 10px 15px;
	background: #fafafa;
	border: 1px solid #ddd;
}

.playlist-content .playlist-number .song-info {
	float: left;	
}

.playlist-content .playlist-number .song-info h4 {
	margin-top: 5px;
	margin-bottom: 5px;
	font-size: 15px;
}
.playlist-content .playlist-number .song-info p {
	font-size: 12px;
	font-style: italic;
}

.playlist-content .playlist-number .music-icon {float: right;}
.playlist-content .playlist-number .music-icon a {
	display: inline-block;
	width: 30px;
	height: 45px;
	line-height: 45px;
	font-size: 20px;
	text-align: center;
}

/*new one here*/

/* =========================================================
   ROCKITPLAY MODERN HOMEPAGE HERO
   ========================================================= */

.rp-hero {
    position: relative;
    min-height: 720px;
    height: calc(100vh - 80px);
    max-height: 900px;
    overflow: hidden;
    background: #09090b;
    color: #fff;
    display: flex;
    align-items: center;
}


/* Dynamic background */

.rp-hero-bg {
    position: absolute;
    inset: -40px;
    background-image: url("../img/logo/logo.png");
    background-size: cover;
    background-position: center;
    filter: blur(8px);
    transform: scale(1.08);
    transition:
        opacity .7s ease,
        background-image .7s ease;
    opacity: .75;
}

.rp-hero-bg.rp-changing {
    opacity: 0;
}


/* Main dark overlay */

.rp-hero-overlay {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(
            90deg,
            rgba(5,5,8,.98) 0%,
            rgba(5,5,8,.88) 32%,
            rgba(5,5,8,.50) 62%,
            rgba(5,5,8,.75) 100%
        ),
        linear-gradient(
            0deg,
            #09090b 0%,
            transparent 35%,
            rgba(0,0,0,.2) 100%
        );

    z-index: 1;
}


/* Purple/blue atmospheric glow */

.rp-hero-glow {
    position: absolute;
    width: 650px;
    height: 650px;

    right: -100px;
    top: 50%;

    transform: translateY(-50%);

    background: radial-gradient(
        circle,
        rgba(125,70,255,.35) 0%,
        rgba(74,50,150,.15) 35%,
        transparent 70%
    );

    filter: blur(20px);

    z-index: 2;

    pointer-events: none;
}


/* Container */

.rp-hero-container {
    position: relative;
    z-index: 4;

    width: 100%;

    display: flex;
    align-items: center;
    justify-content: space-between;

    min-height: 650px;
}


/* Hero text */

.rp-hero-content {
    width: 55%;
    padding-top: 50px;
}


.rp-hero-badge {
    display: inline-flex;
    align-items: center;
    gap: 9px;

    padding: 8px 14px;

    border-radius: 30px;

    background: rgba(255,255,255,.08);

    border: 1px solid rgba(255,255,255,.12);

    backdrop-filter: blur(12px);

    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2px;

    margin-bottom: 24px;
}


.rp-pulse {
    width: 8px;
    height: 8px;

    border-radius: 50%;

    background: #7c4dff;

    box-shadow:
        0 0 0 0 rgba(124,77,255,.7);

    animation: rpPulse 2s infinite;
}


@keyframes rpPulse {

    0% {
        box-shadow:
            0 0 0 0 rgba(124,77,255,.7);
    }

    70% {
        box-shadow:
            0 0 0 10px rgba(124,77,255,0);
    }

    100% {
        box-shadow:
            0 0 0 0 rgba(124,77,255,0);
    }

}


.rp-hero-small {
    margin: 0 0 12px;

    font-size: 13px;

    letter-spacing: 4px;

    font-weight: 600;

    color: rgba(255,255,255,.65);
}


.rp-hero-content h1 {
    margin: 0;

    max-width: 750px;

    font-size: clamp(48px, 6vw, 86px);

    line-height: .98;

    font-weight: 800;

    letter-spacing: -3px;

    color: #fff;

    text-transform: none;

    border: none;
}


.rp-hero-description {
    margin-top: 28px;

    font-size: 20px;

    line-height: 1.6;

    color: rgba(255,255,255,.72);

    max-width: 560px;
}


.rp-hero-description span {
    color: rgba(255,255,255,.45);
}


/* Buttons */

.rp-hero-actions {
    display: flex;

    align-items: center;

    gap: 14px;

    margin-top: 34px;
}


.rp-btn {
    display: inline-flex;

    align-items: center;
    justify-content: center;

    gap: 10px;

    min-height: 52px;

    padding: 0 25px;

    border-radius: 8px;

    font-size: 13px;

    font-weight: 800;

    letter-spacing: 1px;

    text-decoration: none !important;

    transition:
        transform .25s ease,
        background .25s ease,
        box-shadow .25s ease;
}


.rp-btn:hover {
    transform: translateY(-3px);
}


.rp-btn-primary {
    color: #fff;

    border: none;

    background: #7c4dff;

    box-shadow:
        0 12px 35px rgba(124,77,255,.35);
}


.rp-btn-primary:hover {
    color: #fff;

    background: #6c3df0;

    box-shadow:
        0 16px 40px rgba(124,77,255,.5);
}


.rp-btn-secondary {
    color: #fff;

    background: rgba(255,255,255,.08);

    border: 1px solid rgba(255,255,255,.18);

    backdrop-filter: blur(12px);
}


.rp-btn-secondary:hover {
    color: #fff;

    background: rgba(255,255,255,.14);
}


/* Artwork */

.rp-hero-art {
    position: relative;

    width: 43%;

    display: flex;

    justify-content: center;

    align-items: center;
}


.rp-art-ring {
    position: relative;

    width: min(440px, 35vw);

    aspect-ratio: 1 / 1;

    padding: 12px;

    border-radius: 50%;

    background:
        linear-gradient(
            135deg,
            rgba(255,255,255,.28),
            rgba(255,255,255,.02)
        );

    box-shadow:
        0 40px 100px rgba(0,0,0,.65),
        0 0 100px rgba(124,77,255,.25);

    animation: rpFloat 6s ease-in-out infinite;
}


.rp-art-ring::before {
    content: "";

    position: absolute;

    inset: -18px;

    border-radius: 50%;

    border: 1px solid rgba(255,255,255,.08);

    animation: rpRotate 25s linear infinite;
}


.rp-art-ring::after {
    content: "";

    position: absolute;

    inset: -35px;

    border-radius: 50%;

    border: 1px dashed rgba(255,255,255,.08);

    animation: rpRotateReverse 35s linear infinite;
}


.rp-art-ring img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    border-radius: 50%;

    box-shadow:
        inset 0 0 50px rgba(0,0,0,.5);

    position: relative;

    z-index: 2;
}


@keyframes rpFloat {

    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-15px);
    }

}


@keyframes rpRotate {

    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }

}


@keyframes rpRotateReverse {

    from {
        transform: rotate(360deg);
    }

    to {
        transform: rotate(0deg);
    }

}


.rp-art-glow {
    position: absolute;

    width: 80%;

    aspect-ratio: 1 / 1;

    border-radius: 50%;

    background: #7c4dff;

    filter: blur(90px);

    opacity: .20;
}


/* Floating music notes */

.rp-floating-note {
    position: absolute;

    z-index: 5;

    width: 52px;
    height: 52px;

    display: flex;

    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: rgba(255,255,255,.08);

    border: 1px solid rgba(255,255,255,.15);

    backdrop-filter: blur(12px);

    font-size: 25px;

    color: #fff;

    box-shadow:
        0 15px 35px rgba(0,0,0,.3);
}


.note-one {
    top: 10%;
    right: 12%;

    animation:
        rpNoteOne 5s ease-in-out infinite;
}


.note-two {
    bottom: 8%;
    left: 5%;

    animation:
        rpNoteTwo 6s ease-in-out infinite;
}


@keyframes rpNoteOne {

    0%,
    100% {
        transform: translateY(0) rotate(-10deg);
    }

    50% {
        transform: translateY(-18px) rotate(10deg);
    }

}


@keyframes rpNoteTwo {

    0%,
    100% {
        transform: translateY(0) rotate(10deg);
    }

    50% {
        transform: translateY(15px) rotate(-10deg);
    }

}


/* Bottom progress */

.rp-hero-bottom {
    position: absolute;

    bottom: 0;
    left: 0;

    width: 100%;

    z-index: 5;

    padding-bottom: 22px;
}


.rp-hero-progress {
    display: flex;

    align-items: center;

    gap: 15px;

    width: 100%;

    max-width: 520px;

    font-size: 11px;

    font-weight: 700;

    letter-spacing: 1px;

    color: rgba(255,255,255,.6);
}


.rp-progress-line {
    position: relative;

    flex: 1;

    height: 2px;

    background: rgba(255,255,255,.18);

    overflow: hidden;
}


.rp-progress-line span {
    display: block;

    width: 20%;

    height: 100%;

    background: #7c4dff;

    transition: width .5s ease;
}


/* =========================================================
   HERO RESPONSIVE
   ========================================================= */

@media (max-width: 991px) {

    .rp-hero {
        min-height: 700px;

        height: auto;

        padding:
            130px 0
            90px;
    }


    .rp-hero-container {
        flex-direction: column;

        justify-content: center;

        text-align: center;
    }


    .rp-hero-content {
        width: 100%;

        padding-top: 30px;
    }


    .rp-hero-content h1 {
        font-size: 58px;
    }


    .rp-hero-description {
        margin-left: auto;
        margin-right: auto;
    }


    .rp-hero-actions {
        justify-content: center;
    }


    .rp-hero-art {
        width: 100%;

        margin-top: 70px;
    }


    .rp-art-ring {
        width: 300px;
    }


    .rp-hero-bottom {
        bottom: 15px;
    }

}


@media (max-width: 600px) {

    .rp-hero {
        min-height: 720px;

        padding-top: 120px;
    }


    .rp-hero-content h1 {
        font-size: 43px;

        letter-spacing: -2px;
    }


    .rp-hero-small {
        font-size: 10px;

        letter-spacing: 2.5px;
    }


    .rp-hero-description {
        font-size: 16px;

        margin-top: 20px;
    }


    .rp-hero-actions {
        flex-direction: column;

        width: 100%;
    }


    .rp-btn {
        width: 100%;

        max-width: 280px;
    }


    .rp-hero-art {
        margin-top: 55px;
    }


    .rp-art-ring {
        width: 220px;
    }


    .rp-floating-note {
        width: 40px;
        height: 40px;

        font-size: 18px;
    }


    .note-one {
        right: 12%;
    }


    .note-two {
        left: 12%;
    }


    .rp-hero-progress {
        max-width: 90%;
        margin: auto;
    }

}

/*new releases*/

/* =========================================================
   ROCKITPLAY — NEW RELEASES
   ========================================================= */

.rp-releases {
    position: relative;
    padding: 100px 0 110px;
    background:
        radial-gradient(
            circle at 85% 10%,
            rgba(124,77,255,.08),
            transparent 35%
        ),
        #f7f7f9;
}


/* Section heading */

.rp-section-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 30px;
    margin-bottom: 45px;
}


.rp-section-label {
    display: block;

    margin-bottom: 10px;

    color: #7c4dff;

    font-size: 11px;
    font-weight: 800;

    letter-spacing: 3px;
}


.rp-section-heading h2 {
    margin: 0;

    font-family: 'Open Sans', sans-serif;

    color: #17171b;

    font-size: 42px;
    line-height: 1.1;

    font-weight: 800;

    letter-spacing: -1.5px;
}


.rp-section-heading p {
    margin-top: 12px;

    color: #777;

    font-size: 15px;
}


/* View all */

.rp-view-all {
    display: inline-flex;

    align-items: center;

    gap: 9px;

    padding: 11px 17px;

    color: #222 !important;

    border: 1px solid #ddd;

    border-radius: 7px;

    background: #fff;

    font-size: 12px;

    font-weight: 800;

    letter-spacing: .5px;

    transition:
        all .25s ease;
}


.rp-view-all:hover {
    color: #fff !important;

    background: #7c4dff;

    border-color: #7c4dff;

    transform: translateX(3px);

    box-shadow:
        0 10px 25px rgba(124,77,255,.2);
}


/* Music grid */

.rp-release-grid {
    display: grid;

    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 34px 24px;
}


/* Card */

.rp-release-card {
    min-width: 0;
}


/* Artwork */

.rp-release-art {
    position: relative;

    display: block;

    width: 100%;

    aspect-ratio: 1 / 1;

    overflow: hidden;

    border-radius: 12px;

    background: #ddd;

    box-shadow:
        0 15px 35px rgba(0,0,0,.10);

    transition:
        transform .35s ease,
        box-shadow .35s ease;
}


.rp-release-art img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    transition:
        transform .5s cubic-bezier(.2,.8,.2,1);
}


/* Hover overlay */

.rp-release-overlay {
    position: absolute;

    inset: 0;

    background:
        linear-gradient(
            180deg,
            rgba(0,0,0,0) 20%,
            rgba(0,0,0,.65) 100%
        );

    opacity: 0;

    transition:
        opacity .3s ease;
}


/* Play button */

.rp-release-play {
    position: absolute;

    left: 50%;
    top: 50%;

    width: 58px;
    height: 58px;

    display: flex;

    align-items: center;
    justify-content: center;

    transform:
        translate(-50%, -40%)
        scale(.75);

    border-radius: 50%;

    background: #7c4dff;

    color: #fff;

    font-size: 19px;

    padding-left: 3px;

    opacity: 0;

    box-shadow:
        0 12px 30px rgba(0,0,0,.35);

    transition:
        all .3s cubic-bezier(.2,.8,.2,1);
}


/* Hover */

.rp-release-art:hover {
    transform: translateY(-7px);

    box-shadow:
        0 25px 50px rgba(0,0,0,.17);
}


.rp-release-art:hover img {
    transform: scale(1.07);
}


.rp-release-art:hover .rp-release-overlay {
    opacity: 1;
}


.rp-release-art:hover .rp-release-play {
    opacity: 1;

    transform:
        translate(-50%, -50%)
        scale(1);
}


.rp-release-play:hover {
    background: #6840df;

    transform:
        translate(-50%, -50%)
        scale(1.08) !important;
}


/* Information */

.rp-release-info {
    padding: 16px 3px 0;
}


.rp-release-info h3 {
    overflow: hidden;

    margin: 0;

    padding: 0;

    border: none;

    color: #202027;

    font-family: 'Open Sans', sans-serif;

    font-size: 16px;

    font-weight: 800;

    line-height: 1.4;

    white-space: nowrap;

    text-overflow: ellipsis;
}


.rp-release-info p {
    overflow: hidden;

    margin-top: 5px;

    color: #85858c;

    font-size: 13px;

    line-height: 20px;

    white-space: nowrap;

    text-overflow: ellipsis;
}


/* Empty state */

.rp-no-releases {
    grid-column: 1 / -1;

    padding: 80px 20px;

    text-align: center;

    border: 1px dashed #d5d5da;

    border-radius: 15px;

    background: rgba(255,255,255,.7);
}


.rp-no-releases-icon {
    width: 65px;
    height: 65px;

    display: flex;

    align-items: center;
    justify-content: center;

    margin: 0 auto 20px;

    border-radius: 50%;

    background: rgba(124,77,255,.1);

    color: #7c4dff;

    font-size: 25px;
}


.rp-no-releases h3 {
    margin: 0;

    padding: 0;

    border: none;

    color: #222;

    font-family: 'Open Sans', sans-serif;

    font-size: 20px;
}


.rp-no-releases p {
    margin-top: 8px;

    color: #888;
}


/* =========================================================
   NEW RELEASES RESPONSIVE
   ========================================================= */

@media (max-width: 991px) {

    .rp-release-grid {
        grid-template-columns:
            repeat(3, minmax(0, 1fr));
    }

}


@media (max-width: 767px) {

    .rp-releases {
        padding: 75px 0 85px;
    }


    .rp-section-heading {
        align-items: flex-start;

        flex-direction: column;

        margin-bottom: 35px;
    }


    .rp-section-heading h2 {
        font-size: 34px;
    }


    .rp-release-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        gap: 28px 16px;
    }


    .rp-release-play {
        width: 48px;
        height: 48px;

        font-size: 16px;
    }

}


@media (max-width: 480px) {

    .rp-release-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        gap: 24px 12px;
    }


    .rp-release-info {
        padding-top: 11px;
    }


    .rp-release-info h3 {
        font-size: 14px;
    }


    .rp-release-info p {
        font-size: 12px;
    }


    .rp-section-heading h2 {
        font-size: 30px;
    }

}

/* =========================================================
   ROCKITPLAY — LATEST ALBUM
   ========================================================= */

.rp-latest {
    position: relative;

    padding: 110px 0;

    overflow: hidden;

    color: #fff;

    background:
        radial-gradient(
            circle at 15% 50%,
            rgba(124,77,255,.15),
            transparent 35%
        ),
        radial-gradient(
            circle at 90% 10%,
            rgba(65,85,255,.10),
            transparent 30%
        ),
        #0b0b0f;
}


/* Heading */

.rp-latest-header {
    margin-bottom: 45px;
}


.rp-latest-header h2 {
    margin: 0;

    font-family: 'Open Sans', sans-serif;

    font-size: 44px;

    font-weight: 800;

    letter-spacing: -1.5px;

    color: #fff;
}


.rp-latest-header p {
    margin-top: 10px;

    color: rgba(255,255,255,.55);

    font-size: 15px;
}


/* Showcase */

.rp-latest-showcase {

    position: relative;

    display: grid;

    grid-template-columns:
        minmax(300px, .9fr)
        minmax(300px, 1fr)
        minmax(300px, .85fr);

    gap: 50px;

    align-items: center;

    min-height: 480px;

    padding: 50px;

    border: 1px solid rgba(255,255,255,.08);

    border-radius: 24px;

    background:
        linear-gradient(
            135deg,
            rgba(255,255,255,.07),
            rgba(255,255,255,.025)
        );

    box-shadow:
        0 30px 100px rgba(0,0,0,.35);

    backdrop-filter: blur(20px);
}


/* Artwork area */

.rp-latest-art-area {

    position: relative;

    display: flex;

    align-items: center;
    justify-content: center;

    min-height: 400px;
}


/* Purple glow */

.rp-latest-glow {

    position: absolute;

    width: 280px;
    height: 280px;

    border-radius: 50%;

    background: #7c4dff;

    filter: blur(90px);

    opacity: .25;
}


/* Vinyl */

.rp-latest-disc {

    position: absolute;

    width: 330px;
    height: 330px;

    right: 2%;

    border-radius: 50%;

    background:
        repeating-radial-gradient(
            circle,
            #111 0,
            #111 3px,
            #18181d 4px,
            #111 7px
        );

    box-shadow:
        0 30px 60px rgba(0,0,0,.5);

    animation:
        rpLatestDiscRotate 18s linear infinite;
}


.rp-latest-disc::after {

    content: "";

    position: absolute;

    top: 50%;
    left: 50%;

    width: 75px;
    height: 75px;

    transform: translate(-50%, -50%);

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            #7c4dff 0,
            #7c4dff 12%,
            #17171b 13%,
            #17171b 100%
        );
}


@keyframes rpLatestDiscRotate {

    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }

}


/* Album artwork */

.rp-latest-cover {

    position: relative;

    z-index: 3;

    width: 330px;
    height: 330px;

    overflow: hidden;

    border-radius: 18px;

    box-shadow:
        0 30px 70px rgba(0,0,0,.65);

    transform: translateX(-30px);

    transition:
        transform .4s ease;
}


.rp-latest-cover img {

    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    transition:
        transform .6s ease;
}


.rp-latest-cover:hover {

    transform:
        translateX(-30px)
        translateY(-5px);
}


.rp-latest-cover:hover img {

    transform: scale(1.05);

}


/* Floating music icon */

.rp-latest-floating-note {

    position: absolute;

    right: 7%;
    top: 12%;

    z-index: 5;

    width: 48px;
    height: 48px;

    display: flex;

    align-items: center;
    justify-content: center;

    border-radius: 50%;

    color: #fff;

    background: rgba(255,255,255,.09);

    border: 1px solid rgba(255,255,255,.15);

    backdrop-filter: blur(15px);

    animation:
        rpLatestNoteFloat 4s ease-in-out infinite;
}


@keyframes rpLatestNoteFloat {

    0%, 100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-12px);
    }

}


/* Information */

.rp-latest-info {

    position: relative;

    z-index: 3;
}


.rp-latest-badge {

    display: inline-flex;

    align-items: center;

    gap: 8px;

    padding: 8px 13px;

    border-radius: 30px;

    color: #c8b9ff;

    background: rgba(124,77,255,.12);

    border: 1px solid rgba(124,77,255,.25);

    font-size: 10px;

    font-weight: 800;

    letter-spacing: 1.5px;
}


.rp-latest-info h3 {

    margin: 22px 0 10px;

    padding: 0;

    border: none;

    color: #fff;

    font-family: 'Open Sans', sans-serif;

    font-size: clamp(34px, 3vw, 54px);

    line-height: 1.05;

    font-weight: 800;

    letter-spacing: -2px;
}


.rp-latest-artist {

    display: flex;

    align-items: center;

    gap: 7px;

    color: rgba(255,255,255,.45);

    font-size: 15px;
}


.rp-latest-artist strong {

    color: #fff;

    font-weight: 700;
}


.rp-latest-description {

    max-width: 480px;

    margin-top: 24px;

    color: rgba(255,255,255,.58);

    font-size: 14px;

    line-height: 1.8;
}


/* Meta */

.rp-latest-meta {

    display: flex;

    flex-wrap: wrap;

    gap: 20px;

    margin-top: 25px;
}


.rp-latest-meta span {

    color: rgba(255,255,255,.45);

    font-size: 11px;

    font-weight: 700;

    letter-spacing: .5px;
}


.rp-latest-meta i {

    margin-right: 6px;

    color: #9b7cff;
}


/* Buttons */

.rp-latest-actions {

    display: flex;

    align-items: center;

    gap: 20px;

    margin-top: 32px;
}


.rp-latest-play {

    display: inline-flex;

    align-items: center;
    justify-content: center;

    gap: 10px;

    min-height: 50px;

    padding: 0 24px;

    border-radius: 8px;

    color: #fff !important;

    background: #7c4dff;

    font-size: 12px;

    font-weight: 800;

    letter-spacing: 1px;

    box-shadow:
        0 15px 35px rgba(124,77,255,.25);

    transition:
        all .25s ease;
}


.rp-latest-play:hover {

    color: #fff !important;

    background: #6b3eea;

    transform: translateY(-3px);

    box-shadow:
        0 18px 40px rgba(124,77,255,.4);
}


.rp-latest-explore {

    color: rgba(255,255,255,.65) !important;

    font-size: 12px;

    font-weight: 700;
}


.rp-latest-explore i {

    margin-left: 7px;

    transition:
        transform .25s ease;
}


.rp-latest-explore:hover {

    color: #fff !important;
}


.rp-latest-explore:hover i {

    transform: translateX(4px);
}


/* =========================================================
   TRACK LIST
   ========================================================= */

.rp-latest-tracks {

    position: relative;

    z-index: 3;

    min-width: 0;
}


.rp-track-heading {

    display: flex;

    align-items: center;

    justify-content: space-between;

    margin-bottom: 15px;

    padding-bottom: 13px;

    border-bottom: 1px solid rgba(255,255,255,.08);
}


.rp-track-heading span {

    color: rgba(255,255,255,.85);

    font-size: 11px;

    font-weight: 800;

    letter-spacing: 1.5px;
}


.rp-track-heading small {

    color: rgba(255,255,255,.3);

    font-size: 9px;

    font-weight: 700;
}


/* Track */

.rp-track-item {

    display: flex;

    align-items: center;

    gap: 12px;

    width: 100%;

    padding: 10px 8px;

    border-radius: 10px;

    color: #fff !important;

    transition:
        background .25s ease,
        transform .25s ease;
}


.rp-track-item:hover {

    background: rgba(255,255,255,.06);

    transform: translateX(4px);
}


.rp-track-item.active {

    background:
        rgba(124,77,255,.10);
}


/* Number */

.rp-track-number {

    width: 25px;

    color: rgba(255,255,255,.28);

    font-size: 10px;

    font-weight: 700;

    text-align: center;
}


/* Cover */

.rp-track-cover {

    flex: 0 0 48px;

    width: 48px;
    height: 48px;

    overflow: hidden;

    border-radius: 7px;
}


.rp-track-cover img {

    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;
}


/* Details */

.rp-track-details {

    display: flex;

    flex-direction: column;

    min-width: 0;

    flex: 1;
}


.rp-track-details strong {

    overflow: hidden;

    color: rgba(255,255,255,.9);

    font-size: 12px;

    font-weight: 700;

    white-space: nowrap;

    text-overflow: ellipsis;
}


.rp-track-details small {

    overflow: hidden;

    margin-top: 3px;

    color: rgba(255,255,255,.35);

    font-size: 10px;

    white-space: nowrap;

    text-overflow: ellipsis;
}


/* Track play */

.rp-track-play {

    flex: 0 0 32px;

    width: 32px;
    height: 32px;

    display: flex;

    align-items: center;
    justify-content: center;

    border-radius: 50%;

    color: rgba(255,255,255,.6);

    background: rgba(255,255,255,.07);

    font-size: 10px;

    transition:
        all .25s ease;
}


.rp-track-item:hover .rp-track-play,
.rp-track-item.active .rp-track-play {

    color: #fff;

    background: #7c4dff;
}


/* Empty */

.rp-latest-empty {

    padding: 90px 20px;

    text-align: center;

    border: 1px dashed rgba(255,255,255,.12);

    border-radius: 20px;

    background: rgba(255,255,255,.025);
}


.rp-latest-empty > div {

    width: 65px;
    height: 65px;

    display: flex;

    align-items: center;
    justify-content: center;

    margin: 0 auto 20px;

    border-radius: 50%;

    background: rgba(124,77,255,.12);

    color: #9b7cff;

    font-size: 24px;
}


.rp-latest-empty h3 {

    margin: 0;

    padding: 0;

    border: none;

    color: #fff;

    font-family: 'Open Sans', sans-serif;

    font-size: 20px;
}


.rp-latest-empty p {

    margin-top: 8px;

    color: rgba(255,255,255,.4);
}


/* =========================================================
   LATEST ALBUM RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {

    .rp-latest-showcase {

        grid-template-columns:
            minmax(260px, .8fr)
            minmax(280px, 1fr);

        gap: 40px;

    }


    .rp-latest-tracks {

        grid-column: 1 / -1;

    }


    .rp-latest-art-area {

        min-height: 350px;

    }


    .rp-latest-cover,
    .rp-latest-disc {

        width: 290px;
        height: 290px;

    }

}


@media (max-width: 767px) {

    .rp-latest {

        padding: 75px 0 85px;

    }


    .rp-latest-header h2 {

        font-size: 34px;

    }


    .rp-latest-showcase {

        display: flex;

        flex-direction: column;

        gap: 35px;

        padding: 25px 20px 30px;

    }


    .rp-latest-art-area {

        width: 100%;

        min-height: 300px;

    }


    .rp-latest-cover,
    .rp-latest-disc {

        width: 240px;
        height: 240px;

    }


    .rp-latest-cover {

        transform: translateX(-20px);

    }


    .rp-latest-cover:hover {

        transform:
            translateX(-20px)
            translateY(-5px);

    }


    .rp-latest-floating-note {

        right: 10%;

    }


    .rp-latest-info {

        width: 100%;

        text-align: center;

    }


    .rp-latest-info h3 {

        font-size: 35px;

    }


    .rp-latest-artist {

        justify-content: center;

    }


    .rp-latest-description {

        margin-left: auto;
        margin-right: auto;

    }


    .rp-latest-meta {

        justify-content: center;

    }


    .rp-latest-actions {

        justify-content: center;

        flex-wrap: wrap;

    }


    .rp-latest-tracks {

        width: 100%;

    }

}


@media (max-width: 480px) {

    .rp-latest-showcase {

        padding: 20px 15px 25px;

    }


    .rp-latest-art-area {

        min-height: 270px;

    }


    .rp-latest-cover,
    .rp-latest-disc {

        width: 210px;
        height: 210px;

    }


    .rp-latest-info h3 {

        font-size: 30px;

    }


    .rp-latest-actions {

        flex-direction: column;

    }


    .rp-latest-play {

        width: 100%;

    }

}




/* promo */

.promo .promo-element {
	text-align: center;
}

.promo .promo-element h3{
	margin-top: 0;
	margin-bottom: 30px;
	font-size: 40px;
	line-height: 52px;
	color: #fff;
}

.promo .promo-element p {
	font-size: 32px;
	line-height: 44px;
	font-weight: 300;
	color: #fff;	
}

.promo .promo-element .promo-link {
	display: block;
	width: 120px;
	height: 120px;
	line-height: 120px;
	margin: 0 auto;
	margin-top: 40px;
	font-size: 80px;
	text-align: center;
	color: #fff;
}


/* featured album */

.featured .featured-item {
	max-width: 450px;
	margin: 0 auto;
	margin-top: 30px;
	padding-bottom: 30px;
}

.featured .featured-item .figure {
	position: relative;
	overflow: hidden;
}

.featured .featured-item .figure p {
	position: absolute;
	bottom: 0;
	right: 0;
	margin-bottom: 10%;
	margin-right: 10%;
	width: 80%;
	height: 80%;
	padding: 20px 25px;
	color: #fff;
	border: 10px solid #fff;
	font-size: 16px;
	line-height: 28px;
	opacity:0;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	-webkit-transition: all 0.5s ease-out;
	-moz-transition: all 0.5s ease-out;
	-ms-transition: all 0.5s ease-out;
	-o-transition: all 0.5s ease-out;
	transition: all 0.5s ease-out;
}

.featured .featured-item:hover .figure p {
	opacity:1;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}

.featured-item .featured-item-info h4 {
	margin-top: 30px;
	font-size: 28px;
	line-height: 40px;
	text-align: center;
	font-weight: 300;
	font-family: Open Sans;
	text-transform: uppercase;
}

.featured-item .featured-item-info hr {
	max-width: 60px;
	margin: 20px auto;
	border-top: 4px solid #ddd;
}

.featured-item .featured-item-info p {
	font-size: 16px;
	font-weight: 700;
	font-family: Open Sans;
	text-align: center;
}

/* news letter / subscribe */
.news-letter {
	padding: 150px 0;
	background: #252c37;
}
.news-letter .news-content {text-align: center;}
.news-letter .news-content h3 {
	margin-top: 0;
	margin-bottom: 20px;
	font-size: 44px;
	font-family: Open Sans;
	font-style: italic;
	line-height: 54px;
	color: #fff;
}

.news-letter .news-content p {
	margin-bottom: 30px;
	font-size: 20px;
	line-height: 28px;
	font-style: italic;
	color: #fff;
	font-smooth: !important;
	font-family: goergia;
}

.news-letter .news-content form {
	max-width: 450px;
	margin: 0 auto;
}

.news-letter .news-content form .btn {
	padding: 10px 20px;
}

/* why work with us */

.work-with-us .why-content .why-message {
	padding-bottom: 30px;
	font-size: 22px;
	line-height: 32px;
	text-align: center;
}

.work-with-us .why-content .apply-btn {
	margin-top: 60px;
	text-align: center;
}

.work-with-us .why-content .why-item {
	max-width: 450px;
	margin: 0 auto;
	margin-top: 30px;
	padding: 20px 25px; 
	background: #252c37;
}

.why-content .why-item .why-number {
	display: block;
	margin-bottom: 10px;
	color: #fff;
	font-family: 'Droid Sans', sans-serif;
	font-size: 64px;
	font-weight: 700;
	line-height: 1;
}

.why-content .why-item p {color: #fff;}

/* portfolio */

.portfolio.pad {
	padding-top: 100px;
	padding-bottom: 70px;
}

.portfolio-content {margin: 70px 0;}
.portfolio-content .item{
	margin: 0;
	position: relative;
}
.portfolio-content .item img {
	width: 100%;
	max-width: 450px;
}

.portfolio-content .item .p-transparent{
	position: absolute;
	top: -20px;
	left: 0;
	width: 80%;
	height: 80%;
	margin-left: 10%;
	margin-top: 13%;
	opacity: 0;
	border: 10px solid #fff;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

.portfolio-content .item .p-hover {
	position: absolute;
	top: -40px;
	left: 0;
	width: 80%;
	margin-top: 10%;
	margin-left: 10%;
	opacity: 0;
	-webkit-transition: all 0.25s linear;
	-moz-transition: all 0.25s linear;
	-ms-transition: all 0.25s linear;
	-o-transition: all 0.25s linear;
	transition: all 0.25s linear;
}

.portfolio-content .item:hover .p-transparent,
.portfolio-content .item:hover .p-hover  {
	top: 0;
	opacity: 1;
	-webkit-transition: all 0.25s linear;
	-moz-transition: all 0.25s linear;
	-ms-transition: all 0.25s linear;
	-o-transition: all 0.25s linear;
	transition: all 0.25s linear;
}

.portfolio-content .item .p-hover {
	padding: 30px;
	text-align: center;
}

.portfolio-content .item .p-hover h3 {
	margin: 0;
	margin-top: 30px;
	font-size: 28px;
	font-weight: 300;
	color: #fff;
}

.portfolio-content .item .p-hover hr {
	width: 40px;
	border-top: 5px solid #fff;
	margin: 20px auto;
}

.portfolio-content .item .p-hover p {
	color: #fff;
	font-style: italic;
}

.portfolio-content .item .p-hover a {
	display: inline-block;
	width: 45px;
	height: 45px;
	line-height: 45px;
	margin: 0 auto;
	margin-top: 25px;
	text-align: center;
	font-size: 14px;
	color: #fff;
	background: #fff;
}

/* call to action block */

.cta .cta-element {padding: 40px;}

.cta-element h3 {
	margin-top: 0;
	font-size: 26px;
	font: georgia;
	line-height: 36px;
	color: #fff;
}

.cta .cta-element p {
	font-style: italic;
	color: #fff;
	font-size: 18px;
	line-height: 26px;
}

.cta-element .cta-btn{
	margin-top: 25px;
}

/* events */

.events .events-item {
	margin-top: 30px;
	background: #fff;
	padding: 25px;
}

.events .events-item .figure {
	position: relative;
}

.events .events-item .figure .event-location {
	position: absolute;
	bottom: 0;
	left: 0;
	z-index: 8;
	background: rgba(0,0,0,0.3);
	padding: 8px 16px;
	font-size: 14px;
	line-height: 26px;
	color: #fff;
	font-weight: 700;
}

.events .events-item .figure .event-location i {
	display: inline-block;
	margin-right: 10px;
	font-size: 16px;
}

.events .events-item .figure .event-date {
	position: absolute;
	top: 30px;
	right: 0;
	margin-right: -1px;
	z-index: 7;
	color: #fff;
	background: rgba(0,0,0,0.25);
	border: 1px solid #fff;
	text-align: center;
	font-weight: 700;
	font-size: 20px;
	line-height: 40px;
}

.events .events-item .figure .event-date .emonth {font-size: 13px;}
.events-item .figure .event-date .etime {
	display: block;
	background: #fff;
	padding: 5px 7px;
	color: #252c37;
	font-size: 13px;
	line-height: 16px;
}

.events .events-item .figure .img-hover {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 5;
	width: 100%;
	height: 100%;
	opacity: 0;
	-webkit-transition: all 0.25s linear;
	-moz-transition: all 0.25s linear;
	-ms-transition: all 0.25s linear;
	-o-transition: all 0.25s linear;
	transition: all 0.25s linear;
}

.events .events-item:hover .figure .img-hover {
	top: 0;
	opacity: 1;
	-webkit-transition: all 0.25s linear;
	-moz-transition: all 0.25s linear;
	-ms-transition: all 0.25s linear;
	-o-transition: all 0.25s linear;
	transition: all 0.25s linear;
}

.events .events-item .figure .img-hover a {
	position: relative;
	top: 50%;
	display: block;
	width: 80px;
	height: 80px;
	line-height: 80px;
	margin: 0 auto;
	margin-top: -40px;
	font-size: 52px;
	text-align: center;
}

.events .events-item .event-info h3 {
	margin-bottom: 0px;
	font-size: 22px;
	line-height: 32px;
	text-transform: uppercase;
}

.events .events-item .event-info hr {
	width: 60px;
	margin-left: 0;
	margin-bottom: 15px;
	border-top: 1px solid #fff;
}

.events .events-item .event-info p {
	font-style: italic;
}

.events .events-item .event-info .btn {
	display: inline-block;
	margin-top: 20px;
}

/* about */
.about {padding-top: 120px;}
.about .about-what-we {padding-bottom: 30px;}
.about-what-we .what-we-item {
	max-width: 450px;
	margin: 0 auto;
	margin-bottom: 30px;
}

.about-what-we .what-we-item h3 {
	font-size: 26px;
	font-weight: normal;
}
.about-what-we .what-we-item h3 i {
	display: inline-block;
	margin-right: 12px;
}

/* team */
.team {padding-bottom: 120px;}
.team-member {
	text-align: center;
	max-width: 400px;
	margin: 0 auto;
	margin-top: 30px;
}

.team-member .member-img img {
	width: 100%;
	max-width: 450px;
	margin: 0 auto;
}

.team-member .member-img {
	position: relative;
	overflow: hidden;
}

.team-member .member-img .social {
	position: absolute;
	top: 50%;
	left: 0;
	margin-top: -20px;
	z-index: 10;
	width: 100%;
	opacity: 0;
	-webkit-transition: all 0.25s linear;
	-moz-transition: all 0.25s linear;
	-ms-transition: all 0.25s linear;
	-o-transition: all 0.25s linear;
	transition: all 0.25s linear;
}

.team-member:hover .member-img .social {
	opacity: 1;
	-webkit-transition: all 0.25s linear;
	-moz-transition: all 0.25s linear;
	-ms-transition: all 0.25s linear;
	-o-transition: all 0.25s linear;
	transition: all 0.25s linear;
}
	
.member-img .social a i {
	width: 45px;
	height: 45px;
	font-size: 16px;
	color: #fff;
	line-height: 45px;
}

.team-member h3{
	margin-top: 30;
	font-size:22px;
}

.team-member .designation {
	display: block;
	font-size: 14px;
}

/* meets */

.meet {
	background: #252c37 url('../img/flat/back-ptrn.png') repeat;
	box-shadow: inset 0 0 10px #000;
}
.meet .meet-item {
	max-width: 300px;
	margin: 0 auto;
	text-align: center;
}

.meet .meet-item img {
	width: 100%;
	max-width: 300px;
	margin: 0 auto;
}

.meet .meet-map {
	position: relative;
	margin-top: 70px;
}

.meet .default-heading-2 hr {
	max-width: 90px;
	margin: 0 auto;
	margin-top: 25px;
	border-top: 2px solid #fff;
}

.meet .meet-map .img-map {
	width: 100%;
	max-width: 1080px;
	margin: 0 auto;
}

.meet .tooltip {
	font-family: 'Source Sans Pro', sans-serif;
	font-size: 15px;
	letter-spacing: 0.05em;
}

.meet .tooltip .tooltip-inner {
	padding: 4px 8px;
	border-radius: 2px;
	opacity: 1;
}

.meet .meet-map .map-marker {
	display: block;
	position: absolute;
	margin: 0;
	padding: 0;
	text-align: center;
}

.meet-map .map-marker.india {top: 45%;	left: 67%;}
.meet-map .map-marker.usa {top: 35%;	left: 20%;}
.meet-map .map-marker.sa {top: 68%;	left: 52%;}
.meet-map .map-marker.russia {top: 18%;	left: 73%;}
.meet-map .map-marker.brazil {top: 64%;	left: 30%;}

/* contact */
.contact  .contact-item {
	max-width: 450px;
	margin: 0 auto;
	margin-top: 50px;
	margin-bottom: 100px;
}

.contact  .contact-item i {
	display: block;
	width: 80px;
	height: 80px;
	line-height: 80px;
	margin: 0 auto;
	margin-bottom: 30px;
	text-align: center;
	font-size: 36px;
	border: 1px solid #ddd;
	border-radius: 90px;
}

.contact  .contact-item .contact-details {
	display: block;
	text-align: center;
	font-size: 22px;
	line-height: 32px;
}

.form-content p{
	font-size: 22px;
	line-height: 32px;
	text-align: center;
}

.form-content form {
	margin-top: 30px;
}

.form-content form .error {
	display: inline-block;
	margin-top: 5px;
	font-size: 12px;
	font-weight: normal;
	color: #e90404;
}

.form-content form label {
	padding-bottom: 4px;
	font-size: 16px;
	font-weight: 700;
	color: #454545;
}

.form-content form .form-control {border-radius: 3px;}
.form-content form .btn {margin-top: 30px;}

#error, 
#success {
	margin-top: 30px;
	display: none;
}

body {
  background: #f5f5f5;
}

.rounded-lg {
  border-radius: 1rem;
}

.nav-pills .nav-link {
  color: #555;
}

.nav-pills .nav-link.active {
  color: #fff;
}

/* footer */
footer {
	padding-top: 50px;
	padding-bottom: 30px;
	background: #252c37;
	text-align: center;
}

footer .social a {
	display: inline-block;
	width: 60px;
	height: 60px;
	line-height: 60px;
	margin: 0 7px;
	margin-bottom: 30px;
	color: #fff;
	font-size: 32px;
	border: 1px solid transparent;
	border-radius: 80px;
	-webkit-transition: all 0.25s linear;
	-moz-transition: all 0.25s linear;
	-ms-transition: all 0.25s linear;
	-o-transition: all 0.25s linear;
	transition: all 0.25s linear;
}

footer .copy-right {
	color: #fff;
	font-size: 12px;
}

/* Back to top */

.totop {
	position: fixed;
	bottom: 10px;
	right: 10px;
	z-index: 104400;
}

.totop a, .totop a:visited{
	display: block;
	width: 50px;
	height: 50px;
	color: #fff !important;
	text-align: center;
	font-size: 20px;
	line-height: 50px;
	border-radius: 2px;
}

/*
 * Style switcher
 */

.style-switcher{
	width:25px;
	position:fixed;
	top:150px;
	right:0px;
	background:#fff;
	z-index:10000;
	box-shadow:0px 1px 2px rgba(0,0,0,0.15);
}

.style-switcher a{
	display:block;
	width:15px;
	height:15px;
	margin: 5px auto;
}	

/*
 * Responsive CSS 
 */

/*
 * Mobile phones 
 */
@media (max-width: 575px){
	.banner .slide-one h3, .banner .slide-two h3,
	.banner .slide-one .btn, .banner .slide-two .btn {display: none !important;}
	.banner-video .slider .video-header {bottom: 70px;}
	
	.meet .meet-map .map-marker img {max-width: 15px !important;}
}

/*
 * Tablets 
 */
@media (max-width: 767px){
	.navbar-default .navbar-collapse {
		border-color: rgba(0,0,0,0.15);
		box-shadow: none;
	}
	
	.navbar-default .navbar-brand {padding-top: 5px;}
	.navbar-default .navbar-brand>img {max-width: 140px;}
	
	.navbar, .navbar.comeup { margin-top: 0; padding: 10px 0; background: rgba(0,0,0,0.9);}
	header .navbar-default .navbar-nav>li>a, header .navbar-default .navbar-nav>li.active>a,
	header .navbar-default .navbar-nav>li.active>a:hover, header .navbar-default .navbar-nav>li>a:hover	{ 
		padding-top: 8px;
		padding-bottom: 8px;
		background: none;
	}
	.navbar .navbar-nav {margin-top: 0;}
	.secondary-menu {display: none;}
	
	.banner .slide-one, .banner .slide-two {top: 80px !important;}
	.banner .carousel .carousel-control {display: none;}
	.banner .slide-one h2, .banner .slide-two h2 {font-size: 32px !important;}
	.banner .slide-one h2 i, .banner .slide-two h2 i {font-size: 40px !important;}
	.banner .slide-one h3, .banner .slide-two h3 {font-size: 20px !important;}
	.banner .slide-one .btn, .banner .slide-two .btn {
		padding: 8px 12px;
		font-size: 14px;
	}
	
	.banner-video .slider .video-header {bottom: 25%;}
	.banner-video .slider .video-header p	{display: none;}
	.banner-video .slider .video-header h3 {
		font-size: 32px;
		margin-bottom: 20px;
	}
	
		
	.hero-playlist .playlist-content {
		max-width: 450px;
		margin: 0 auto;
	}
	
	.portfolio-content .item .p-hover {top: 0;}
	.featured .featured-item .figure p,
	.portfolio-content .item .p-transparent,
	.portfolio-content .item .p-hover	{
		opacity:0.8;
		-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
	}
		
	.cta .cta-element {
		max-width: 500px;
		margin: 0 auto;
		text-align: center;
	}
	
	.cta .cta-element .cta-btn {margin-top: 30px;}
	
	.work-with-us .why-content .why-message {max-width: 450px; margin: 0 auto;}
	
	.news-letter .news-content {
		max-width: 500px;
		margin: 0 auto;
	}
		
	.events .events-item {
		max-width: 500px;
		margin: 0 auto;
		margin-top: 30px;
	}
	
	.meet .meet-map .map-marker img {max-width: 18px;}
	
	.contact .form-content {
		max-width: 500px;
		margin: 0 auto;
	}
}

/*
 * Desktop 
 */
@media (max-width: 991px){
	.banner .slide-one, .banner .slide-two {top: 130px;}
}

@media (max-width: 1100px){ 
}