/* ---- style 

Name:     2009
Designer: Conor Byrne
URL:      www.ssje.org
Date:     October 2009
 

<<<-----------*/

html, body {
	font-size: 100.01%;
	display: block;
}



/* ---- floats skips alignment <<<-----------*/

.clear 		{ clear:both; }

.float-left 	{ float:left; }
.float-right 	{ float:right; }
.bold 		{ font-weight:bold; }
.italic 		{ font-style:italic; }
.underline 	{ border-bottom:1px solid; }
.highlight 	{ background:#cccccc; }

.fl 	{ float:left;margin:4px 10px 4px 0; }
.fr 	{ float:right;margin:4px 0 4px 10px; }
.fl-hw 	{ float:left;margin:0px 0px 30px 50px; }

.nopadding 	{ padding:0; }
.noindent 	{ margin-left:0;padding-left:0; }
.indent 	{ margin-left:50px;padding-left:5px; }
.nobullet 	{ list-style:none;list-style-image:none; }

#cc {position: absolute; left: -9999px; font-size: small;}
#cc a:hover {color: #ffffff;}

 .skip {display: none;}
a.skip {display: none;}

#axs {display:none;}
.table {margin: 0 130px 10px 50px;}

.rss-box-feed {width:350px;margin-left:300px;list-style:none;list-style-image:none;}
.rss-box-feed-left {float:left; width:400px; margin-left:10px;}

/* ---- STRUCTURE <<<-----------*/

#container_shell {width:887px;margin:0 auto;text-align: left;}


#container_wrap {width:887px;float:left; background:#ffffff; padding-top:5px;}
#pagetop {width:887px; height:126px; text-align:right; float:left; margin-bottom:-34px; background:url(../parts/logo.jpg) no-repeat; }

#pagetop h1 {display: none; }
#navbar {width:887px; height:20px; float:right; text-align:right; border-bottom:1px #333333 solid;  }


#page {width:887px;margin:0;padding:0;}
#left {width:150px; margin:0;padding:0;float:left;overflow:hidden; font-size:16px; padding-top:0px; }
#left p{font-size:13px; font-family: arial, Verdana, Helvetica, sans-serif; line-height:1.3em;   }



#middle {
	width:720px;
	background:#ffffff;
	margin:0;
	padding-left:5px;
	float:left;
	border-left:1px #333333 solid;
	margin-left:10px;
	padding-top:5px;
}

#middle ul li {	list-style-image: url(../../elements/images/bullet.gif);margin: 0 130px 0px 50px;
}


#middle p {margin: 0 130px 10px 50px; text-align:justify;
}

.bguw {
    display: inline-block;    
    zoom:1; 
    *display: inline;

}

#left_element {
	border-left: 1px solid #333333; 
	padding-left: 5px; 
	margin: 0 0 0 10px;
}

#right_element {
	vertical-align: top; 
	margin-top: 15px;
}

#insert {
	position:relative;
	margin: 0 0 0 0px;
	padding:0 0 0 90px;
	width: 240px;
	float:right;
	z-index: 100;
}

#insert p{margin: 0 0px 0px 0px; text-align: left; font-style:italic; font-size:11px;
}

#pagebot {width:877px; height:50px; color:#333333; font:10px Arial, Helvetica, Sans Serif; padding:5px 5px; padding-top:20px;}


#store {
	width:720px;
	background:#ffffff;
	margin:0;
	padding-left:5px;
	float:left;
	border-left:1px #333333 solid;
	margin-left:10px;
	padding-top:5px;	
}

#store p {margin: 0 0px 0px 0px;
}
#store ul li {color:#000000; font-size:13px; font-family: arial, Verdana, Helvetica, sans-serif;
}

.twitterclass{
width: 720px;
height: 20px;
padding: 0px;
background-color: transparent;
border: 0;
margin-bottom: 1em;
filter:progid:DXImageTransform.Microsoft.alpha(opacity=80); /*Specify fade effect in IE. Remove if desired.*/
-moz-opacity: 0.8; /*Specify fade effect in Firefox. Remove if desired.*/
<!--[if IE]>
padding: 70px;
<![endif]-->

}

.twitterclass {
 font-family:Arial;
 font-size:12px;
 color:#444444;
}

#rss-box-left {width:360px;margin: 0 0 0 0px; padding:0 0 0 0px; list-style:none;list-style-image:none; border:dashed #FF0000;}

/* ---- HTML tags <<<-----------*/


h1, h2, h3, h4, h5, h6 {
margin:0;
padding:0;
font-weight:normal;
color:#990000;
}

h1 {
font:160%  'Garamond', 'Palatino','Times New Roman', Serif;
color:#990000;
padding:10px 0 10px 0;
text-align:right;
}


h2 {
font:120% 'Garamond', 'Palatino','Times New Roman', Serif;
color:#990000;
padding:5px 0 5px 25px;

}

h3 {
font:110% 'Garamond', 'Palatino','Times New Roman';
color:#000000;
padding:0px 0 5px 0;
margin: 0 0px 0px 50px;
font-weight:bold;
}


h4 {
font:110% 'Garamond', 'Palatino','Times New Roman', Serif;
color:#333333;
margin: 0 0px 0px 20px;
}

/* ---- H5 navbar <<<-----------*/

h5 {
font-family:Verdana, Arial, Helvetica, sans-serif;
text-transform:uppercase;
color:#181818;
font-size:10px;
margin-left:25px;
}

h6 {
padding:0px 0px 0px 0px;
}

p {
color:#000000;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size:12px;

}


ul, ol, li {
margin: 0 0px 0px 14px;
list-style:none;
color:#333333;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
}

blockquote {
margin:22px 40px;
padding:0;
}

small {
font-size:0.85em;
}

img {
border:0;
}

sup {
position:relative;
bottom:0.3em;
vertical-align:baseline;
}

sub {
position:relative;
bottom:-0.2em;
vertical-align:baseline;
}

acronym, abbr {
cursor:help;
letter-spacing:1px;
border-bottom:1px dashed;
}



a:active { } 
/* ---- links <<<-----------*/

a, a:visited {
text-decoration:none;
}

a:link { color: #990000; }
a:visited { color: #990000; }
a:hover { color: #333333; }
a:active { color: #333333; }

.link2 a:link { color: #181818;}
.link2 a:visited {color: #181818;}
.link2 a:hover {color: #990000;}
.link2 a:active {color: #990000;}

a:link h4 { color: #333333;}
a:visited h4 {color: #333333;}
a:hover h4 {color: #333333;}
a:active h4 {color: #333333;}




/* ---- forms <<<-----------*/

form {
margin:0;
padding:0;
display:inline;
}

input, select, textarea {
font:1em 'Century Schoolbook', 'Goudy Old Style', 'Baskerville','Times New Roman', Serif;
}

textarea {
line-height:1.25;
}

label {
cursor:pointer;
}


/* ---- tables <<<-----------*/

table {
border:0;
margin:0;
padding:0;
}

.flashpad {margin:0; padding:0; margin-left:30px;}



td {align:left}

/* ---- navigation <<<-----------*/

#navwrap { 
	width: 887px;
	height: 35px;
	margin: 0;
	border:0;
	padding: 0;
	position:relative;
	background: url(../../zz_new/elements/images/pnav.gif) no-repeat;
}

#nav { 
	width: 887px;
	height: 35px;
	margin: 0;
	border:0;
	padding: 0;
	background: #111111;
	position:relative;
}

#nav ul	{
	width: 887px;
	height: 35px;
	background: url(../../zz_new/elements/images/pnav.gif) no-repeat;
	margin: 0;
	padding: 0;
	position: relative;
}

#nav ul li {
	margin: 0;
	padding: 0;
	list-style: none;
	position: absolute;
}

#nav ul li, #nav a {
	height: 35px;
	display: block;
}

#nav ul li a {
	text-indent: -9999px; 
	text-decoration: none;
}

#nav1 {left: 170px; width: 55px;}
#nav2 {left: 235px; width: 105px;}
#nav3 {left: 350px; width: 95px;}
#nav4 {left: 455px; width: 100px;}
#nav5 {left: 570px; width: 100px;}
#nav6 {left: 680px; width: 140px;}

#on1 { color:#990000; font-size:12px; }
#nav2 a:hover, #on2 {background: transparent url(../../zz_new/elements/images/pnav.gif) -235px -35px;}
#nav3 a:hover, #on3 {background: transparent url(../../zz_new/elements/images/pnav.gif) -350px -35px;}
#nav4 a:hover, #on4 {background: transparent url(../../zz_new/elements/images/pnav.gif) -455px -35px;}
#nav5 a:hover, #on5 {background: transparent url(../../zz_new/elements/images/pnav.gif) -570px -35px;}
#nav6 a:hover, #on6 {background: transparent url(../../zz_new/elements/images/pnav.gif) -680px -35px;}




#anavwrap { 
	width: 887px;
	height: 26px;
	margin: 0;
	border:0;
	padding: 0;
	position:relative;
	background: url(../../zz_new/elements/images/anav.gif) no-repeat;
}

#anav ul
{
width:670px;
margin-left:150px;
padding-top:8px;
font: 12px/15px Arial, Helvetica, Sans-Serif;
}

#anav li
{
display: inline;
list-style-type: none;
padding-right: 15px;
}

#anav li a:link { color: #222222; }
#anav li a:visited { color: #222222; }
#anav li a:hover { color: #ffffff; }
#anav li a:active { color: #222222; }


/* ---- scrollable <<<-----------*/
/*
	root element for the scrollable.
	when scrolling occurs this element stays still.
*/
.scrollable {

	/* required settings */
	position:relative;
	overflow:hidden;
	width: 660px;
	height:90px;
}

/*
	root element for scrollable items. Must be absolutely positioned
	and it should have a extremely large width to accommodate scrollable items.
	it's enough that you set width and height for the root element and
	not for this element.
*/
.scrollable .items {
	/* this cannot be too large */
	width:20000em;
	position:absolute;
}

/*
	a single item. must be floated in horizontal scrolling.
	typically, this element is the one that *you* will style
	the most.
*/
.items div {
	float:left;
}

/*----- sidebar custom search-----*/

.custom .menu { background-color: #fff;
width:75.5%;
 }

.custom .menu  li a{
line-height:1.6em;
font-size:1.5em;}

.custom .searchs{
width:24.5%;
float:right;
margin-top:-3.5em;

}