/* SETTINGS */

/* The container */
#boutique{
	width: 710px;		/* Total carousel width */
}

/* The frames */
body #boutique li{
	background: #eee3db url(../images/loading.gif) center no-repeat;	/* Color of the frame behind and around the image */
	border:1px solid;													/* Outer border around frame */
	border-color:#f5eee9 #d0c2b6 #d0c2b6 #f5eee9;
}

/* Headers of all frames */
#boutique h6{
	margin: -5px 0 2px -2px;											/* Precise positioning is very font specific */
	line-height: 130%;
	font-family: 'Cantarell','segoe ui',Georgia,serif;
	font-weight: normal;
	color: #222;
}

/* Description text of all frames */
/* Note that this is the complete text layer, including the header inside */
#boutique span{
	font-family: Verdana,sans-serif;
	color: #444;
	background: #eee3db;
	margin: 0;
	padding: 10px 15px 14px;
	opacity: 0.7;														/* These 3 should be equal */
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";	/* IE8 opacity */
	filter: alpha(opacity=70);											/* IE5-7 opacity */
}

/* The most frontal item */
#boutique .front{
	margin-top: 40px;	/* Distance between this frame and the container top */
}
#boutique .front img{
	margin: 6px;		/* Determines the gap between image and frame border */
	width: 280px;		/* Width of the front image, the other sizes will be relative to this * IMPORTANT */
	height: 400px;		/* Height of the front image, the other sizes will be relative to this * IMPORTANT */
}
#boutique .front h6{
	font-size: 30px;	/* Front frame header */
}
#boutique .front span{
	font-size: 11px;	/* Front frame description text */
}

/* The further back items */
#boutique .behind{
	margin-top: 20px;	/* Distance between these frames and the container top */
}
#boutique .behind img{	/* Determines the gap between image and frame border */
	margin: 3px;
}
#boutique .behind h6{	/* Behind frame headers */
	font-size: 18px;
}
#boutique .behind span{	/* Behind frame description text */
	font-size: 9px;
}

/* The furthest back items */
#boutique .back{
	margin-top: 0;		/* Distance between these frames and the container top */
}
#boutique img{			/* Determines the gap between image and frame border */
	margin: 1px;
}
#boutique .back h6{		/* Back frames header */
	font-size: 13px;
}
#boutique .back span{	/* Back frame description text */
	font-size: 9px;
}

/* That's it for the settings */

#boutique{ margin:0; padding:0; position:relative; z-index:1 }
#boutique li{ margin:0; padding:0; list-style:none; position:absolute; z-index:1; display:none; border-width:0px }
#boutique img{ border:0; vertical-align:bottom }
#boutique span{ display:block; position:absolute; left:0; right:0; bottom:0; text-align:left; cursor:default }
#boutique h6{ cursor:default }
#boutique a{ cursor:default; text-decoration:none }