﻿@charset "utf-8";
/* CSS Document */
/* font*/
.authorInfo,.articleInfo, .smallhint, .warntxt, .ft11{
	font-size:11px;
	}
.bold { font-weight:600;}	
/* color */
span.linkcolor {color: #cc3300; }
.warntxt, .star {color:#e30404;}
.ftcolorliter {color:#7c7a7a;}
/* form */
 
input.text,textarea, select,input[type="text"]{
   border:solid 1px #999;
   }
/* webmsg */
.webmsgbox {width:70%;text-align:center;font-size:11px;font-weight:normal;line-height:200%;margin:20px auto 20px auto;padding:15px;	border:solid 1px #DEDEDE;background-color:#f7f6f5;}
.usmsgbox {}
.usmsgbox .item {margin:0 0 10px 0;}
.usmsgbox .item p{margin:0;padding:0;line-height:normal;}
/* headline style */
.hd { padding-bottom:5px;margin-bottom:10px;margin-top:13px}
h1.common, h1.special {font-weight:bold;margin:0;padding:0;}
h1.special {font-size:21px;}
	
h1.common, h1.special, h2.special, h3.leftcolumn, h3.leftcolumnheadline, h3.indexheadline, h1.common a, h1.special a, h2.special a,h3.special a, h3.leftcolumn a, h3.leftcolumnheadline a, h3.indexheadline a{
	color:#3f3f3f;
	font-weight:bold;
	}

h1.common, h2.special {
	font-size:15px;
	}

h3.common, h3.indexheadline, h3.leftcolumnheadline {
	font-size:14px;
	}
	
h2.common,h3.special, h3.special a {
	margin:0;
	font-size:12px;
    color:#3f3f3f;
	font-weight:normal;
      }

h3.leftcolumnheadline, h3.indexheadline {
	margin:10px auto 14px 0;
	padding:0 0 5px 15px;
	}

h3.indexheadline, he.special, h3.leftcolumn {
	margin-top:6px;
	}
	
h3.indexheadline, h3.leftcolumn {
	margin:10px auto 14px 0;
	padding:0 0 5px 15px;
	}	

h2.special {
	margin:0;
	padding:0;
}

/* LinkStyle */
.pipe {color:#808080;padding:0 3px;}
.pagination {font-size:11px;}
.pagination a {height:auto;text-align:center; margin:0 auto; padding:4px; color:#dd5e0a; text-decoration:none; cursor:pointer; line-height:24px;}
.pagination a:hover {background:#dd5e0a;color:#fff; line-height:24px;}
.pagination span {color:#dd5e0a;}
.buttonBg,.buttonBackground { background-image:url(Images/linkBgGreyLeft.gif); background-repeat:no-repeat; background-position: left center;}
.buttonBackground a{ float:left;}
.buttonBg img {margin:4px 4px 0 8px; float:left;}
.inputImage {margin:4px 4px 0 8px; float:left;}
.buttonBg a,.buttonBackgroundRight { background:url(Images/linkBgGreyRight.gif) no-repeat right center; float:left; color:#333; height:20px;display:block; padding:4px 10px 0 1px;}

/*index*/					     
#signUp { margin:0;padding:0;width:401px;height:291px;background-image:url(images/signUpbg.gif);background-repeat:no-repeat;font-size:16px;}
.signUpWrap {margin:0;padding:70px 80px 0 80px;}
#signUp h2 { text-align:center;font-size:20px; height:32px;color:#663300; margin:0 auto; font-weight:normal;}					
#signUp .signUptable { margin:0 auto;width:220px;height:80px;}
#signUp table td.text { font-size:14px;color:#595854;padding:2px;}
#signUp input.text{  margin:0;width:110px;height:16px;border:1px #999 solid; padding:2px 2px 0 2px; }
#signUp .ctnbtm { float:right;margin:0;color:#ea772b;font-weight:600;width:auto;font-size:14px;}				 
.bArrow { float:left;margin-top:55px;margin-left:5px;_display:inline;}
.spcText { float:right;width:280px;margin:0;text-align:right;padding-right:20px; _display:inline;}
.str1 { font-size:28px;color:#5c5331;font-weight:400; }
.str2{ font-size:46px;color:#ea772b;font-weight:400;}
.str3{ font-size:23px;color:#878168;font-weight:400; }
.introText { padding:0 15px 15px 15px;font-size:12px;color:#535252; line-height:22px;}
.btmText { margin:0 auto;width:387px;height:64px;color:#FFF;font-size:14px;background-image:url(images/gr_02.gif);background-repeat:no-repeat; }
.recentupdatebox {padding:10px 5px 10px 10px; border:solid 1px #ccc;background:#f7f7f6;}
.recentupdate {width:244px;margin-left:8px;font-size:11px; line-height:normal;}
.recentupdate li {margin:0 0 5px 0;}
/*headline div*/
.headlineBox {width:100%; float:left; margin-bottom:14px;}	

/*comments*/
.commentsWrap{ margin:0; padding:0 10px 0 10px;}
.commentsContainer {margin:0 0 10px 0; padding:0 0 5px 0; border-bottom:dashed 1px #CCC;}
.commentsContainer h2 {margin:0 0 5px 0; font-size:12px; font-weight:600;}
.commentsContent{ margin:0 0 5px 0;}
						 
/* MyTree */
.familyBox { padding:12px 0 13px 0; border-top:1px solid #959595;width:100%;}
.familyInforBox {position:absolute; bottom:0; width:285px;}
						 

/* person page */
.middleColumn .personalBox {
	float:left;
	width:381px;}

.personalBox .rbox {
	float:right;
	width:250px;}

.personalInfoList {margin:11px 0 0 0;font-size:11px;}
.personalInfoList li {margin-bottom:2px;}	
.middleColumn .parentBox {
	float:right;
	width:192px;}	

.parentInfoList {margin:0px;font-size:11px;width:104px;}
.parentInfoList li { margin-bottom:0px;}
.personalIcon, .personalIconDefault,.dependantsIcon, .dependantsIconBox img,.familyIcon {padding:4px;display:block;border:1px #dedede solid;}
.familyIcon { margin:0 auto; display:block;}
.personalIcon { margin:2px auto 0 auto;}
.personalIconDefault { margin:8px auto auto auto;}
.personalIconBox {width:118px;}
.personalIconBox img {padding:4px;display:block;border:1px #dedede solid;}
.personalDescription p {margin-top:4px; margin-left:auto; margin-right:auto; font-size:12px;}
.dependantsIconBox,.spouseIconBox {width:60px; height:auto;}
.dependantsBox { width:286px;}
.dependantsBoxItem, .spouseBoxItem {margin-bottom:10px; width:286px; float:left;}
.spouseBoxItem { padding-bottom:12px; border-bottom:dashed 1px #999;}
.dependantsIcon {margin:0 auto;}
.dependantsInfoList,.spouseInfoList { margin:0px; padding:0; font-size:11px; width:214px;}	
.dependantsInfoList a {width:214px;display:block;}

/*singlePhotoView*/
a.photoLink{text-decoration:none;}
a.photoLink img{border:solid 1px #DEDEDE; display:block; margin:0 auto;}
a.photoLink:hover{border:none;}
a.photoLink:hover img{border:solid 1px #EA772B;}
.albumLinkFirst a,.albumLinkLast a,.albumLinkPrevious a,.albumLinkNext a{width:24px;height:45px;display:block; margin:0 auto;}  
.albumLinkFirst a { background:url(Images/gif/arrow_previous.gif) no-repeat 0 0; }
.albumLinkLast a { background:url(Images/gif/arrow_next.gif) no-repeat 0 0;}
.albumLinkPrevious a { background:url(Images/gif/arrow_previous.gif) no-repeat 0 0;}
.albumLinkPrevious a:hover { background:url(Images/gif/arrow_previous.gif) no-repeat -24px 0;}
.albumLinkNext a { background:url(Images/gif/arrow_next.gif) no-repeat -0 0;}
.albumLinkNext a:hover { background:url(Images/gif/arrow_next.gif) no-repeat -24px 0;}
/*GetPersonMatch*/
.orangebox {border:solid 1px #ea772b;padding:8px;}
.orangebox .lbox{float:left;width:260px; background-color:#F7F6F5;padding:8px; overflow:hidden;}
.orangebox .rbox{float:left;width:260px;margin-left:8px;background-color:#fff7d9;padding:8px; overflow:hidden;}

/* define round corner   */
.ltop { background-image:url(Images/corner/l_p.gif);
		background-position:top left;
		background-repeat:no-repeat; }

.rtop  {background-image:url(Images/corner/r_p.gif);
		background-position:top right;
		background-repeat:no-repeat; }
		
.rbtm { background-image:url(Images/corner/r_p.gif);
        background-position:bottom right; }

.lbtm { background-image:url(Images/corner/l_p.gif);
        background-position:bottom left;
		background-repeat:no-repeat; 
		}
		
.msgul { padding-left:15px;
		 padding-bottom:10px;
		 height:auto;
	     min-height:100px;
	     _height:100px;
			 } 

.msgul li { padding-top:5px;
            }

.msgul li a { background-image:url(Images/ui/email_link.png);
			  background-repeat:no-repeat;
			  background-position:0 0;
			  padding-left:21px;
			}

.middleColumn .usboxl {
	float:left;
    width:275px;
    margin-right:10px;
	}			   

.middleColumn .usboxr {
	float:right;
	width:285px;
	}
	
.middleCosColumn .usboxl {
	float:left;
    width:350px;
	}		
	
.middleCosColumn .usboxr {
	float:right;
	width:350px;
	border:
	}	

.middleColumn .FBoxL, .middleCosColumn .FBoxL {
	float:left;
	width:135px;
	padding-left:15px;
	padding-bottom:10px;
	_display:inline;
	}

.middleColumn .FBoxR {
    float:left;
	width:422px;
	margin-left:15px;
	padding-bottom:10px;
	_display:inline;}

.middleCosColumn .FBoxR {
	float:left;
	width:568px;
	margin-left:15px;
	padding-bottom:10px;
	_display:inline;
	}


/* List_Stories */
.ListFamilyBoxContainer { margin-bottom:3px;}

.ListFamilyBoxLeft {
	float:left;
	width:395px;
}
.ListFamilyBoxRight {
	float:right;
	width:175px;
}

.SquareList, .SquareList2 {
    padding: 0;list-style-position:outside;
        }
		
.SquareList {   list-style: square;margin:5px 0 10px 0;}

.SquareList2 { 
    list-style-type:square;
    list-style-type:none\0;
	margin-bottom:1px;}
		
.SquareList li{
	margin-left:30px;
    padding:2px 0 2px 0;
        }

.SquareList2 li{
	margin-left:23px;
    padding:2px 0 2px 0;
        }
        
.latestNews li{ 
    padding-bottom:5px;
    font-size:12px;
					}	

.latestPerson li {  padding-bottom:4px;}	
					
.latestPerson li a { background-image:url(Images/ui/tinyarrow.png);
						 background-repeat:no-repeat;
						 background-position:0 3px;
						 padding-left:14px; 
						 font-size:11px;
						 color:#535252;
						 }

/*Link List*/
.personslink { list-style-type:disc; list-style-position:inside;}
.personslink li{margin-bottom:5px;}
.personslink a {display:block;margin-left:13px;width:250px;height:14px;text-overflow:ellipsis;overflow:hidden;}
.personslink p {margin:0; padding:0;}

						 
/* album */
/* album public */
.summaryBar { padding:0 0 0 10px;}
.albumBackground {padding:10px 0 20px 0; background-color:#FFF;border-top:1px solid #D7D7D7;border-right:1px solid #D7D7D7;border-bottom:1px solid #D7D7D7;border-left:1px solid #D7D7D7; }
img.photoLinkImage {padding:3px;}

/*photoAlbum*/
.albumWrap {padding:10px;border-top:1px solid #D7D7D7;border-bottom:1px solid #D7D7D7; background-color:#f9f9f7;}
.albumContainer {padding:10px;padding-right:10px; padding-bottom:15px; padding-left:10px; margin-bottom:10px;border:1px solid #D7D7D7;}
.albumAttachPersonContainer { padding-right:10px; padding-bottom:15px; padding-left:10px;}
.albumPrimaryImage { float:left; width:148px; margin-right:10px;}
.nophoto {height:124px; line-height:124px; vertical-align:middle; text-align:center;}
.albumBasicInfo {float:left; width:392px; padding-right:15px;}
.albumBasicInfoList li{ padding:2px 0 2px 0;}
/* AlbumEdit */
.Ltext{float: left;width: 125px; margin-right:10px;}
.Rfucbox{float: left;width: 300px;}
/* SingleAlbum*/
.albumPhotosWrap { margin-bottom:5px;padding:10px;border:1px solid #D7D7D7; background-color:#f9f9f7;}
.albumTable {width:567px;}
.albumTable td {width:104px; padding:10px 0;vertical-align:middle; text-align:center;}
/* PhotoList */
.albumCommentWrap, .albumAttachPersonWrap, .editPhotoWrap {padding:10px; background-color:#f9f9f7;}
.albumCommentContainer, .albumAttachPersonContainer { padding-right:10px; padding-bottom:15px; padding-left:10px;}
.editPhotoContainer { padding:15px 10px 10px 15px;background-color:#FFF;border:1px solid #D7D7D7; margin-bottom:8px;}
.editPhotoRbox{float:right; width:200px;}
.editPhotoRbox img {display:block; margin:0 auto 8px auto;}
.albumCommentRbox, .albumAttachPersonRbox {float:right;width:96px; }
.albumCommentLbox, .albumAttachPersonLbox,.editPhotoLbox {float:left;width:435px;}
.Ltext { float:left; width:125px; margin-right:10px;}
.Rfucbox { float:left;width:300px;}
.qactophoto {background-color:#f9f9f7; padding:1px; border:1px solid #D7D7D7;}
.qactophoto .photoTransfer { margin:0; padding:4px; line-height:21px;}
.qactophoto select.moveto {float:left; display:block;margin-left:5px; padding:2px 1px 2px 2px;width:130px;font-size:11px;}
.albumCommentSingle { margin:0 0 8px 0; padding-bottom:7px; border-bottom:1px dashed #999999}
.albumCommentSingle .commentContent {width:435px;margin:0;}
.linkImageTable {width:96px; height:96px;}
.linkImageTable td { text-align:center; vertical-align:middle;}
/* ViewSinglePhoto*/
.albumViewPhotoWrap {padding:10px;border-top:1px solid #D7D7D7;border-bottom:1px solid #D7D7D7; background-color:#f9f9f7;}
.albumViewPhotoContainer{}
.singlePhotoContainer { margin:0 auto; width:567px;}
.arrowColumn {width:62px; text-align:center; vertical-align:middle;}
.centerColumn {text-align:center; vertical-align:middle;}
.centerColumn img { display:block; margin:0 auto;}
.singlePhotoInforContainer {margin:15px 0 0 0; font-size:11px;}
.singlePhotoInforLbox { float:left; width:422px;}
.singlePhotoInforLbox p.description { line-height:16px;}
.singlePhotoInforRbox {float:right; width:125px; padding-left:10px; border-left:solid 1px #DEDEDE;}
.commentSubmitItem{ background-color:#f3f3f3;padding:10px; margin-bottom:3px;}
.commentSubmitItem textarea {border:1px solid #999999; width:274px; padding:2px; height:55px; font-size:11px; display:block;}
.singlePhotoAction li{border-bottom:1px solid #E0EBE0; padding:2px 0 2px 0;font-size:11px;}
/* PhotoCommentList*/
.topSummary { margin:0 0 5px 0;}
.commentListWrap{ font-size:11px;}
.commentListItem{ background-color:#f3f3f3;padding:5px; margin-bottom:3px;}
.commentListItem p.commentContent {margin:0; padding:0; width:290px;}
.photoActionWrap { margin:10px 0 0 0; padding:0 0 0 10px;}
.photoActionWrap .leftPart {float:left; width:300px; display:inline;}
.photoActionWrap .rightPart {float:right; width:200px; display:inline;}		
/* text */
.comtxt { color:#535252;line-height:20px;}
		   
		
/* User Interface */
				
/* add new story */

table td.bt { text-align:left;
			  vertical-align :top;
					  }	   
			
/* Label */
label.hint { font-size:11px; }	

		   /* div */
.tbox { margin-bottom:15px;
        padding-left:14px; }
		 

/* background position */

/* background block */
				 

.addstr .ltop {  width:8px;
				 height:8px;
                 background-image:url(Images/ui/addstrLtop.gif);
		         background-position:bottom;
		         background-repeat:no-repeat;
				 }

.addstr .acrtop { width:auto;
                  background-image:url(Images/ui/addstrCrotop.gif);
				  background-position:bottom;
		          background-repeat:repeat-x;
				 }				

.addstr .rtop  { width:8px;
				 height:8px;
                 background-image:url(Images/ui/addstrRtop.gif);
		         background-position:bottom;
		         background-repeat:no-repeat; 
				 }
				 
.addstr .lupright { 
                   margin:0;
				   padding:0px;
                   width:auto;
				   height:auto; 
				   background-image:url(Images/ui/addstrLmiddle.gif);
				   background-position:left;
				   background-repeat:repeat-y;
				   }

.addstr .rupright { margin:0;
                   padding:0px; 
                   width:auto;
				   height:auto;
				   background-image:url(Images/ui/addstrRmiddle.gif);
				   background-position:right;
				   background-repeat:repeat-y;}
				   
.addstr .lupright p, .addstr .rupright p { margin:0;        /* Preventing layout from collapsing when p element is put in. */
                                           padding:0;
										 }				   

.addstr .lbtm { width:8px;
                background-image:url(Images/ui/addstrLbtm.gif);
                background-position:top;
		        background-repeat:no-repeat; 
		}			

.addstr .acrbtm { height:8px;
                  background-image:url(Images/ui/addstrCrobtm.gif);
                  background-position:top;
		          background-repeat:repeat-x;
				 }

.addstr .rbtm { width:8px;
                background-image:url(Images/ui/addstrRbtm.gif);
                background-position:top;
				background-repeat:no-repeat;}


/* table */

/* toolIcon */
.toolIcon { float:right;margin-left:6px;padding-top:2px;}
.toolIconBoundary {margin:2px 0 0 6px;}
.toolIconBoundaryH1 { margin:6px 0 0 10px;}
.toolIconBoundaryH1c {margin:2px 0 0 10px;}
.imgTips {cursor:pointer;}

/* headline, text limitation  */
.lengthLimit {width:inherit;overflow:hidden;display:block;}
.lengthLimit1, .lengthLimit2, .lengthLimit3, .lengthLimit4, .lengthLimit5 { overflow:hidden;} 
.lengthLimit2, .lengthLimit3, .lengthLimit4 { display:block;}
.lengthLimit1 {         
	width:280px;
	}

.lengthLimit2 {
width:730px;
}

/* edit story */
.lengthLimit3 {
    width:500px;
}
/* FamilyNewsList */
.lengthLimit4 {
	width:600px;
	}
/* List_Stories */	
.lengthLimit5{
	width:460px;
	}

/* btn*/
.top_btn {margin:0 15px 10px 0;}
.btm_btn {margin-right:15px;}

/* margin padding */
.mginpdd0 {margin:0!important;padding:0!important;}

.m0 { margin: 0 !important; }

.mt0 { margin-top: 0 !important; }
.mt4 {margin-top:4px !important; }
.mt5 { margin-top: 5px !important; }
.mt8 { margin-top: 8px !important; }
.mt9 { margin-top:9px !important;}
.mt10 { margin-top: 10px !important; }
.mt12 { margin-top: 12px !important; }
.mt15 { margin-top: 15px !important; }
.mt18 { margin-top: 18px !important; }
.mt20 { margin-top: 20px !important; }
.mt25 { margin-top: 25px !important; }
.mt30 { margin-top: 30px !important; }
.mt50 { margin-top: 50px !important; }

.mb0 { margin-bottom: 0 !important; }
.mb5 { margin-bottom: 5px !important; }
.mb8 { margin-bottom: 8px !important; }
.mb10 { margin-bottom:10px!important; }
.mb15 { margin-bottom: 15px !important; }
.mb20 { margin-bottom: 20px !important; }
.mb25 { margin-bottom: 25px !important; }
.mb30 { margin-bottom: 30px !important; }
.mb50 { margin-bottom: 50px !important; }

.mtb10 { margin: 10px 0 !important; }
.mtb20 { marging: 20px 0 !important; }
.mtb100 { margin: 100px 0 !important; }

.mr5 { margin-right: 5px !important; }
.mr10 { margin-right: 10px !important; }
.mrl5 { margin-right: 15px !important; }
.mr20 { margin-right: 20px !important; }
.mr25 { margin-right: 25px !important; }
.mr100 { margin-right: 100px !important; }
.mr130 { margin-right: 130px !important; }

.ml5 { margin-left: 5px !important; }
.ml10 { margin-left: 10px !important; }
.ml15 { margin-left: 15px !important; }
.ml20 { margin-left: 20px !important; }
.ml25 { margin-left: 25px !important; }
.ml30 { margin-left: 30px !important; }
.ml35 { margin-left: 35px !important; }
.ml50 { margin-left: 50px !important; }

.mrl5 { margin: 0 5px; }

.p5 { padding: 5px; }
.p10 { padding: 10px; }
.p20 { padding: 20px; }

.pt2 { padding-top: 2px; }
.pt4 { padding-top: 4px; }
.pt5 { padding-top: 5px; }
.pt8 { padding-top: 8px; }
.pt10 { padding-top: 10px; }
.pt13 { padding-top: 13px; }
.pt14 { padding-top: 14px; }
.pt20 { padding-top: 20px; }
.pt50 { padding-top: 50px; }

.pb5 { padding-bottom: 5px; }
.pb10 { padding-bottom: 10px; }

.ptb10 { padding: 10px 0; }
.ptb20 { padding: 20px 0; }
.ptb50 { padding: 50px 0; }

.pr15 { padding-right:15px;}
.pr25 { padding-right: 25px; }
.pl10 { padding-left: 10px; }
.pl15 { padding-left: 15px; }
.pl20 { padding-left: 20px; }
.pl25 { padding-left: 25px; }
.pl40 { padding-left: 40px; }
.pl50 { padding-left: 50px; }

/* hidden*/
.hidden { display:none;}