/*
Plugin name: user-gallery
*/

@import "includes.less";
#user-gallery-2hats{
	&.user-gallery-2hats {
		.font();
		overflow: hidden;
		padding: 0 0 50px;
	}
	ul{
		&.menu{
			padding: 0;
			margin: 0 0 15px;
			text-align: center;
			li{
				list-style: none;
				display: inline-block;
				margin: 0 2px;					
				a{
					padding: 5px 15px;
					background-color: @bg;
					height: 30px;
					line-height: 30px;	
					color: @color;
					border-radius: 3px;
					text-transform: lowercase;
					.transition(0.15s);
					&.active{
						background-color: @theme-color;
					}
					&:hover{
						background-color: @theme-hover;					
					}
				}
			}
		}
	}
	.overview-blocks {
		float: left;
		padding: 0 7.5px;
		width: 25%;
		@media @tab {
			width: 33.3333%;
		}
		@media @mobile {
			width: 50%;
		}
		@media @small-mobile {
			width: 100%;
		}
	}
	.overview-block {
		.shadow(0.2);
		margin-bottom: 15px;
		overflow: hidden;
		&.user-files{
			padding: 3px;
		}
		img{
			width: 100%;
		}
		.name-block{
			background-color: @color;
			color: @bg;
			padding: 15px;
			text-align: center;
			font-weight: 600;			
		}
	}
	.sort-box {
		margin-bottom: 30px;
	}
	.custom-select{
		padding: 0;
		margin: 0 auto;
		border: 1px solid @border;
		width: 150px;
		overflow: hidden;
		background-color: #fff;
		background-image:url('../images/arrowdown.gif');
		background-color: #fff;
		background-repeat: no-repeat;
		background-position: 90% 50%;
	}

	.custom-select select {
		padding: 5px 8px;
		border: none;
		box-shadow: none;
		width: 100%;
		background-color: transparent;
		background-image: none;
		-webkit-appearance: none;
		-moz-appearance: none;
		appearance: none;
		color: @bg;
	}

	.custom-select select:focus {
		outline: none;
	}
	.search-form {
		background-color: @color;
		border: 1px solid @border;
		margin: 0 auto 30px;
		max-width: 500px;
		width: 100%;
		padding: 15px;
		fieldset{
			padding: 0 15px;
			margin-bottom: 7.5px;
			&.select{
				float: left;				
				width: 50%;
			}
			label {
				color: @bg;
				display: block;
				padding-bottom: 2px;
			}
			input{
				&.date {					
					content: "";
					background-image: url('../images/calendar-ico.png');
					background-position: 98% center;
					background-repeat: no-repeat;
					background-size: 15px auto;
					cursor: pointer;
				}
			}
		}
	}
	#users_gallery_add_item,#loginform{
		background-color: @color;
		border: 1px solid @border;
		margin: 0 auto 30px;
		max-width: 500px;
		width: 100%;
		padding: 15px;
		fieldset{
			padding: 0 15px;
			margin-bottom: 7.5px;
			fieldset{
				padding: 0;
			}
			label{
				a{
					color: @theme-hover;
					.transition(0.15s);
					&:hover{
						color: @theme-color;
					}					
				}
			}
		}	
		input[type="radio"] {
			margin-left: 0;
			margin-top: 0;
		}
		label[for="image"],label[for="video"] {
			margin: 0 0 0 15px;
		}
		input[type="file"]{
			background-color: #ccc;
			color: @bg;
			width: 100%;
			padding: 5px 15px;
			cursor: pointer;
			border-radius: 3px;
			border: medium none;
			.transition(0.15s);
			&:hover{
				background-color: @theme-hover;
				color: @color;			
			}	
		}
	}
	.chosen-container-single{
		.chosen-single {
			background: @color;
			border: 1px solid @border;
			border-radius: 0;
			box-shadow: none;
			height: 30px;
			padding-top: 2px;
		}
	}
	.clear{
		clear: both;
		overflow: hidden;
	}
	.chosen-container{
		width: 100% !important;
	}
	.submit,.theme-btn {
		background-color: @theme-color;
		color: @color;
		margin-left: 15px;
		padding: 5px 15px;
		cursor: pointer;
		border-radius: 3px;
		border: medium none;
		.transition(0.15s);
		&:hover{
			background-color: @theme-hover;
			color: @color;			
		}
	}
	.row{
		margin-left: -15px;
		margin-right: -15px;
	}
	.eq-row {
		display: -webkit-box;
		display: -webkit-flex;
		display: -ms-flexbox;
		display:         flex;
		flex-wrap: wrap;
	}
	.eq-row > [class*='overview-blocks'] {
		display: flex;
		flex-direction: column;
	}
	.usergallery-title {
		.font();
		font-size: 20px;
		font-weight: 700;
		margin: 0 0 15px;
		text-align: center;
		text-transform: uppercase;
		color: @theme-hover;
	}
	.delete-file {
		padding: 7.5px;
		text-align: right;
		input{			
			background-color:@theme-hover;
			color: @color;
			margin-left: 15px;
			padding: 5px 15px;
			cursor: pointer;
			border-radius: 3px;
			border: medium none;
			.transition(0.15s);
			&:hover{
				background-color: @bg ;
				color: @color;			
			}
		}
	}
	.user-gallery-widget{
		img{
			width: 100%;
		}
		p {
			border-left: 1px solid #ddd;
			border-right: 1px solid #ddd;
			margin: 0;
			padding: 10px;
			text-align: center;
		}
	}
	.overview-block.user-files > img[src*="http://img.youtube"] {
		height: 121px;
	}
	iframe{
		visibility: visible;
		opacity: 1;
	}
}
/*#user-gallery-2hats*/