﻿/*
Dependencies:

scripts
	/Style Library/imageLibrary.css
	/Style Library/scripts/imageLibrarySearchDetail.js
	/Style Library/scripts/imageLibrarySearchResult.js

layout
	/_catalogs/masterpage/ASSH_content_members_1column.aspx
		<asp:Content ContentPlaceHolderID="PlaceHolderAdditionalPageHead" runat="server">
	        <link rel='stylesheet' type='text/css' href='/Style%20Library/imageLibrary.css' />
	        <script type='text/javascript' src='http://code.jquery.com/jquery-1.4.2.min.js'></script>
	  	    <script type='text/javascript' src='/Style%20Library/scripts/imageLibrarySearchResult.js'></script>
	        <script type='text/javascript' src='/Style%20Library/scripts/imageLibrarySearchDetail.js'></script>
	        <script type='text/javascript'>$(document).ready( function() { $('div.imgLibSearchResult').imageLibrarySearchResult(); } );</script>
		</asp:Content>
		
webparts
	ASSHImageUpload.webpart
	ASSHImageSearch.webpart

*/

.searchResults { height:400px; width:620px; position:relative; }

/* main container bottom image carousel case search */
.imgLibSearchResult
{
	width: 100%; 
	float:left;
	background-color:#E5E5E5;
}
/* left and right arrow controls */
.searchResults div.arrow-main
{
width: 20px;
height: 140px;
color: #ccc;
background:url(/Style%20Library/Images/arrow.png) no-repeat 0 0;
cursor:pointer !important;
}
.searchResults div.arrow-main.forward-main { 
	background-position: -20px 0px; 
	float:left;
}
.searchResults div.arrow-main.back-main { 
	background-position: 0px 0px; 
    float:left;
}

.formThankYouMsg { clear:both; padding-top: 20px; }

/* navigation button styles */
.ASSHImageLibraryNavigation {  }
.ASSHImageLibraryNavigationHome {margin-right:2px; display:inline-block; height:20px; width:130px; background:url(/Style%20Library/Images/ASSHImageLibraryNavigationHome.png) no-repeat 0 0; }
.ASSHImageLibraryNavigationSearch {margin-right:2px; display:inline-block; height:20px; width:130px; background:url(/Style%20Library/Images/ASSHImageLibraryNavigationSearch.png) no-repeat 0 0; }
.ASSHImageLibraryNavigationUpload {margin-right:2px; display:inline-block; height:20px; width:130px; background:url(/Style%20Library/Images/ASSHImageLibraryNavigationUpload.png) no-repeat 0 0; }
.ASSHImageLibraryNavigationMyImages {margin-right:2px; display:inline-block; height:20px; width:130px; background:url(/Style%20Library/Images/ASSHImageLibraryNavigationMyImages.png) no-repeat 0 0; }

/* if we wanted mouse over effects
.imgLibSearchResult .forward-main:hover {  background-position: 0 -36px; }
*/

/* if we wanted mouse over effects
.imgLibSearchResult .back-main:hover { background-position: 0 -108px; }
*/
.imgLibSearchResultHeader, .imgLibDetailHeader {
    font-size:110%;
    background-color: #00483A;
    font-weight:bold;
    padding:4px;
    color:#ffffff; 
    height: 16px;
}
#imgLibDetailHeader span {
	float:left;	
}
#CaseDownloadLink { color: #ffffff; vertical-align:middle; font-size:80%; float:right; border:0;  text-decoration:none; }
#CaseDownloadLink img { border:0;  text-decoration:none; margin-top: -2px; }

/* Thumb strip container */
div.imgLibSearchResultWrapper
{
    width:574px;
	float:left;
	height:140px; 
	overflow:hidden; 	
}    	
/* thumb images list */
ul.imgLibSearchResultThumbs 
{
list-style-image:none;
list-style-position:outside;
list-style-type:none;          
text-align:left;
padding:0;
margin:0;
}
/* thumb image item */
li.resultThumb { display: block; float:left; width:108px; 
	text-align: center; background-color:#DFDFDF; padding:1px; 
	border: 1px solid #00483A; margin: 1px;
	cursor:pointer;
	height:132px;
	margin-bottom: 20px;
	margin-top:2px;
}
li.resultThumb:hover { 
	display: block; float:left; width:108px;  text-align: center; background-color:#CCCCCC; 
	padding:1px; border: 1px solid #00483A; margin: 1px; 
	height:132px;
	margin-bottom: 20px;
	margin-top:2px;
}
li.resultThumb a { border: 0; }
.resultThumb img { border: 1px solid #00483A;  }

/* thumb hover size */
/*
.resultThumb img.imgShadow
{
margin: 0;
display: block;
position: relative;
border: 3px solid #928469;
height: 125px;
width: 96px;
}
*/
        
/* thumb shadow effx */
/*
.resultThumb.liShadow
{ 
display: block; 
width: 102px; 
height: 140px; 
background: url(/design/Conference/thumb_shadow.jpg) bottom left no-repeat !important; 
} 
*/         		

/* ------------------------- details top image carousel --------------------------------------- */

/* details container */
.imgLibDetail
{
	height: 296px;	
	width:100%;
	float:left;
	display:none;
}
/* left and right arrow controls */
.searchResults div.arrow-detail
{
display: block;
height: 90px;
width: 20px;
background:url(/Style%20Library/Images/arrow_small.png) no-repeat 0 0 #E5E5E5;
cursor:pointer !important; 
}
.searchResults div.arrow-detail.forward-detail
{
	background-position: -20px 2px;
    float:left;
}
.searchResults div.arrow-detail.back-detail
{
	background-position: 0px 2px;
    float:left;
}

/* if we wanted mouse over effects
.imgLibDetail .forward-detail:hover {  background-position: 0 -36px; }
*/

/* if we wanted mouse over effects
.imgLibDetail .back-detail:hover { background-position: 0 -108px; }
*/
.formAgreementVerbage { !important width:100%; }
/* Thumb strip container */
div.imgLibDetailWrapper
{
    width:578px;
    float:left;    
    height:88px;
    text-align:center;
    overflow:auto;
    cursor:pointer !important;
    background-color:#E5E5E5;
    padding: 1px;
}    	
/* thumb images list */
ul.imgLibDetailThumbs
{
margin:0;
padding: 0;
/*position: absolute;*/
/*top: 10px;
left: 0;
width: 9999px;
*/
list-style-image:none;
list-style-position:outside;
list-style-type:none;
}
/* thumb image item 
ul.imgLibDetailThumbs li { display: inline; text-align: center; }
/* li.imgLibDetailThumb { display: inline; min-width: 74px; height: 90px; text-align: center; } 
li.imgLibDetailThumb.empty { display: inline; width: 74px; height: 80px; }
.imgLibDetailThumb img { margin: 10px 3px 0 3px; width: 68px; }
*/
li.imgLibDetailThumb.empty { display: none; float:left; width: 80px; text-align: center; }
li.imgLibDetailThumb{ display: block; float:left; width:80px;  text-align: center;  
background-color:#E5E5E5; margin: 0 1px 10px 1px;  }
li.imgLibDetailThumb:hover { display: block; float:left; width:80px;  text-align: center; background-color:#DFDFDF; border: 0px solid #00483A; }
li.imgLibDetailThumb a { border: 0; }
.imgLibDetailThumb img { border: 1px solid #00483A; }


/* thumb hover size */
.imgLibDetailThumb img.imgShadow
{
margin: 0;
display: block;
/* position: relative; */
border: 3px solid #928469;
height: 125px;
width: 96px;
}
        
/* thumb shadow effx */
.imgLibDetailThumb .liShadow
{ 
display: block; 
width: 102px; 
height: 140px; 
/*background: url(/design/Conference/thumb_shadow.jpg) bottom left no-repeat !important; */
}

div.imgLibDetailDesc
{
	margin-top:10px;
}
div.imgLibDetailWrapper
{
   	margin-bottom:10px;
}

/* fields and controls */
.formField /* contains formFieldLabel div and formFieldValue div */
{
	width:100%;
	float:left;
	font-weight:normal;
	display:block;
	border: 0px;	  
}

.detailFormField /* contains formFieldLabel div and formFieldValue div */
{
	width:50%;
	float:left;
	font-weight:normal;
	display:block;
	border: 0px;	 
	margin-bottom:18px;
	font-size:110%;
}
.searchFormDetails { text-align:left; padding:4px;}

.formField select {
font-family:Verdana,sans-serif;

padding:2px;
border:1px solid #888;
}

.radupload { }

.formFieldLabelBetween { float:left;}

.formFieldLabel
{
width:40%;
text-align:left; 
vertical-align:middle;
font-weight:bold;
float:left;
display: block;
}

.formFieldTextBox
{
text-align:left;
vertical-align:top;
float:left;
padding:2px;
width:auto;
}
.formFieldValue
{
width:60%;
text-align:left;
float:left;
display: block;
}

.formFieldTextBox input
{
width:250px; 
border:1px solid #888;
}

.formFieldCheckBox
{
text-align:left;
vertical-align:top;
width:25px;
float:left;
}
.formFieldPickList { width:auto; }
.formFieldCheckBox input
{
width:25px; 
border-width:0px;
}

.formActions
{
text-align: center;
}

.formActions div
{
display:inline;
}
.formButton { margin: 0px 10px 0 0; float:left; }

.cb
{
clear:both;
}

#jquery-overlay {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 90;
	width: 100%;
	height: 500px;
}
#jquery-lightbox {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%; 
	z-index: 100;
	text-align: center;
	line-height: 0;
}
#jquery-lightbox a img { border: none; }
#lightbox-container-image-box {
	position: relative;
	background-color: #fff;
	width: 250px;
	height: 250px;
	margin: 0 auto;
}
#lightbox-container-image { padding: 10px; }
#lightbox-loading {
	position: absolute;
	top: 40%;
	left: 0%;
	height: 25%;
	width: 100%;
	text-align: center;
	line-height: 0;
}
#lightbox-nav {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 10;
}
#lightbox-container-image-box > #lightbox-nav { left: 0; }
#lightbox-nav a { outline: none;}
#lightbox-nav-btnPrev, #lightbox-nav-btnNext {
	width: 49%;
	height: 100%;
	zoom: 1;
	display: block;
}
#lightbox-nav-btnPrev { 
	left: 0; 
	float: left;
}
#lightbox-nav-btnNext { 
	right: 0; 
	float: right;
}
#lightbox-container-image-data-box {
	font: 10px Verdana, Helvetica, sans-serif;
	background-color: #fff;
	margin: 0 auto;
	line-height: 1.4em;
	overflow: auto;
	width: 100%;
	padding: 0 10px 0;
}
#lightbox-container-image-data {
	padding: 0 10px; 
	color: #666; 
}
#lightbox-container-image-data #lightbox-image-details { 
	width: 70%; 
	float: left; 
	text-align: left; 
}	
#lightbox-image-details-caption { font-weight: bold; }
#lightbox-image-details-currentNumber {
	display: block; 
	clear: left; 
	padding-bottom: 1.0em;	
}			
#lightbox-secNav-btnClose {
	width: 66px; 
	float: right;
	padding-bottom: 0.7em;	
}
div#alertText { clear:both; color:red; display:block; text-align:left; }