@charset "UTF-8";
/* CSS Document */

* {
margin: 0;padding: 0;
}
/*generic codes-----------------------------*/
body {
	background-color: #111;
}
a:link {
	color: #6e6d32;
}
a:hover {
	color: #1a3206;
	text-decoration: underline;
}


/*home page code-----------------------------*/
#wrap { width:929px; margin:0 auto; }

#background {
z-index: 1;
position:absolute;
width: 929px;
height: 402px;
float:left;
}
#menu {
z-index: 2;
position:absolute;
width: 929px;
height: 360px;
float:left;
top: 25px;
}



/* home top navigation-----------------------------*/

#navHead {
float: left;
display: inline;
width: 929px;
}
#navWrap {
width: 929px;
float: left;
display: inline;
}
.logo {
float: left;
margin-left:23px;
display: inline;
border:none;
}
ul {
font-family:"Lucida Grande", Arial, Helvetica, san-serif;
font-size:12px;
float: left;
display: inline;
list-style: none;
width: 929px;
}
ul#tabs {
margin:0;
float: right;
list-style: none;
width: 500px;
}
ul#tabs li {
float: left;
margin: 0;
font-size: 12px;
list-style: none;
}
ul#tabs a {
font-family:"Lucida Grande", Arial, Helvetica, san-serif;
font-size:12px;
display: block;
padding: 8px 20px 8px 20px;
text-decoration: none;
color:#6e6d32;
text-transform: uppercase;
}
ul#tabs a:hover {
font-family:"Lucida Grande", Arial, Helvetica, san-serif;
font-size:12px;
color: #1a3206;
padding: 8px 20px 8px 20px
text-decoration:none;
}
ul#tabs li.selected a {
color:#1a3206;
}

/* content--------------------------------- */
#content {
	width: 929px;
	padding: 0;
	margin: 0px;
	clear: left;
}
#mainContent {
	width: 931;
	float:left;
	display:inline;
	clear: left;
}
#homeContent {
	width: 100%;
	float: left;
	display: inline;
	padding: 0;
	margin-top: 402px;
	clear: left;
}
#insideContent {
	width: 929px;
	float:left;
	display:inline;
	clear: left;
}

/* subnav--------------------------------- */
#subNav {
width:931px;
margin-top: 400px;
}
#subWrap{
background:url(images/navbar_left.jpg) no-repeat bottom left;
background-color: #35221c;
width:931px;
height:28px;
float: left;
}
#subWrap ul#tabs {
margin-left:324px;
float:left;
display:inline;
width: 597px;
height:28px;
}
#subWrap ul#tabs li {
font-family:"Lucida Grande", Arial, Helvetica, san-serif;
font-size:10px;
float:left;	
margin-left: 24px;
list-style: none;
}
#subWrap ul#tabs  a {
font-family:"Lucida Grande", Arial, Helvetica, san-serif;
font-size:10px;
padding: 8px 20px 7px 20px;
text-decoration: none;
text-transform: uppercase;
color: #c3b785;
}
#subWrap ul#tabs  a:hover {
font-family:"Lucida Grande", Arial, Helvetica, san-serif;
font-size:10px;
float:left;
display: inline;
padding: 8px 20px 7px 20px;
text-decoration: none;
text-transform: uppercase;
color: #BCA764;
}
#subWrap ul#tabs li.selected a {
background:url(images/tab_on.jpg) no-repeat bottom center;
color:#fff;
}
.lowercase {
text-transform:lowercase;
font-style:italic;
}



/* content--------------------------------- */
#sideBar{
background:url(images/home_sidebar_bg.jpg) repeat-x top left;
float:left;
width:196px;
height:800px;
display:inline;
margin:0;
padding: 42px 0 0px 0;
color:#000;
clear:left;
}

#sideBar p{
font-family:"Lucida Grande", Arial, Helvetica, san-serif;
font-size:12px;
line-height:24px;
padding:0px 25px 24px 22px;
}
#sideBar h2{
font-family:"Lucida Grande", Arial, Helvetica, san-serif;
font-size:12px;
font-weight:bold;
padding:20px 25px 7px 22px;
}
#testimonial{
font-family:"Lucida Grande", Arial, Helvetica, san-serif;
font-size:12px;
font-style:italic;
padding:0px 25px 24px 22px;
}
.rule{
	border-color:#504f1e;
	padding-bottom:5px;
	border-bottom-width:thin;
}
.read {
font-family:"Lucida Grande", Arial, Helvetica, san-serif;
font-size:12px;
font-color:#000;
}
.read a: {
font-family:"Lucida Grande", Arial, Helvetica, san-serif;
font-size:12px;
font-color:#000;
}
.read a:hover {
color:#6e6d32;
}
#welcome {
	background:url(images/home_content_bg.jpg) no-repeat top left;
	height:802px;
	float:left;
	width: 735px;	
	padding-top: 40px;	
}
#welcome p{
font-family:"Lucida Grande", Arial, Helvetica, san-serif;
font-size:14px;
line-height:24px;
padding:15px 50px 24px 38px;
}
#welcome h2{
font-family:"Lucida Grande", Arial, Helvetica, san-serif;
font-size:10px;
font-weight:bold;
padding:10px 0px 0px 0px;
}

/* inside pages--------------------------------- */
.sideBar_inside{
background:url(images/inside_sidebar_bg.jpg) repeat-x top left;
float:left;
width:195px;
height:1011px;
display:inline;
margin:0;
padding: 42px 0 177px 0;
color:#000;
clear:left;
}
.sideBar_inside p{
font-family:"Lucida Grande", Arial, Helvetica, san-serif;
font-size:12px;
line-height:24px;
padding:0px 25px 24px 22px;
}
.sideBar_inside h2{
font-family:"Lucida Grande", Arial, Helvetica, san-serif;
font-size:12px;
font-weight:bold;
padding:20px 25px 7px 22px;
}
.sideBar_insidePort{
background:url(images/inside_sidebar_bg.jpg) repeat-x top left;
float:left;
width:194px;
height:800px;
display:inline;
margin:0;
padding: 48px 0 50px 0;
color:#000;
clear:left;
}

.sideBar_insidePort p{
font:"Lucida Grande", Arial, Helvetica, san-serif;
font-size:10px;
line-height:24px;
padding:0px 20px 24px 22px;
}
.sideBar_insidePort h2{
font:"Lucida Grande", Arial, Helvetica, san-serif;
font-size:10px;
font-weight:bold;
padding:10px 20px 7px 22px;
}
.testimonial{
font:"Lucida Grande", Arial, Helvetica, san-serif;
font-size:12px;
font-style:italic;
}
.readMore {
font:"Lucida Grande", Arial, Helvetica, san-serif;
font-size:12px;
font-style:italic;
color:#000;
}
.readMore a{
font:"Lucida Grande", Arial, Helvetica, san-serif;
font-size:12px;
font-style:italic;
color:#000;
}
.readMore a:hover{
font:"Lucida Grande", Arial, Helvetica, san-serif;
font-size:12px;
font-style:italic;
color:#2e4522;
}
.rule{
	border-color:#504f1e;
	padding-bottom:5px;
	border-bottom-width:thin;
}
.awards {
margin-top:50px;
}
#portfolioBack {
background:url(images/bg_portfolio_page.jpg) no-repeat top left;
width:929px;
float:left;
}
.contactBack {
background:url(images/bg_contact_page.jpg) no-repeat top left;
width:929px;
float:left;
}
.mediaBack {
background:url(images/bg_media_page.jpg) no-repeat top left;
width:929px;
float:left;
}
.testimonialBack {
background:url(images/bg_testimonial_page.jpg) no-repeat top left;
width:929px;
float:left;
}
#insideMenu {
width: 929px;
float: left;
display: inline;
margin-top: 25px;
}
#insideNav {
width:929px;
margin-top: 218px;
display:inherit;
}
#insideWrap{
background:url(images/inside_nav_bar.jpg) no-repeat top left;
background-color: #35221c;
float: left;
}
#insideWrap ul#tabs a {
font-family:"Lucida Grande", Arial, Helvetica, san-serif;
font-size:10px;
padding: 8px 20px 7px 20px;
text-decoration: none;
text-transform: uppercase;
color: #c3b785;
}
#insideWrap ul#tabs a:hover {
font-family:"Lucida Grande", Arial, Helvetica, san-serif;
font-size:10px;
float:left;
display: inline;
padding: 8px 20px 7px 20px;
text-decoration: none;
text-transform: uppercase;
color: #BCA764;
}
#insideWrap ul#tabs {
float:left;
height:28px;
display:inline;
width: 595px;
}
#insideWrap ul#tabs li {
font-family:"Lucida Grande", Arial, Helvetica, san-serif;
font-size:10px;
float:left;	
margin-left: 24px;
list-style: none;
}

#insideWrap ul#tabs li.selected a {
background:url(images/tab_on.jpg) no-repeat bottom center;
color:#BCA764;
}
.lowercase {
text-transform:lowercase;
font-style:italic;
}
#inside {
	background:url(images/inside_bg.jpg) no-repeat top left;
	float:left;
	width: 732px;
	height:1150px;
	padding: 25px 0 50px 0px;	
}

#inside p{
font-family:"Lucida Grande", Arial, Helvetica, san-serif;
font-size:12px;
line-height:22px;
margin-right:55px;
padding:0px 0px 21px 0px;
}
#inside h2{
font-family:"Lucida Grande", Arial, Helvetica, san-serif;
font-size:14px;
font-weight:bold;
padding:10px 0px 0px 0px;
}
#inside .testimonial{
font-family:"Lucida Grande", Arial, Helvetica, san-serif;
font-size:14px;
font-style:italic;
line-height:24px;
margin-right:55px;
padding:15px 0px 21px 0px;
}
#portfolioPage {
background:url(images/inside_bg.jpg) no-repeat top left;
float:left;
width: 735px;
height:1145px;
padding: 35px 0 50px 0px;	
}

#portfolioPage p{
font-family:"Lucida Grande", Arial, Helvetica, san-serif;
font-size:13px;
line-height:23px;
margin-right:55px;
padding:15px 25px 21px 45px;
}
#portfolioPage img{
margin-left:45px;
}
#portfolioPage h2{
font-family:"Lucida Grande", Arial, Helvetica, san-serif;
font-size:14px;
font-weight:bold;
padding:10px 25px 0px 45px;
}
#portfolioPage .more{
font-family:"Lucida Grande", Arial, Helvetica, san-serif;
font-size:11px;
font-weight:bold;
text-decoration:none;
text-transform:uppercase;
color:#000;
}
#portfolioPage .more a{
font-family:"Lucida Grande", Arial, Helvetica, san-serif;
font-size:11px;
font-weight:bold;
text-decoration:none;
text-transform:uppercase;
color:#000;

}
#portfolioPage .more a:hover{
font-family:"Lucida Grande", Arial, Helvetica, san-serif;
font-size:11px;
font-weight:bold;
text-decoration:underline;
text-transform:uppercase;
color:#2e4522;

}
#mediaPage {
background:url(images/inside_bg.jpg) no-repeat top left;
float:left;
width: 735px;
height:1150px;
padding: 30px 0 50px 0px;	
}

#mediaPage p{
font-family:"Lucida Grande", Arial, Helvetica, san-serif;
font-size:13px;
line-height:23px;
margin-right:55px;
padding:15px 25px 21px 45px;
}
#mediaPage img{
margin-left:45px;
}
#mediaPage h2{
font-family:"Lucida Grande", Arial, Helvetica, san-serif;
font-size:14px;
font-weight:bold;
padding:10px 25px 0px 45px;
}
#testimonyPage {
background:url(images/inside_bg.jpg) no-repeat top left;
float:left;
width: 735px;
height:1155px;
padding: 25px 0 50px 0px;	
}

#testimonyPage p{
font-family:"Lucida Grande", Arial, Helvetica, san-serif;
font-size:13px;
line-height:23px;
margin-right:55px;
padding:15px 25px 21px 45px;
}
#testimonyPage img{
margin-left:45px;
}
#testimonyPage h2{
font-family:"Lucida Grande", Arial, Helvetica, san-serif;
font-size:14px;
font-weight:bold;
padding:10px 25px 0px 45px;
}
#testimonyPage .testimonial{
font-family:"Lucida Grande", Arial, Helvetica, san-serif;
font-size:14px;
font-style:italic;
line-height:24px;
margin-right:65px;
padding:15px 25px 21px 45px;
}

#contactPage {
background:url(images/inside_bg.jpg) no-repeat top left;
float:left;
width: 735px;
height:1150px;
padding: 30px 0 50px 0px;	
}

#contactPage p{
font-family:"Lucida Grande", Arial, Helvetica, san-serif;
font-size:12px;
line-height:22px;
margin-right:55px;
padding:15px 25px 21px 45px;
}
#contactPage a{
font-family:"Lucida Grande", Arial, Helvetica, san-serif;
font-size:12px;
line-height:22px;
margin-right:55px;
color:#000;
padding:15px 25px 21px 0px;
}
#contactPage a:hover{
font-family:"Lucida Grande", Arial, Helvetica, san-serif;
font-size:12px;
line-height:22px;
margin-right:55px;
color:#2e4522;
padding:15px 25px 21px 0px;
}
#contactPage .italic{
font-family:"Lucida Grande", Arial, Helvetica, san-serif;
font-size:10px;
line-height:22px;
font-style:italic;
padding:15px 25px 21px 0px;
border-top:1px;
border-top-color:#585720;
border-top-style:solid;
margin-left:45px;
}
#contactPage img{
margin-left:45px;
}
#contactPage h2{
font-family:"Lucida Grande", Arial, Helvetica, san-serif;
font-size:14px;
font-weight:bold;
padding:10px 45px 0px 45px;
}

/*form-------------------------------------*/

.formText {
  font-family:"Lucida Grande", Arial, Helvetica, san-serif;
  font-size: 11px;
  line-height:22px;
  color: #000;
  font-weight:bold;
  text-transform:uppercase;
  text-decoration: none;
}
.TextInput {
  font-family:"Lucida Grande", Arial, Helvetica, san-serif;
  font-size: 12px;
  color: #000;
  text-decoration: none;
  height: 18px;
  width:210px;
  padding-bottom:3px;
  border-top-width: 1px;
  border-right-width: 1px;
  border-bottom-width: 1px;
  border-left-width: 1px;
  border-top-style: solid;
  border-right-style: solid;
  border-bottom-style: solid;
  border-left-style: solid;
  border-top-color: #afae71;
  border-right-color: #afae71;
  border-bottom-color: #afae71;
  border-left-color: #afae71;
  background-color: #b0af85;

}
.TextForm {
  font-family:"Lucida Grande", Arial, Helvetica, san-serif;
  font-size: 10px;
  color: #747474;
  text-decoration: none;
}
.TextArea {
  font-family:"Lucida Grande", Arial, Helvetica, san-serif;
  font-size: 12px;
  color: #000;
  text-decoration: none;
  height: 80px;
  width: 210px;
  border-top-width: 1px;
  border-right-width: 1px;
  border-bottom-width: 1px;
  border-left-width: 1px;
  border-top-style: solid;
  border-right-style: solid;
  border-bottom-style: solid;
  border-left-style: solid;
  border-top-color: #afae71;
  border-right-color: #afae71;
  border-bottom-color: #afae71;
  border-left-color: #afae71;
  background-color: #b0af85;

}

/*portfolio-------------------------------------*/

.portfolioNavContainer {
width:55px;
text-align:left;
}
.portfolioCatContainer {
width:55px;
text-align:left;
}
.portfolioNav {
width:17px;
height:55px;
font-family:"Lucida Grande", Arial, Helvetica, san-serif;
font-size:11px;
color:#2e4522;
line-height:17px;
font-weight:normal;
display:block;
}
.portfolioNavCat {
width:55px;
height:55px;
font-family:"Lucida Grande", Arial, Helvetica, san-serif;
font-size:11px;
color:#2e4522;
line-height:17px;
font-weight:normal;
display:block;
}
a.portfolioNavCat:link {
text-decoration:none;
color:#2e4522;
}
a.portfolioNavCat:hover {
text-decoration:none;
color:#000;
}
a.portfolioNav:link {
text-decoration:none;
color:#2e4522;
}
a.portfolioNav:hover {
text-decoration:none;
color:#000;
text-align:center;
}
a.portfolioNavSelected {
width:17px;
height:17px;
font-family:"Lucida Grande", Arial, Helvetica, san-serif;
font-size:11px;
color:#000;
line-height:17px;
font-weight:normal;
display:block;
}
a.portfolioNavCatSelected {
width:55px;
height:17px;
font-family:"Lucida Grande", Arial, Helvetica, san-serif;
font-size:11px;
color:#000;
line-height:17px;
font-weight:normal;
display:block;
text-decoration:none;
}
a.portfolioNavSelected:hover {
text-decoration:none;
color:#2e4522;
}



/* footer--------------------------------- */
#footer {
font-family:"Lucida Grande", Arial, Helvetica, san serif;
width: 929;
padding:10px 0 40px 25px;
margin:0px;
color:#666;
font-size:9px;
clear:both;
}
#footer a:link {
	color: #6e6d32;
}
#footer a:hover {
	color: #777;
	text-decoration: underline;
}

/* gallery--------------------------------- */



/* ================================================================ 
This copyright notice must be untouched at all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.stunicholls.com/gallery/simple.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any 
way to fit your requirements.
=================================================================== */

/* The outer container with a relative position */
#gallery {width:664px; height:664px; float:left; position:relative; background:none; padding-left:45px; border:none;}
#gallery p {font-family:"Lucida Grande", Arial, Helvetica, san serif; font-size:12px;}

/* Float the ul to the right with a width to give 3 thumbnail images per row */
#gallery ul {list-style:none; padding:0; margin:8px 0 0 0; width:155px; float:left;}

/* Place the list items inline using display:inline for IE and float:left */
#gallery ul li {display:inline; width:50px; height:50px; float:left; margin:0 7px 7px 0px; border:none; cursor:pointer;}

/* Set up the thumbnail images as the background images */

/* wedding page 1 */
#gallery ul li.wed1 {background:url(thumbs/wed1.jpg) top left;}
#gallery ul li.wed1_2 {background:url(thumbs/wed1[2].jpg) top left;}
#gallery ul li.wed1_3 {background:url(thumbs/wed1[3].jpg) top left;}
#gallery ul li.wed1_4 {background:url(thumbs/wed1[4].jpg) top left;}
#gallery ul li.wed1_5 {background:url(thumbs/wed1[5].jpg) top left;}
#gallery ul li.wed2 {background:url(thumbs/wed2.jpg) top left;}
#gallery ul li.wed2_2 {background:url(thumbs/wed2[2].jpg) top left;}
#gallery ul li.wed2_3 {background:url(thumbs/wed2[3].jpg) top left;}
#gallery ul li.wed2_4 {background:url(thumbs/wed2[4].jpg) top left;}
#gallery ul li.wed2_5 {background:url(thumbs/wed2[5].jpg) top left;}
#gallery ul li.wed3 {background:url(thumbs/wed3.jpg) top left;}
#gallery ul li.wed3_2{background:url(thumbs/wed3[2].jpg) top left;}

#gallery ul li.wed13 {background:url(#) -220px -160px;}
#gallery ul li.wed14 {background:url(#) -120px -160px;}
#gallery ul li.wed15 {background:url(#) -120px -80px;}
#gallery ul li.wed16 {background:url(#) -130px -80px;}
#gallery ul li.wed17 {background:url(#) 0 0;}
#gallery ul li.wed18 {background:url(#) -130px -30px;}

/* wedding page 2 */
#gallery ul li.wed3_3 {background:url(thumbs/wed3[3].jpg) top left;}
#gallery ul li.wed3_4 {background:url(thumbs/wed3[4].jpg) top left;}
#gallery ul li.wed4 {background:url(thumbs/wed4.jpg) top left;}
#gallery ul li.wed4_2 {background:url(thumbs/wed4[2].jpg) top left;}
#gallery ul li.wed4_3 {background:url(thumbs/wed4[3].jpg) top left;}
#gallery ul li.wed4_4 {background:url(thumbs/wed4[4].jpg) top left;}
#gallery ul li.wed5 {background:url(thumbs/wed5.jpg) top left;}
#gallery ul li.wed5_2 {background:url(thumbs/wed5[2].jpg) top left;}
#gallery ul li.wed5_3 {background:url(thumbs/wed5[3].jpg) top left;}
#gallery ul li.wed5_4 {background:url(thumbs/wed5[4].jpg) top left;}
#gallery ul li.wed6 {background:url(thumbs/wed6.jpg) top left;}
#gallery ul li.wed6_2{background:url(thumbs/wed6[2].jpg) top left;}

/* wedding page 3 */
#gallery ul li.wed6_3 {background:url(thumbs/wed6[3].jpg) top left;}
#gallery ul li.wed6_4 {background:url(thumbs/wed6[4].jpg) top left;}
#gallery ul li.wed7 {background:url(thumbs/wed7.jpg) -250px -100px;}
#gallery ul li.wed7_2 {background:url(thumbs/wed7[2].jpg)top left;}

/* mitzvah page 1 */
#gallery ul li.bar1 {background:url(thumbs/bar1.jpg) top left;}
#gallery ul li.bar1_2 {background:url(thumbs/bar1[2].jpg) top left;}
#gallery ul li.bar1_3 {background:url(thumbs/bar1[3].jpg) top left;}
#gallery ul li.bar1_4 {background:url(thumbs/bar1[4].jpg) top left;}
#gallery ul li.bar1_5 {background:url(thumbs/bar1[5].jpg) top left;}
#gallery ul li.bar1_6 {background:url(thumbs/bar1[6].jpg) top left;}
#gallery ul li.bar1_7 {background:url(thumbs/bar1[7].jpg) top left;}
#gallery ul li.bar1_8 {background:url(thumbs/bar1[8].jpg) top left;}
#gallery ul li.bar1_9 {background:url(thumbs/bar1[9].jpg) top left;}
#gallery ul li.bar1_10 {background:url(thumbs/bar1[10].jpg) top left;}
#gallery ul li.bar1_11{background:url(thumbs/bar1[11].jpg) top left;}
#gallery ul li.bar1_12{background:url(thumbs/bar1[12].jpg) top left;}

#gallery ul li.wed13 {background:url(#) -220px -160px;}
#gallery ul li.wed14 {background:url(#) -120px -160px;}
#gallery ul li.wed15 {background:url(#) -120px -80px;}
#gallery ul li.wed16 {background:url(#) -130px -80px;}
#gallery ul li.wed17 {background:url(#) 0 0;}
#gallery ul li.wed18 {background:url(#) -130px -30px;}

/* mitzvah page 2 */
#gallery ul li.bar1_13 {background:url(thumbs/bar1[13].jpg) top left;}
#gallery ul li.bar1_14{background:url(thumbs/bar1[14].jpg) top left;}
#gallery ul li.bar1_15{background:url(thumbs/bar1[15].jpg) top left;}
#gallery ul li.bar2 {background:url(thumbs/bar2.jpg) top left;}
#gallery ul li.bar2_2 {background:url(thumbs/bar2[2].jpg) top left;}
#gallery ul li.bar2_3 {background:url(thumbs/bar2[3].jpg) top left;}
#gallery ul li.bar2_4 {background:url(thumbs/bar2[4].jpg) top left;}
#gallery ul li.bar3 {background:url(thumbs/bar3.jpg) top left;}
#gallery ul li.bar3_2{background:url(thumbs/bar3[2].jpg) top left;}
#gallery ul li.bar3_3 {background:url(thumbs/bar3[3].jpg) top left;}
#gallery ul li.bar3_4 {background:url(thumbs/bar3[4].jpg) top left;}
#gallery ul li.bar3_5{background:url(thumbs/bar3[5].jpg) top left;}

/* mitzvah page 3 */
#gallery ul li.bar4 {background:url(thumbs/bar4.jpg) top left;}
#gallery ul li.bar4_2 {background:url(thumbs/bar4[2].jpg) top left;}
#gallery ul li.bar4_3 {background:url(thumbs/bar4[3].jpg) top left;}
#gallery ul li.bar4_4 {background:url(thumbs/bar4[4].jpg) top left;}
#gallery ul li.bar4_5 {background:url(thumbs/bar4[5].jpg) top left;}
#gallery ul li.bar4_6 {background:url(thumbs/bar4[6].jpg) top left;}


#gallery ul li.wed13 {background:url(#) -220px -160px;}
#gallery ul li.wed14 {background:url(#) -120px -160px;}
#gallery ul li.wed15 {background:url(#) -120px -80px;}
#gallery ul li.wed16 {background:url(#) -130px -80px;}
#gallery ul li.wed17 {background:url(#) 0 0;}
#gallery ul li.wed18 {background:url(#) -130px -30px;}

/* occasions page 1 */
#gallery ul li.occ1 {background:url(thumbs/occ1.jpg) top left;}
#gallery ul li.occ1_2 {background:url(thumbs/occ1[2].jpg) top left;}
#gallery ul li.occ1_3 {background:url(thumbs/occ1[3].jpg) top left;}
#gallery ul li.occ1_4 {background:url(thumbs/occ1[4].jpg) top left;}
#gallery ul li.occ1_5 {background:url(thumbs/occ1[5].jpg) top left;}
#gallery ul li.occ1_6 {background:url(thumbs/occ1[6].jpg) top left;}
#gallery ul li.occ1_7 {background:url(thumbs/occ1[7].jpg) top left;}
#gallery ul li.occ1_8 {background:url(thumbs/occ1[8].jpg) top left;}
#gallery ul li.occ1_9 {background:url(thumbs/occ1[9].jpg) top left;}
#gallery ul li.occ1_10 {background:url(thumbs/occ1[10].jpg) top left;}
#gallery ul li.occ1_11 {background:url(thumbs/occ1[11].jpg) top left;}



/* Hide the full size images */
#gallery ul li span i img {display:none;}

/* set up the .click style which will be added using javascript */

/* Change the li border to white */
#gallery ul li.click {border-color:#000; cursor:default;}

/* Position the span using an absolute position and specify the width and height */
#gallery ul li.click span {position:absolute; right:0; top:0; width:502px; height:502px;}

/* Set up the i so that it is the same size as the span BUT this has a static position so that the image can be both vertically and horizontally centered in all browsers except IE using display:table-cell */
#gallery ul li.click span i {width:502px; height:355px; display:table-cell; vertical-align:middle; text-align:center;} 

/* Make the image actual size using auto width and height */
#gallery ul li.click span i img {display:block; width:auto; height:auto; border:none; margin:0 auto;}

/* set up the default image */
#gallery ul li.default {width:0; height:0; border:0;}
#gallery ul li.default span {position:absolute; right:0; top:10px; width:502px; height:502px;}
#gallery ul li.default span i {width:502px; height:502px; display:table-cell; vertical-align:top; text-align:top;} 
/* specify the image width and height for IE6 */
#gallery ul li.default span i img {display:block; width:auto; height:auto; border:0; margin:0 auto;}
#gallery ul li.off {display:none;}