/*
	King's Community Church
	08 April 2008
	
	main styles
*/

/*-----------------------------------------------{   common elements   }----------*/

body {
	margin:0;
	padding:0;
	background:url(../images/layout/page_bg.gif) repeat-x top #363636;
	text-align:center;
	font-size:80%;
	font-family:Arial, helvetica, sans-serif;
	color:#363636;
}

h1, h2, h3, h4, h5, h6  {
	margin:0;
	padding:7px 0;
	line-height:140%;
	font-weight:normal;
}

h1 {
	font-size:200%;
	color:#002469;
}

h2 {
	font-size:160%;
	color:#d56c1b;
	border-bottom:1px solid #e2bca5;
}

h3 {
	font-size:140%;
	color:#555;
}

h4 {
	font-size:130%;
}

h5 {
	font-size:120%;
}

h6 {
	font-size:100%;
}
h7 {font-size:135%;
	color:#110093;
	font-style:oblique;
        text-indent:50px;
        margin:15px 15px;
        text-align:center;
        line-height:140%;
}
p {
	margin:0;
	padding:10px 0;
	line-height:150%;
}

a {
	text-decoration:none;
	border-bottom:1px dotted #e27928;
	color:#e27928;
}

a:hover {
	border-bottom:1px solid #e27928;
}

a.no_border,
a.no_border:hover {
	border:none;
}

a:focus {
	outline:none;
}

blockquote {
	margin:5px 30px 10px;
	line-height:150%;
	font-style:italic;
}

ul {
	margin:0;
	padding:5px 30px;
}

li {
	line-height:140%;
	padding:5px;
}

img {
	border:none;
}

/*-----------------------------------------------{   layout   }----------*/

#container {
	width:758px;
	margin:0px auto;
	text-align:left;
}

#header {
	float:left;
	position:relative;
	width:758px;
	height:161px;
	background:url(../images/layout/header_bg.gif) no-repeat bottom center;
}

#logo {
	position:relative;
	width:320px;
	height:98px;
	top:46px;
	left:32px;
	background:url(../images/layout/logo.gif) no-repeat;
}

#logo a {
	border:none;
}

#services {
	position:absolute;
	width:200px;
	height:70px;
	right:40px;
	top:80px;
	text-align:right;
	font-size:80%;
	color:#002469;
}

#content_container {
	float:left;
	width:758px;
	background:url(../images/layout/content_bg.gif) repeat-y center;
}

#content_shadow_left {
	float:left;
	width:758px;
	background:url(../images/layout/content_shadow_left.gif) no-repeat top left;
}

#content_shadow_right {
	float:left;
	width:758px;
	background:url(../images/layout/content_shadow_right.gif) no-repeat top right;
}

#content {
	float:left;
	width:698px;
	padding:6px 30px;
	overflow:hidden;
}

#right_column {
	float:right;
	margin:0;
	padding:10px;
	width:179px;
	background-color:#f7f7f7;
	font-size:90%;
}

#footer {
	float:left;
	height:32px;
	width:758px;
	background:url(../images/layout/footer_bg2.gif) no-repeat top center;
	margin-bottom:0;
	
}

#footer_address {
	padding:0 30px 0 0;
	text-align:center;
	font-size:x-small;
	color:#9EA3AC;
	line-height:1.2em;
	
		}

/*-----------------------------------------------{   misc divs   }----------*/

#admin_float {
	position:absolute;
	top:17px;
	right:0;
	padding:5px 10px;
	background:#efefef;
	border:1px solid #e27928;
	text-align:right;
	z-index:100;
}

#admin_float ul {
	margin:0;
	padding:0;
	list-style-type:none;
}

#map_container {
	width:425px;
	height:350px;
	padding:0 0 17px 0;
	background:url(../images/layout/map_shadow.gif) no-repeat bottom;
}

#map {
	margin:0;
	padding:0;
}

#calendar_iframe body {
	background:#000;
}

/*-----------------------------------------------{   menu   }----------*/

#menu {
	float:left;
	width:696px;
	padding:0 0 0 30px;
	background:url(../images/layout/menu2_bg.gif) no-repeat center;
	font-family:Arial, helvetica, sans-serif;
	text-transform:uppercase;
	color:#ddd;
	
}

#menu_shadow {
	float:left;
	width:758px;
	height:6px;
	line-height:1px;
	font-size:1px;
	background:url(../images/layout/menu_shadow.gif) no-repeat top center;
}

#nav, #nav ul { 
	padding: 0;
	margin: 0;
	list-style: none;
}

#nav a {
	display: block;
	width:96px;
	padding:4px 20px 5px;
	color:#fff;
	text-decoration:none;
	border:none;
}

#nav a:hover {
	color:#002469;
}

#nav li#menu_1,
#nav li#menu_2,
#nav li#menu_3,
#nav li#menu_4,
#nav li#menu_5 {
	float:left;
	padding:0;
	line-height:normal;
}

#nav li ul { 
	position: absolute;
	left: -999em;
	z-index:100;
}

#nav ul li {
	padding:0;
	line-height:normal;
}

#nav li:hover ul, #nav li.sfhover ul { 
	left: auto;
	margin:0 0 0 5px;
}

#nav li#menu_1 a {
	width:39px;
	padding:5px 27px 4px;
}

#nav li#menu_2 a {
	width:64px;
	padding:5px 27px 4px;
}

#nav li#menu_3 a {
	width:96px;
	padding:5px 27px 4px;
}

#nav li#menu_4 a {
	width:78px;
	padding:5px 27px 4px;
}

#nav li#menu_5 a {
	width:82px;
	padding:5px 27px 4px;
}

#nav li#menu_6 a {
	width:39px;
	padding:5px 27px 4px;
}

#nav li#menu_1 ul li a,
#nav li#menu_2 ul li a,
#nav li#menu_3 ul li a,
#nav li#menu_4 ul li a,
#nav li#menu_5 ul li a {
	display:block;
	width:130px;
	padding:4px 10px 5px;
	background:#f88f3e;
	border-top:1px solid #fccba7;
	border-bottom:1px solid #d56c1b;
	font-size:x-small;
}

#nav li#menu_1 ul li a:hover,
#nav li#menu_2 ul li a:hover,
#nav li#menu_3 ul li a:hover,
#nav li#menu_4 ul li a:hover,
#nav li#menu_5 ul li a:hover {
	background:#f1ad7a;
}

/*-----------------------------------------------{   class styles   }----------*/

.small {
	font-size:70%;
}

img.photae {
	margin:0 5px 5px;
	padding:5px;
	border:1px solid #ddd;
}

.arrow {
	font-size:140%;
	line-height:1px;
	color:#e27928;
}

.hidden {
	display:none;
}

table.styled {
	border-top:1px solid #bebebe;
	border-left:1px solid #bebebe;
}

table.styled th{
	border-bottom:1px solid #bebebe;
	border-right:1px solid #bebebe;
	text-align:right;
}

table.styled td{
	border-bottom:1px solid #bebebe;
	border-right:1px solid #bebebe;
}

table.noborder th {
	text-align:right;
}


/* these are added because of the google map incorporation*/
h4.hotspot {
  font-size : 100%;
  font-weight : normal;
  color : rgb(9, 122, 182);
  margin-left : 8px;
  margin-top : 0px;
  margin-bottom : 2px;
  font-style : normal;
  cursor : pointer;
}

h4.hotspot:hover {
  color : rgb(237, 92, 11);
  text-decoration : underline;
}

#mapsearch {
  width : 680px;
  margin : 10px;
  padding : 4px;
  border : 1px solid #d56c1b;
}
    
    /* set height of idle state map */
#mapsearch .gsmsc-idleMapDiv { height : 200px; }

/* set height of active state map */
#mapsearch .gsmsc-mapDiv { height : 500px; }

/* _______________________________________

	STYLING INFORMATION TABLES
  ________________________________________  */

.table1, .table2, .table3{
border-collapse:collapse; 
text-align: center; margin-left:auto; margin-right: auto;


}

.table1  th{border:1px solid #f79646;background-color:#f79646;}
.table2  th{border:1px solid #c0504d;background-color:#c0504d;}
.table3  th{border:1px solid #4bacc6;background-color:#4bacc6;}
.table1  td{border:1px solid #f79646;}
.table2  td{border:1px solid #c0504d;}
.table3  td{border:1px solid #4bacc6;}
.table1 th, td, .table2 th, td .table3 td, th{
text-align:left;
padding:2px 0px 2px 15px;
}
.table1 th, .table2 th, .table3 th{
color:white;
width:550px;padding:3px 3px 3px 18px;
}
.B{ font:Bold;
width:auto;
}
.B1{ font:Bold; background-color:#FFE0CC; padding:6px;text-align: center;
}
/*________________________

Image Bubbles Styles
_________________________*/
.bubblewrap{
list-style-type:none;
margin:0;
padding:0;
}

.bubblewrap li{
display:inline-block;
zoom:1; /*Trigger haslayout in IE7 and less*/
*display:inline; /*For IE7 and less*/
position:relative;
width: 32px;
height:35px;
}

.bubblewrap li img{
position:absolute;
width: 30px; /*default width of each image.*/
height: 33px; /*default height of each image.*/
left:0;
top:0;
border:0;
}

.bubblewrap .tooltip{ /*CSS for image tooltip (alt attribute of image)*/
position:absolute;
font:bold 11px Arial;
padding:2px 0 2px 0;
width:90px;
text-align:center;
background:#fefefe;
}


/*------------ { Slider } ---------------- */

#slider {
    position:relative;
    width:718px;
    height:199px; 
    background:url(../images/loading.gif) no-repeat 50% 50%;
}
#slider img {
    position:absolute;
    top:0px;
    left:0px;
    display:none;
}
#slider a {
    border:0;
    display:block;
}





/* Newly added icons and fancy displays */

*  Lists with Icons */

.tick, .red_cross, .fav, .blue_arrow{font-size:12px; line-height:24px; margin-left:0; color:#666}
.tick li{background:url(../images/icons/tick.png) left 4px no-repeat; padding-left:25px}
.red_cross li{background:url(../images/icons/red_cross.png) left 4px no-repeat; padding-left:25px}
.fav li{background:url(../images/icons/fav.png) left 3px no-repeat; padding-left:25px}
.blue_arrow li{background:url(../images/icons/blue_arrow.png) left 5px no-repeat; padding-left:25px}


/*  Paragraphs with borders */
.dark, .brown, .yellow, .red, .blue, .green{font-size:12px; line-height:18px; padding-left:15px; color:#666; margin-bottom:18px}
.dark{border-left:#3B3B3B solid 7px}
.brown{border-left:#8D8767 solid 7px}
.yellow{border-left:#DBA742 solid 7px}
.red{border-left:#C05D48 solid 7px}
.blue{border-left:#52878B solid 7px}
.green{border-left:#B0BD85 solid 7px}
.border_top{background:url(../images/separators/border1.png) repeat-x; padding:21px 0px 0px 0px}
.border_bottom{background:url(../images/separators/border1.png) repeat-x; height:9px; width:100%; padding:0px}
.static_content {font-size:13px;}


/*  Paragraphs with Icons */
.del, .ok, .info, .alert{font-size:12px; line-height:18px; padding:10px; padding-left:36px; margin-bottom:18px; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius: 5px;}
.del{background:#FBE5E2 url(../images/icons/error.png) no-repeat 7px 10px; border:#F2A197 solid 1px; color:#992213}
.ok{background:#E1F8CB url(../images/icons/ok.png) no-repeat 7px 10px; border:#C6D880 solid 1px; color:#37620d}
.info{background:#E9F5FB url(../images/icons/info2.png) no-repeat 7px 10px; border:#84C7E9 solid 1px; color:#16597a}
.alert{background:#FFB url(../images/icons/alert.png) no-repeat 7px 10px; border:#FFD324 solid 1px; color:#756730}

.calendar, .note, .help, .delete, .favorite, .lock, .archive, .briefcase, .search, .user, .mail, .print, .chart, .brush, .computer{padding-left:36px; margin-bottom:18px}
.calendar{background:url(../images/icons/calendar.png) no-repeat 0px 5px}
.note{background:url(../images/icons/note.png) no-repeat 0px 5px}
.help{background:url(../images/icons/help2.png) no-repeat 0px 5px}
.delete{background:url(../images/icons/delete.png) no-repeat 0px 5px}
.favorite{background:url(../images/icons/favorite.png) no-repeat 0px 5px}
.lock{background:url(../images/icons/lock.png) no-repeat 0px 5px}
.archive{background:url(../images/icons/archive.png) no-repeat 0px 5px}
.briefcase{background:url(../images/icons/briefcase.png) no-repeat 0px 5px}
.search{background:url(../images/icons/search.png) no-repeat 0px 5px}
.user{background:url(../images/icons/user.png) no-repeat 0px 5px}
.mail {background:url(../images/icons/mail.png) no-repeat 0px 2px;}
.print {background:url(../images/icons/print.png) no-repeat 0px 2px;}
.chart {background:url(../images/icons/chart.png) no-repeat 0px 3px;}
.brush {background:url(../images/icons/brush.png) no-repeat 0px 3px;}
.computer {background:url(../images/icons/computer.png) no-repeat 0px 3px;}

.bullets_arrow{font-size:12px; line-height:21px; margin-bottom:18px}
.bullets_arrow li{padding-left:18px; background:url(../images/icons/bullet1.png) no-repeat 0px 5px}

/* buttons */

.button_link{background:url(../images/buttons.png) repeat-x left 0px; color:#FFF; font-size:12px; text-transform:uppercase; margin-right:18px; float:left; border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px;padding:3px 15px 3px 15px;}
.button_link:hover{background-position:left -30px; color:#fff; -moz-box-shadow:0px 0px 1px #222222; -webkit-box-shadow:0px 0px 1px #222222; box-shadow:0px 0px 1px #222222;}