@charset "utf-8";
/* CSS Document */


*{
	font-family: 'Rubik', sans-serif;
	box-sizing: border-box;
	font-weight: 100;
	-webkit-tap-highlight-color:transparent;
    -moz-tap-highlight-color:transparent;
    -o-tap-highlight-color:transparent;
    tap-highlight-color:transparent;
}
textarea:hover,  
textarea:active, 
textarea:focus, 
button:focus,
button:active,
button:hover,
label:focus,
.btn:active,
.btn.active
{
    outline:0px !important;
    -webkit-appearance:none;
    box-shadow: none !important;
}
input[type="file"]{
	font-size: 14px
}

/*Checkbox Custom Style*/

input[type="checkbox"] { display: none; }

input[type="checkbox"] + label {
  display: block;
  position: relative;
  padding-left: 35px;
  margin-bottom: 20px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
	line-height: 22px;
}

input[type="checkbox"] + label:last-child { margin-bottom: 0; }
input[type="checkbox"] + label:before{
  content: '';
  display: block;
  width: 20px;
  height: 20px;
  border: 2px solid #65778e;
  border-radius: 3px;
  position: absolute;
  left: 0;
  top: 0;
  opacity: .9;
  -webkit-transition: all .12s, border-color .08s;
  transition: all .12s, border-color .08s;
}
input[type="checkbox"] + label:after {
  content: '';
  display: block;
  width: 20px;
  height: 20px;
  border: 2px solid #65778e;
  position: absolute;
  left: 0;
  top: 0;
  opacity: .6;
  -webkit-transition: all .12s, border-color .08s;
  transition: all .12s, border-color .08s;
	border-radius: 3px;
}
/*
input[type="checkbox"]:checked + label:before{
	background: #1ea1f2;
}*/
input[type="checkbox"]:checked + label:after {
    width: 7px;
    border-radius: 0;
    opacity: 1;
	border-color: #65778e;
    border-top-color: transparent;
    border-left-color: transparent;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    height: 13px;
    left: 6px;
    top: 2px;
}

/*Radio Btn Custom Style*/
/*
[type="radio"]:checked,
[type="radio"]:not(:checked) {
    position: absolute;
    left: -9999px;
}
*/
[type="radio"]:checked + label,
[type="radio"]:not(:checked) + label
{
    position: relative;
    padding-left: 28px;
    cursor: pointer;
    line-height: 20px;
    display: inline-block;
}
[type="radio"]:checked + label:before,
[type="radio"]:not(:checked) + label:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 18px;
    height: 18px;
    border: 2px solid #65778e;
    border-radius: 100%;
    background: #fff;
}
[type="radio"]:checked + label:after,
[type="radio"]:not(:checked) + label:after {
    content: '';
    width: 10px;
    height: 10px;
    background: #65778e;
    position: absolute;
    top: 4px;
    left: 4px;
    border-radius: 100%;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
}
[type="radio"]:not(:checked) + label:after {
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
}
[type="radio"]:checked + label:after {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
}


input[type="text"],input[type="password"],textarea {
    width: 100%;
    border: 1px solid #ccc;
    font-weight: 500;
    font-size: 14px;
    line-height: 30px;
	transition: all 0.3s ease;
	-webkit-transition: all 0.3s ease;
	border-radius: 3px;
	background: #efefef;
	padding: 0px 5px;
}



.fullwidth{
	width: 100%;
}
.mgnT30{
	margin-top: 30px;
}
.mgnT25{
	margin-top: 25px;
}
.mgnT20{
	margin-top: 20px;
}
.mgnT15{
	margin-top: 25px;
}
.mgnT10{
	margin-top: 10px;
}
.mgnT5{
	margin-top: 5px;
}
.mgnB30{
	margin-bottom: 30px;
}
.mgnB25{
	margin-bottom: 25px;
}
.mgnB20{
	margin-bottom: 20px;
}
.mgnB15{
	margin-bottom: 25px;
}
.mgnB10{
	margin-bottom: 10px;
}
.mgnB5{
	margin-bottom: 5px;
}

.pdgR20{
	padding-right: 20px;
}
.primary-btn {
    color: #fff;
    background-color: #1ea1f2;
    border-color: transparent;
	transition: all 0.3s ease;
	-webkit-transition: all 0.3s ease;
	padding: 8px 20px;
	border: none;
	border-radius: 18px;
	font-size: 14px;
	cursor: pointer;
}
.primary-btn:hover{
	background-color: #0E99EC;
    border-color: transparent;
	opacity: 0.9;
}
.primary-btn-1 {
    color: #fff;
    background-color: #1ea1f2;
    border-color: transparent;
	transition: all 0.3s ease;
	-webkit-transition: all 0.3s ease;
	padding: 8px 20px;
	border: none;
	border-radius: 5px;
	font-size: 14px;
	cursor: pointer;
}
.primary-btn-1:hover{
	background-color: #0E99EC;
    border-color: transparent;
	opacity: 0.9;
}
.top-header {
    background: rgba(255,255,255,0.20);
	padding: 5px 0;
	left: 240px;
	right: 0;
	top: 0;
	z-index: 1001;
	transition: all 0.3s ease;
	-webkit-transition: all 0.3s ease;
}
.top-header .pagelogo{
	display: none;
}
.page-heading {
    font-family: 'Raleway', sans-serif;
    font-weight: 700;
    color: #333;
    font-size: 20px;
}
.navbar-left .pagelogo{
	position: fixed;
	background: #FFF;
    top: 0;
    left: 0;
    width: 240px;
	border-right: 1px solid #ccc;
	height: 70px;
	padding: 15px;
}
.pagelogo img {
    height: 40px;
}
.top-header.white_bg {
    background: #FFF;
	box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.3);
    -webkit-box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.3);
}
.top-header.white_bg .header-right .nav-link{
	color: #666666;
}
.nav-toggle-btn {
    padding: 5px;
    display: block;
    float: left;
    font-size: 24px;
    color: #FFF;
    transform: rotate(-90deg);
	cursor: pointer;
	display: none;
}
.nav-toggle-btn svg{
	color: #FFFFFF;
}
.top-header.white_bg .nav-toggle-btn svg{
	color: #666666;
}
.header-right .nav-link {
    color: #FFF;
    font-size: 14px;
}
.navbar-bg {
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(0,0,0,0.3);
    z-index: 1003;
    display: none;
}
.navbar-left {
    top: 70px;
    background: #FFF;
    bottom: 0;
    left: 0;
    width: 240px;
	overflow: auto;
	scrollbar-width: thin;
	border-right: 1px solid #ccc;
	z-index: 1002;
}
.leftnav-ul {
    padding: 10px 0;
    margin: 0;
}
.leftnav-ul .leftnav-li {
    list-style: none;
	transition: all 0.3s ease;
	-webkit-transition: all 0.3s ease;
}
.leftnav-a {
    padding: 10px 15px;
    color: #666666;
    font-weight: unset;
    font-size: 14px;
	transition: all 0.3s ease;
	-webkit-transition: all 0.3s ease;
}
.leftnav-a.active{
	background-color: #1ea1f2;
    color: #FFFFFF;
}
.leftnav-a:hover{
	background-color:#1ea1f2;
    color: #FFFFFF;
	text-decoration: none;
}
.leftnav-a svg {
    width: 20px !important;
}
.leftsubnav-ul {
    padding: 0;
    background: #ddd;
	display: none;
}
.leftsubnav-li {
    list-style: none;
}
.leftsubnav-a {
    color: #555555;
    font-size: 14px;
    padding: 10px;
    padding-left: 30px;
	transition: all 0.3s ease;
	-webkit-transition: all 0.3s ease;
}
.leftsubnav-a:hover{
	color: #333;
	text-decoration: none;
	padding-left: 35px;
	background: #ccc;
}
.content-spacer {
    background-color: #65778e;
    height: 160px;
}
.content-wraper {
    padding-left: 255px;
    padding-right: 15px;
	position: relative;
	z-index: 100;
}
.content-wraper-in {
    margin-top: -80px;
    border-radius: 10px;
}
.dashboard-info-box {
    height: 120px;
    background: #FFF;
    border-radius: 10px;
    box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.3);
    -webkit-box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.3);
	padding: 20px;
	margin-bottom: 30px;
}
.dashinfo-count {
    width: 100%;
    float: left;
    padding: 10px 0;
}
.dashboard-info-box h5 {
    font-family: 'Raleway', sans-serif;
    color: #666;
	margin: 0;
}
.dashcount-box {
    float: right;
	padding: 5px;
}
.dashcount-box img {
    width: 25px;
    float: left;
    margin: 4px;
	-webkit-filter: grayscale(100%);
	filter: grayscale(100%);
}
.dashcount-box span {
    font-family: 'Oswald', sans-serif;
    font-weight: 700;
    color: #1ea1f2;
    font-size: 26px;
    line-height: 32px;
    float: left;
    padding-left: 5px;
}
.dashboard-right-box {
    background: #FFF;
    border-radius: 10px;
    box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.3);
    -webkit-box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.3);
    padding: 15px;
	margin-bottom: 25px;
}
.d-r-box-header {
    font-family: 'Raleway', sans-serif;
    font-size: 19px;
    font-weight: bolder;
    padding: 0 10px 10px;
    border-bottom: 1px solid #ddd;
    margin-bottom: 10px;
}
.select-outer select {
    border: none;
    appearance: none;
    -webkit-appearance: none;
    font-size: 14px;
    padding-right: 20px;
    line-height: 30px;
	background: transparent;
	position: relative;
	z-index: 2;
}
.select-outer {
	border: 1px solid #ccc;
	border-radius: 3px;
	position: relative;
}
.select-outer::after{
	content: "";
	position: absolute;
	width: 0;
	height: 0;
	border: 4px solid transparent;
	border-top-color: #666666;
	right: 6px;
	top: 14px;
	z-index: 0;
}
.admin-login-header-in {
    background-color: #1ea1f2;
    padding: 50px 15px 160px;
    text-align: center;
}
.login_page_logo {
    display: inline-block;
    position: relative;
    z-index: 20;
}
.login_page_bg {
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-size: 100%;
    background-position: bottom;
	background-image: url(../images/login_bg.png);
	background-repeat: no-repeat;
}
.login_page_logo img {
    height: 50px;
}
.login-container {
    padding: 0 15px;
}
.login-container .login-box {
    width: 100%;
    max-width: 340px;
    margin-left: 50%;
    transform: translateX(-50%);
    padding: 25px;
    margin-top: -120px;
    background: #fff;
    border-radius: 15px;
    box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.3);
    -webkit-box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.3);
	margin-bottom:50px;
}
.login-box .form_row {
    position: relative;
    padding-bottom: 25px;
}
.login-box .login-header {
    font-family: 'Raleway', sans-serif;
    font-weight: 700;
    color: #666666;
    font-size: 23px;
    line-height: 20px;
    margin-bottom: 30px;
    text-align: center;
}
.login-box .form_row label {
    font-size: 12px;
    float: left;
    width: 100%;
    margin: 0;
    font-family: 'Raleway', sans-serif;
    font-weight: 500;
    letter-spacing: 0.5px;
    color: #666;
}
.login-box input[type="text"],.login-box input[type="password"] {
    width: 100%;
    border: none;
    font-weight: 500;
    font-size: 14px;
    border-bottom: 2px solid #999;
    line-height: 30px;
	transition: all 0.3s ease;
	-webkit-transition: all 0.3s ease;
}
.login-box input[type="text"]:focus, .login-box input[type="password"]:focus{
	border-bottom-color: #1ea1f2;
}

.login-box .form_row .info-p {
    font-size: 13px;
    margin: 0;
    color: #777;
}
.login-btn{
    background-color: #1ea1f2;
    border: none;
    font-size: 14px;
    padding: 0 30px;
    line-height: 40px;
    border-radius: 20px;
    color: white;
    cursor: pointer;
    -webkit-appearance: none;
}
.form-error {
    bottom: 4px;
    left: 0;
    right: 0;
    font-size: 12px;
    color: red;
    display: none;
}
.error .form-error{
	display: block;
}
.login-box .form_row.error label{
	color: red;
}
.error input[type="text"],.error input[type="password"] {
	border-color: #FD3C3F;
}
.content-wraper-in.bg-white {
    padding: 20px;
    min-height: 200px;
    box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.2);
    -webkit-box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.2);
}
.header-tabs {
    border-bottom: 1px solid #ddd;
    margin-top: -10px;
}
.header-tabs .header-tab {
    font-size: 14px;
    padding: 8px 5px;
    float: left;
    color: #666;
    border-bottom: 2px solid transparent;
	transition: all 0.3s ease;
	-webkit-transition: all 0.3s ease;
}
.header-tabs .header-tab.active {
	color: #1ea1f2;
    border-bottom: 2px solid #1ea1f2;
}
.header-tabs .header-tab:hover{
	color: #1ea1f2;
	text-decoration: none;
}
.page-description {
    font-size: 14px;
    color: #282828;
}
.radio_box {
    padding-right: 15px;
}
.radio_box label {
    line-height: 20px !important;
    height: auto;
}
.form-group.custom_row label {
    font-size: 14px;
    margin: 0;
    line-height: 30px;
    color: #282828;
}
.mandatory {
    color: red;
}
.helpmessage {
    position: relative;
    display: inline-block;
}
.help-title {
    display: none;
    position: absolute;
    width: 240px;
    background: rgba(0,0,0,0.8);
    float: left;
    z-index: 1;
    font-size: 12px;
    bottom: 30px;
    padding: 5px;
    border-radius: 3px;
    color: #FFF;
	line-height: 18px;
}
.helpmessage:hover .help-title{
	display: block;
}
.table-filter label {
    padding-right: 5px;
    line-height: 30px;
    margin: 0;
    font-size: 14px;
    color: #777;
}
.custom-table-outer {
    border: 1px solid #ddd;
    border-radius: 5px;
    margin: 10px 0;
}
.custom-table th {
    padding: 10px;
    background: #ddd;
    font-size: 14px;
    font-weight: bold;
}
.custom-table tbody td {
    border-bottom: 1px solid #eee;
    padding: 10px;
    font-size: 14px;
}
.table-action {
    position: relative;
    float: left;
}
.table-action .ta-btn {
    font-size: 20px;
    padding: 6px 10px;
    border-radius: 3px 3px 0 0;
	cursor: pointer;
}
.table-action:hover .ta-btn{
	background: #ddd;
}
.ta-dd {
    position: absolute;
    display: none;
    z-index: 100;
    background: #ddd;
    right: 0;
    top: 26px;
    padding: 5px 0px;
	min-width: 120px;
    border-radius: 3px;
	transition: all 0.3s ease;  
	-webkit-transition: all 0.3s ease;
	box-shadow: 0px 3px 3px -1px #0000004c;
}
.table-action:hover .ta-dd{
	display: block;
}
.ta-dd .ta-subbtn {
    float: left;
    line-height: 20px;
	color: #000;
    cursor: pointer;
    width: 100%;
	padding: 5px 10px;
	transition: all 0.3s ease;  
	-webkit-transition: all 0.3s ease;
	white-space: nowrap;
}
.ta-dd .ta-subbtn:hover{
	text-decoration: none;
	padding-left: 15px;
	padding-right: 5px;
	background: #eee;
}
.custom-table-outer .pagination {
    margin: 10px 0;
    font-size: 14px;
    padding-right: 10px;
}
.custom-table .mobilehead {
    display: none;
}
.table-list-image {
    width: 40px;
    height: 40px;
    float: left;
    margin: 3px;
    margin-left: 0;
    background-size: cover;
    border-radius: 5px;
}
.page-footer {
    background: #DDD;
    margin-top: 10px;
    padding: 10px;
    font-size: 12px;
    padding-left: 250px;
}
.footer-links {
    text-align: right;
}
.footer-links a {
    color: #333;
    font-size: 12px;
    padding: 5px;
    text-decoration: underline;
}
.package-row {
    padding: 0;
    padding-bottom: 20px;
    width: 100%;
    font-size: 14px;
}
.package-row input[type="text"] {
    width: 60px;
    line-height: 20px;
}
.package-row .mny {
    margin-left: -15px;
    margin-right: 10px;
}
.albumdetails-box {
    padding: 15px;
    border: 1px solid #dedede;
    border-radius: 10px;
    margin-bottom: 15px;
    padding-left: 230px;
}
.delete-album {
    top: 6px;
    right: 15px;
    font-size: 21px;
    color: #666;
	z-index: 100;
	margin-right: 15px;
}
.block-album {
    top: 6px;
    right: 40px;
    font-size: 21px;
    color: #666;
	z-index: 100;
}
.block-album:hover{
	color: rgba(75,1,2,1.00);
}
.albumdetails-box:hover .delete-album ,.albumdetails-box:hover  .block-album{
	
}
.albumdetails-box .album-image {
    width: 200px;
    height: 200px;
    left: 15px;
    top: 15px;
    overflow: hidden;
    border-radius: 8px;
}
.albumdetails-box .album-image img {
    width: 100%;
}
.albumdetails-box .box-row-left {
    font-size: 14px;
    color: #666;
}
.albumdetails-box .box-row-right {
    font-size: 14px;
}
.albumdetails-box .box-row-right strong{
	font-weight: 600;
}
.albumdetails-box .box-row-right .capsule {
    padding: 5px;
    margin-right: 5px;
    background: #e0e0e0;
    border-radius: 10px;
}
.albumdetails-box .box-row-right .album-artist img {
    width: 30px;
    height: 30px;
    border-radius: 20px;
}
.albumdetails-box .box-row-right .album-artist {
    padding: 5px;
    background: #ddd;
    border-radius: 22px;
    float: left;
    margin-right: 5px;
    margin-bottom: 5px;
	color: #000000;
}
.albumdetails-box .box-row-right .album-artist:hover{
	text-decoration: none;
}
.user-comment-row {
    padding: 15px;
    padding-right: 50px;
    font-size: 14px;
    position: relative;
	transition: all 0.3s ease;  
	-webkit-transition: all 0.3s ease;
}
.user-comment-row .comment-title {
    font-weight: bold;
    font-size: 16px;
}
.user-comment-row  .comment-info span {
    color: #666;
    font-size: 12px;
    margin-right: 5px;
    float: left;
}
.user-comment-row .cmnt-dlt {
    position: absolute;
    right: 15px;
    top: 10px;
    font-size: 20px;
    color: #666;
    padding: 5px;
}
.user-comment-row:hover{
	background: #e0e0e0;
}
        .error_msg.alert-message {
    background-color: #db5353;
    color: #FFF;
}
.alert-message {
    bottom: 20px;
    right: 20px;
    padding: 15px;
    display: none;
    z-index: 1000000;
}
.success_msg.alert-message {
    background: #5DAC62;
    color: #FFF;
}
.amnt{
    font-family: 'Raleway', sans-serif;
    font-weight: 700;
    color: #333;
    font-size: 16px;
}
.amnt span{
    color:#FF0000;
	font-weight: 700;
}
.line-h{
	line-height: 35px !important;
}
.filter-ul{
	padding: 0px;
	margin: 0px;
	float: right;
}
.filter-li{
	list-style: none;
}
.filter-div{
	width: 100%;
}
.page-link{
	padding: .5rem 0px;
	font-size: 12px;
	width: 25px;
    text-align: center;
}
.fltr-btn{
	border: 1px solid #ccc;
    padding: 3px 10px;
    cursor: pointer;
    border-radius: 3px;
	float: left;
}
.admin-bg{
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background: rgba(0, 0, 0, 0.35);
    z-index: 9999;
    display: none;
}
.delt-pop {
    float: left;
    position: fixed;
    background: #fff;
    left: 50%;
    top: 50%;
    width: 95%;
    max-width: 400px;
    transform: translate(-50%,-50%);
    border-radius: 5px;
    padding: 20px;
    z-index: 10000;
    display: none;
    text-align: center;
}
.delt-p{
    text-align: center;
    font-size: 15px;
    margin: 0px;
}
.dlt-bt {
    font-size: 15px;
    border: none;
    width: 70px;
    margin: 15px 5px 0px 5px;
    padding: 4px 0px;
    border-radius: 5px;
    cursor: pointer;
    color: #fff;
    -webkit-transition: .2s all ease;
    -mox-transition: .2s all ease;
    -ms-transition: .2s all ease;
    -o-transition: .2s all ease;
    transition: .2s all ease;
    
}
.d-bt {
    background: #D43F3A
;
}
.c-bt {
    background: #5CB85C
;
}
.d-bt:hover {
    background: #C0332F
;
}
.c-bt:hover {
    background: #489548
;
}
.blk-pop {
    float: left;
    position: fixed;
    background: #fff;
    left: 50%;
    top: 50%;
    width: 95%;
    max-width: 400px;
    transform: translate(-50%,-50%);
    border-radius: 5px;
    padding: 20px;
    z-index: 10000;
    display: none;
    text-align: center;
}
.pagination li.page-item {
    margin-right: 10px;
}
.pagination-sm .page-link {
    padding: .25rem .5rem;
    font-size: .875rem;
    box-sizing: border-box;
    width: auto;
}
