/*----------------- default for all folders -------------------*/ 
.folder-view							{ margin:0; clear:both; overflow:hidden; 
	a									{ border:none; text-decoration:none; }
	> li								{ float:left; margin:0; box-sizing:border-box; display:inline-block; }
	li									{ 
		.img-wrapper					{ position:relative; float:none; }
		&.no-img .folder-details		{ margin:0; }
		.img-block						{ position:relative; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; }
		.img							{ position:absolute; width:100%; height:100%; background-size:cover; background-position:center center; background-repeat:no-repeat; -webkit-transition:opacity .5s ease-in-out; -moz-transition:opacity .5s ease-in-out; -o-transition:opacity .5s ease-in-out; transition:opacity 0.5s ease-in-out; }
		&.img-contain .img				{ background-size:contain; }
		&.img-cover .img				{ background-size:cover; }
		&.img-alt-contain .img-alt		{ background-size:contain; }
		&.img-alt-cover .img-alt		{ background-size:cover; }
		.img-block						{ 
			&:hover div.img-main.alt-exists
										{ opacity:0; }
			img							{ display:block; opacity:0; }
		}
		.caption						{ -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; left:0; right:0; 
			&.none						{ display:none; }
			&.over						{ position:absolute; overflow:hidden; 
				&.slide					{ min-height:0; height:0; }
			}
		}
		&:hover .caption.over.slide		{ transition-property:height; transition-duration:0.3s; }
		.caption h3						{ margin-bottom:0; }
		.caption-text-wrapper			{ padding:5px; }
		.folder-edit					{ position:absolute; z-index:3; top:0; right:0; padding:4px 4px 4px 10px; background:rgba(255, 255, 255, 0.6); opacity:0; -webkit-transition:opacity .3s ease-in-out; -moz-transition:opacity .3s ease-in-out; -o-transition:opacity .3s ease-in-out; transition:opacity 0.3s ease-in-out; }
		&:hover .folder-edit			{ opacity:1; }
		.folder-edit .alias				{ display:none; }
		&.is-alias .folder-edit .alias	{ display:inline; }
		.read-more						{ text-decoration:none; font-style:italic; 
			&:after						{ content:'...read more'; white-space:nowrap; padding-left:5px; }
		}
		&:last-child::after				{ border:none; }
		.pg-date-time.has-author::before{ content:' on '; text-transform:none; }
		.pg-author::before				{ content:'by '; text-transform:none; }
		audio							{ margin-top:15px; }
	}
}
.folder-list.folder-view .fg-row .columns	{ flex:1 1 auto; }

/*----------------- related folder -------------------*/ 
.pg-related .folder-wrapper				{ overflow:hidden; }

/*----------------- When item hidden -------------------*/ 
.folder-view li.item.is-hidden			{ 
	.img-block a:not(.icn-action), .stock-img, .caption, .product-action-form, .folder-details
										{ opacity:0.15; }
	.img-block:before					{ content:'Hidden item'; position:absolute; top:45%; color:#292929; display:block; z-index:11; width:100%; display:block; text-align:center; font-size:1.25em; font-family:inherit; }
}
/*----------------- ajax-more-content -------------------*/ 
ul.folder-view li.ajax-more-content		{ clear:both; width:100%; margin-top:20px; 
	div									{ cursor:pointer; color:#666; padding:10px; margin:0 auto; width:250px; background:#f2f2f2; text-align:center; -moz-border-radius:10px; -webkit-border-radius:10px; border-radius:10px; font-size:1.1em; 
		&:hover							{ background:#dedede; }
		&::after						{ content:"Load More"; }
	}
	&.autoscroll						{ position:relative; height:100px; top:-20px; opacity:0; }
}

/*---------------- folder-list ----------------*/ 
.folder-list							{ 
	li									{ 
		&.item							{ position:relative; clear:both; width:100%; }
		&::after						{ content:""; display:block; width:1000%; clear:both; }
		&.img-contain.no-h .img			{ background-size:contain; }
		&.img-use-original .img			{ background-size:auto; }
		&.img-inline					{ 
			&.no-h div.img-block		{ height:auto; }
			.img-wrapper				{ float:none; }
		}
		.img-block img					{ pointer-events:none; max-width:100%; }
	}
	&.folder-tile li .folder-details	{ display:block; }
}
/*----------------- folder-tile -------------------*/ 
.folder-tile .row-inline-image			{ display:none; 
	.img-wrapper						{ width:100%; }
}
.folder-view:not(.folder-list) .fg-row .columns
										{ width:100%; }
.folder-tile:not(.folder-list)			{ overflow:hidden; 
	li									{ float:left; 
		&.no-img .img-block, .folder-details
										{ display:none; }
		.img-block img					{ visibility:hidden; width:100%; }
		.caption-text-wrapper			{ text-align:center; }
		.action-block .vat-status		{ display:none; }
	}
}

/*----------------- folder-waterfall -------------------*/ 
.folder-waterfall						{ overflow:visible; 
	.fg-row .columns						{ width:100%; }
	.item								{ float:left; 
		.img							{ position:absolute; width:100%; height:100%; background-size:cover; background-position:center center; background-repeat:no-repeat; -webkit-transition:opacity .5s ease-in-out; -moz-transition:opacity .5s ease-in-out; -o-transition:opacity .5s ease-in-out; transition:opacity 0.5s ease-in-out; }
		.img-block						{ position:relative; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; }
		&.no-img .img-block, .folder-details
										{ display:none; }
		.img-block img					{ visibility:hidden; width:100%; }
		.caption-text-wrapper			{ text-align:center; }
		.action-block .vat-status		{ display:none; }
		.caption						{ -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; left:0; right:0; 
			&.none						{ display:none; }
			&.over						{ position:absolute; overflow:hidden; 
				&.slide					{ min-height:0; height:0; }
			}
			&.top						{ top:0; }
			&.bottom					{ bottom:0; }
			&.fade						{ opacity:0; visibility:hidden; }
		}
		&:hover .caption.fade				{ opacity:1; visibility:visible; }
		&:hover .caption.over.slide			{ transition-property:max-height; transition-duration:.3s; max-height:300px; }
	}
	.caption.over.slide					{ min-height:0; height:auto; max-height:0; }
}
.folder-wrapper-waterfall .ajax-more-content
										{ clear:both; width:100%; margin-top:20px; position:absolute; bottom:50px; 
	&.autoscroll						{ height:100px; opacity:0; }
}

/*---------------- carousel ----------------*/ 
.folder-carousel						{ box-sizing:border-box; padding:0 23px; 
	.linkable:hover						{ cursor:pointer; }
	ul									{ list-style:none outside none; padding:0; }
	.slick-list ul li					{ position:relative; margin-left:0 !important; float:left; }
	.box								{ float:left; overflow:hidden; position:relative; width:100%; 
		div.img							{ margin-left:auto; margin-right:auto; background-position:center center; }
	}
	.img img							{ opacity:0; visibility:hidden; width:100%; }
	.caption							{ text-align:center; }
}
.admin .folder-carousel					{ max-width:800px; }

/*---------------- folder-col ----------------*/ 
.folder-col								{ 
	.row1								{ overflow:hidden; width:100%; margin-top:4px; }
	.rowfooter							{ clear:both; border-bottom:1px solid #888; padding:4px 0; margin-bottom:8px; }
	.row2footer							{ clear:left; }
	.col								{ float:left; }
	.colInner .thumb img				{ float:left; margin-right:10px; }
	.pg-title							{ font-weight:700; margin-bottom:4px; }
	.txt								{ font-size:11px; margin-bottom:2px; }
	.row2								{ overflow:hidden; 
		ul								{ padding-left:4px; }
	}
	.col2-block							{ float:left; }
	.col2 a								{ font-size:11px; text-decoration:none; }
	.folder-edit						{ clear:both; overflow:visible; float:right; margin:2px 24px 2px 0; }
}

/*----------------- folder-options -------------------*/ 
.folder-options							{ overflow:hidden; 
	&.has-options						{ border-bottom:1px solid #bbb; margin-bottom:10px; padding:5px 0; }
	.row-view-options					{ float:right; 
		.radio-swatch					{ position:absolute; filter:alpha(opacity = 0); -moz-opacity:0; opacity:0; left:-100px; }
		label							{ cursor:pointer; display:inline-block; width:24px; height:20px; margin-right:5px; position:relative; background:url(/media/icons/view_icon.png) no-repeat; background-position:0 0; width:50px; border:0px; }
		.radio-swatch					{ 
			&:checked					{ 
				+ label::before			{ background:none; }
				+ label					{ opacity:1; }
			}
			+ label						{ opacity:.5; }
		}
		#id_label_row_view_option_tile	{ background-position:0 -21px; }
		#id_label_row_view_option_list::after
										{ content:"List"; display:block; margin-left:30px; }
		#id_label_row_view_option_tile::after
										{ content:"Tile"; display:block; margin-left:25px; }
	}
	.row-sort-options					{ float:left; }
	input.radio-swatch:checked + label div
										{ background:none; }
}