﻿/*---------------------------------*/
/* Styles for album browsing */

body
{
	font-family:Tahoma;
}

.clearfix:after {
    content: "."; 
    display: block; 
    height: 0px; 
    clear: both; 
    visibility: hidden;
}
.clearfix {display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

.photobg
{
	background:lightgrey;
	/*border-top:solid 1px black;*/
	padding:0px;
	margin:0px;
	width:auto;
	height:auto;
	display:block;
	overflow:hidden;	
}

#photobg
{
	background:lightgrey;
	padding:0px;
	display:block;
	overflow:hidden;
}

#photoHeadBar
{
	display:block;
	margin:auto;
	padding:0px;
	height:40px;
	border-top:solid 1px gray;
	background:white;
}

#pagerControl
{
	padding:0px;
	margin:0px;
	min-height:1px;
	display:block;	
}

.pagerPanel
{
	margin:0px;
	padding:0px;
	margin-left:300px;
	display:block;
	height:35px;
}

#spagerControl
{
	width:auto;
	height:20px;
	margin:0px;
	background:gray;
	display:block;
	padding:0px;
	border-bottom:solid 1px black;
}

.sbList
{
	display:block;	
	float:left;
	margin:3px;
	text-align:center;
}

.sbList a
{
	font-size:12px;
	font-weight:bold;	
	text-decoration:none;
	color:White;
}

.sbList a:hover
{
	text-decoration:underline;
}

.spagerList
{
	height:24px;
	padding:0px;
	margin:0px;
	float:left;
	display:block;	
	color:White;
}

.spagerList span
{
	float:left;
}

a.spager
{
	margin:2px;
	margin-top:2px;
	padding:1px;
	width:10px;
	display:block;
	text-align:center;
	float:left;
	font-size:11px;
	color:White;
}

.pagerList 
{
	width:auto;	
}

.pagerList a
{
	background:lightgrey;
	text-decoration:none;
	margin: 0px 2px 0px 2px;
	padding:2px;
	padding-left:4px;
	padding-right:4px;
	width:auto;	
	border:solid 1px black;
	text-align:center;	
	font-size:11px;
	display:block;
	color:black;
	float:left;
}

.smallPager a
{
	background:lightgrey;
	text-decoration:none;
	margin: 0px 2px 0px 2px;
	padding:2px;
	width:13px;
	border:solid 1px black;
	text-align:center;	
	font-size:11px;
	display:inline-block;
	color:black;
}

.pagerList span
{
	float:left;	
}

.bList
{
	/*float:right;*/
	display:block;
	margin:0px;
	padding:0px;
	padding-top:0px;
}

.pagerList
{
	/*float:right;*/
	display:block;
}

.pagerList a:hover
{
	border:solid 1px black;	
	text-decoration:underline;
	border:solid 1px black;
	background:#0097a9;
	color:black;
}

.pagerList span
{
	display:block;
	margin-top:0px;	
	font-weight:bold;
	color:black;
}

.bList a
{	
	border:none;
	text-decoration:underline;
	margin:3px;
	margin-top:3px;
	padding:0px;
	display:inline-block;
	color:black;
}

.bList a:hover
{
	color:#0097A9;
}

.headLink
{
	font-size:14px;
	font-weight:bold;
}

#loadMsg
{
	display:none;
	background:#CCDEFF;
	color:Red;
	width:auto;
	margin-left:10px;
	padding:3px;
	font-size:14px;
	display:none;
}

.txtCaption
{
	margin:auto;
	width:70%;
	padding-left:10px;
	padding-right:10px;
	padding-bottom:20px;
	display:block;
	text-align:center;
}

/*--------------------------------------------*/
#PageViewer
{
	background:lightgrey;
	padding:10px;
	margin:5px;
	width:auto;
	overflow:hidden;
	display:block;
}

.imageItem
{
	margin:10px 8px 5px 10px;	
	width:120px;
	height:115px;
	display:block;
	padding:4px;
	background:white;
	float:left;
	overflow:visible;
	cursor:pointer;
	left:auto;
	top:auto;
}

.imgItem
{
	margin:8px;	
	width:120px;
	height:115px;
	display:block;
	padding:4px;
	background:white;
	float:left;
	cursor:pointer;	
	border:solid 1px gray;
	overflow:hidden;
}

.imgItem:hover
{
	background-color:#C3D9FF;	
}

.imgItem:hover, .imgItem:hover span, .imgItem:hover imageText
{
	background-color:#C3D9FF;
}

.imageItem img, .imgItem img
{
	width:120px;
	height:100px;
	background:gray;	
	display:block;
}
.imageItem span, .imgItem span
{
	font-size:11px;
	color:Black;
	text-decoration:none;	
}

.imageText
{
	padding:3px;
	text-align:center;	
	width:115px;
	margin:0px;
	font: bold 12px Tahoma;
	text-decoration:none;
}

.loadPanel
{
	position:absolute;
	background:lightgrey;
	text-align:center;
	filter: alpha(opacity=60);
	-moz-opacity: 0.5;
	opacity:0.5;
	display:none;
	margin:0px;
	padding:0px;	
	width:620px;
	height:600px;
	left:0px;
	top:0px;
	z-index:99;
}

.loadImage
{
	position:absolute;
	margin-top:5px;
	margin-left:5px;
	padding:10px;
	display:none;
	background:white;
	width:150px;
	height:30px;
	z-index:110;
	font-size:12px;
	text-align:center;
}

/*---------------------------------------------
  Album Pager Styles
---------------------------------------------*/
.albumHeader
{
	margin:0px;
	padding:0px;
	width:775px;
	height:32px;
	display:block;
	background:white;
	overflow:hidden;
}	

.hItem
{
	margin: 1px 5px auto 5px;
	padding-top:5px;
	display:block;
	float:left;
}

.hItem a
{
	padding:6px 10px 6px 10px;
	margin:0px;
	display:block;
	text-decoration:none;
	border:solid 1px gray;
}

.hItem a:hover
{
	text-decoration:underline;
	background: lightgrey;
}

#PageViewer
{
	padding-top:0px;
	padding-left:5px;
	padding-right:5px;
}

.albumFrame
{
	width:360px;
	display:block;
	padding:0px;
	margin:0px;	
	margin-left:2px;
	font-size:14px;
	float:left;	
}

.albumFrame .imageItem
{
	margin:0px;
	padding:0px;
	position:relative;
}

.albumCover
{
    background: url(../images/PhotoStack.png) no-repeat;
	width:135px;	
	min-height:130px;
	margin:10px;
	margin-right:0px;
	padding-left:13px;
	padding-top:16px;
	display:block;
	font-size:12px;
	float:left;
}

.albumCover .imageItem
{
	width:120px;
	height:100px;
	margin:0px;
	margin-bottom:7px;
	padding:0px;
	background-color:Transparent;
}

.albumCover span
{
	width:110px;
	height:15px;
	display:block;
	margin-left:3px;
	padding-top:5px;
	text-align:center;
}

.albumInfo
{
	width:185px;
	margin: 20px 0px auto 170px;
	padding:0px;
}

.albumInfo h4
{
	margin-top:0px;	
	margin-bottom:15px;
	margin-left:0px;
	padding-left:0px;
	font-size:15px;	
}

.albumInfo h4 a
{
	text-decoration:none;
	color:black;	
}

.albumInfo a
{
	margin:5px;
	margin-left:0px;
}

.albumInfo span
{
	display:block;
}

.albumInfo h4 a:hover
{
	text-decoration:underline;
	color:Black;
}

.albumInfo span
{
	margin-top:5px;
	margin-bottom:5px;
	display:block;
	font-size:10px;	
}

.albumInfo a
{
	font-size:12px;
	text-decoration:none;
}

.albumInfo a:hover
{
	text-decoration:underline;
}

.albumInfo a img
{
	vertical-align:middle;
}

.photoNav
{
	font-size:14px;
	margin:10px;
	padding:2px;
	display:block;
}

.cTitle
{
	height:22px;
	margin:0px 15px 5px 15px;
	padding:0px;
	padding-top:10px;
	border-bottom:solid 1px gray;
}

.cTitle h5
{
	font-size: 18px;
	margin:0px;
	padding:0px;
	float:left;	
}

.cTitle a
{
	font-size:12px;
	text-decoration:none;
	margin-left:15px;
}

.cTitle a img
{
	vertical-align:middle;
}

.cTitle a:hover
{
	text-decoration:underline;
}

.nTool
{
	position:absolute;
	width:270px;
	height:auto;
	padding:10px;
	left:0px;
	top:0px;
	display:none;
	background:white;
	border:solid 1px gray;
	float:right;
	z-index:100;
}

.nTool table
{
	margin:auto;
	width:90%;
	text-align:right;
}

.nTool table tr td input
{
	width:150px;
}

.nTool table tr td.txtField
{
	text-align:right;	
}

.nTool h4
{
	margin:5px;
	margin-bottom:10px;
	text-align:center;
}

a.linkBtn
{
	padding:3px 8px 3px 8px;
    margin:2px;
    height:14px;
    display:inline-block;
	background:url(/images/btn.png);
	text-decoration:none;
	font-size:11px;	
	border:solid 1px gray;
	color:Black;	
}

a.linkBtn:hover
{
	color:Black;	
}

.albumNote
{
	position:absolute;
	display:none;
	width:120px;
	height:100px;
	left:0px;
	top:0px;
	margin:0px;
	padding:0px;
    z-index:99;
}

.albumNote .viewPanel
{
	margin:0px;
	padding:0px;
	padding-top:30px;
	display:block;
	width:120px;
	height:70px;
	background:white;
	font-size:16px;
	font-weight:bold;
	text-decoration:none;
	text-align:center;
	color:Black;
	
	filter: alpha(opacity=85);
	-moz-opacity: 0.85;
	opacity:0.85;
}
.albumNote .nSetting
{
	position:absolute;
	background:white;
	width:116px;
	height:16px;
	margin:0px;
	padding:2px;
	text-align:center;
	font-size:10px;
	cursor:default;
	left:0px;
	top:80px;
	z-index:2;
}

.albumNote .nSetting a
{
	font-size:10px;
	text-decoration:underline;
	margin:0px;
	padding:0px;
	width:60px;
	height:10px;
	display:inline;
	color:Blue;
}

.coverPreview
{
	margin-left:60px;width:90px;text-align:center;
}

.imgPreview
{
	width:81px;height:71px;border:solid 1px gray;
}	

/*----------------------------------
Styles for ModalPopup
-----------------------------------*/
.modalbg
{
	background-color:Gray;
	filter:alpha(opacity=70);
	-moz-opacity: 0.7;
	opacity:0.7;
}

.modalPanel
{
	background:white;
	border-width:3px;
	border-style:solid;
	border-color:Gray;
	padding:5px;
	width:400px;
	height:230px;
	text-align:center;	
	display:none;
}

.modalPanel h3
{
	margin-top:10px;
	margin-bottom:15px;
	font-size: 18px;
}

/*---------------------------------
 Styles for creating album
---------------------------------*/
.albumCreate
{
	margin:10px;
	width:400px;
	border:solid 1px gray;		
}

.albumCreate .header
{
	width:auto;
}

.NewForm
{
	width:300px;
	margin:auto;
	font-size:13px;
}

.NewForm td
{
	vertical-align:top;
}

.NewForm input, .NewForm textArea 
{
	width:220px;
}

.NewForm Select
{
	width:160px;
}

.txtField
{
	width:150px;
	text-align:left;
	font-weight:bold;
}

/*--------------------------
  Styles for ajax indicator
----------------------------*/
.indicator
{
	margin:3px;
	padding:2px;
	padding-left:0px;
	margin-left:20px;
	display:none;
	color:#0097A9;
	font-weight:bold;
}

/*--------------------------
 Styles for slide page
---------------------------*/
/* Photo Slider */
.previewBar
{
	width:760px;
	height:95px;
	margin:5px;
	margin-bottom:0px;
	padding:0px;
	background: lightgrey;
	display:block;	
	font-size: 12px;
	font-family: Arial;
	overflow:hidden;
	/* border:solid 1px black; */
}

.buttonList
{
	position:absolute;	
	clip:rect(0px 682px 100px 0px);
	Max-height:95px;
	width:8000px;
	left:41px;
	top:5px;
	padding:0px;
	display:block;	
	z-index:100;	
	background:lightgrey;
}
.preButton
{
	margin-left:0px;
	margin-top:5px;
	padding:0px;
	width:50px;
	height:90px;
	float:left;	
}
.nxtButton
{
	margin-right:5px;
	margin-top:5px;
	width:40px;
	padding:0px;
	height:90px;
	float:right;
}
.viewerContainer
{
	background:lightgrey;
	width:760px;
	margin: 0px 0px 5px 0px;
	padding:0px;
	display:block;
	text-align:center;
	height:auto;
}
.viewerContainer h3
{
	margin:5px;
	font-size:18px;
}
.viewerContainer img
{
	padding:3px;
	margin:0px;
	background:white;
	max-width:746px;
	max-height:746px;
}
.viewerContainer a
{
	text-decoration:none;
	color:Black;
}
.viewerContainer a:hover
{
	text-decoration:underline;
}

/*--- Styles for slider end ----*/
/*------------------------------*/

.aInfo
{
	margin:10px;
	margin-top:10px;
	padding:10px;
	width:300px;
	background-color:#CCDEFF;
	font-size:12px;
}

.aComment
{
	width:100%;
	display:block;
	margin-top:10px;	
	margin-left:5px;
	margin-bottom:10px;
	padding:0px;
}

.aComment b
{
	font-size:16px;
}

.aComment textarea
{
	margin-top:10px;
	margin:0px;
	padding-left:3px;
	border:solid 1px #333;	
}

.commentList
{
	padding:0px;
	margin:0px;
}

.commentList h5 
{
	margin:0px;
	padding:5px;
	padding-bottom:0px;
	border-bottom:solid 1px black;
	font-size:18px;	
}

.commentItem
{
	margin:0px;
	padding:5px;
	border-bottom:dashed 1px gray;
}

.commentItem_b
{
	margin:0px;
	padding:5px;
	background:white;
	border-bottom:dashed 1px gray;
}

.commentHead
{
	width:auto;
	height:15px;
	display:block;
	margin:0px;	
	padding:0px;
	font-weight:bold;
}

.commentItem p, .commentItem_b p
{
	margin:5px;
	margin-left:0px;
	margin-bottom:10px;
	margin-right:80px;
	padding:0px;
}

.commentAbuse
{
	font-size:10px;
	margin-right:10px;
	float:right;
}

.searchBox
{
	width:auto;
	height:20px;
	padding:10px;
	margin:2px 0px 10px 5px;
	display:block;	
}

.searchBox input
{
	padding:1px;
	font-size:12px;
}

#resultMsg
{
	width:700px;
	height:25px;
	margin:autp;
	padding:0px 0px 5px 15px;
	display:block;
	font-family:Tahoma;
	font-style:italic;
	font-size:12px;	
	text-align:left;
}

/* Style for Photo Info Edit */
.detailInforEdit
{
	width:80%;
	margin:auto;
	padding:5px;
	text-align:center;
}

.detailInforEdit b
{
	margin:2px;
}

.detailInforEdit input 
{
	background:#E7E7E7;
	border:none;
	padding:2px;
	margin:2px;
	width:auto;
	font-size:18px;
	font-weight:bold;
	text-align:center;
	color:black;	
}
.detailInforEdit textarea
{
	background:#E7E7E7;
	border:none;
	padding:2px;
	margin:2px;
	font-size:12px;
	color:black;	
}

.detailInforEdit span
{
	padding:2px;
	max-width:70%;
	margin: 2px 0px 5px 0px;
	text-align:center;
}

.detailInforEdit span:hover
{
	background:#E7E7E7;
	cursor:text;
}

.detailInforEdit a
{
	font-size:10px;	
	padding:0px;
	margin:0px;
}

.detailInfor
{
	color:#606060;
}

.detailInforEdit
{
	margin: 0px auto 0px 0px;
}

.detailInforCheck input
{
	margin:10px;
	font-size:10px;
}

.detailInfor,  .detailInfor a, .detailInfor select, .detailInfor b
{
	font-size:10px;
	max-width:160px;
	padding:1px;
	color:#606060;
}

.albumName
{
	font-size: 14px;
	font-weight: bold;
	padding:0px;
	margin-bottom:5px;
	margin-left:0px;
	display:block;
}

.albumCoverPanel
{
	margin:auto;
	padding:6px;
	padding-bottom:0px;
	width:220px;
	height:50px;
	background:gray;
	border:solid 1px black;
	text-align:left;	
}


#chbx1Set
{
	/* border:solid 1px green;	*/
	margin:2px;
}

#chbx1Set label, #chbx1Set input
{
	cursor:pointer;
}

#chbx1Set label:hover
{
	background:lightgrey;
	text-decoration:underline;	
}

.albumCoverPanel a
{
	margin:2px;
	margin-top:20px;
	padding-left:4px;
	color:black;
	font-weight:bold;
	/* border:solid 1px green;	*/
}

.albumCoverPanel img
{
	width:16px;
	height:16px;
	padding:0px;
	margin:0px;
	margin-right:3px;
	display:inline;
	background:gray;
	vertical-align:middle;
}

.albumCoverPanel span
{
	color: white;
	font-weight:bold;	
	margin:5px;
}

/*--------------------------
Styles for Pre and Next Buttons
---------------------------*/
.ImgBtnCon
{
	width:80px;
	height:16px;
	margin-top:40px;
	padding:0px;
	font-size:14px;
	font-weight:bold;
	float:right;
	display:block;	
}
#topInfo
{
	margin:0px;
	padding:5px;
	padding-bottom:0px;
	height:auto;
	display:block;
}

.boldLink
{
	font-weight:bold;
}

.hiddenInput
{
	top:0px;
	left:0px;
	width:0px;
	height:0px;
	display:none;
}

#asForm
{
	display:none;
}

.commentInfo
{
	font-size:11px;
	color:gray;
	padding: 0px;
	padding-left:3px;
	text-align:center;
	margin:3px;
	margin-top:15px;
	border:dashed 1px gray;	
	width:124px;
	background:white;	
	/*border-top:dashed 1px gray;
	border-bottom:dashed 1px gray;*/
}
.commentInfo table
{
	width:100%;		
}

.commentInfo table, .commentInfo table label
{
	color:#006272;
}

.commentInfo table td
{
	text-align:center;
	color:#666;
	font-size:11px;	
}

.commentInfo table td img
{
	vertical-align:middle;
	background:none;	
}

.commentInfo table td a
{
	text-decoration:none;
}

/* Rating */
.ratingStar {
    font-size: 0pt;
    width: 13px;
    height: 12px;
    margin: 0px;
    padding: 0px;
    cursor: pointer;
    display: block;
    background-repeat: no-repeat;
}

.filledRatingStar {
    background-image: url(/images/FilledStar.png);
}

.emptyRatingStar {
    background-image: url(/images/EmptyStar.png);
}

.savedRatingStar {
    background-image: url(/images/SavedStar.png);
}

.bNav
{
	height:22px;
	margin:10px 0px 5px 0px;
	padding: 15px auto 0px 5px;	
	border:solid 1px black;	
	overflow:hidden;
	background:#eeeeee;
}

.bNav ul
{
	margin:0px;
	padding:0px;
	font-size:12px;
	display:block;
	color:#eeeeee;		
}

.bNav li
{	
	display:block;
	float:left;	
	color:#eeeeee;	
	padding-top:4px;
	padding-bottom:4px;
}

.bNav li span
{
	
	padding:0px;
	text-decoration:none;
	display:block;
	border-right:solid 1px black;
	/*background: #C3D9FF url(../images/corner_left.jpg) no-repeat top left;*/
}

.bNav a
{
	color:Black;	
}

.bNav li:hover 
{
	background:#0097a9;
	
}

.bNav li a:hover
{
	background:#0097a9;
	text-decoration:underline;
}

.bNav li a
{
	margin:0px;
	padding:0px 10px 0px 10px;
	display:block;
	text-decoration:none;
	/*background:  url(../images/corner_right.jpg) no-repeat top right;*/
}

li.selTab 
{
	background-color:#494949;
}
li.selTab:hover 
{
	background-color:#494949;	
}

.selTab a
{
	text-decoration:none;	
	color:white;
}

li.selTab span a:hover
{
	background:#494949;
	text-decoration:underline;
}

.selTab
{
	color:White;
}
a[id=btnNewAlbum]
{
	padding:4px;
	text-decoration:none;
	float:right;
}
a[id=btnNewAlbum]:hover
{
	text-decoration:underline;
}
a[id=btnNewAlbum] img
{
	vertical-align:middle;	
}
/* Styles for report photo panel */
.photoReport
{
	padding:10px;
	margin:auto;
	display:none;
	border:solid 1px black;
}

.statsTable
{
	width:100%;
	text-align:center;
}

.statsTable table
{
	color:gray;
	margin:15px;
	width:100%;
}

#favHeader td
{
	background:#333333;
	color:White;
	text-align:center;
	padding-left:10px;
	padding-right:10px;
}

.statsTable td
{
	padding:5px;
	text-align:center;
}

.statsTable td a
{
	font-weight:normal;
}

.statsTable td img
{
	vertical-align:middle;
}

.emptyMsg
{
	/*border:solid 1px red;
	margin:10px;
	padding:10px;
	width:50%;
	text-align:center;
	font-size:14px;
	color:Red;*/
	margin:10px;padding:0px;padding:15px;border:dashed 1px gray;background:#FFF5E5;
}

.boldLink
{
	font-weight:bold;
}

#imgPreview
{
	max-width:75px;
	max-height:65px;
}

.updateProgress
{
	left:240px;
}

.headband
{
	margin:0px;
	padding:2px;
	text-align:center;
	font-size:12px;
	font-weight:bold;
	background: #494949;
	color: white;
}

.albumInfoBox
{
	margin:15px;
	padding:0px;
	width:380px;
	border:solid 1px black;	
	background:White;
}

.albumInfoBox h4
{
	margin:0px;
	margin-bottom:10px;
	padding:3px;
	background:#003366;
	text-align:center;
	font-size:12px;
	color:White;
}

#navButtons a
{
	font-weight:bold;
	color:Blue;
}

.EmptyHead
{
	height:18px;border-bottom:solid 1px gray;background:#666666;
}

.lineBreak
{
	margin:0px;
	padding:3px;
	padding-left:10px;
	display:block;
	float:left;
	width:100%;
	background:#63666A;
	color:white;
	border-bottom:solid 1px gray;
}

#submitComment
{
	font-size:13px;
	text-transform:capitalize;
}

/* Round Corner Div */
div.RoundedCorner{background: #7EBC9B;margin:10px;width:380px;margin-left:25px;}
b.rtop, b.rbottom{display:block;background: lightgrey;}
b.rtop b, b.rbottom b{display:block;height: 1px;overflow: hidden; background: #7EBC9B;}
b.r1{margin: 0 5px}
b.r2{margin: 0 3px}
b.r3{margin: 0 2px}
b.rtop b.r4, b.rbottom b.r4{margin: 0 1px;height: 2px}


#message
{
	height:20px;
	margin:5px;
	color:#333;padding:5px;display:block;
}
ul.ViewMode
{
	margin:0px;
	height:23px;
	padding:0px;
	list-style:none;
}
.ViewMode li
{
	list-style:none;
	padding:0px 12px 0px 12px;
	margin:0px;
	font-size:11px;
	border-right:solid 1px gray;
	display:inline;
}
.ViewMode li a.current
{
	text-decoration:none;
	color:Black;
}
.ViewMode li a
{
	text-decoration:none;
}
.ViewMode li a:hover
{
	text-decoration:underline;
}
#photo_info_text.right_col
{
	position:absolute;
	left:638px;
	top:2px;
	margin:0px;
	width:auto;
}
.commentInfo table tr
{
	height:40px;	
}
._searchBox 
{
	margin-left:5px;
	margin-bottom:5px;	
	display:block;
	float:left;
}
.buddyList h5
{
	margin:5px;
	padding:0px;
	padding-left:5px;
}
select
{
    font-size:12px;
}