@import "compass/css3";

@mixin font-size-line-height($fontsize, $lineheight) {
	font-size: $fontsize;
	line-height: $lineheight;
}

@mixin element-height-width($height, $width) {
	height: $height;
	width: $width;
}

.rtm-link-button {
	border: none;
	background: none;
	text-decoration: none;
}

.rtm-top-notch {
	content: '';
	border-width: 5px;
	border-style: inset inset solid;
	display: block;
	position: absolute;
	border-color: rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) #EDEFF4;
}

.rtm-primary-button {
	background-color: #3475BA;
	border-radius: 5px 5px 5px 5px;
	text-transform: uppercase;
	box-shadow: 0 0 0 rgba(255, 255, 255, 0) inset;
	transition: background-color 300ms ease-out 0s;
	color: white;
	border: none;
	padding: 10px 20px;
	background-image: none;
	&:hover {
		background-color: #306BAA;
	}
}

.rtm-primary-font-color {
	color: #3475BA
}

#rtmedia-add-media-button-post-update {
	float: left;
	margin-top: 12px;
	margin-right: 20px;
}

.rtmedia-container {
	@import "compass/reset";
	//updated for foundation 5
	//@import "bower_components/foundation/variables";
	//@import "bower_components/foundation/scss/foundation/components/variables";
	@import "bower_components/foundation/scss/foundation/components/global"; // *always required
	@import "bower_components/foundation/scss/foundation/components/grid";
	//@import "foundation/components/visibility";
	@import "bower_components/foundation/scss/foundation/components/visibility";
	//@import "foundation/components/flex-video";
	@import "bower_components/foundation/scss/foundation/components/flex-video";
	@import "bower_components/foundation/scss/foundation/components/tabs";
	//@import "foundation/components/reveal";
	//@import 'foundation_section_settings';
	//@import "foundation/components/section";

	padding: 5px;
	margin: 0;
	clear: left;
	.rtmedia-editor-main {
		dl.tabs dd {
			& > a {
				font-size: 14px;
				text-decoration: none;
				padding: 5px 15px;
				background: #f1f1f1;
				&:hover {
					background: darken(#F5F5F5, 10%);
				}
			}
			&.active > a {
				background: #50A1D7;
				color: #fff;
			}
		}
		.tabs-content {
			margin-bottom: 5px;
			.content {
				float: none;
				padding: 10px;
			}
		}
		.rtmedia-title-editor {
			display: block;
			width: 100%;
		}
		.rtmedia-edit-change-album {
			margin-top: 15px;
		}
		.rtmedia-edit-title {
			label {
				display: block;
			}
		}
	}
	.primary {
		color: #3475BA;
	}
	.secondary {
		color: #82909D;
	}
	#buddypress {
		li {
			list-style: none;
		}
	}
	.row {
		max-width: 95%;
	}
	.rtmedia-item-title {
		text-align: center;
		h4 {
			text-overflow: ellipsis;
			white-space: nowrap;
			width: 100%;
			overflow: hidden;
			font-size: 1.1em;
			text-align: center;
		}
	}
	.rtmedia-success {
		display: block;
		padding: 5px;
		margin-top: 15px;
		border: 1px solid #457A1A;
		background-color: #5DA423;
		font-weight: bold;
	}
	h2 {
		font-size: 1.4em;
		font-weight: bold;
		line-height: 2.4em;
	}
	.drag-drop {
		border: 4px dashed #DDD;
		text-align: center;
		background: #fafafa;
		overflow: hidden;
		color: #AAAAAA;
		padding: 25px 0;
		&.dragover {
			border-color: #83b4d8;
		}
		.drag-drop-info {
			font-size: 20px;
			line-height: 24px;
		}
		.rtm-album-privacy span {
			margin: 0 20px 20px 20px;
			display: inline-block;
		}
		.rtm-select-files {
			//margin-bottom: 20px;
			span {
				vertical-align: middle;
			}
		}
		.rtm-seperator {
			margin: 0px 20px;
		}
		.start-media-upload {
			display: none;
			margin-top: 20px;
			@extend .rtm-primary-button;
		}

		.rtm-file-size-limit {
			vertical-align: middle;
			font-size: 16px;
			line-height: 24px;
		}
	}
	.rtm-uploader-main-wrapper {
		.rtm-uploader-tabs {
			margin-bottom: 10px;
			text-align: left;
		}
		ul{
			border-bottom: 1px solid #CCC;
		}
		li{
			margin: 0 0 -1px 10px;
			display: inline-block;
			padding: 5px 10px;
			line-height: 25px;
			background-color: #e4e4e4;
			border: 1px solid #CCC;
			&.active{
				background: transparent;
				border-left: 1px solid #CCC;
				border-top: 1px solid #CCC;
				border-right: 1px solid #CCC;
				border-bottom: 1px solid #fafafa;
			}
			&:hover{
				cursor: pointer;
			}
		}
	}
	.rtmedia-action-update {
		float: left;
		margin-top: 12px;
		margin-right: 10px;
	}
	.rtmedia-list {
		list-style: none;
		.rtmedia-list-item {
			word-wrap: break-word;
			margin: 10px;
			float: left;
			list-style: none;
			position: relative;
			a {
				text-decoration: none;
				h4 {
					line-height: 1.4em;
					font-size: 1.2em;
					padding-top: 10px;
				}
			}

			.rtmedia-item-selector {
				position: absolute;
			}
		}
		.rtmedia-list-item.media-type-music, .rtmedia-list-item.media-type-video {
			width: 100%;
			.mejs-controls {
				.mejs-time-rail {
					margin: 8px 4px 0px 4px;
					height: 0px;
				}
				.mejs-time {
					height: 24px;
				}
			}
		}
		.rtmedia-list-item.media-type-photo {
			width: 100%;
		}
	}
	.rtmedia-media img {
		max-width: 100%;
	}
	.rtmedia-item-thumbnail {
		text-align: center;
		.rtmedia_time {
			position: absolute;
			top: 2px;
			right: 2px;
			padding: 0 4px;
			font-weight: bold;
			font-size: 11px;
			background-color: #000;
			color: #fff;
			line-height: 14px;
			opacity: .75;
			display: inline-block;
		}
		img {
			vertical-align: middle;
		}
	}
	.rtmedia_next_prev {
		clear: both;
		a {
			display: block;
			clear: both;
			background-color: #E9E9E9;
			padding: 10px;
			text-align: center;
			text-decoration: none;
			color: #000;
			margin: 15px;
		}
		.pagination {
			clear: both;
			padding: 0;
			position: relative;
			font-size: 11px;
			line-height: 13px;
			span, a {
				display: inline;
				float: left;
				margin: 2px 2px 2px 0;
				padding: 6px 9px 5px 9px;
				text-decoration: none;
				width: auto;
				color: #fff;
				background: #555;
				float: none;
				font-size: 13px;
				line-height: 30px;
				&:hover {
					color: #fff;
					background: #bc360a;
				}
			}
			.current {
				padding: 6px 9px 5px 9px;
				background: #bc360a;
				color: #fff;
			}
			.rtmedia-page-no {
				display: inline;
				float: left;
				font-size: 13px;
				color: #888;
				input {
					padding: 3px;
					max-width: 50px;
				}
			}
		}
	}
	.rtmedia-item-comments-container {
		margin: 3% 3%;
	}
	#rtmedia_comment_ul {
		margin-left: 0;
		margin-bottom: 10px;
	}
	.rtmedia-bp-header {
		width: 460px;
		margin: auto;
	}
	#div-attache-rtmedia {
		display: none;
	}
	#rtMedia-update-queue-list {
		p {
			span {
				margin-right: 20px;
			}
		}
	}
	.rtmedia-move-container {
		display: none;
		padding: 10px;
		border: 1px dashed #999;
	}
	#rtmedia-add-media-button-post-update {
		float: left;
		margin-top: 10px;
		margin-right: 20px;
	}
	#whats-new-post-in-box {
		float: left;
	}
	.rtmedia-activity-text {
		display: block;
		padding-bottom: 10px;
	}
	select {
		width: auto;
	}
	&.rtmedia-single-container {
		.row {
			background-color: #FFF;
			#rtmedia-single-media-container {
				padding-top: 10px;
				padding-bottom: 10px;
				.rtmedia-media {
					div.mejs-layers {
						div.mejs-poster {
							overflow: hidden
						}
					}
					.mejs-layers .mejs-overlay-button {
						margin: -50px 0 0 -50px;
					}
					.mejs-layers .mejs-poster {
						overflow: hidden;
					}
				}
				.rtmedia-media-title {
					margin: 0 0 5px 0;
					display: block;
					font-weight: bold;
					letter-spacing: 1px;
				}
			}
			.rtmedia-single-meta {
				div {
					&.userprofile {
						float: left;
						padding: 10px;
					}
					&.username {
						padding: 0 10px;
						line-height: 16px;
						//margin-bottom: 10px;
						font-weight: bold;

						a {
							text-decoration: none;
							&:hover {
								text-decoration: underline;
							}
						}

					}
					&.rtm-time-privacy {
						font-size: 12px;
						line-height: 24px;
						margin-bottom: 7px;
						color: #808080;
						i {
							margin-left: 4px;
						}
					}
					&.rtmedia-actions-before-description {
						margin-top: 10px;
						> div {
							float: left;
							line-height: 20px;
							display: inline-block;
						}
					}
				}
				padding: 10px;
				button {
					color: #5E5E5E;
					background-color: #EBEBEB;
					background-repeat: repeat-x;
					background-image: -moz-linear-gradient(top, #F9F9F9, #EBEBEB);
					background-image: -ms-linear-gradient(top, #F9F9F9, #EBEBEB);
					background-image: -webkit-linear-gradient(top, #F9F9F9, #EBEBEB);
					background-image: -o-linear-gradient(top, #F9F9F9, #EBEBEB);
					background-image: linear-gradient(top, #F9F9F9, #EBEBEB);
				}
				& > a {
					float: left;
					margin: 10px;
				}
				.rtmedia-item-actions {
					& > ul > li {
						display: inline-block;
						float: left;
						margin-right: 5px;

						.rtmedia-like {
							display: none;
						}
					}
					& > a {
						display: inline-block;
						float: left;
					}
					& > form {
						float: left;
						margin-right: 5px;
					}
					.rtmedia-action-buttons {
						span.like-count {
							background: #EEE;
							@include border-radius(50%);
							border: 1px solid #CCC;
							color: #999;
							display: inline;
							font-size: 70%;
							margin-left: 2px;
							margin-right: 2px;
							padding: 3px 6px;
							text-align: center;
							vertical-align: middle;
						}
					}
				}
				.rtmedia-media-description {
					line-height: 22px;
					margin: 10px 0;
				}
			}
			.rtmedia-item-comments {
				background-color: transparent;
				div {
					background-color: transparent;
				}

				.rtm-like-comments-info {
					width: 100%;
					&:before {
						@extend .rtm-top-notch;
						top: 13px;
						left: 20px;
					}
				}
				.rtmedia-like-info {
					background-color: #EDEFF4;
					@include font-size-line-height(12px, 16px);
					padding: 3px 5px;
					position: relative;
					margin-bottom: 2px;
					i {
						margin-right: 4px;
					}
				}
			}
		}
	}

	#wp-description-editor-tools {
		a.wp-switch-editor {
			margin: 5px 5px 0 0;
			padding: 4px 5px 2px;
			float: right;
			cursor: pointer;
			border: 1px solid;
			border-color: #DFDFDF #DFDFDF #CCC;
			font: 13px/18px Arial, Helvetica, sans-serif normal;
			height: auto;
		}
	}
	#description_toolbargroup .mceToolbar td {
		padding: 0px;
	}
	#wp-description-editor-container {
		border-width: 1px;
		border-style: solid;
		-webkit-border-top-right-radius: 3px;
		-webkit-border-top-left-radius: 3px;
		border-top-right-radius: 3px;
		border-top-left-radius: 3px;
		border-color: #CCC #CCC #DFDFDF;
	}
	.rtmedia-change-cover-arts {
		p {
			padding: 5px 0;
		}
	}
	.rtm-media-loading {
		text-align: center;
		padding: 20px 0;
	}
}

.rt-clear:after {
	display: block;
	height: 0;
	line-height: 0;
	clear: both;
	content: '.';
	visibility: hidden;
}

.rtmedia-activity-container {
	@extend .rtmedia-container;
}

#buddypress {

	.rtmedia-container .rtmedia-uploader .drag-drop {
		.start-media-upload {
			@extend .rtm-primary-button;
		}
	}
	.rtmedia-single-container .rtmedia-single-meta {
		div.rtmedia-actions-before-comments {
			color: #6D84B4;
			line-height: 18px;
			margin-bottom: 5px;

			& > span {
				display: inline-block;
				margin-right: 5px;

				a, button, button.rtmedia-action-buttons {
					@extend .rtm-link-button;
					padding: 0;
					color: #21759B;
					@include font-size-line-height(12px, 14px);
					text-decoration: none;
					&:hover {
						text-decoration: underline;
					}
					&.rtmedia-like i {
						display: none;
					}
				}
			}
		}
	}
	button.rtm-alert-btn {
		background-color: #f04124;
		border-color: #cf280e;
		color: white;
	}
}

#buddypress {
	div {
		&.rtmedia-activity-container {
			@extend .rtmedia-container;
			ul {
				&.rtmedia-list {
					li {
						float: left;
						padding: 10px;
						.rtmedia-item-thumbnail {
							overflow: hidden;
							margin: 0 auto;
						}

						&.media-type-video {
							float: none;
							.rtmedia-item-thumbnail {
								margin: 0 auto;
								overflow: hidden;
								.mejs-overlay-button {
									margin: -50px 0 0 -50px;
								}
							}
						}
					}
				}
			}
		}
	}
}

#buddypress, .rtmedia-container {
	.mejs-controls {
		button {
			padding: 4px 8px;
			border: none;
			background: rgba(0, 0, 0, 0) url('../../../lib/media-element/controls.png') no-repeat;
		}
		.mejs-play {
			button {
				background-position: 0 0;
			}
		}
		.mejs-pause {
			button {
				background-position: 0 -16px;
			}
		}
		.mejs-unmute {
			button {
				background-position: -16px 0;
			}
		}
		.mejs-mute {
			button {
				background-position: -16px -16px;
			}
		}
		.mejs-fullscreen-button {
			button {
				background-position: -32px 0;
			}
		}
		.mejs-unfullscreen {
			button {
				background-position: -32px -16px;
			}
		}
	}
}

.mfp-content {
	#rtmedia-single-media-container {

		.rtmedia-media {
			text-align: center;
			background-color: #333;
			overflow: hidden;
			img {
				max-height: 95%;
			}
		}
	}
}

#rtmedia-action-update {
	float: left;
	padding-right: 10px;
}

.mfp-ready, .mfp-bg {
	z-index: 9999;
}

div.mfp-bg {
	background-color: #222222;
	opacity: 0.7;
}

.bp_media_content {
	video {
		background-color: black;
	}
}

.rtmedia-success {
	display: block;
	padding: 5px 10px;
	@include border-radius(4px);
	background-color: #2ECC71;
	color: white;
}

.rtmedia-error {
	color: white;
	display: block;
	padding: 10px;
	@include border-radius(4px);
	background-color: #E74C3C;
}

.rtmp-uploaded-file {
	width: 100%;
}

.close {
	cursor: pointer;
	color: red;
}

button.mfp-arrow, button.mfp-arrow:active {
	margin-top: -30px;
}

button.rtp-lb-close {
	top: 0;
	right: 0;
}

#object-nav, #group-admins, .item-list-tabs {
	li {
		list-style: none;
	}
}

.mejs-video .mejs-controls {
	position: absolute;
}

/* audio player positioning fix */
.mfp-content #rtmedia-single-media-container .wp-audio-shortcode {
	height: 0px !important;
}

/*.rtmedia-single-container .rtmedia-editor-description {
    margin-top: 15px;
}*/

//styles for media-single-edit template
.rtmedia-media-edit, #buddypress .rtmedia-media-edit {
	.rtmedia-single-edit-title-container {
		margin-bottom: 20px;
		.rtmedia-title {
			margin: 0;
		}
	}

	.rtmedia-edit-title {
		margin-bottom: 15px;
	}
	.rtmedia-edit-privacy {
		margin-bottom: 10px;
	}

	.rtmedia-editor-description {
		& > label {
			display: block;
			line-height: 24px;
		}
		.rtmedia-desc-textarea {
			width: 100%;
			display: inline-block;
			padding: 5px;
		}
	}
	.rtmedia-image-editor-cotnainer {
		.imgedit-menu {
			margin-bottom: 15px;
		}
		.imgedit-crop-wrap, .imgedit-group > p, .wp_attachment_image .thumbnail {
			margin-bottom: 10px;
		}
		.hidden {
			display: none;
		}
		hr {
			margin: 15px 0 25px 0;
		}

	}
	#rtmedia-image-editor-cotnainer {
		.imgedit-wrap td {
			vertical-align: top;
		}
	}
}

.rtmedia-container #rtm-media-options, .rtmedia-container {

	line-height: 30px;

	[class^="icon-"], [class*=" icon-"] {
		font-family: FontAwesome;
		font-style: normal;
		font-weight: normal;
		text-decoration: inherit;
		cursor: pointer;
		padding: 0;
		border: none;

		&.icon-2x {
			font-size: 1.6em;
		}
		&.icon-3x {
			font-size: 3em;
		}
		&:visited {
			color: #444444;
		}
		&:hover {
			background: none;
		}
	}
	.icon-remove {
		color: red;
	}
}

#rtm-media-options {
	text-align: right;

	[class^="icon-"], [class*=" icon-"] {
		margin-left: 10px;
		color: #444444;
	}

	.rtmedia-upload-media-link, i, a, button, span {
		font-size: 16px;
		cursor: pointer;
		color: #444444;
		text-decoration: none;
	}
	.primary, .primary i {
		color: #3475BA;
	}
	.rtmedia-delete-album {
		margin-left: 0;
	}
}

.rtmedia-inline {
	display: inline;
}

.rtmedia-container .rtMedia-queue-list {
	margin-bottom: 10px;
	line-height: 20px;
	width: 100%;
	tr td, tr th {
		padding: 3px 8px;
		//border-bottom : 1px solid #ffeca0;
	}
	tr {

		color: #333;
		> td.close {
			text-align: right;
		}
		> td.plupload_file_size {
			text-transform: uppercase;
		}
		&.upload-waiting {
			background-color: #FFFFCC;
			border-bottom: 1px solid #ffeca0;
		}
		&.upload-error {
			background-color: #ffe5e5;
			border-bottom: 1px solid #ffcccc;
		}
		&.upload-success, &.upload-progress {
			background-color: #C2FAC1;
			border-bottom: 1px solid #8EE888;
		}
	}
	.plupload_media_edit a {
		text-decoration: none;
		color: #181818;
	}
}

#rtm-drop-files-title {
	font-size: 24px;
	text-align: center;
	margin: -80px 0 40px 0;
	z-index: 0;
	display: none;
}

.rtm-drag-drop-active {
	border: 4px dashed green !important;
	opacity: 0.5;
	height: 100%;
	display: block;
	z-index: 9999;
}

.drag-drop p {
	margin: 10px 0;
}

#drag-drop-title {
	position: absolute;
	margin-top: -30px;
	z-index: 0;

}

#rtm-upload-start-notice {
	display: none;
	& > span {
		color: red;
		font-size: 14px;
		line-height: 20px;
	}

}

#rtm-media-gallery-uploader {
	display: none;
	margin-bottom: 20px;
}

#rtm-gallery-title-container {

	margin: 0 0 15px 0;

	.rtm-gallery-title {
		display: inline-block;
		margin: 0;
		overflow: hidden;
		vertical-align: bottom;
		padding-left: 0;
		padding-right: 0;
	}

	#rtm-media-options {
		padding: 5px 0;
		display: inline-block;

		.click-nav {
			float: none;
			.clicker, .clicker > i {
				font-size: 16px;
			}
			.rtm-options li {
				a, span, button, input {
					border: none;
					padding: 2px 5px;
					@include border-radius(4px);
					background: none;
					color: #fff;
					display: block;
					width: 100%;
					text-align: left;
					font-size: 13px;
					line-height: 24px;
					&:hover {
						background-color: #fff;
						color: #37454D;
						i {
							color: #37454D;
						}
					}
				}
				i {
					font-size: 13px;
					color: #fff;
				}
			}
		}

	}
}

.rtmedia-container ul#rtmedia_comment_ul {

	li {
		list-style: none;
		background: #EDEFF4;
		margin: 0 0 2px 0;
		padding: 5px;
		width: 100%;
		position: relative;
		word-wrap: break;
		line-height: 20px;

		&.rtmedia-no-comments {
			padding: 5px;
			font-size: 12px;
		}

		&:hover .rtmedia-delete-comment {
			display: block;
		}
		.rtmedia-comment-details {
			overflow: hidden;
			margin: 0;
			padding: 0;
		}
		.rtmedia-comment-user-pic {

			float: left;
			margin: 0 10px 0 0;
			padding: 2px 0 0 2px;
			img {
				height: 35px !important;
				width: 35px !important;
				//importants are provided to override the inline style that comes when buddypress is not active and image is set as profile pic
				@include border-radius(0);
			}
		}

		.rtmedia-comment-author {
			//display: block;
			line-height: 18px;
			font-size: 13px;
			margin-right: 5px;
			a {
				color: #3B5998;
				font-weight: bold;
				text-decoration: none;
				line-height: 18px;
			}
			a:hover {
				text-decoration: underline;
			}
		}

		.rtmedia-comment-content {
			line-height: 16px;
			font-size: 13px;
			padding-right: 5px;
		}

		.rtmedia-comment-date {
			//clear: left;
			display: block;
			font-size: 11px;
			//text-align: right;
			color: #808080;
		}

		.rtmedia-delete-comment {
			text-decoration: none;
			position: absolute;
			right: 0;
			top: 0;
			color: #3B59A1;
			display: none;
			cursor: pointer;
		}
	}
}

.rtmedia-item-comments .rt_media_comment_form {
	textarea {
		width: 100%;
		font-size: 13px;
		height: 50px;
	}
}

// lightbox changes
.mfp-content {
	width: 90%;
	#buddypress {
		.rtm-lightbox-container {
			background: #333;
			position: relative;
			@include box-shadow(0 0 10px rgba(0, 0, 0, 0.5));
			border: 1px solid #222222;

			.rtmedia-media .tagcontainer {
				display: inline-block;
				max-width: calc(100% - 4px);
				img {
					max-height: calc(100% - 4px);
				}
			}

			.rtmedia-single-meta {
				background: #fff;
				overflow: hidden;
				padding: 20px 0 0 10px;
				.rtm-single-meta-contents {
					&.logged-in {
						height: calc(97% - 80px);
					}
					max-height: 100%;
					overflow-x: hidden;
					overflow-y: auto;
					padding: 0 20px 0 10px;

					.rtmedia-media-title {
						@include font-size-line-height(16px, 22px);
						margin: 5px 0 10px 0;
					}
					.rtmedia-media-description {
						@include font-size-line-height(13px, 20px);
						margin-bottom: 10px;
					}

					.rtm-like-comments-info {
						&:before {
							top: 13px;
						}
					}

				}
				.rtm-single-meta-contents .rtmedia-comment {
					.rtmedia-comment-content {
						@include font-size-line-height(12px, 18px);
					}
					.rtmedia-comment-date {
						font-size: 11px;
					}
					.rtmedia-comment-author {
						@include font-size-line-height(13px, 18px);
					}
				}

				.username {
					padding: 0 10px;
				}
				.userprofile {
					padding: 0 10px 10px 0;

					.avatar {
						width: 40px;
					}
				}

				.rtm-media-single-comments {
					position: absolute;
					bottom: 10px;
					width: 95%;
					padding: 4px;
					background-color: #EDEFF4;
					.row {
						background: none;
					}
					textarea {
						min-height: 30px;
						max-height: 40px;
						@include font-size-line-height(12px, 14px);
						padding: 4px;
					}
					.rt_media_comment_submit {
						background-color: #5B74A8;
						border-color: #29447E #1A356E;
						color: #FFFFFF;
						font-weight: bold;
					}
				}
			}

			.rtm-mfp-close {
				.mfp-close {
					@include element-height-width(20px, 24px);
					font-size: 20px;
					color: grey;
					line-height: 20px;
					position: absolute;
					right: 0;
					z-index: 2;
					top: 0;
					cursor: pointer;
					font-weight: bold;
				}
			}
			.mfp-arrow {
				background: none;
				border: none;
				display: none;
			}

			#rtmedia-single-media-container {
				padding: 0 !important;

				&:hover {
					.mfp-arrow, .rtm-ltb-title-container, .rtm-ltb-action-container {
						display: block;
						z-index: 99;
					}
				}

				.rtm-ltb-title-container, .rtm-ltb-action-container {
					background-color: rgba(0, 0, 0, 0.6);
					padding: 0 10px;
					color: #fff;
					position: absolute;
					width: 100%;
					display: none;

					.rtmedia-actions, .rtmedia-author-actions {
						display: inline-block;
						vertical-align: middle;
						text-align: right;

						form {
							display: inline;
						}
						.click-nav {
							float: right;
							margin-right: 0;
						}
						.rtmedia-action-buttons, a, button {
							font-weight: bold;
							color: #fff;
							font-size: 12px;
							opacity: 0.7;
							padding: 4px 8px;
							&:hover {
								opacity: 1;
							}
							@extend .rtm-link-button;
						}

						.rtm-options {
							background-color: white;
							&:before {
								border-color: rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) #fff;
							}
							li {
								display: block;
								.rtmedia-action-buttons {
									//buttons in dropdown
									width: 100%;
									color: #000;
									&:hover {
										color: #21759B;
									}
								}
							}
						}
					}
				}

				.rtm-ltb-title-container {
					top: 0;

					.rtm-ltb-title {
						font-size: 14px;
						width: 55%;
						overflow: hidden;
						float: left;
						line-height: 30px;
						max-height: 30px;
						a {
							text-decoration: none;
							color: #fff;
							opacity: 0.7;
							&:hover {
								opacity: 1;
							}
						}
						span {
							opacity: 0.5;
						}
						.rtmedia-media-name {
							float: left;
							overflow: hidden;
						}
						.rtmedia-media-name-width-50 {
							@extend .rtmedia-media-name;
							max-width: 50%;
						}
						.rtmedia-media-name-width-100 {
							@extend .rtmedia-media-name;
							max-width: 100%;
						}
						.rtmedia-album-name {
							max-width: 50%;
							display: inline-block;
							overflow: hidden;
						}
					}
					.rtmedia-author-actions {
						text-align: right;
						width: 44%
					}
				}

				.rtm-ltb-action-container {
					bottom: 0;
					.rtmedia-actions {
						text-align: right;
						display: inline-block;
						max-width: 69%;
						float: right;
					}
					.rtm-ltb-gallery-title {
						display: inline-block;
						width: 30%;
					}
				}
			}
			.rtmedia-media:before {
				content: '';
				display: inline-block;
				height: 100%;
				vertical-align: middle;
			}
			#rtm-mejs-video-container {
				max-width: 100%;
			}
			#rtm-mejs-video-container {
				display: inline-block;
				vertical-align: middle;
			}
			.mejs-audio {
				display: inline-block;
				max-width: 400px;
				.mejs-controls {
					margin-left: 25px;
					width: 79%;
					.mejs-time-rail {
						width: 134px;
						.mejs-time-total {
							width: 124px;
						}
					}
				}
			}
		}
	}
}

.rtmedia-admin-notice {
	padding: 4px;
	text-align: center;
	margin: 2px 0;
}

.rtmedia-info {
	color: green;
}

.rtmedia-warning {
	color: red;
}

//audio player fix under the current lightbox.
.mfp-content #rtmedia-single-media-container .wp-audio-shortcode {
	margin-left: 30px;
}

// options dropdown styles
#rtm-media-options {
	.click-nav {
		position: relative;
		float: left;
		margin-right: 10px;
	}
}

.rtm-lightbox-container #rtm-media-options-list.click-nav {
	position: relative;
}

.rtm-lightbox-container #rtm-media-options-list {
	ul {
		left: -85px;
	}
}

#rtm-media-options, .rtm-lightbox-container #rtm-media-options-list {
	ul {
		position: absolute;
		right: 0;
		width: 170px;
		z-index: 30;
		padding: 10px 5px;
		background-color: #37454D;
		margin-top: 12px;
		@include border-radius(6px);

		&:before {
			content: '';
			border-width: 12px;
			border-style: inset inset solid;
			display: block;
			position: absolute;
			z-index: 9;
			top: -24px;
			right: 20px;
			border-color: rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) #37454D;
		}

		.clicker {
			position: relative;
		}

		li {
			padding: 0 5px;
			list-style: none;
			form {
				display: block
			}
			.rtmedia-action-buttons {
				display: block;
				padding: 8px;
				color: #fff;
				width: 100%;
				text-align: left;
				margin: 0;
				font-size: 12px;
				@extend .rtm-link-button;
				@include border-radius(6px);

				&:hover {
					background-color: #EDEFF4;
					color: #2284B5;
				}
			}
		}
	}
}

/* Fallbacks */
.click-nav .no-js ul {
	display: none;
}

.click-nav .no-js:hover ul {
	display: block;
}

//hide the default content initially. (shows when user clicks more link)
.morecontent span {
	display: none;
}

.rtmedia-footer-link {
	text-align: center;
	padding: 7px;
}

// videoplayer fix for buddypress default theme
#bp-default {
	.rtmedia-container {
		embed {
			height: 100%;
		}
		.me-plugin {
			height: 100%;
		}
	}
	.rtmedia-activity-container .mejs-overlay-button {
		margin-left: -50px;
	}
}

.rtmedia-save-album {
	margin-top: 15px;
}

//style for magnific popup used as modal for create album/playlist
.rtmedia-popup {
	position: relative;
	background: #FFF;
	padding: 20px;
	width: auto;
	max-width: 600px;
	margin: 20px auto;

	.rtm-modal-title {
		font-size: 24px;
		line-height: 24px;
		margin-bottom: 30px;
		margin-top: 0;
	}
	.rtm-input-medium {
		width: 55%;
	}

	input, select {
		margin-right: 10px;
	}

	p {
		margin-bottom: 10px;
	}

	label {
		min-width: 90px;
		display: inline-block;
	}
	& > div button {
		font-size: 13px;
		color: #777;
		padding: 6px 14px;
		background: #fff;
		border: 1px solid #c1c1c1;
		&:hover {
			background: #EDEDED;
		}
	}

}

#buddypress {
	#whats-new-options {
		.rtmedia-plupload-container {
			float: left;
		}
		#rtmedia-whts-new-upload-container {
			margin-top: 12px;
		}
		#rtmedia-add-media-button-post-update {
			margin-top: 12px;
			float: left;
			margin-right: 20px;
		}
	}
}

.rtmedia-list.masonry {
	.rtmedia-list-item, .rtmedia-list-item .rtmedia-item-thumbnail {

		display: block;
		position: relative;
		&:hover {
			.rtmedia-item-title {
				display: block;
			}
		}

	}
	.rtmedia-item-title {
		position: absolute;
		bottom: 0;
		max-width: 100%;
		display: none;
		width: 100%;
		background-color: rgba(0, 0, 0, 0.6);
		h4 {
			font-size: inherit;
			color: #ffffff;
		}
		a {
			color: #ffffff;
			&:hover {
				color: #ffffff;
			}
		}
	}
	.rtmedia-list-item {
		margin: 3px;
		a {
			h4 {
				font-size: inherit;
				padding: 5px 2px;
			}
		}
	}
}
