body{
background:url('') repeat;
background-repeat: repeat-y;
margin:0;
font: 10pt/12pt 'Lucida Grande', Verdana, Helvetica, sans-serif; 
}
html { 
  background: url(images/lace1.jpg) repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

A:link{ color:#B56115; text-decoration:none; }
A:hover{ color:#333333; text-decoration:underline; }
A:active{ color:#B56115; text-decoration:none; }
A:active:hover{ color:#333333; text-decoration:underline; }
A:visited{ color:#B56115; text-decoration:none; }
A:visited:hover{ color:#333333; text-decoration:underline; }

#header{
background:#FFFFFF;
width:1100px;
height:150px;
margin-left:auto;
margin-right:auto;
margin-bottom:0;
}
#header1{
background:#FFFFFF;
width:1100px;
height:250px;
margin-left:auto;
margin-right:auto;
margin-bottom:0;
}

#wrap{
width:1100px;
margin-left:auto;
margin-right:auto;
background:#E68A00;
border:;
background:url(bg.gif);
}
#wrap1{
width:1100px;
margin-left:auto;
margin-right:auto;
background:transparent;
border:;
background:;
}

#container{
width:1100px;
}

#navcontainer{
background:transparent;
margin-top:-240px;
}


 #navlist li{
background:transparent;
list-style-type: none;
text-align:right;
font-family: 'Lucida Grande', Verdana, Helvetica, sans-serif;
font-size:14px;
letter-spacing:2px;
color:#666666;
width:150px;
}

#navlist li a:link { color: darkorange; text-decoration:none; }
#navlist li a:visited { color: darkorange; text-decoration:none; }
#navlist li a:hover {color: darkorange; text-decoration:none; }

h1{
font-size:24px;
font-weight:bold;
color:#CC2900;
letter-spacing:-2px;
}

h2{
font-size:20px;
font-weight:bold;
color:#CC2900;
letter-spacing:-2px;
}


h3{
font-size:18px;
font-weight:bold;
color:#CC2900;
letter-spacing:-2px;
}


img {
    border-style: 5px solid;
    border-color: white;
}

.content{
background:url(images/center.jpg);
padding:0px;
text-align:justify;
font: 10pt/12pt 'Lucida Grande', Verdana, Helvetica, sans-serif;
color:#666666;
border-style:;
}
.content1{
background:;
padding:0px;
text-align:justify;
font: 10pt/12pt 'Lucida Grande', Verdana, Helvetica, sans-serif;
color:transparent;
border-style:;
}

#footer{
background:#E8D3C4;
padding:9px;
text-align:center;
font: 8pt/9pt 'Lucida Grande', Verdana, Helvetica, sans-serif;
color:#333333;
}

#title{
background:white;
text-align:left;
padding:0px;
font-family: 'Lucida Grande', Verdana, Helvetica, sans-serif;
font-size:28px;
text-transform:uppercase;
color:#FFFFFF;
}

#outer{
background:white;border-style : ridge;
width:1100px;
margin-left:auto;
margin-right:auto;

			
}
#outer1{
background:transparent;border-style:;
width:1100px;
margin-left:auto;
margin-right:auto;

			
}
.pullquote1 {
color:green;
width:250px;
float:right;
width:250px;
margin-top:10px;
margin-bottom:10px;
margin-left:30px;
padding-bottom:10px;
font-family:'Lucida Grande', Helvetica, sans-serif;
font-size: 16px;
line-height:20px;
letter-spacing:2px;
text-align: center;
color:darkorange;
}
.pullquote {
color:green;
width:250px;
float:right;
width:250px;
margin-top:10px;
margin-bottom:10px;
margin-left:30px;
padding-bottom:10px;
font-family:'Lucida Grande', Helvetica, sans-serif;
font-size: 16px;
line-height:20px;
letter-spacing:2px;
text-align: center;
color:#B56115;
}
#lightbox{
	background-color:#eee;
	padding: 10px;
	border-bottom: 2px solid #666;
	border-right: 2px solid #666;
	}
#lightboxDetails{
	font-size: 0.8em;
	padding-top: 0.4em;
	}	
#lightboxCaption{ float: left; }
#keyboardMsg{ float: right; }
#closeButton{ top: 5px; right: 5px; }

#lightbox img{ border: none; clear: both;} 
#overlay img{ border: none; }

#overlay{ background-image: url(images/overlay.png); }

* html #overlay{
	background-color: #333;
	background-color: transparent;
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="overlay.png", sizingMethod="scale");
	}

.rotate33 {
    -webkit-transform: rotate(-33deg);
    -moz-transform: rotate(-33deg);
    -o-transform: rotate(-33deg);
    -ms-transform: rotate(-33deg);
    transform: rotate(-33deg);
}
.rotate66 {
    -webkit-transform: rotate(33deg);
    -moz-transform: rotate(33deg);
    -o-transform: rotate(33deg);
    -ms-transform: rotate(33deg);
    transform: rotate(33deg);
}
.imageHolder { position: relative; width: 285px; height: 175px; }
.imageHolder .caption { opacity: 0; position: absolute; height:50px; width: 283px; bottom: 0px; left: 0px; padding: 2px 0px; color: black; background: white; text-align: center; font-weight:bold; } 
.imageHolder:hover .caption { opacity: 0.7; }

.under
{
position:absolute;
left:0px;
top:0px;
z-index:-1;
}
.over
{
position:absolute;
left:40px;
top:10px;
z-index:-1;
}
	#myslideshow{ /*sample CSS for demo*/
border:10px solid tan;
}

	#sign{ /*sample CSS for demo*/
border:10px solid white;
}
.spotlightmenu{
width: 100%;
overflow:hidden;
}

.spotlightmenu ul{
margin: 0;
padding: 0;
font: bold 14px Verdana; /* font style and size */
list-style-type: none;
letter-spacing: 2px;
text-align: center; /* "left", "center", or "right" align menu */
}

.spotlightmenu li{
display: inline-block;
position:relative;
padding: 5px;
margin: 0;
margin-right: 5px; /* right margin between menu items */
}


.spotlightmenu li a{
display:inline-block;
padding: 5px;
min-width:100px; /* horizontal diameter of spotlight */
height:25px; /* vertical diameter of spotlight */
text-decoration: none;
color: url(images/top1.jpg);
margin: 0 auto;
overflow:hidden;
-moz-transition: all 0.5s ease-in-out; /* CSS3 transition to animate all A properties */
-webkit-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}

.spotlightmenu li:hover a{
color: white;
background: url(images/top.png); /* background color of spotlight */
-webkit-border-radius: 75%; /* large radius to create circular borders */
-moz-border-radius: 75%;
border-radius: 75%;
}

.spotlightmenu li a span{
position:relative;
top:35%; /* move text down so it appears centered within menu item */
}
div.beforeandafter{ /* main container */
	background: white;
	border: 10px solid tan;
	display: block;
	height: 434px; /* default height of main container */
	overflow: hidden;
	position: relative; 
	width: 650px; /* default width of main container */
}

div.before, div.after{ /* before and after DIVs within main container */
	height: 100%;
	left: 0;
	overflow: hidden;
	position: absolute;
	top: 0;
	transition: width 0.4s ease-in-out; /* CSS transition. Actual duration set inside script (options.revealduration) */
	width: 100%;
	z-index: 100;
}

div.after{
	z-index: 1; /* z-index of after div should be smaller than before's */
}


div.drag{ /* main div used for separating and dragging between before and after slides */
	background: white;
	cursor: col-resize;
	display: block;
	height: 100%;
	left: 100%;
	position: absolute;
	top: 0;
	transition: left 0.4s ease-in-out; /* transition. 0.4s sets duration of drag fade in time */
	width: 2px; /* width of drag bar separator */
	z-index: 1001;
}

div.drag div.draghandle{ /* handle bar within drag interface */
	background: darkorange;
	background: -moz-radial-gradient(center, ellipse cover, rgba(169,3,41,1) 0%, rgba(143,2,34,1) 44%, rgba(109,0,25,1) 100%);
	background: -ms-radial-gradient(center, ellipse cover, rgba(169,3,41,1) 0%,rgba(143,2,34,1) 44%,rgba(109,0,25,1) 100%);
	background: -o-radial-gradient(center, ellipse cover, rgba(169,3,41,1) 0%,rgba(143,2,34,1) 44%,rgba(109,0,25,1) 100%);
	background: radial-gradient(ellipse at center, rgba(169,3,41,1) 0%,rgba(143,2,34,1) 44%,rgba(109,0,25,1) 100%);
	background: rgb(169,3,41);
	background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,rgba(169,3,41,1)), color-stop(44%,rgba(143,2,34,1)), color-stop(100%,rgba(109,0,25,1)));
	background: -webkit-radial-gradient(center, ellipse cover, rgba(169,3,41,1) 0%,rgba(143,2,34,1) 44%,rgba(109,0,25,1) 100%);
	border-radius: 2px;
	box-shadow: 0 0 5px gray;
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a90329', endColorstr='#6d0019',GradientType=1 );
	height: 20%; /* height of drag handle */
	position: absolute;
	text-align: center;
	width: 16px; /* width of drag handle */
}

div.before span.caption, div.after span.caption{ /* CAS to syle SPAN caption. Optional */
	background: tan;
	bottom: 10px;
	color: white;
	display: block;
	font: bold 12px Germand;
	padding: 5px;
	position: absolute;
	right: 10px;
	width: 90px;
}


div.before span.caption{
	left: 10px;
	right: auto;
}

div.before span.caption a, div.after span.caption a{
	color: lightyellow;
	text-decoration: none;
}