/* CSS Document */


/*
---------------------------------------------
01. main/default elements
---------------------------------------------
*/

* { margin:0; padding:0}
img { border:none}

body { background: url(../images/by_body.gif) top center ;background-repeat: repeat-x; background-color: #000; font-color: #fff; font-family:Arial, Helvetica, sans-serif}

p { font-size:13px; font-weight:normal; color:#FFFFFF; line-height:1.3em}
p a:link, p a:visited { color:#FFFFFF; text-decoration:underline}
p a:hover { color:#FFFFFF; text-decoration:underline}

h1 { font-family:"Myriad Pro", Arial, Helvetica, sans-serif; font-weight:normal; color:#FFFFFF; font-size:40px; padding-bottom:5px}

h2 { color:#508FD2; font-size:25px; padding-bottom:15px; font-family:"Tahoma", Verdana, Arial, Helvetica, sans-serif; font-weight:normal}
h3 { color:white; font-size:22px; padding-bottom:15px; font-family:"Tahoma", Verdana, Arial, Helvetica, sans-serif; font-weight:normal}

/*
---------------------------------------------
02. container and wrapper
---------------------------------------------
*/

#container { width:992px; margin:0 auto}
#wrapper { width:992px; float:left}


/*
---------------------------------------------
03. header styles
---------------------------------------------
*/


#header { width:992px; height:240px; float:left;  position:relative}
#header .logo { width:403px; float:left; position:relative}

#header .toplinks { width: 570px; height:70px; float:right; background: url(../images/bg_left.png) no-repeat left top; padding-left:15px; }

#header .toplinks ul { width:565px; height:70px; background:url(../images/bg_right.png) no-repeat top right; float:right; padding-right:5px}
#header .toplinks ul li { list-style:none; float:left; font-size:11px; color:#fff; padding-top:18px; position:relative; padding-right:13px }
#header .toplinks ul li a { display:block; color:#fff; text-decoration:none; font-size:.95em; font-weight:bold}
#header .toplinks ul li a:hover { border-bottom:4px solid #000000; padding-bottom:12px; color:#002D64}
#header .toplinks ul li .selected {border-bottom:4px solid #000000; padding-bottom:12px; color:#002D64}

#header .caption { width: auto; float:right; text-align:right; padding-top:120px}


/*
---------------------------------------------
05. content
---------------------------------------------
*/


#content { width:992px; float:left;}


/*
---------------------------------------------
06. welcome page
---------------------------------------------
*/


#welcome { width:952px; float:left; height:533px; background:url(../images/box_home.png) no-repeat top; padding:20px;}

#intohope { width:239px; height:382px; float:left}
#intohope .photo { width:239px; height:382px; float:left}
#intohope .content { width:239px; height:110px; float:left; background:url(../images/bg_transparent.png) no-repeat; position:relative; margin-top:-110px}
#intohope .content 

#intohope .blogList {
 padding: 0;
 }
#intohope .blogList ul {
 margin-left: 10px !important;
 padding: 0px !important;
 list-style: none;
 list-style-image: none;
 }
#intohope .blogList ul li {
 list-style: none;
 list-style-image: none;
 margin: 0 !important;
 padding: 0 0 5px !important;
 }
#intohope .blogList ul li h2.postTitle {
 font-size: 15px;
 font-family: arial;
 line-height: 1;
 margin: 0px 0 5px;
 margin-bottom: -15px;
 font-weight: normal;
 }
#intohope .blogList ul li h2.postTitle a {
 font-size: 13px;
 color: #fff;
 text-decoration: none;
 }
#intohope .blogList ul li .postBody {
 font-size: 11px;
 }
#intohope .blogList ul li .postInfo {
 font-size: 12px;	
 margin: 4px 0 5px;
 color: #777;
 }
#intohope .blogList ul li .postInfo em {
 font-size: 10px;
 }
#intohope .blogList ul li .postInfo span.postDate {
 color: #777;
 }
#intohope .rss { display: none; }


#rotatingphotos { width:265px; height:381px; float:left; padding-left:23px; position:relative;}
#rotatingphotos .heading { float: right; padding-right:10px; padding-bottom:10px; margin-top:-30px; position:relative}


#lastseptember { width:380px; height:410px; float: right;}
#lastseptember p { color:#CFCFCF; text-align: justify; position:relative}

#lastseptember .caption { width:auto; height:70px; float:left; padding-bottom:20px;  position:relative}

#lastseptember .greybox { width:360px; float:left; padding-bottom:10px;  position:relative}
#lastseptember .button_clickhere { width:380px; float:left;  position:relative}


/*
---------------------------------------------
07. footer styles
---------------------------------------------
*/


#footer { width:972px; height:40px; float:left; padding:10px 10px; margin-top:-150px}
#footer p { font-size: 11px; float:left; padding-top:15px; color: #9dbeda;}
#footer a { color: #6a94b8; text-decoration: none;}
#footer p .developed { padding-left:35px}

.link_represent { float:right; padding-right:10px; margin-top:-8px}


#footer_inner { width:972px; height:40px; float:left; padding:10px 10px; margin-top:-90px}
#footer_inner p {  font-size: 11px; float:left; padding-top:15px; color: #9dbeda; }
#footer_inner a { text-decoration: none; color: #6a94b8;}
#footer_inner p .developed { padding-left:35px}


/*
---------------------------------------------
08. left panel
---------------------------------------------
*/

#leftpanel { width:721px; float:left; background:#000000; padding:20px; font-color: #ffffff;}
#leftpanel h1 { font-size:45px; color:#508FD2; border-bottom:1px solid #373737; margin-bottom:10px}
#leftpanel h2.events { font-size:30px; color:#508FD2; border-bottom:1px solid #373737; margin-bottom:10px}
#leftpanel h1.title { font-size:30px; color:#508FD2; border-bottom:1px solid #373737; margin-bottom:10px}
#leftpanel p { font-size:14px; color:#fff; padding-bottom:20px; font-family:"Tahoma", Verdana, Arial, Helvetica, sans-serif}

#leftpanel .commentsHead a {
 font-size: 20px;
 color: gray;
 font-weight: normal;
 }

#leftpanel .post .postViewInfo {
 background: #508FD2;
 margin-bottom: 15px;
 border: none !important;
 padding: 5px 9px;
 margin: 0;
 }

/* OL/UL */
#leftpanel ol {
	list-style: decimal;
	margin: 0 0 15px 25px;
}
	#leftpanelol li {
		padding: 0 0 5px 0;
	}	
		
#leftpanel ul {
	list-style: disc;
	margin: 0 0 15px 20px;
	font-color: #fff;
}
	#leftpanel ul li {
		padding: 0px 0px 5px 10px;
		color: #fff;
	}

.shadow { width:761px; float:left; height:100px; background:url(../images/shadow_leftpanel.png) no-repeat bottom center;}

#leftpanel2 { width:931px; float:left; background:#fff; padding:20px}


/*
---------------------------------------------
09. right panel
---------------------------------------------
*/

#rightpanel { width:210px; float:right}
#rightpanel a.button { padding: 10px; background-color: #3478ca; width: 100% !important; font-size: 19px; text-decoration: none; }
#rightpanel ul { width:190px; float:left; background:url(../images/bg_rightpanel.png) no-repeat top; padding:10px; list-style:none; margin-bottom:25px; }
#rightpanel ul li { font-size:21px; color:#fff; text-align:right; border-bottom:1px solid #26303C; padding:7px 0px;}
#rightpanel ul li a { display:block; color:#FFFFFF; text-decoration:none;  position:relative}
#rightpanel ul li a:hover {color:#5594D8; text-decoration:none;}
#rightpanel ul li .selected {color:#5594D8; text-decoration:none;}


#rightpanel .photo { width:210px; float:left}

/* ELEMENT SPECIFIC CALLINGS */

/* BLOG ITEM */	
	/* blog listing page */		
	.blogList {
		padding: 0;
				
	}
		.blogList ul {
			margin: 0 !important;
			padding: 0 !important;
			list-style: none;
		}
			.blogList ul li {
				list-style: none;
			}

			#leftpanel .blogList ul li h2.postTitle a {
				font-size: 25px;
				color: #508FD2;
				text-decoration: none;
				margin: 0;
				
			}
				
				.blogList ul li h2.postTitle a:visited {
					font-size: 30px; 
					color: white; 
					text-decoration:none
					}

			.blogList ul li  .postInfo {
				color: #ccc;
				margin-bottom: 10px;
			}

			.blogList ul li  .postDate {
				color: #ccc;
				font-size: 11px;
			}

			.blogList ul li .postInfo a {
				color: #ccc !important;	
				font-size: 11px;			
			}
			
			#leftpanel dt.comment {
			 text-decoration: none;
			 color: white;
			 }
			
			#leftpanel dt.comment a {
			 text-decoration: none;
			 color: white;
			 }
			
			#leftpanel dd.comment {
			 background: transparent !important;
			 margin: 5px 0 25px !important;
			 padding: 0 0 5px !important;
			 color: #9c9c9c;
			 border-bottom: 1px dotted #ccc;
			 }
			
			#leftpanel dd.comment .commentDate {
			 font-size: 11px;
			 font-family: arial;
			 color: #888;
			 font-style: normal;
			 }
			
			#leftpanel .rss { display: none; }
			
	/* post detail page */
	.post .postDate {
		margin: 0 0 15px 0;
		color: #ccc;
	}
		.post .blogBack {
			margin: 40px 0 0 0;
			font-weight: bold;
			border-top: 2px solid #ccc;
			text-align: right;
			display: block;
			width: 100%;
			padding-top: 5px;
		}





	/* blog comments */
	.comments {
		padding-top: 10px;
	}
		.comments dl {
			background: #000 !important;

		}	
			dt.comment {
				background: #000 !important;
				clear: both;
				margin: 0 0 5px 0;
				padding: 0 0 5px 0;
				border-bottom: 1px solid #000;
			}			
				dt.comment a {
					font-weight: bold;
				}			

			dd.comment {			
				background: #000 !important;
				padding: 8px;
				margin-bottom: 15px;
			}

			.commentDate {		
				font-size: .9em;
				color: #ccc;
			}



	/* comments form */
	.commentsHead {
		margin-top: -45px;
	}

	.commentsForm {
		clear: both;
		padding-top: 15px;
		width: 90%;
	}
		.commentsForm .addComment {
			font-size: 1.5em;
		}

		.commentsForm label {
			font-weight: bold;
		}

		.commentsForm input, .commentsForm textarea {
			padding: 2px 4px;
			font-size: 1em;
		}

		.commentsForm img { /* this is for the captcha image */
			 margin: 5px 0;
			 border: 1px solid #ccc;
		}

		.commentsForm input.submitComment {
			 margin: 10px 0;
			 background: #3C3C3C;
			 border: 1px solid #000;
			 padding: 5px 3px;
			 width: 210px;
			 color: #fff;
			 font-weight: bold;
			 text-transform: uppercase;
		}

		.commentsForm .note {
			color: #ccc;
		}







/* GRAPHIC TABULAR EVENTS CALENDAR */
	.eventsCalendar table { /* entire table */
		border: 1px solid #333;
		width: 100%;
		border-collapse: collapse;
	}		
		.calendarDay, .calendarToday, .calendarDayHeader, .calendarTitle td, .calendarWeekendDay, .calendarOtherMonthDay   {
			padding: 2px;
			border: 1px solid #333;
			text-align: left;
			vertical-align: top;
		}

		.calendarTitle td { /* top bar with current month and next/previous buttons */
			text-align: center;
			background: #333 !important;
			color: #FFF;
			padding: 5px 4px !important;	
			text-transform: uppercase !important;
			font-weight: bold !important;	
		}	
			.calendarNextPrevious {
				color: #fff !important;
				font-weight: normal;
			}	
				.calendarNextPrevious a {
					color: #fff !important;
					font-weight: normal;
				}	

		.calendarDayHeader { /* m-f bar */
			color: #333;
			background: #999;
			font-weight: normal;
			height: 1px;
			text-align: center;
			padding: 4px 2px;
			text-transform: uppercase !important;
			font-size: .9em;
		}	

		.calendarToday, .calendarToday a { /* current day */
			color: #333 !important;
			background: #ACACAC;
			font-weight: bold;
		}	
		.calendarWeekendDay { /* weekends */
			background: #e0dedb;
			color: #333 !important;
		}	
		.calendarDay { 
			background: #e0dedb;
			color: #333 !important;
		}	
			.calendarDay a { 
				font-weight: bold;
				color: #333 !important;
			}		
		.calendarOtherMonthDay { /* previous or next months days on current months calendar */
			color: #333;
			background: #efefef;
		}



	.eventsList {
		padding: 0;	
		padding-top: 10px;	
	}
		.eventsList ul {
			margin: 0 !important;
			padding-right: 10px !important;
			list-style: none;
		}
			.eventsList ul li {
				list-style: none;
				padding: 0 0 5px 0;
				margin-bottom: 5px;
				font-color: white;
			}

			.eventsList ul li a {
				font-size: 20px;
				color: white;
				text-decoration: none;
			}
			
			.eventsList ul li a:visited {
				font-size: 20px;
				color: white;
				text-decoration: none;
			}
			

			.eventsList ul li .eventDate {
				margin: 0 0 5px 0;
				color: #ccc;
				font-size: 11px;
			}		


	/* calendar detail page */
		.event .eventDate {
			margin: 0 0 15px 0;
			color: #ccc;
		}
		.event .eventBack {
			margin: 10px 0;
			font-weight: bold;
			border-top: 2px solid #ccc;
			padding-top: 5px;
		}



		/* ICEBRRG */

		/*
		--------------------------------------------------------*/



   		.formHeader { margin: 0; }

		.formTitle {margin-left: 9px;}
	 	.formDescription {margin-left: 9px; padding-bottom: 20px; }

		.fieldItemEven { }
		.fieldItemOdd { }
		
			.fieldSelected { /* background color of a selected field. */
				background: transparent !important;
				border-color: #000 !important;
			}
			
			.fieldItem .fieldTitle { padding: 0 0 0.1em; display: block; font-size: 1em; font-weight: bold; color: white; padding-top: 5px;}
			.fieldName {  color: #7c7c7c; padding-bottom: 5px;}
			.fieldNote {font-color: #7c7c7c !important; padding-top: 5px;}
			.fieldNote em {color: #7c7c7c !important;}
			
			a#addCommentLink {color:7c7c7c;}




		/* FIXING POPUP CONFIRMATION COLORS */
			.confirmation-content-message, 
			.confirmation-content-message * { 
				color: #000 !important;
			}
