@import url(https://fonts.googleapis.com/css?family=Raleway:500,600,700,400);
@import url(https://fonts.googleapis.com/css?family=Nunito:300,400,700);

/* Base Declarations & Components */
html, body
{
	width:100%;
	height:100%;
	font-family:"Raleway", "Verdana", "Lucida Grande", "Gill Sans",  "Helvetica", sans-serif;
	font-size:14px/22px;
	-webkit-font-smoothing: antialiased;
	letter-spacing: 0.5px;
	color:#888888;
	background:#e6e6e6;
}
.transition
{
	transition:all .5s ease;
	-o-transition:all .5s ease;
	-moz-transition:all .5s ease;
	-webkit-transition:all .5s ease;
}
.btn-default:active:hover, .btn-default.active:hover, .open > .dropdown-toggle.btn-default:hover, .btn-default:active:focus, .btn-default.active:focus, .open > .dropdown-toggle.btn-default:focus, .btn-default:active.focus, .btn-default.active.focus, .open > .dropdown-toggle.btn-default.focus
{
	color:#FFF;
}
.facebook { background:#3b5999 !important;}
	.facebook:hover { background:#254281 !important; }
.google-plus { background:#d44332 !important; }
	.google-plus:hover { background:#b94032 !important; }
.instagram { background:#517fa4 !important; }
	.instagram:hover { background:#37658b !important; }
.vine { background:#517fa4 !important; }
	.vine:hover { background:#37658b !important; }
.twitter { background:#00aced !important; }
	.twitter:hover { background:#0592c8 !important; }
.default { background:#7b7b7b !important; }
	.default:hover { background:#5b5b5b !important; }
.android { color:#a4c639; }
.ios { color:; }
.windows { color:#00adef; }
.circle { border-radius:50%; }

#pageContainer .container
{
	background:#FFF;
	padding:30px;
	padding-top: 10px;
}

/* App Banner */

#appBanner
{
	padding:15px;
	background-color:#343434;
	color:#FFF;
}
#appBanner a
{
	color:#FFF;
	font-weight:700;
}
#appBanner a:hover,
#appBanner a:focus,
#appBanner a:active
{
	text-decoration: none;
}
#appBanner .application-logo
{
	float:left;
	margin-right:10px;
}
#appBanner .available-stores
{
	float:right;
	display:inline-block;
}
#appBanner .available-stores .btn
{
	width:auto;
	min-width:auto;
	text-align:center;
}
	#appBanner .available-stores .btn:hover
	{
		background: #000000;
		color: #ffffff;
	}
	#appBanner .available-stores .btn:active
	{
		background: #000000;
		color: #5d5d5d;
	}
	#appBanner .available-stores .btn:visited
	 {
		 background: #343434;
		 color: #ffffff;
	 }
#appBanner .available-stores .btn .fa
{
	display:none;
}

.mixcord-logo
{
	height:60px;
	text-align: left;
}
	.mixcord-logo-button
	{
		float: right;
		line-height: 40px;

	}
		.mixcord-logo-button button
		{
			color: #ed1c34;
			font-family: 'Nunito', sans-serif;
			font-weight: 300;
			font-size: 16px;
		}
	.mixcord-logo img
	{
		margin-top: 5px;
		height:35px;
        margin-left: 8px;
	}
/* Media Panel */

.media-information
{
	margin:10px auto;
}
.application-logo,
.album-cover
{
	height:40px;
	width:40px;
	display:block;
	background:no-repeat center center;
	border-radius:5px;
	background-size:100%;
	float:left;
	margin-right:1px;
    margin-left: 8px;
}

.application-brand,
.music-block,
.ad-block
{
	border-bottom:1px solid #dad7d8;
	padding:10px;
}
.music-information,
.application-brand-inner,
.ad-information
{
    padding-left: 60px;
}
.ad-block
{
	background: #222222;
}
.brand-name
{
	font-family: 'Nunito', sans-serif;
	font-size: 0.875em;
	color: #ffffff;
	font-weight:400;
}
.available-stores,
.listen-button
{
	text-align:right;
	float:right;
}
.availability
{
	float:right;
}
.btn.app-stores
{
	/*background:#ed1c34;*/
	/*color:#FFF;*/
	text-shadow:none;
	min-width:100px;
	text-align:left;
	font-weight:700;
}
.btn-make {
	background:#FFF;
	color:#ed1c34;
	min-width:100px;
    border:solid #ed1c34 2px;
    margin-right: 8px;
}

.btn-get {
	background:#343434;
	color:#FFF;
	min-width:50px;
}
.btn-listen {
	background: #FFF;
	/*color:#000000;*/
	color:#ed1c34;
	min-width:100px;
    border:solid #ed1c34 2px;
    margin-right: 8px;
}

.btn.app-stores:hover
{
	background:#ed1c34;
	color:#ffffff;
}
.btn.app-stores:active
{
	background:#a41c34;
	color:#ffffff;
}
.btn.app-stores:visited
{
	background:#ed1c34;
	color:#ffffff;
	border: #ed1c34 solid 2px;
}
	.btn.app-stores .fa
	{
		margin-right:10px;
	}
.song-name
{
	font-weight:400;
}
.song-artist
{
    font-weight:700;
}
.private-post
{
    margin:0 auto;
    float:none;
}
.ad-desc
{
	color: #ffffff;
}
/* Social Panel */

.avatar-header
{
	height: 50px;
}
.post-information
{
	padding:0px 10px;
}
.poster-avatar
{
	width:38px;
	height:38px;
	border-radius:50%;
	display:block;
	float:left;
	margin-right:10px;
    margin-left: 8px;
	background-position:center center;
	background-size:contain;
}
.username
{
	color:#7a7a7a;
	font-weight:700;
}
.media-source
{
	padding:5px 0px;
	float:right;
}
.source-icon
{
    width: 28px;
    height: 28px;
    display: block;
    padding:4px 6px;
    border-radius: 3px;
    color: #FFF;
}
.post-content
{
	margin:30px 15px 30px 15px;
}
.comment-icon
{
	color:#c6c4c4;
	float:left;
}
.post-comment
{
	font-size: 1em;
	font-family: 'Nunito', sans-serif;
	font-weight: 300;
	margin: 0 30px;
}
.share-icons
{
	text-align:center;
  margin-bottom: 20px;
}
.share-icons h5
{
	font-weight:700;
	margin-bottom:20px;
    margin-top: 30px;
}
.social-icons
{
	margin:0;
	padding:0;
}
.social-icons .social-icon
{
	list-style:none;
	display:inline-block;
	margin:0 10px;
}
.social-icons .social-icon .btn
{
	width:48px;
	height:48px;
	text-align:center;
	color:#FFF;
	border:0;
}

/* Modal Replacement */

#appStoreModal
{
	text-align:left;
	color:#000;
}
#appStoreModal h5
{
	text-align:center;
}
#appStoreModal .app-stores
{
	text-align:center;
	-webkit-padding-start: 0;
}
#appStoreModal .app-stores li
{
	display:inline-block;
}
#appStoreModal .sms-form
{
	margin-top:40px;
	text-align:center;
}
#appStoreModal .sms-form h5
{
	margin-bottom:20px;
}
#appStoreModal .sms-form input
{
	max-width:250px;
	display:inline-block;
}

/* Collaborators */

.post-collaborators
{
	margin-top:10px;
	position:relative;
	border-bottom:1px solid #dad7d8;
	padding-bottom: 10px;
}
.collaborator-icon
{
	color:#ed1c34;
	float:left;
	padding-top:8px;
    padding-left: 8px;
	text-align: center;
}
.collaborator-label
{
	float:left;
	margin-left:10px;
	color:#ed1c34;
	line-height:1;
	padding-top:6px;
}
	.collaborator-label a
	{
		color:#ed1c34;
		text-decoration: none;
	}
	.collab-by
	{
		display:block;
		font-size:13px;
	}
	.collab-count
	{
		font-weight:bold;
		font-size:17px;
	}
.collaborator-container
{
	overflow:hidden;
	height:38px;
}
.collaborator-modal .modal-body
{
	max-height:300px;
	overflow:hidden;
	overflow-y:scroll;
}
.collaborator-list
{
	list-style: none;
	padding:0;
	margin:0;
}
.collaborator-list li
{
	display:block;
	padding:10px 0;
	border-bottom:1px solid #f0f0f0;
	width:50%;
	float:left;
}
.collaborator-username
{
	padding-top:8px;
	display:inline-block;
	margin-left:10px;
	color:#7a7a7a;
	font-weight:bold;
}
	.collaborator-username a
	{
		color:#7a7a7a;
		font-weight:bold;
	}
.collaborator-avatars
{
	padding:0;
	margin:0;
}
.collaborator
{
	float:left;
	margin-left:10px;
	width:38px;
	height:38px;
	border-radius:50%;
	display:block;
	vertical-align: middle;
	font-weight:bold;
}
.collaborator a
{
	color:#FFF;
	text-decoration: none;
}
.collaborator-avatar
{
	width:38px;
	height:38px;
	border-radius:50%;
	display:block;
	background-position:center center;
	background-size:contain;
}

/* Copyright */

#copyright .container
{
	text-align: center;
	background-color:#f4f4f4;;
	padding:10px;
}
.brand-image
{
	margin-top:10px;
}
.brand-image img
{
	max-height:30px;
}

/* Footer */
.collab-footer
{
	background-color: #f4f4f4;
	padding: 5px 10px;
	text-align: center;
}
.collab-footer a
{
	color: #959595;
	font-family: 'Nunito', sans-serif;
	font-weight: 400;
	font-size: 1em;
	line-height: 20px;
	margin: 5px;
	/*padding: 20px 10px*/
  display: inline-block;
}
.company-logo
{
	font-family: 'Nunito', sans-serif;
	font-weight: 400;
	color: #353535;
	font-size: 0.75em;
	margin: 10px;
}


/* Modal Replacement */

#appStoreModal
{
	text-align:left;
	color:#000;
}
#appStoreModal h5
{
	text-align:center;
}
#appStoreModal .app-stores
{
	text-align:center;
	-webkit-padding-start: 0;
}
#appStoreModal .app-stores li
{
	display:inline-block;
}
#appStoreModal .app-stores img
{
	width:100%;
}
#appStoreModal .sms-form
{
	margin-top:40px;
	text-align:center;
}
#appStoreModal .sms-form h5
{
	margin-bottom:20px;
}
#appStoreModal .sms-form input
{
	max-width:250px;
	display:inline-block;
}

/* Media Queries */

@media only screen and (max-width : 1200px) {

}

@media only screen and (max-width : 979px) {

}

@media only screen and (max-width : 768px) {
	#pageContainer .container
	{
		padding:10px;
	}
	.media-block
	{
		margin:10px -10px;
	}
}

@media only screen and (max-width : 480px) {
	#appBanner a
	{
		font-size:0.75em;
	}
	#pageContainer .container
	{
		padding:10px;
	}
	#appBanner .made-with
	{
	font-size:0.75em;
	}
	.media-source
	{
		float:right;
	}
	.comment-icon
	{
		display:none;
	}
	.post-comment
	{
		margin:0;
		padding:0 10px;
	}
	.social-icons .social-icon
	{
		margin:5px;
	}
	.collaborator-list li
	{
		float:none;
		width:100%;
	}
}

.black-background {
	background-color: #000;
	color: #fff;
	height: 20rem;
}

.black-background p {
  position: relative;
  top: 8rem;
  width: 70%;
  margin: 0 auto;
}


@media only screen and (max-width : 320px) {

}

#private-report{
	padding-top: 20px;
}

.fa-plus {
  background-image: url("/img/Get_icon.png");
}

/* slick carousel */

.posts-related-ctn {
  width: 96%;
  bottom: 0;
}

.posts-related-ctn h5 {
  color: #adadad;
  margin: 0 0 0 10px;
}

.posts-related {
  overflow: hidden;
}

.slick-slide {
  padding: 10px 10px 4px;
  position: relative;
}

.slick-slide img {
  /*max-height: 100%;*/
  max-width: 100%;
  box-shadow: 0 2px 2px 0 #999;
}

.slick-slide span {
  background-size: contain;
  height: 25px;
  position: absolute;
  right: 17px;
  top: 17px;
  width: 25px;
}

.slick-arrow {
  height: 100%;
  position: absolute;
  text-align: center;
  top: 0;
  width: 13%;
  background: rgba(255, 255, 255, 0.75);
  cursor: pointer;
  z-index: 1;
}
.slick-next {
  right: 0;
}
.slick-prev {
  left: 0;
}
.slick-arrow img {
  height: 32px;
  margin-top: -17px;
  position: relative;
  top: 50%;
}
.slick-next img {
  right: 2px;
}
.slick-prev img {
  left: 2px;
}

@media (min-width: 1200px) {
  .post-comment {
    min-height: 199px;
  }
}

@media (max-width: 1199px) {
  .col-xs-12.col-lg-6.right {
    height: auto;
  }
  .posts-related-ctn {
    position: static;
    width: auto;
    margin-top: 35px;
  }
  .slick-arrow img {
    height: 40px;
    margin-top: -20px;
  }
}

@media (max-width: 991px) {
  .slick-arrow img {
    height: 32px;
    margin-top: -17px;
  }
}

@media (max-width: 569px) {
  .posts-related-ctn h5 {
    font-size: 12px;
    margin-left: 8px;
  }
  .slick-arrow img {
    height: 30px;
  }
  .slick-slide {
    padding: 8px;
  }
  .slick-slide span {
    height: 18px;
    right: 13px;
    top: 13px;
    width: 18px;
  }
}

@media (max-width: 480px) {
  .slick-arrow img {
    height: 25px;
  }
  .slick-slide {
    padding: 5px;
  }
}

@media (max-width: 320px) {
  .posts-related-ctn h5 {
    margin-left: 5px;
  }
  .slick-arrow img {
    height: 18px;
  }
  .slick-slide span {
    height: 18px;
    right: 8px;
    top: 8px;
    width: 18px;
  }
}