/* override global styles */

#content-container .content
{
   position: relative;
}

	.deleteButton:link,
	.deleteButton:visited {
		background: url(/community/themes/StJohn/images/btn-close-default2.gif) no-repeat 0 0;
	}

	.deleteButton:hover,
	.deleteButton:active {
		background: url(/community/themes/StJohn/images/btn-close-default2.gif) no-repeat -10px 0;
	}


/* wardrobe navigation*/
.wardrobeNav
{
	border-bottom:solid 1px #636363;
	margin:0 0 8px 0;
	padding:0 0 8px 0;
	width:685px;
}
.wardrobeNav .pageNav
{
	margin:0;
}
.wardrobeNav .subnav
{
	margin:0;
	float:left;
}	
.wardrobeNav .subnav li
{
	font-size:93%;
}

/* filters */
#gallery-container .filter{margin:0 0 20px 0;}
#gallery-container .filter select{width:auto;}
.createalook .filter
{
	margin:0 0 50px;
	background-color:#808080;
}
.createalook .filter #products-filters
{
    float:left;
    
	padding:12px;
}
.createalook .filter .wdsearch
{
    clear:none;
    float:right;
    border-left:1px solid #404040;
    width:175px;
	padding:14px;
	vertical-align:top;
}
.createalook .filter .wdsearch li{float:left;display:block;line-height:18px;vertical-align:top;padding:0;text-align:right;}
.createalook .filter .wdsearch .frmtext{
	background-color:#404040 !important;
	border:1px solid #404040;
	color:#fff;
	font-size:77%;
	line-height:13px;
	outline:none;
	padding:2px 8px 1px 8px;
	margin:0;
	font-family:Arial;
	width:135px;
	text-align:left;vertical-align:top;
}

.createalook .filter .wdsearch select
{
	font-size:77%;
}
.createalook .filter .wdsearch .frmhover{
		border:1px solid #000;
	}
.createalook .filter .wdsearch .frmfocus{
		border:1px solid #fff;
	}
	
	.createalook .filter .wdsearch .searchbutton-search{
		text-transform:uppercase;
		color:#666;
		cursor:pointer;
		_cursor:hand;
        display:block;
        background: #515151 url(/images/icn-search.gif) no-repeat 100% 0;
        width:18px;
        height:18px;
	    line-height:18px;
	    vertical-align:top;	
        text-indent:-9999px;
        float:right;
        text-align:left;
	}
	.createalook .filter .wdsearch .searchbutton-search:hover 
	{
		color:#fff;
	}
.createalook fieldset.filter select
{
	width:auto;
	
}
.createalook fieldset.filter label
{
	width:auto;
	line-height:20px;
}
.createalook fieldset.filter li
{
}

    
.createalook fieldset.filter .button-container li{margin:0;}
/* gallery intro - on detail page */

.galleryIntro
{
	padding:10px 30px 0 0;
}
.galleryIntro h2,
.galleryIntro p,
.galleryIntro cite{
	width:390px;
}
	.sendWardrobe .galleryIntro
	{
		padding:0 0 18px 0;
	}
.galleryIntro .galleryImg
{
	float:left;
	border:solid 4px #636363;
	margin-right:18px;
}
.galleryIntro h2,
.galleryIntro p
{
	
}

.galleryIntro cite {padding-bottom:25px;display:block;font-size:93%;}
.galleryIntro cite span.date{margin-left:20px; position:relative;font-size:inherit;}
.galleryIntro h2
{
	margin:0 0 10px 0;
	font-size:93%;
	font-weight:bold;
	text-transform:uppercase;	
}
.galleryIntro h2 .headLink
{
	float:right;
	text-decoration:underline;
	font-weight:normal;
}
.galleryIntro .btn-back
{
	font-size:85%;
	text-transform:uppercase;
	margin:0 0 10px 0;
}
.galleryNav{margin-right:30px;}
/* create a look */
.createalook
{
		width:685px;
}
.createalook .intro
{
	/*border-bottom:solid 1px #444; */
	margin-bottom:5px;
}
.createalook .intro .pageNav
{
    margin:4px 0 4px 0;
    line-height:18px;
	font-size:85%;
	float:right;
}

	.createalook .intro .pageNav li{
		line-height:15px;
		float:left;
		display:inline;
		margin:0 8px;
		text-transform:uppercase;
	}
	.createalook .intro .pageNav #next{*width:85px;}
	.createalook .intro .pageNav .active{
		color:#fff;
	}

		.createalook .intro .pageNav .arrowleft,
		.createalook .intro .pageNav .arrowright{
			display:block;
			width:15px; 
			height:15px;
			text-indent:-9999px;
			margin:0;
			background: url(/images/pagingArrows2.png) no-repeat;
			*background: url(/images/pagingArrows2.gif) no-repeat;
		}		
		.createalook .intro .pageNav .arrowleft{
			background-position:0 0;
			float:left;
			margin-right:5px;
		}
		.createalook .intro .pageNav a:hover .arrowleft{
			background-position:0 -15px;
		}
		
		.createalook .intro .pageNav a .arrowright{
			background-position:-15px 0;
			float:right;
			margin-left:5px;
		}	
		.createalook .intro .pageNav a:hover .arrowright{
			background-position:-15px -15px;
		}
		
		/*disabled arrow state */
		.createalook .intro .pageNav .disabled
		{
			-moz-opacity:0.25;
			opacity: 0.25;
			filter:alpha(opacity=25);
			cursor:default;
		}
		.createalook .intro .pageNav .disabled a{
			cursor:default;
		}
			.createalook .intro .pageNav .disabled a .arrowleft,
			.createalook .intro .pageNav .disabled a:hover .arrowleft{
				background-position:0 0;
			}

			.createalook .intro .pageNav .disabled a .arrowright,
			.createalook .intro .pageNav .disabled a:hover .arrowright{
				background-position:-15px 0;
			}
			

.createalook .intro .button-container li{text-align:right;}
.createalook .intro p
{
	margin:4px 0;
	line-height:18px;
	width:320px;
}
.createalook .intro .floatLeft
{
	width:460px;
}
.createalook .subnav a.disabled
{
	color:#666;
	cursor:default;
}

.Tab1button-container
{
	width:355px;
	text-align:right;
}
.Tab3button-container
{
	width:200px;
	float:right;
	text-align:right;
	margin:20px 0 0 0;
}
.Tab3button-container ul{margin:0 0 10px 0;}
.Tab4button-container
{
	width:525px;
	text-align:right;
	border-top: solid 1px #636363;
	padding-top:10px;
	margin-top:30px;
}
.addMembers li{float:left;}
.wardrobeForm {	width:355px; }
	.sendWardrobe .wardrobeForm { border-top: solid 1px #636363; width:685px; padding:18px 0; }
	.wardrobeForm .label
	{
		float:none;
		padding-left:2px;
		font-size:85%;
		text-transform:uppercase;
	}
	.wardrobeForm .frmtext
	{
		width:327px;
	}
	.sendWardrobe .wardrobeForm .frmtext
	{
		width:300px;
	}
	.wardrobeForm textarea
	{
		width:334px;
	}
	.sendWardrobe .wardrobeForm textarea
	{
		width:306px;
	}
.UserLookUpTextBox{margin: 0 10px 10px 0;}
/* drag and drop */
#sandbox-container
{
    float: right;
    width: 218px;
}
 #sandbox-container h3
{
    line-height: 26px;
    border-bottom:solid 1px #404040;
    padding:0 0 0 7px;
    background-color:#515151;
    margin:0;    
}
#sandbox-container .button-container
{
    float:right;
    margin-top:20px;
}
#sandbox
{
  
    padding: 10px 0;
    height:3872px;    
    background-color:#515151;
}
	#sandbox li
	{
		float: left;
		display:block;
		margin: 2px 4px 10px 4px;
		width:59px;
	}
	#sandbox li .deleteButton
	{
		margin:2px auto;
	}
	#sandbox.droppable-hover
	{   
		filter:alpha(opacity=60);
		-moz-opacity:0.6;
		opacity: 0.6;
	    
	}
	#sandbox li.ui-droppable-disable-hover
	{
		background-color: #fff;
		border: solid 1px #cecece;
	}
	#sandbox img
	{
		display: block;
		overflow: hidden;
	}

#products-container
{
	float: left;
    width: 465px;
    position: relative;
    z-index: 1;
 
}
#products-container .button-container{padding:0 0 10px 0;text-align:right;}
#products
{
}
	#products li
	{
		float: left;
		display:inline;
		cursor: move;
		margin:5px 10px 20px 0;
		width:145px;
		height:275px;

	}
	#products .price li
	{height:auto;margin:0;}
	#products .price li.reg{color:#fff;
		}
	#products li.ui-draggable-disabled
	{
		opacity: 0.50;
		filter: alpha(opacity=50);
		cursor: default;
	}
	#products li h3
	{
		margin-bottom:5px;
		text-transform:none;
		font-weight:bold;
	}
	#products li img
	{
		display: block;
		border:4px solid #515151;
		margin-bottom:8px;
	}
	#products li:hover img
	{
		border:4px solid #fff;
	}
	#products li.first
	{
		clear:left;
	}
	
/* send look */

.sendWardrobe .userSelectIntro
{
	margin:0px 0 10px 0;
	padding:20px 0 0 0;
	border-top:solid 1px #636363;
	width:658px;
}
.sendWardrobe .userSelectIntro h4
{
}
.sendWardrobe .userSelect
{
	float:left;
	width:525px;
}
.sendWardrobe .userGrid
{
	margin:0;
}
	.sendWardrobe .userGrid li
	{
		text-align:left;
		height:80px;
		width:250px;
		margin:0 10px 10px 0;
	}
	.sendWardrobe .userGrid li .userLink 
	{
		color:#000;
		margin:0 0 5px 0;
		overflow:hidden;
		position:relative;
		top:0;
		left:0;
		display:block;
		font-size:85%;
	}
	.sendWardrobe .userGrid li .avatar 
	{
		margin-right:10px;
		width:80px;
		float:left;
	}
	.sendWardrobe .userGrid li .addUser{padding-bottom:5px;}

.sendWardrobe .sendList
{
	background-color:#515151;
	width:150px;
	float:right;
	padding:0;
	height:450px;
	}
	.sendWardrobe .sendList h3
	{
		border-bottom:solid 1px #404040;
		padding:7px 10px;
	}
	.sendWardrobe .sendList .deleteButton
	{
		float:left;
		margin:2px 10px 0 0;
		display:inline;
	}
	.sendWardrobe .sendList ul
	{
		margin:0 0 0 10px;
		font-size:85%;
		height:413px;
		width:150px;
	}
	.sendWardrobe .sendList li
	{
		margin:6px 0;
		overflow:hidden;
	}
	.sendWardrobe .sendList .userLink
	{
		width:100px;
		overflow:hidden;
		float:left;
	}


/* gallery list */
#gallery-container
{
	width:685px;
}
	.createalook #gallery-container
	{
		
		border-bottom:solid 1px #636363;
		padding:20px 0 0 0;
	}
	
	.createalook .lnkHolder
	{font-size:100%;
	} 
	.createalook .lnkHolder a
	{   font-size:77%;
	    text-transform:uppercase;
	    }
#gallery-container .last
{
	margin-right:0;
}
#gallery-container .first
{
	clear:left;
}

	.gallery-item
	{
		display:inline;
		float:left;
		margin:0 35px 0 0;
		overflow:hidden;
		position:relative;
		width:144px;
		height:290px;
	}
		.createalook .gallery-item
		{
			height:315px;
		}
		.favoriteList .gallery-item
		{
			height:230px;
			/*margin:12px 46px 12px 0;*/
		}
.gallery-item .comment p{margin:0 0 5px 0;font-size:85%;}
.gallery-item .comment a{font-size:10px;text-transform:uppercase;}
	.gallery-item .button-container li
	{
		margin:0 0 5px 0;
	}
	.gallery-item .button-container .deleteButton
	{
		margin:10px 0 0 0;
	}
	.gallery-item h3
	{
		margin:6px 0;
		text-transform:none;
		font-weight:bold;
		line-height:16px;
	}
	.gallery-item .author{font-size:85%;margin-left:20px;}

	.gallery-item .galleryImg
	{
		
	}
	.gallery-item .galleryImg:hover img
	{
		border:4px solid #fff;
	}
	.gallery-item .galleryImg img
	{
		display:block;	
		border:4px solid #515151;
	}
/* gallery detail */

.galleryDetail
{
	border-top:solid 1px #636363;	
	padding: 30px 0 10px 0;
	margin:0 30px 0 0;
}

.galleryDetailContainer
{
    position: relative;
    width:355px;
    float:left
}

.galleryDetailImg 
{

	margin-bottom:20px;
}
.galleryDetail .galleryInfo
{
	width:310px;
	float:right;
	padding:0 0 8px 0;
}
.galleryDetail .galleryInfo p
{
    font-size:85%;
}
.galleryDetail .galleryInfo h2
{
	font-size:93%;
	margin:0 0 5px 0;
}
.galleryDetail .galleryInfo h3
{
	margin:0;
}

/* pricing info */
.price
{
	font-size:85%;
	margin:0 0 10px 0;
	display:block;
}

.price .sale
{
		display:none;
}
	
.onsale .sale{
    display:block;
    color: Red;
}
.onsale .reg{
    text-decoration:line-through;
    color:#666;
}

/*ratings */
fieldset.rating
{
	border-top:solid 1px #404040;		
	border-bottom:solid 1px #404040;
	padding:15px 0;
	margin:0 0 10px 0;
}
.ratingStars
{
	display:inline;
}
.galleryDetail fieldset h4
{
	margin-bottom:5px;
}
.galleryDetail fieldset .frmtext
{
	width:300px;
}
.galleryComments
{
	border-top:solid 1px #404040;
	padding-top:10px;
	margin:20px 0;
	width:355px;
}
.galleryRatings
{
	margin:20px 0;
	width:355px;
}
.comments-list li
{
    padding: 8px 0;
	border-bottom:solid 1px #404040;
 }
.comments-list .deleteButton{float:right;}

.comments-list .author
{
	display:inline;
}
.comments-list cite.author a {
	font-size:93%;
	font-weight:normal;
}
.avgRating
{
	margin-bottom:20px;	
}
.galleryRatings .avatar
{
	float:left;
	margin:0 10px 0 0;
}
.galleryRatings .avatar img
{
	display:block;
}

.galleryRatings li
{
	margin:0 0 10px 0;
	display:block;
}
.ratingList
{	text-align:right;
	padding:28px 0 0 0;
	display:block;
}

.ratingList li
{
	float:right;
}
.ratingList .userName
{
	float:left;
	
}
#gallery-container .userGrid
{
	border-top:1px solid #404040;	
	padding:12px 0;
}
#gallery-container .userGrid li
{
	width:170px;
}
/* zoom */

.zoomBox{
	border:4px solid #404040;
	background-color:#808080;
	width:172px;
	height:172px;
	display:block;
	position:absolute;
	overflow:hidden;
	top:0;
	left:0;
	z-index:100;
}
.zoomImg{
	position:absolute;
}
.sensor{
	position:absolute;
	cursor:pointer;
	*cursor:hand;
	z-index:101;
	/* almost opaque layer to catch mouse movement
	 * opaque later also needs a bgcolor set - ie fix */
	filter:alpha(opacity=1);
    -moz-opacity:0.01;
	opacity: 0.01;
	background-color:#000;
	top:0;
	left:0;
}

.preloader
{
	position:absolute;
	top:0;
	left:0;
	z-index:100;
}

.preloader img
{
	margin:132px 0 0 173px; 
}


/* wardrobe tooltip */
.wardrobe-tooltip{
		background-color:#515151;
		padding:18px 18px 15px 18px;
		width:200px;
		height:206px;
		text-align:left;
		font-size:93%;
	}
	.wardrobe-tooltip{
		width:235px;
		height:auto;
	}
	#gallery-container .p-info
	{
		display:none;
	}
	#products-container .p-info
	{
		display:none;
	}
	#tooltip {
		position: absolute;
		z-index: 3000;
	}
	#tooltip h3, #tooltip div { margin: 0; }
	
.galleryInfo .jScrollPaneContainer
{
    margin-bottom:15px;}
    
.galleryInfo .galleryItemDetail{height:155px;}


/* paging tooltip */
.paging-tooltip{
		background-color:#515151;
		padding:5px;
		width:auto;
		height:20px;
		text-align:left;
		font-size:93%;
	}
	.paging-tooltip{
		width:auto;
		height:auto;
	}
	
	
/* sent Wardrobes */
.sentWardrobes	{}

.sentWardrobes .col1{ width:100px;}
.sentWardrobes .col2{ width:200px;}
.sentWardrobes .col3{ width:75px;}
.sentWardrobes .col4{ width:310px;}

.sentWardrobes thead th	 
{
    text-transform:uppercase;    
    font-size:85%;
    padding:10px 0 5px;
    border-bottom:1px solid #636363;
}
.sentWardrobes tbody td
{
    vertical-align:top;
    padding:5px 5px 5px 0;
    font-size:93%;
    line-height:16px;
}
.sentWardrobes .galleryImg img
{
    border:4px solid #515151;
    display:block;
}
.sentWardrobes .galleryImg:hover img
{
    border:4px solid #fff;
}
.sentWardrobes tbody td .recipients a{font-size:11px;line-height:18px;}