body    {
margin: 0px;
padding: 0px;
background-color: black;
}
  
img {
display: block;
border: 0;
}



/* TYPE */

h1 {
font-family: verdana, sans-serif;
font-style: bold;
font-size: 24px;
color: #A6BCA9;
}

h2  {
font-family: verdana, sans-serif;
font-size: 18px;
color: #698280;
}

h3  {
font-family: verdana, sans-serif;
font-size: 12px;
}

a   {
font-family: verdana, sans-serif;
color: #9C9C9A;
font-size: 10px;
font-style: bold;
text-decoration: none;
}

p   {
font-family: verdana, sans-serif;
font-size: 12px;
}


/*  SITE BEGINS */

#page   {
margin-left: auto;
margin-right: auto;
width: 760px;
height: auto;
background-color: white;
}

#header {
width: 760px;
height: 68px;
margin: 0px;
padding: 0px;
}

#top_nav        {
position: relative;
z-index: 100;
width: 760px;
height: 34px; 
background-image: url("../image/header_2a.jpg");
background-repeat: no-repeat;
margin: 0px;
padding: 0px;
}

#top_nav2        {
position: relative;
z-index: 100;
width: 760px;
height: 34px; 
background-image: url("../image/header_2a.jpg");
background-repeat: no-repeat;
margin: 0px;
padding: 0px;
}

#top_nav a  {
width: auto;
height: auto; 
padding: 0px 0px 0px 4px;
color: black;
font-size: 9px;
font-weight: bold;
font-family: verdana, sans-serif;
margin: 0px;
float: left;
} 

#top_nav2 a  {
float: left;
display: inline;
width: auto;
height: 12px;
margin: 3px 0px; 
padding: 12px 9px 0px 9px;
color: black;
font-size: 9px;
font-weight: bold;
font-family: verdana, sans-serif;
border-right: solid 1px #333333;
} 

#top_nav2 a#top_nav_bottom_link_3 { width: 50px; height: 24px; padding: 0px 9px; }
#top_nav2 a#top_nav_bottom_link_4 { width: 90px; height: 24px; padding: 0px 9px; }
#top_nav2 a#top_nav_bottom_link_5 { width: 75px; height: 24px; padding: 0px 9px; }
#top_nav2 a#top_nav_bottom_link_7 { width: 55px; height: 24px; padding: 0px 9px; }
#top_nav2 a#top_nav_bottom_link_8 { width: 80px; height: 24px; padding: 0px 9px; border-right: 0px; }

#top_nav a:hover    {
color: #D22B26;
}

.top_nav_category {
width: auto;
height: auto;   
float: left;
margin: 0px;
padding: 0px 4px;
text-align: left;
}

/* new to us */
.top_nav_menu_1 {   
    width: 80px;
    height: 13px;
    margin: 0px;
    padding: 0px;
}
/* about sjc */
.top_nav_menu_2 {
    width: 70px;
    height: 13px;
    margin: 0px;
    padding: 0px; 
}
/* worship */
.top_nav_menu_3 {
    width: 60px;
    height: 13px;
    margin: 0px;
    padding: 0px; 
}
/* what's new */
.top_nav_menu_4 {
    width: 80px;
    height: 13px;
    margin: 0px;
    padding: 0px; 
}
/* spirituality */
.top_nav_menu_5 {
    width: 85px; 
    height: 13px;
    margin: 0px;
    padding: 0px; 
}
/* youth */
.top_nav_menu_6 {
    width: 75px; 
    height: 13px;
    margin: 0px;
    padding: 0px;
}
/* music */
.top_nav_menu_7 {
    width: 45px;
    height: 13px;
    margin: 0px;
    padding: 0px; 
}
/* helping others */
.top_nav_menu_8 {
    width: 100px;
    height: 13px;
    margin: 0px;
    padding: 0px; 
}
/* communities */
.top_nav_menu_9 {
    width: 75px;
    height: 13px;
    margin: 0px;
    padding: 0px; 
}

/* new to us */
.top_nav_menu_1_b { 
    width: 80px;
    height: 13px;
    margin: 0px;
    padding: 0px;
    border-right: solid black 1px;
}
/* about sjc */
.top_nav_menu_2_b {
    width: 70px;
    height: 13px;
    margin: 0px;
    padding: 0px;
    border-right: solid black 1px;  
}
/* worship */
.top_nav_menu_3_b {
    width: 60px;
    height: 13px;
    margin: 0px;
    padding: 0px;
    border-right: solid black 1px;  
}
/* what's new */
.top_nav_menu_4_b {
    width: 80px;
    height: 13px;
    margin: 0px;
    padding: 0px;
    border-right: solid black 1px;  
}
/* spirituality */
.top_nav_menu_5_b {
    width: 85px; 
    height: 13px;
    margin: 0px;
    padding: 0px;
    border-right: solid black 1px;  
}
/* youth */
.top_nav_menu_6_b {
    width: 75px; 
    height: 13px;
    margin: 0px;
    padding: 0px;
    border-right: solid black 1px;  
}
/* music */
.top_nav_menu_7_b {
    width: 45px;
    height: 13px; 
    margin: 0px;
    padding: 0px;
    border-right: solid black 1px;  
}
/* helping others */
.top_nav_menu_8_b {
    width: 100px;
    height: 13px;
    margin: 0px;
    padding: 0px;
    border-right: solid black 1px;  
}
/* communities */
.top_nav_menu_9_b {
    width: 75px;
    height: 13px;
    margin: 0px;
    padding: 0px; 
}

#header_2   {
width: 760px;
height: 30px;
margin: 0px; 
padding: 0px;
float: left;
} 

#header_2 a {
font-weight: bold;
color: black;
font-family: verdana, sans-serif;
padding: 0px 10px;
margin: 0px;
}

#logo   {
width: 325px;
height: 67px;
float: left;
margin: 0px;
padding: 0px;
}

#header_right   {
width: 435px;
height: 67px;
float: right;
background-image: url("../image/header.jpg");
background-repeat: no-repeat;
margin: 0px;
padding: 0px;
}

#search {
width: 255px;
height: 30px;
float: right;
margin: 10px 0px 0px 0px;
padding: 0px;
}

.search {
float: left;
border-top: solid black 1px;
border-left: solid black 1px;
border-right: 0;
border-bottom: solid white 1px;
margin: 0px 5px 0px 10px;
height: 14px;
width: 195px;
color: gray;
}

.button {
float: left;
height: 18px;
width: 23px;
}

#rollover_text  {
float: right;
width: 290px; 
height: auto;
margin: 5px 0px 0px 0px;
padding: 0px;
}


#support    {
width: 145px;
height: auto;
float: left;
}

#signup {
width: 145px;
height: auto;
float: left;
}


#rollover_text a    {
font-family: verdana, sans-serif;
font-size: 10px;
font-weight: bold;
color: white;
margin: 15px 0px 0px 0px;
padding: 0px;
}

.arrow  {
width: 9px;
height: 16px;
float: left; 
margin: 3px 5px 0px 0px;
}

.arrow_small    {
width: 6px;
height: 9px;
float: left;
margin: 3px 5px 0px 0px;
}

#main_content_splash    {
width: 760px;
height: 358px; 
background-image: url("../image/main_content_new.jpg");
background-repeat: no-repeat;
margin: -1px 0px 0px 0px;
float: left;
} 

#main_content_image {
    width: 0px; 
    height: 0px;
    float: left;
    z-index: 100;
}

#main_content_splash_image {
    width: 318px;
    height: 358px;
    visibility: hidden;
}

#main_content   {
position: relative;
z-index: 1;
width: 760px;
height: auto;
min-height: 410px;
margin: 0px 0px 0px 0px;
float: left;
background-color: white;
}

#main_nav   {
width: 442px;
height: 98px; 
float: right;
margin: 120px 0px 0px 0px;
}

.main_nav_row   {
height: 25px;
width: 442px;
}

.main_nav_row a {
display: block;
font-size: 11px;
font-family: verdana, sans-serif;
font-weight: bold;
color: #F9F7F7;
}

.main_nav_row a:hover   {
color: black;
}

#hover  a:hover {
color: #c4c4c4;
}

#lt_gray    {
padding: 5px 0px 0px 30px;
margin: 0px;
width: 112px;
}

#lt_green   {
padding: 5px 0px 0px 50px;
margin: 0px;
width: 250px;
}

#dk_green   {
padding: 5px 0px 0px 30px;
margin: 0px;
width: 152px;
}

#lt_blue    {
padding: 5px 0px 0px 14px;
margin: 0px;
width: 118px;
}

#orange { 
padding: 5px 0px 0px 40px;
margin: 0px;
width: 82px;
}

#dk_gray    {
padding: 5px 0px 0px 30px;
margin: 0px; 
width: 192px;

}

#black  {
padding: 5px 0px 0px 55px;
margin: 0px;
width: 162px;
}

#lt_lt_green    {
padding: 5px 0px 0px 30px;
margin: 0px;
width: 142px;
}

#maroon {
padding: 5px 0px 0px 30px;
margin: 0px;
width: 92px;
} 

#dk_blue    {
padding: 5px 0px 0px 30px;
margin: 0px;
width: 112px;
}

#orange_2 { 
padding: 5px 0px 0px 5px;
margin: 0px;
width: 162px;
}

#dk_green_2 { 
padding: 5px 0px 0px 8px;
margin: 0px;
width: 138px;
}

#dk_gray_2 { 
padding: 5px 0px 0px 8px;
margin: 0px;
width: 118px;
}

.nav    {
float: left;
}






/*  FOOTER */


#footer {
width: 760px;
height: 50px;
background-color: #646459;
float: left;
}

#foot_left  {
width: 375px;
height:50px;
float: left;
}

#footer p   {
font-size: 11px;
color: #9C9C9A;
float: left;
margin: 5px;
}

#bot_nav a  {
padding: 10px 10px;
margin: 0px;
text-decoration: none;
}

#foot_right {
width: 375px;
height: 50px;
float: right;
}

#foot_right p   {
float: right;
}

#foot_right a   {
float: right;
margin: 0px 10px;
text-decoration: underline;
color: white;
}

#foot_links {
    width: 200px;
    height: auto;
    float: right;
} 

#top_content    {
width: 175px;
height: 85px;
float: left;
}

#caption    {
width: 165px;
height: 85px;
float: left;
background-repeat: no-repeat;
margin: 0px 0px 10px 5px;
}

#quote  {  
width: 535px;
height: 85px;  
float:left;
margin: 0px 0px 10px 5px;
}

#left_content   {
width: 175px;
height: auto;
float: left;
}

#left_nav   {
width: 175px;
height: auto;
margin: 10px 0px 20px 0px;
float: left;
}

#left_nav   a   {
width: 148px;
height: auto;  
margin: 0px 0px 10px 0px;
padding: 0px 0px 0px 5px;
float: left;
font-family: verdana, sans-serif;
font-size: 11px;
color: #3F3B3C;
font-weight: bold;
text-decoration: none;
text-align: right;
}

#left_nav   a:hover {
color: white;
color: #7A7D82;
}

#right_content  {
width: 555px;
height: auto;
float: left; 
margin: 0px 0px 0px 0px;
}

#right_content a {
color: #3F8FB2; 
} 

#content    {
width: 335px;
height: auto;
min-height: 300px;
padding: 0px 15px;
margin: 0px;
float: left;
border-right: dotted gray 1px;
border-left: dotted gray 1px;
}

#intro  {
width: 335px;
height: auto;
margin: 0px;
padding: 0px;
}

#intro p    {
font-family: arial, helvetica, sans-serif;
font-size: 12px;
color: black;
margin: 0px 0px 10px 0px;
padding: 0px;
line-height: 18px;
}

#intro a {
font-size: 12px;  
}
 
#news_col   {
width: 170px;
height: auto;
float:left;
margin: 0px 0px;
padding: 0px 0px 0px 15px;
}

#news_col p {
font-family: verdana, sans-serif;
font-size: 12px;
color: black;
margin: 0px ;
line-height: 16px;
margin: 5px 0px 0px 0px;
}



.bold   {
font-weight: bold;
}

.lt_red_txt {
color: #CC8056;
}

.lt_gray_txt    {
color: #96999A;
}

.red_text   {
color: #D22B26;
} 


/*  ADMIN */

#admin_content  {
width: 760px;
height: auto; 
margin: 0px 0px 0px 0px;
float: left;
background-color: white;
}

#admin_left_cont     {
width: 330px;
height: auto; 
border-right: dotted gray 1px;
float: left;
}

#admin_left_cont p  {
font-size: 12px;
color: red;
}

#admin_main_nav {
width: 145px;
height: auto;
float: left;
margin: 20px 0px 0px 0px;
padding: 0px;
}


#admin_main_nav a   {
display: block;
font-size: 11px;
font-family: verdana, sans-serif;
font-weight: bold;
color: black;
border:solid gray 1px;
padding: 3px 10px;
}

#admin_main_nav a:hover {
background-color: #DDD6BA;
}

#admin_main_nav a:active    {
background-color: red;
}

#admin_sec_nav  {
width: 145px;
height: auto;
float: left;
margin: 20px 0px 0px 0px;
} 

#admin_sec_nav a    {
display: block;
font-size: 11px;
font-family: verdana, sans-serif;
font-weight: bold;
color: black;
border: solid gray 1px;
padding: 3px 10px;
}

#admin_sec_nav a:hover  {
background-color: #DDD6BA;
}

#admin_sec_nav a:active {
background-color: red;
}

#admin_third_nav    {
width: 125px; 
height: auto;
margin: 0px 0px 0px 20px;
}

#admin_third_nav a  {
display: block;
font-size: 11px;
font-family: verdana, sans-serif;
font-weight: bold;
color: gray;
border: solid gray 1px;
padding: 3px 10px;
 
}

#admin_third_nav a:hover    {
background-color: #DDD6BA;
}

#admin_third_nav a:active   {
background-color: red;
}

#admin_col_1 {
width: 150px; 
height: auto;
float: left;
margin: 10px 5px 50px 5px;
padding: 0px;
}

#admin_col_2    {
width: 150px;
height: auto;
float: left;
margin: 10px 0px 50px 5px;
padding: 0px;
}

#admin_right_cont   {
width: 410px;
height: auto;
float: left;
margin: 20px 0px 20px 10px;
}

#admin_right_cont a {
color: black;
} 

#admin_right_cont table {
font-size: 11px;
font-family: verdana, sans-serif;
}


.form   {
width: 400px; 
height: auto; 
background-color: #EFEDE4;
font-family: verdana, sans-serif;
font-size: 11px;
margin: 0px 0px 20px 0px;
}
 
.form input {
background-color: #FFFFFF;
margin: 0px 0px 0px 0px;
height: auto;
width: auto;
float: none;
}

.form th {
    text-align: left; 
}

.form a {
color: black;
font-size: 11px;

}

#events {
    width: 90%;
    margin: 0px 0px 0px 20px;
}
 
.admin_select {
    background-color: red;  
}


.pdf {
    background-color: white;
    font-size: 11px;
    font-family: verdana, sans-serif;
    margin-left: 30px;
}

.pdf p {
    font-size: 14px;
    font-weight: bold;
}
 
.floatright_pic {
float: right;
margin: 0px 0px 5px 5px;
}

.floatleft_pic  {
float: left;
margin: 0px 5px 5px 0px;
}
 
#submenu { 
width: 335px;
height: auto;
margin: 0px;
padding: 0px;
}

#submenu a {
font-family: verdana, sans-serif;
font-size: 10px;
float: left;
margin: 2px 0px 0px 0px;
color: black;
}

#submenu_select a {
    color: #3F8FB2;
}

#sitemap_right_content  {
width: 554px;
height: auto;
float: right; 
margin: 10px 0px 0px 0px;
} 

#sitemap_right_content a {
    color: black;
    font-size: 12px;
    font-family: verdana, sans-serif;
}

#sitemap_right_content a:hover {
    color: gray;
}
 
.sitemap_first_col {
    padding: 0px;
    margin: 0px 0px 5px 10px;
    font-weight: bold;
}  


.sitemap_sec_col {
    padding: 0px;
    margin: 0px 0px 5px 25px;
    font-weight: normal;
}

.sitemap_third_col {
    padding: 0px;
    margin: 0px 0px 5px 40px;
}

.error {
    color: red;
}

/*  PRIVACY POLICY PAGE */

#privacy_right_content {
    width: 514px;
    height: auto;
    float: right; 
    margin: 10px 30px 0px 10px;
}

/*  NEWSLETTER PAGE */
 
#newsletter_right_content {
    width: 514px;
    height: auto;
    float: right; 
    margin: 10px 30px 0px 10px;
}

#newsletter_right_content a {
    color: #3F8FB2;
    font-size: 11px;
}

/* MENU */

#dropmenudiv{
width:146px;
position:absolute;
border:1px solid gray;
border-bottom-width: 0px;
font:normal 12px Verdana;
line-height:18px;
z-index:100;
visibility:hidden;
background-color: #C8D0D3;
}

#dropmenudiv a{
width: 140px;
display: block;
border-bottom: 1px solid gray;
padding: 1px 3px 1px 3px;
text-decoration: none;
font-weight: bold;
color: black;
}

#dropmenudiv a:hover{ /*hover background color*/
    background-color: white;
    color: red;
}

#slideshow {
  width: 100%;
  text-align: center;
  font-family: verdana, sans-serif;
  font-size: 12px;
  color: #333333;
  font-weight: bold;
}

#slideshow img {
  float: none;
  display: inline;
  border: solid 3px #cccccc;
  margin: 8px 0px 0px 0px;
}

span#action {
  background: #eeeeee;
  border: solid 1px #999999;
  text-align: center;
  padding: 4px;
  color: #666666;
  font-weight: bold;
  font-family: verdana, sans-serif;
  font-size: 11px;
}

span#action:hover {
  background: #ffffff;
  color: #333333;
  border-color: #666666;
}