/* Cardinal Red = #D77069; */
/* Purple = #BEAAD7; */
/* Yellow/Gold = #FFD780; */


body {
	text-align:center;  /* IE6 needs this to center the layout in the browser window */
	background-image:url(images/background.gif);
	background-repeat:repeat-x;
	background-repeat:repeat-y;
	
	}
#main_wrapper {
	width:800px; /* widths of columns will scale proportionately as this width is changed */
	height:auto;
	margin-left:auto;  /* centers max\'d layout in browser */
	margin-right:auto; /* centers max\'d layout in browser */
	margin-bottom:auto; /* centers max\'d layout in browser */
	}
	
#header {
	width:100%;
	margin:0em 0em 0em 0em;

	}
#nav {
	width:18%;
	float:left;
	}
	
#content {
	width:62%;
	float:left;
	}
#promo {
	width:20%;
	float:left;
	}
#footer {
	width:100%;
	clear:both;
	border-top-width:1px; 
	border-top-color:#BEAAD7; 
	border-top-style:solid; 

	}
#header_inner, #nav_inner, #content_inner, #promo_inner {
	overflow:hidden; /* prevents oversize elements from breaking the layout */
	}
#header_inner {
margin:0em 0em -.2em 0em;

	}
#nav_inner {
	margin:.5em .5em 30em .5em;
	}
	
#content_inner {
	margin:.5em 1em 0em 1em;
	text-align:left;
	}
#promo_inner {
	margin:1em .5em;
	}
#footer_inner p {
	padding:.5em .5em;
	text-align:center;
	color:#D77069;
	font-weight:bolder;
	}
	
.footertext {
font-family:Arial, Helvetica, sans-serif;
font-size:.9em;
color:#000000;
font-weight:lighter;
}	

/* a fix for IE6 only - see Star Hack in Stylin' with CSS to see how the comments and * html hide this hack from other browsers \*/
* html * {
	zoom:100%; 
/* triggers IE6 "haslayout" - google 'IE6 haslayout' for details*/
	}
/* without the above hack, IE6 does not draw the header until the page is resized */
/* the problem is triggered by the universal * selector below that resets the margins, but I need to do that, hence the hack */
* {
	margin:0;
	padding:0;
	}
body {
	font: 1em Lucida, Arial, sans-serif; /* 1em = 16pts */
}
.float_left {float:left; margin: 0 .3em .3em 0;}      /* apply this class to any image or element with width - text will wrap it to the right */
.float_right {float:right;  margin: 0 0 .3em .3em;} /* apply this class to any image or element with width  - text will wrap it to the left */

/* DEFAULT TAG STYLES - font sizes, margins, padding, etc. */
/* NOTE: text colors follow below */


body.cardinalred {background-image:url(images/back.jpg); background-color:#D77069;}
.cardinalred  #main_wrapper {
	background-color:#FFF; 
	border-left-width:5px; 
	border-left-color:#BEAAD7; 
	border-left-style:solid; 
	border-right-width:5px; 
	border-right-color:#BEAAD7; 
	border-right-style:solid; 
	border-bottom-width:2px; 
	border-bottom-color:#BEAAD7; 
	border-bottom-style:solid; 
	border-top-width:2px; 
	border-top-color:#BEAAD7; 
	border-top-style:solid; 
}


.questions {
font-family:Arial, Helvetica, sans-serif;
font-weight:bold;
font-size:.9em;
color:#D77069;
}

#stencils-armband {
padding:0em 0em 0em 2em;
}

#stencils-americana, #stencils-belly, #stencils-butterflies, #stencils-childrens, #stencils-christmas, #stencils-easter, #stencils-floral, #stencils-hair, #stencils-halloween {
padding:0em 0em 0em 2em;
}

#stencils-jewish, #stencils-kanji, #stencils-largeandhair, #stencils-military, #stencils-misc, #stencils-motorcycle, #stencils-paws, #stencils-sports, #stencils-sunandstars {
padding:0em 0em 0em 2em;
}

#stencils-americana ul li{
padding:0em 0em 1em 0em;
list-style:none;
}

#stencils-armband ul li{
padding:0em 0em 0em 0em;
list-style:none;
}

#stencils-belly ul li{
padding:0em 0em 1em 0em;
list-style:none;
}

#stencils-butterflies  ul li{
padding:0em 0em 1em 0em;
list-style:none;
}

#stencils-christmas ul li{
padding:0em 0em 1em 0em;
list-style:none;
}

#stencils-childrens ul li{
padding:0em 0em 1em 0em;
list-style:none;
}

#stencils-easter ul li{
padding:0em 0em 1em 0em;
list-style:none;
}

#stencils-floral ul li{
padding:0em 0em 1em 0em;
list-style:none;
}

#stencils-hair ul li{
padding:0em 0em 1em 0em;
list-style:none;
}

#stencils-halloween ul li{
padding:0em 0em 1em 0em;
list-style:none;
}

#stencils-jewish ul li{
padding:0em 0em 1em 0em;
list-style:none;
}

#stencils-kanji ul li{
padding:0em 0em 1em 0em;
list-style:none;
}

#stencils-largeandhair ul li{
padding:0em 0em 1em 0em;
list-style:none;
}

#stencils-military ul li{
padding:0em 0em 1em 0em;
list-style:none;
}

#stencils-misc ul li{
padding:0em 0em 1em 0em;
list-style:none;
}

#stencils-motorcycle ul li{
padding:0em 0em 1em 0em;
list-style:none;
}

#stencils-paws ul li{
padding:0em 0em 1em 0em;
list-style:none;
}

#stencils-sports ul li{
padding:0em 0em 1em 0em;
list-style:none;
}

#stencils-sunandstars ul li{
padding:0em 0em 1em 0em;
list-style:none;
}


.cardinalred  #header {background-color:#FFFFFF;}
.cardinalred  #nav {background-color:#E9E2F1;}
.cardinalred  #content {background-color:#FFF;}
.cardinalred  #promo {background-color:#FFF;}
.cardinalred  #footer {background-color:#FFFFFF;}

h1, h2, h3, h4, h5, h6, ul, ol, dl {
	font-family:Arial, Helvetica, sans-serif;
	} 

.cardinalred  h1 {
	color:#E6CFE1;
	}
.cardinalred  h2, .cardinalred  h3, .cardinalred  h4, .cardinalred  h5 {
	color:#D77069;
	}
.cardinalred  h3 {
	color:#D77069;
	}
.cardinalred  h6 {
	color:#BEAAD7;
	}
.cardinalred  p {
	color:#574080;
	}
.cardinalred  ul, .cardinalred  ol, .cardinalred  dl, .cardinalred  blockquote, .cardinalred  cite {
	color:#6430BF;
	}
.cardinalred  cite {
	color:#FFF;
	}

.cardinalred  #promo_inner ul, .cardinalred  #promo_inner a {
	color:#FFF;
	}
.cardinalred  table, .cardinalred  form {
	color: #6430BF;
	}
.cardinalred  a {
	color:#D77069;
	}
.cardinalred  a:hover {
	color:#BEAAD7;
	text-decoration:underline;
	}	

.cardinalred  #promo_inner a:hover {
	color:#E6CFE1;
	}
	
.info img{filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100);-moz-opacity: 1;}

.info:hover img{filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50);-moz-opacity: 0.5;}

.qanda img{filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100);-moz-opacity: 1;}

.qanda:hover img{filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50);-moz-opacity: 0.5;}

.stencils img{filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100);-moz-opacity: 1;}

.stencils:hover img{filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50);-moz-opacity: 0.5;}

.links img{filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100);-moz-opacity: 1;}

.links:hover img{filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50);-moz-opacity: 0.5;}

.about img{filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100);-moz-opacity: 1;}

.about:hover img{filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50);-moz-opacity: 0.5;}

.contact img{filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100);-moz-opacity: 1;}

.contact:hover img{filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50);-moz-opacity: 0.5;}

.bio img{filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100);-moz-opacity: 1;}

.bio:hover img{filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50);-moz-opacity: 0.5;}

.photos img{filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100);-moz-opacity: 1;}

.photos:hover img{filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50);-moz-opacity: 0.5;}

/* FONT SIZES */
h1 {font-size:1.5em; /* 24pt */
	}
h2 {font-size:1.375em; /* 22pt */
	line-height:1.25;
	padding:.5em 0 0 0;	
	}
h3 {font-size:1.125em; /* 18pt */
	line-height:1.25;
	}
h4 {font-size:1.125em; /* 18pt */
	}
h5 {font-size:1em; /* 16pt */
	}
h6 {font-size:.8em; /* 14pt */
	}
	
h6 {font-size:.8em; /* 14pt */
	}
	
	
	
p  {
	font-size:.8em; /* 12pt */
	line-height:1.25; /* on 15pt */
	margin-bottom:.5em; /* 12pts of space */
 	}

/* basic list styling - more-styled lists in list.css */

#content ul li{
		margin:0 0em 0em 0em; /* lists without specific classes */
		font-size:1em;
		line-height:2;
		color:#000000;}
		
.normaltext {
	font-size:1em;
	color:#000000;
	
}

a {
	text-decoration:none;
	font-size:.9em;
	}
a:hover {
	text-decoration:underline;
	}
		
		
ul, dl, ol {
		margin:0 1em 0em 0em; /* lists without specific classes */
		font-size:.8em;
		line-height:1.5;}
li, dd {
		padding:0em 0; /* lists without specific classes */
		margin-left:0em;
		}
#nav ul, #nav dl, #nav ol {
		margin:0em 0em 0em 0em; /* lists without specific classes */
		}
#nav li {
	list-style-type:none;
	margin:0em 0em 0em 0em; 
	}
#promo ul, #promo dl, #promo ol {
		margin:0em 0em 0em 0em;  /* lists without specific classes */
		}
#promo li {
	list-style-type:none;
	margin-left:0
	}		
dt {font-weight:bold;}

code {font-size:1.25em;}
* html code {font-size:1.1em;} /* default size is smaller in IE */
	
cite {
	font-size:.85em;
	font-style:italic;
	}
blockquote {
	border-top:2px solid;
	border-bottom:2px solid;
	width:50%;
	margin:1em 0 1em 20%;
	padding:.3em 1em;
	}
blockquote p {
	margin-bottom:.1em;
	}
blockquote p:before { /* IDWIMIE 6 and 7 */
	content: open-quote;
	color:#cccc8f;
}
blockquote p:after {  /* IDWIMIE 6 and 7 */
	content: close-quote;
	color:#366;
}
blockquote cite {
	font-size:.85em;
	}
abbr, acronym {
	border-bottom:1px dashed #000;
	cursor:default;
	}
address {
	margin:0 1em .75em 1em;
	}
img {
	border:0;
	}


/* THE ALSETT CLEARING METHOD */
	.clearfix:after {
 content: “.”;
 display: block; 
 height: 0;
 clear: both;
 visibility: hidden;
}
.clearfix {display: inline-table;}
/* backslash hack hides from IE mac \*/ LEAVE THIS COMMENT RIGHT HERE! 
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* end backslash hack */ 
b.niftycorners,b.niftyfill{display:block}
b.niftycorners *{display:block;height: 1px;line-height:1px;font-size: 1px;
    overflow:hidden;border-style:solid;border-width: 0 1px}
/*normal*/
b.r1{margin: 0 3px;border-width: 0 2px}
b.r2{margin: 0 2px}
b.r3{margin: 0 1px}
b.r4{height: 2px}
b.rb1{margin: 0 8px;border-width:0 2px}
b.rb2{margin: 0 6px;border-width:0 2px}
b.rb3{margin: 0 5px}
b.rb4{margin: 0 4px}
b.rb5{margin: 0 3px}
b.rb6{margin: 0 2px}
b.rb7{margin: 0 1px;height:2px}
b.rb8{margin: 0;height:2px}
b.rs1{margin: 0 1px}
/*transparent inside*/
b.t1{border-width: 0 5px}
b.t2{border-width: 0 3px}
b.t3{border-width: 0 2px}
b.t4{height: 2px}
b.tb1{border-width: 0 10px}
b.tb2{border-width: 0 8px}
b.tb3{border-width: 0 6px}
b.tb4{border-width: 0 5px}
b.tb5{border-width: 0 4px}
b.tb6{border-width: 0 3px}
b.tb7{border-width: 0 2px;height:2px}
b.tb8{border-width: 0 1px;height:2px}
b.ts1{border-width: 0 2px}



.arrowlistmenu{
width: 180px; /*width of accordion menu*/

}

.arrowlistmenu .menuheader{ /*CSS class for menu headers in general (expanding or not!)*/
font: bold 14px Arial;
color: white;
background:url(images/stencils.jpg) repeat-x center left;
margin-bottom: 5px; /*bottom spacing between header and rest of content*/
text-transform: uppercase;
padding:2em 0 4px 10px; /*header text is indented 10px*/
cursor: hand;
cursor: pointer;
}

.arrowlistmenu .openheader{ /*CSS class to apply to expandable header when it's expanded*/
background-image: url(images/stencils.jpg);
}

.arrowlistmenu ul{ /*CSS for UL of each sub menu*/
list-style-type: none;
margin: 0;
padding: 0;
margin-bottom: 8px; /*bottom spacing between each UL and rest of content*/
text-decoration: none;
}

.arrowlistmenu ul li{
padding-bottom: 2px; /*bottom spacing between menu items*/
text-decoration: none;
}

.arrowlistmenu ul li a{
color: #D77069;
background: url(arrowbullet.png) no-repeat center left; /*custom bullet list image*/
display: block;
padding: 2px 0;
text-decoration: none;
text-align:right;
font-weight: bold;
border-bottom: 1px solid #dadada;
font-size: 1.2em;
}

.arrowlistmenu ul li a:visited{
color: #D77069;
text-decoration: none;
}

.arrowlistmenu ul li a:hover{ /*hover state CSS*/
color: #D77069;
background-color: #FFFFFF;
text-decoration: none;
}

-------------------------------------------------------------------------------------------------------------------------------------------------------
#myGallery, #myGallerySet, #flickrGallery
{
	width: 470px;
	height: 353px;
	z-index:5;
	border: 1px solid #000;
}

#flickrGallery
{
	width: 470px;
	height: 353px;
}

#myGallery img.thumbnail, #myGallerySet img.thumbnail
{
	display: none;
}

.jdGallery
{
	overflow: hidden;
	position: relative;
}

.jdGallery img
{
	border: 0;
	margin: 0;
}

.jdGallery .slideElement
{
	width: 100%;
	height: 100%;
	background-color: #000;
	background-repeat: no-repeat;
	background-position: center center;
	background-image: url('img/loading-bar-black.gif');
}

.jdGallery .loadingElement
{
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	background-color: #000;
	background-repeat: no-repeat;
	background-position: center center;
	background-image: url('img/loading-bar-black.gif');
}

.jdGallery .slideInfoZone
{
	position: absolute;
	z-index: 10;
	width: 100%;
	margin: 0px;
	left: 0;
	bottom: 0;
	height: 40px;
	background: #333;
	color: #fff;
	text-indent: 0;
	overflow: hidden;
}

* html .jdGallery .slideInfoZone
{
	bottom: -1px;
}

.jdGallery .slideInfoZone h2
{
	padding: 0;
	font-size: 80%;
	margin: 0;
	margin: 2px 5px;
	font-weight: bold;
	color: inherit;
}

.jdGallery .slideInfoZone p
{
	padding: 0;
	font-size: 60%;
	margin: 2px 5px;
	color: #eee;
}

.jdGallery div.carouselContainer
{
	position: absolute;
	height: 135px;
	width: 100%;
	z-index: 10;
	margin: 0px;
	left: 0;
	top: 0;
}

.jdGallery a.carouselBtn
{
	position: absolute;
	bottom: 0;
	right: 30px;
	height: 20px;
	/*width: 100px; background: url('img/carousel_btn.gif') no-repeat;*/
	text-align: center;
	padding: 0 10px;
	font-size: 13px;
	background: #333;
	color: #fff;
	cursor: pointer;
}

.jdGallery .carousel
{
	position: absolute;
	width: 100%;
	margin: 0px;
	left: 0;
	top: 0;
	height: 115px;
	background: #333;
	color: #fff;
	text-indent: 0;
	overflow: hidden;
}

.jdExtCarousel
{
	overflow: hidden;
	position: relative;
}

.jdGallery .carousel .carouselWrapper, .jdExtCarousel .carouselWrapper
{
	position: absolute;
	width: 100%;
	height: 78px;
	top: 10px;
	left: 0;
	overflow: hidden;
}

.jdGallery .carousel .carouselInner, .jdExtCarousel .carouselInner
{
	position: relative;
}

.jdGallery .carousel .carouselInner .thumbnail, .jdExtCarousel .carouselInner .thumbnail
{
	cursor: pointer;
	background: #000;
	background-position: center center;
	float: left;
	border: solid 1px #fff;
}

.jdGallery .wall .thumbnail, .jdExtCarousel .wall .thumbnail
{
	margin-bottom: 10px;
}

.jdGallery .carousel .label, .jdExtCarousel .label
{
	font-size: 13px;
	position: absolute;
	bottom: 5px;
	left: 10px;
	padding: 0;
	margin: 0;
}

.jdGallery .carousel .wallButton, .jdExtCarousel .wallButton
{
	font-size: 10px;
	position: absolute;
	bottom: 5px;
	right: 10px;
	padding: 1px 2px;
	margin: 0;
	background: #222;
	border: 1px solid #888;
	cursor: pointer;
}

.jdGallery .carousel .label .number, .jdExtCarousel .label .number
{
	color: #b5b5b5;
}

.jdGallery a
{
	font-size: 100%;
	text-decoration: none;
	color: inherit;
}

.jdGallery a.right, .jdGallery a.left
{
	position: absolute;
	height: 99%;
	width: 25%;
	cursor: pointer;
	z-index:10;
	filter:alpha(opacity=20);
	-moz-opacity:0.2;
	-khtml-opacity: 0.2;
	opacity: 0.2;
}

* html .jdGallery a.right, * html .jdGallery a.left
{
	filter:alpha(opacity=50);
}

.jdGallery a.right:hover, .jdGallery a.left:hover
{
	filter:alpha(opacity=80);
	-moz-opacity:0.8;
	-khtml-opacity: 0.8;
	opacity: 0.8;
}

.jdGallery a.left
{
	left: 0;
	top: 0;
	background: url('img/fleche1.png') no-repeat center left;
}

* html .jdGallery a.left { background: url('img/fleche1.gif') no-repeat center left; }

.jdGallery a.right
{
	right: 0;
	top: 0;
	background: url('img/fleche2.png') no-repeat center right;
}

* html .jdGallery a.right { background: url('img/fleche2.gif') no-repeat center right; }

.jdGallery a.open
{
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}

.withArrows a.open
{
	position: absolute;
	top: 0;
	left: 25%;
	height: 99%;
	width: 50%;
	cursor: pointer;
	z-index: 10;
	background: none;
	-moz-opacity:0.8;
	-khtml-opacity: 0.8;
	opacity: 0.8;
}

.withArrows a.open:hover { background: url('img/open.png') no-repeat center center; }

* html .withArrows a.open:hover { background: url('img/open.gif') no-repeat center center;
	filter:alpha(opacity=80); }
	
	
/* Gallery Sets */

.jdGallery a.gallerySelectorBtn
{
	z-index: 15;
	position: absolute;
	top: 0;
	left: 30px;
	height: 20px;
	/*width: 100px; background: url('img/carousel_btn.gif') no-repeat;*/
	text-align: center;
	padding: 0 10px;
	font-size: 13px;
	background: #333;
	color: #fff;
	cursor: pointer;
	opacity: .4;
	-moz-opacity: .4;
	-khtml-opacity: 0.4;
	filter:alpha(opacity=40);
}

.jdGallery .gallerySelector
{
	z-index: 20;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	background: #000;
}

.jdGallery .gallerySelector h2
{
	margin: 0;
	padding: 10px 20px 10px 20px;
	font-size: 20px;
	line-height: 30px;
	color: #fff;
}

.jdGallery .gallerySelector .gallerySelectorWrapper
{
	overflow: hidden;
}

.jdGallery .gallerySelector .gallerySelectorInner div.galleryButton
{
	margin-left: 10px;
	margin-top: 10px;
	border: 1px solid #888;
	padding: 5px;
	height: 40px;
	color: #fff;
	cursor: pointer;
	float: left;
}

.jdGallery .gallerySelector .gallerySelectorInner div.hover
{
	background: #333;
}

.jdGallery .gallerySelector .gallerySelectorInner div.galleryButton div.preview
{
	background: #000;
	background-position: center center;
	float: left;
	border: none;
	width: 40px;
	height: 40px;
	margin-right: 5px;
}

.jdGallery .gallerySelector .gallerySelectorInner div.galleryButton h3
{
	margin: 0;
	padding: 0;
	font-size: 12px;
	font-weight: normal;
}

.jdGallery .gallerySelector .gallerySelectorInner div.galleryButton p.info
{
	margin: 0;
	padding: 0;
	font-size: 12px;
	font-weight: normal;
	color: #aaa;
}

#myGallery
{
width: 470px !important;
height: 353px !important;
}