@import "compass";
@import "theme_variables";

/********************************************************
			Scenes Styles
********************************************************/

#scenes .popover-button span{
	display: block;
	font-size: 28px;
	text-align: center;
	&:before {
		content: "\f0fe";
		font-family: $font-icon;
		display: block;	
		vertical-align: 5px;
	}
}
.scene_cat{
	.image{margin-bottom: 15px;}
}
.thumbs_banner{
	margin: 10px auto;
	padding: 0;
	height: 62px !important;
	width: 100%;
	border-top: $main-border;
	border-bottom: $main-border;
	.space-keeper{
		width: 21px;
		@include rtl-float-left ();
		display: block;
		height: 100%;
		a.prev{
			display: none;
			width: 21px; 
			text-decoration: none;

			&:before {
				font-family: $font-icon;
				content: "\f053";
				vertical-align: middle;
				padding-top: 35px;
				padding-left: 5px;
			}
		}
		a.next {
			@include rtl-float-left ();
			display: block;
			width: 21px; 
			text-decoration: none;

			&:before {
				font-family: $font-icon;
				content: "\f054";
				vertical-align: middle;
				padding-top: 35px;
				padding-left: 5px;
			}
		}	
	}
}

#scenes_list{
	overflow: hidden;
	@include rtl-float-left ();
	width: 828px;
	ul{
		list-style-type: none;
	}
	li{
		@include rtl-float-left ();
	}
	a{
		display: block;
	}
}

#scenes {
	a.popover-button {
		display: block;
		position: absolute;
		text-decoration: none;
	}
	.popover {
		@include border-radius(0);
		border-color: $border-color;
	}
	.product-image-container, 
	.product-name {
		margin-bottom: 15px;	
	}
	div.description {
		margin-bottom: 15px;	
	}
	.button-container {
		margin-bottom: 15px;
		a {
			text-decoration: none;
		}
	}
	.price {
		margin-bottom: 10px;	
	}
	@media  (max-width: $screen-md-max) { // max 1199px 
		display: none;	
	}
}
