/* Styles for JIJY.COM */

/* === holds the breadcrumbs and log-in elements                   === */
#over_the_top {
	width: 95%;
	}
	
/* === this contains everything on the top of the page regarding page identification 
       and site navigation                                         === */   
#heading_container {
	position: absolute;
	left: 0px;
	top: 5px;
	padding: 4px;
	width: 91%;
	text-align: left;
	border: 1px solid #eda;
	margin: 0 auto;
	font: Verdana, Arial, Helvetica, sans-serif;
	margin: 2em;
	
}

/* === the banner container holds drop-down site navigation menus === */
#banner_container {
	position: absolute;
	width: 78%;
	top: 0px;
	left: 263px;
	background: #eda;
	
}
/* === Site identification: the tagline is contained within 
       the logo box                                              === */
#logo_container {
	width: 257px
}
#tagline_container {
	padding-left: 4px;
	padding-right: 4px;
	padding-bottom: 6px;
	font-size: .6em;
	font-family: verdana, arial, helvetica, sans-serif;
	color: black;
	text-align: center;
}	

/* === the site-search box                                        === */
#search_container {
	height: 20px;
	padding: 4px;
	font-size: .7em;
	font-family: verdana, arial, helvetica, sans-serif;
	font-weight: bold;
	color: #808080;
	background: #ffcc33;
}

/*  ===  holds the nagigation buttons and their dropdowns     === */
#navbar_container {
	height: 99px;
	font-size: .8em;
	background: #eda;

}
	
/* menu bar item styles */

#nav {				/* the box holding the main menu items */
	
	float: left;
	list-style: none;
	line-height: 1;
	background: #eda;
	font-size: .85em;
	font-weight: bold;
	padding: 0;
	border: solid #eda;
	border-width: 1px 0;
	margin: 0 0 1em 0;
}
#nav ul {			/* the box behind the dropdowns  */
	float: left;
	list-style: none;
	line-height: 1;
	background: #fffafa;
	font-weight: bold;
	padding: .25em .25em .25em .25em;
	border: solid #eda;
	border-width: 1px 0;
	margin: 0 0 1em 0;
	
}

#nav a {			/* the box behind the individual menu items in the #nav structure */
	display: block;
	width: 8em;
	color: #003366;
	text-decoration: none;
	padding: .25em .25em .25em .25em;
	border: 1px solid #ffefd5;
	
}

#nav a:hover {
	border: 2px solid #daa520;
	background: #ffd700;
}
#nav a.nav-arrow {
	background: url(http://www.jijy.com/includes/styles/images/nav_arrow.gif) center right no-repeat;
}

#nav li {			
	float: left;
	padding-left: .75em;
	width: 8.5em;
}

/* === the z-index value here keeps the dropdown menus in front of the background === */
#nav li ul {
	position: absolute;
	left: -999em;
	height: auto;
	width: 9.5em;
	w\idth: 9.5em;
	font-weight: normal;
	border-width: 0.25em;
	padding: 0;
	margin: 0;
	z-index: 10;
}


#nav li li {
	padding-right: 1em;
	width: 9em
}


#nav li ul a {	/*  background for the dropdown  */
	
	left: -999em;
	width: 9.5em;
	w\idth: 9.5em;
}

#nav li ul ul {
	margin: -1.75em 0 0 9em;
/*    border: dashed green; */
}

#nav li:hover ul ul, #nav li:hover ul ul ul, #nav li.sfhover ul ul, #nav li.sfhover ul ul ul {
	left: -999em;
}

#nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul {
	left: auto;
}

#nav li:hover, #nav li.sfhover {
	background: #eda;
}

#content {
	clear: left;
}

#content a {
	color: #7C6240;
}

/*#content a:hover {
	text-decoration: none;
	color: black;
}
*/


/* === the breadcrumb container sits at the top of the page       === */
#backlinks {
	width: 50%;
	left: 0px;
	padding-left: 10px;
	padding-right: 10px;
	font-size: .7em;
	font-family: verdana, arial, helvetica, sans-serif;
	font-weight: bold;
	color: #808080;
	/*background: #ffcc33;*/
	float: left;
}

#backlinks strong {
	color: black;
}

/* === the login container sits at the top of the page            === */
#login {
	width: 30%;
	left: 0px;
	padding-left: 10px;
	font-size: .7em;
	font-family: verdana, arial, helvetica, sans-serif;
	font-weight: bold;
	color: #808080;
	border: 1px solid #ffcc33;
	float: right;
}

body {
	margin : 10px;
	padding: 10px;
	background: #fff;
	font-family: verdana, arial, helvetica, sans-serif;
	font-size: 1em;
	}
body h1 {
	font-size: 4;
	}
	
/* I need to make this float down relative to the bottom of the navigation bar */
#content_container {
	float: left;
    position: relative;
	border: 1px dashed purple;
	width: 93%;
	margin-top: 110px;
	margin-left: 10px;
	padding: 5px;
	/* margin: 1em 2em; */
	font-size: .8em;
	}
	
#content_container h1 {
	background-color: #696969; 
	border-style: solid; 
	padding-bottom: 6px;
	padding-left: 10px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: normal;
	font-size: 1.5em;
	color: #FFFFFF;
}
/* === the body of the site has five columns                       === */
#column_1 {
	width: 11%;
	padding: 1%;
	padding-top: 0px;
	float: left;
	border: 1px dashed green;
}
#column_2 {
	width: 24%;
	padding: 1%;padding-top: 0px;
	float: left;
	border: 1px dashed green;
}
#column_3 {
	width: 24%;
	padding: 1%;padding-top: 0px;
	float: left;
	border: 1px dashed green;
}
#column_4 {
	width: 24%;
	padding: 1%;padding-top: 0px;
	float: left;
	border: 1px dashed green;
}

#column_5 {
	width: 5%;
	padding: 1%;padding-top: 0px;
	float: right;
	border: 1px dashed green;
}