@charset "UTF-8";
/* CSS Document */

/*******************************************
	Copyright 2009 Agape Evangelical Church
********************************************/


/* ---------- Main Content ---------- */
	#content {
		float: left;
		width: 700px;
		min-height: 660px;
		margin: 0px 0px 25px 20px;
		z-index: 10;
	}
	#content h1, h2 {
		font-style: italic;
		color: #822023;
	}
	#content h1 { font-size: 24px; }
	#content h2 { font-size: 14px; }

/* ---------- Breadcrumb ---------- */	

 	#content #breadcrumb {
		clear: both;
		margin-bottom: 5px;
		height: 25px;
		color: #333333;
		z-index: 25;
	}
	#content #breadcrumb ul {
		float: left;
		font-size: 12px;
		margin-top: 10px;
	}
	#content #breadcrumb ul li {
		float: left;
		padding-right: 8px;
	}
	#content #breadcrumb ul li a:link,
	#content #breadcrumb ul li a:visited {
		color: #999999;
	}
	#content #breadcrumb ul li a:active, 
	#content #breadcrumb ul li a.current {
		text-decoration: underline;
		color: #2866a2;
	}

	/* Personalise with login */
 	#content #breadcrumb #personal {
		float: right;
		text-align: right;
		height: 25px;
	}
	#content #breadcrumb #personal ul.login {
		float: right;
		margin: 0px;
		border-right: 1px solid #2866a2;
		border-bottom: 1px solid #2866a2;
		border-left: 1px solid #2866a2;
	}
	#content #breadcrumb #personal ul.login li {
		float: left;
		padding-left: 5px; 
		font-size: 14px;
		line-height: 25px;
		text-align: right;
		color: #2866a2;
	}
	#content #breadcrumb #personal ul.login li a:link, 
	#content #breadcrumb #personal ul.login li a:visited {
		color: #822023;
	}
	#content #breadcrumb #personal ul.login li a:active, 
	#content #breadcrumb #personal ul.login li a.current {
		font-weight: normal;
		color: #2866a2;
	}

/* ---------- Divider between Header and content ---------- */
	#content #divider {
		height: 25px;
		margin-top: 7px;
		padding-top: 5px;
	}
	#content #divider #back {
		float: right;		/* IE: float: none */
		text-align: right;
	}
	#content #divider #back p a,
	#content #divider #back p a:link,
	#content #divider #back p a:visited {
		float: right;		/* IE: float: none */
		padding-left: 20px ;
		background: white url('../_images/arrow_back.gif') no-repeat;
	}
	#content #divider #back p a:hover,
	#content #divider #back p a:active {
		float: left;
		padding-left: 20px ;
		background: white url('../_images/arrow_back_red.gif') no-repeat;
	}
	
	/*Add new */
	#content #divider #add {
		float: left;
		text-align: left;
	}	
	#content #divider #add p a,
	#content #divider #add p a:link,
	#content #divider #add p a:visited {
		float: left;
	}
	#content #divider #add p a:hover,
	#content #divider #add p a:active {
		float: left;
	}
	
	/* Add This */
	#content .addthis_toolbox {
		float: left;
		z-index: 100;
	}
	
/* ---------- Display the lists---------- */	
	#content #display {
		clear: both;
		margin-top: 12px;
	}
	/*Display as two columns*/
	#content #display form,
	#content #display #center {
		float: left;
		width: 430px;
		margin-right: 20px;
	}
	#content #display #right {
		float: right;
		width: 200px;
		border : 1px solid #cccccc;
		padding: 20px ;
		min-height: 200px;
	}
	#content #display #right a:link,
	#content #display #right a:visited  {
		color: #999999;
	}
	#content #display #right a:hover,
	#content #display #right a:active {
		color: #822023;
		text-decoration: underline;
	}
	
	#content #display #right p {
		font-size: 12px; 
		font-weight: bold;
		padding-bottom: 10px;
		color: #333333;
	}
	
	/*Display the form*/
	#content form dl {
		float: left;
		padding-top: 5px; 
	}
	#content form dt {
		font-size: 14px;
		width: 100px;
		padding-top: 3px;	
	}
	#content form dd {
		padding-bottom: 5px;
	}
	#content form dd input  {
		width: 350px;
		height: 25px; 
	}
	#content form dd input.small { 
		width: 75px; 
		margin-right: 5px; 
	}
	#content form dd select {
		width: 100px;
	}
	#content form dd textarea  { 
		width: 350px;
		height: 50px;
		padding: 3px 0px 0px 2px;
	}
	/* Radio Button */
	#content form dd li {
		float: left;
		width: 125px; 
		margin-right: 10px;
		margin-top: 7px; 
	}
	#content form dd li input {
		float: left; 
		margin-top: 4px;
		margin-right: 5px ;
	}
	#content form dd li label {
		float: left; 
		padding-top: 3px; 
		font-size: 14px;
	}

	/*cannot edit the field */
	#content form dd.uneditable { 
		font-size: 14px;
		font-size: bold;
		border: 1px solid #CCC;
		padding: 5px 0px 0px 5px;
		width: 350px;
		height: 25px;
		color: #2866a2;
	}
	
	/* control inside the writtable field(s) in the form */
	#content form dd input,
	#content form dd input.small, 
	#content form dd textarea  { 
		color: #2866a2;
		font-size: 14px;
		padding: 5px 0px 0px 2px;
	}
	/* clickable button for submission form */
	#content form dd input.submit {
		font-size: 12px;
		width: 100px; 
		height: 25px;  
		color: #333333;
		margin: 10px 10px 10px 0px;
		padding: 0px;
	}
	#content form dd input.submit:hover {
			text-decoration: none;
			background-color: #822023;
			color: #ffffff;
	}
	
	/* Buttons */
	#content .buttons {
		clear: both;
		padding-top: 20px; 
	}
	#content .buttons input {
		width: 100px;
		height: 25px;
		padding-bottom: 3px; 
		margin-right: 5px;
	}
	#content .buttons input:hover {
		background-color: #822023;
		color: #ffffff;
	}

	/* Error Messages */
	#content #errorMessageContact {
		font-size: 14px;
		width: 410px;
		margin-top: 30px;
	}
	#content #errorMessageContact p {
		padding-top: 10px;
		border-top: 1px solid #CCC;
		margin: 0px 20px;
		color: #822023;
	}
	
	/*Display as the list*/
	#content #display .list {
		float: left;
		width: 700px;
		min-height: 40px;
		padding-bottom: 5px;
		border-bottom: 1px solid #DDD;
		margin-top: 5px;
	}
	#content #display .list dt {
		font-size: 16px;
		font-weight: bold;
		color: #2866a2;
		padding-bottom: 3px;
		width: 550px;
	}
	#content #display .list dt a:link,
	#content #display .list dt a:visited {
		color: #2866a2;
		text-decoration: none;
	}
	#content #display .list dt a:hover {
		color: #822023;
		text-decoration: underline;
	}
	
	#content #display .list dd {
		float: left;
		font-size: 14px;
		font-weight: normal;
		text-align: left;
	}
	#content #display #right dl span {
		font-weight: bold;
		color: #2866a2;
	}
	#content #display #right dt{
		clear: both;
		float: left;
		margin: 5px 0px;
	}
	#content #display #right dd {
		clear: both;
		float: left;
		padding-bottom: 10px;
	}	

/* ---------- Global - Articles ---------- */
	#content #article #display .list dd.date {
		width: 100px;
		padding: 2px 0px 0px 5px;
	}
	#content #article #display .list dd.author {
		clear: both;
		margin-left: 105px; /* dt.date with 100 + padding 5 */
		width: 380px ; 
	}
	#content #article #display .list dd.doc,
	#content #article #display .list dd.pdf { 
		float: left;	
		width: 75px ;
		padding: 0px 10px;
	}
	#content #article #display .list dd.doc li,
	#content #article #display .list dd.pdf li {
		float: left;
		font-size: 12px;
		text-indent: 0;
		font-weight: normal;
		text-align: right;
	}
	
/* Articles Dynamic Page */	
	/* sub title and sub sub title*/
	#content #article #display h3 {
		font-size: 14px;
		font-style: bold;
		color: #333333;
		padding: 5px 0px;
	}
	#content #article #display h4 {
		font-size: 14px;
		font-style: normal;
		color: #333333;
	}
	#content #article #display p,
	#content #article #display li {
		font-size: 14px;
		text-indent: 50px;
		color: #333333;
		text-align: justify;
	}
	#content #article #display li.icon { width: 20px; }
	#content #article #display li.text { width: 50px; }
	
	#content #article #display p strong{
		font-weight: normal;
		color: #666666;
	}

/* ---------- Global - Videos ---------- */

	#content #video #display .list dd.date {
		float: left;
		width: 100px;
		font-size: 14px;
		text-align: left;
		padding: 2px 0px 0px 5px;
	}
	#content #video #display .list dd.speaker {
		clear: both;
		float: left;
		margin-left: 105px; /* dt.date with 100 + padding 5*/
		width: 410px;
		font-size: 14px; 
	}
	#content #video #display .list dd.flash { 
		float: left;	
		width: 150px; 
		padding: 0px 0px 0px 20px;
		border-left: 1px solid #CCC;
	}
	#content #video #display .list dd.flash li {
		float: left;
		font-size: 12px;
		text-indent: 0;
		font-weight: normal;
		padding-right: 10px;
		text-align: right;
	}

/*Video Dynamic Page*/
	#content #video #display #video {
		clear: both;
		width: 640px;
		margin-left: 10px;
		margin-bottom: 10px; 
		border: 1px solid #EEE;
		z-index: 50;
	}
	#content #video #display #video #v995 {
		text-align: center;
	}
	#content #video #display #video #v995 img {
		margin-top: 150px;
	}
	#content #video #display #video #v995 p {
		padding-top: 5px;
		text-align: center;
	}

	#content #video #info dt.nas {
		float: left;
		width: 200px;
		font-size: 14px;
		text-align: left;
		padding: 2px 0px 0px 10px;
	}

/* ---------- Local - Profile ---------- */
	/*Login*/
	#content #login #display form dl,
	#content #login #display .buttons {
		padding-left: 20px;
	}
	/*Register*/
	#content #register #display form dl,
	#content #register #display .buttons {
		padding-left: 20px;
	}
	#content #register #display form .buttons input{
		margin-top: 25px ;
	}
	/*Customized the form*/
	#content #register #display form dt {
		width: 150px;
	}
	#content #register #display form dt.cur_pass {
		width: 120px;
	}
	#content #register #display form dd.cur_pass  {
		margin-top: 2px;
	}
	#content #register #display form dd.cur_pass label {
		font-size: 14px;
		font-weight: bold;
	}
	#content #register #display form label.timestamp {
		padding-left: 25px;
		font-style: italic;
	}
	
	#content #registers #display form label.info,
	#content #member #display form label.info {
		clear: both;
		float: left;
	}
	#content #registers #display form dd.birthday,
	#content #member #display form dd.birthday {
		clear: both;
		float: left;
	}
	/*Display User*/
	#content #user #display #center dl,
	#content #registers #display #center dl,
	#content #member #display #center dl {
		float: left;
		width: 100%;
		margin-bottom: 5px;
		padding: 5px 0px;
	}
	#content #user #display #center dt,
	#content #registers #display #center dt,
	#content #member #display #center dt { 
		float: left;
		width: 125px;
		font-size: 14px;
	}
	#content #user #display #center dd,
	#content #registers #display #center dd,
	#content #member #display #center dd { 
		font-size: 14px;
		font-size: bold;
		border: 1px solid #CCC;
		padding: 5px 0px 0px 5px;
		width: 350px;
		height: 25px;
		color: #2866a2;
	}
/* ---------- Local - Services ---------- */

	#content #services #display .list dd.date {
		float: left;
		width: 100px;
		font-size: 14px;
		text-align: left;
		padding: 2px 0px 0px 5px;
	}
	#content #services #display .list dd.speaker {
		clear: both;
		float: left;
		margin-left: 105px; /* dt.date with 100 + padding 5*/
		width: 350px;
		font-size: 14px; 
	}
	#content #services #display .list dd.bible { 
		float: left;	
		width: 170; 
		padding: 0px 0px 0px 20px;
		border-left: 1px solid #CCC;
	}
	#content #services #display .list dd.pdf { 
		float: left;	
		width: 75px ;
		padding: 0px 10px;
	}
	#content #services #display .list dd.pdf li {
		float: left;
		font-size: 12px;
		text-indent: 0;
		font-weight: normal;
		text-align: right;
	}
	#content #services #display .list dd.pdf li.icon { padding-right: 10px; }
/* ---------- Local - Contact ---------- */
	#content #contact #display form dl,
	#content #contact #display .buttons {
		padding-left: 20px;
	}
	
/* ---------- Local - Events Photo ---------- */
	/*Events List Page*/
	#content #events #display .list dd.date {
		float: left;
		width: 100px;
		font-size: 14px;
		text-align: left;
		padding: 2px 0px 0px 5px;
	}
	#content #events #display .list dd.location {
		clear: both;
		float: left;
		margin-left: 105px; /* dt.date with 100 + padding 5*/
		width: 425px;
		font-size: 14px; 
	}
	#content #events #display .list dd.count { 
		float: left;	
		width: 170; 
		padding: 0px 20px;
		text-align: center;
		border-left: 1px solid #CCC;
	}
	
	/*Thumbnail Gallery*/
	#content #gallery #display .thumb {
		float: left;
		width: 132px;
		margin-bottom: 6px; 
		border: 1px solid #CCC;
		margin-right: 6px;
		text-align: center;
		min-height: 140px;
	}
	#content #gallery #display .thumb img {
		padding: 6px;
	}
	#content #gallery #display .thumb dt {
		float: left;
		width: 120px;
		padding-top: 3px;
		padding-left: 5px;
		font-size: 12px;
		font-weight: bold;
	}
	#content #gallery #display .thumb dd {
		clear: both;
		float: left;
		padding-left: 5px;
		width: 120px;
		font-size: 12px;
		padding-bottom: 6px;
	}
	#content #gallery #display .thumb a:link img,
	#content #gallery #display .thumb a:active,
	#content #gallery #display .thumb dt a:visited  {
		font-weight: bold;
	}
	#content #gallery #display .thumb a:hover img {
		background-color: #822023;
	}
	
	/*Adding Foto for member*/
	#content #gallery #display form dl,
	#content #gallery #display .buttons {
		padding-left: 20px;
	}
	#content #gallery #display form,
	#content #gallery #display #right { 
		margin-top: 20px;
	}


	/*Photo Page -- Display photo */
	#content #gallery #display #frame {
		clear: both;
		float: left;	
	}
	#content #gallery #display #frame img {
		padding: 10px;
	}
	#content #gallery #display #frame dl {
		clear: both;
		float: left;
		width: 700px;
		border-top: 1px solid #CCC;
		border-bottom: 1px solid #CCC;
		height: 30px;
	}
	#content #gallery #display #frame dt {
		float: left;
		width: 430px;
		font-size: 14px;
		margin-top: 5px; 
		padding: 5px 0px 0px 10px;
	}
	#content #gallery #display #frame dd {
		margin-top: 5px;
		padding-top: 4px;
		padding-left: 10px;
	}
	#content #gallery #display #frame dd.info {
		float: left;
		width: 40px;
		text-align: right;
		padding-top: 5px;
		font-size: 10px;
	}
	#content #gallery #display #frame dd.large,
	#content #gallery #display #frame dd.medium {
		width: 75px;
		text-align: center;
		border-right: 1px solid #CCC;
	}

	/*Photo Page -- Display Comment(s)*/
	#content #gallery #display #comment {
		clear: both;
		float: left;
		width: 700px;
		margin-top: 20px; 
	}
	#content #gallery #display #comment h2 { margin-left: 10px;}
	#content #gallery #display #comment form {
		float: left;
		width: 400px;
	}
	#content #gallery #display #comment .list {
		clear: both;
		float: left;
		width: 660px;
		padding-left: 20px;
		padding-top: 5px;
		border-bottom: 1px solid #CCC;
	}
	#content #gallery #display #comment .list dt.author {
		font-size: 16px;
		font-weight: bold;
		color: #333333;
	}
	#content #gallery #display #comment .list dd.date {
		float: left;
		font-size: 12px;
		font-style: italic;
		font-weight: normal;
		color: #333333;
		padding-top: 4px;
		padding-left: 10px;
	}
	#content #gallery #display #comment .list dd.body {
		clear: both;
		padding: 5px 0px 5px 25px;
		width: 600px;
	}

	/* Adding Photo Forms */
	#content #gallery #display #add {
		clear: both;
		float: left;
		margin-top: 20px;
	}
	#content #gallery #display #add form dl,
	#content #gallery #display #add .buttons {
		padding-left: 20px;
	}
	#content #gallery #display #add form,
	#content #gallery #display #add #right { 
		margin-top: 10px;
	}
	#content #gallery #display #add form dt.button {
		width: 0px;
	}
	
	#content #gallery #display form h2 {
		margin-left: 10px;
	}
		#content #gallery #display form textarea {
			height: 100px;
		}
	/* Adding Photo Forms -- Error Messages */
	#content #gallery #display #add #errorMessage,
	#content #gallery #comment #errorMessage {
		font-size: 14px;
		width: 410px;
		margin-top: 30px;
	}
	#content #gallery #display #add #errorMessage p,
	#content #gallery #comment #errorMessage p {
		float: left;
		padding-top: 10px;
		border-top: 1px solid #CCC;
		margin: 0px 20px;
		color: #822023;
	}


	#content #gallery .closed {
		clear: both;
		float: left;
		width: 660px;
		padding-left: 25px;
	}
	#content #gallery .closed p {
		font-size: 14px;
		font-style: italic;
	}

/* ---------- Local - Posting ---------- */

	#content #posting #display .list dd.body {
		clear: both;
		float: left;
		width: 600px;
		font-size: 14px;
		text-align: left;
		padding-left: 25px;
	}
	#content #posting #display .list dd.info {
		clear: both;
		float: left;
		width: 75px;
		font-size: 10px; 
		padding-top: 3px;
		padding-left: 25px;
	}
	#content #posting #display .list dd.email,
	#content #posting #display .list dd.phone,
	#content #posting #display .list dd.post_date { 
		float: left;	
		width: 175px;
		font-size: 12px;
		padding-left: 20px;
	}
	
	/* Add new Posting  */
	#content #posting #display form dl,
	#content #posting #display .buttons {
		padding-left: 20px;
	}
	
	#content #posting #display #errorMessage {
		font-size: 14px;
	}
	#content #posting #display #errorMessage p {
		float: left;
		padding-top: 10px;
		margin: 0px 20px;
		color: #822023;
	}