/** style.css **/
/** overall Styles **/
html, body, div{ margin: 0; padding: 0; font-family: Palatino, 'Palatino Linotype', 'Palatino LT STD', 'Book Antiqua', Georgia, serif; font-size: 12pt;}

h1, h2, h3, h4, h5, h6{font-family: 'Lobster', cursive; margin: 0; padding: 0; line-height: 1em; margin-top: 10px;}
p, em{margin: 0; padding: 10px 5px; line-height: 1.4em;}
.right {float: right;}
a {color: #f3da5b;}
a:hover {color: #fff;}


ul {margin: 0; padding: 10px 0 10px 20px;}
ol {margin: 0; padding: 10px 0 10px 25px;}
li {padding-bottom: 5px;}
h1, h2, h3, h4, h5, h6 {margin-bottom: 10px;}
h1 {font-size: 40pt;}
h2 {font-size: 32pt;}
h3 {font-size: 28pt;}
h4 {font-size: 24pt;}
h5 {font-size: 20pt;}
h6 {font-size: 17pt;}

.ie a img {border: none;}

html, body {height: 100%;}

body {background: url('img/bg.jpg') top left;}

#wrapper {position: relative; width: 100%; min-height: 580px; margin: 0; padding: 0;}

/* menu styles */
#menu{width: 241px; position: absolute; left: 20px; top: 20px; }
#menulinks {}

#logo {text-align: center; display: block;}

#menubutton {display: none;}

.floatwidth {width: 227px;}

.topleftcorneryellow {width: 7px; height: 7px; background: url('img/yellow-corner-fabric.png') top left no-repeat; float: left;}
.topbaryellow {height: 7px; background: url('img/yellow-upper-fabric.jpg') top left; float: left;}
.toprightcorneryellow {width: 7px; height: 7px; background: url('img/yellow-corner-fabric.png') top right no-repeat; float: left;}
.leftbaryellow {width: 7px; background: url('img/yellow-left-fabric.jpg') top left; display: table-cell;}

.mainzoneyellow {background: url('img/yellow-fabric-bg.jpg'); display: table-cell;}
.topinnerred {height: 13px; background: url('img/red-hor-stitch.png') top left repeat-x;}
.leftinnerred {width: 13px; display: table-cell; background: url('img/red-vert-stitch.png') top left repeat-y;}
.content {display: table-cell;}
.rightinnerred {width: 13px; display: table-cell; background: url('img/red-vert-stitch.png') top right repeat-y;}
.botinnerred {height: 13px; background: url('img/red-hor-stitch.png') bottom left repeat-x;}

.rightbaryellow {width: 7px; background: url('img/yellow-right-fabric.jpg') top left; display: table-cell;}
.botleftcorneryellow {width: 7px; height: 7px; background: url('img/yellow-corner-fabric.png') bottom left no-repeat; float: left;}
.botbaryellow {height: 7px; float: left; background: url('img/yellow-lower-fabric.jpg') top left;}
.botrightcorneryellow {width: 7px; height: 7px; background: url('img/yellow-corner-fabric.png') bottom right no-repeat; float: left;}

/* menu links */ 
#footerlinks, #menulinks {list-style: none; padding: 10px 0 0;}
.button-link, #footerlinks li a, #menulinks li a{ 
		background-color: #692f5e;
		display: block;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		border-radius: 5px;
		height: 29px;
		text-decoration: none;
		color: #fff;
		}
.button-link:hover, #footerlinks li a:hover, #menulinks li a:hover{
		height: 26px;
		margin-top: 3px;
		background-color: #883e7a;
		}
.button-link:hover span, #footerlinks li a:hover span, #menulinks li a:hover span{
		background-color: #af4f9d;
		}		
		
.button-link span, #footerlinks li a span, #menulinks li a span{ 
		background-color: #883e7a;
		display: block;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		border-radius: 5px;
		padding: 5px 0 3px 13px;
		}



#menu .content p {padding: 5px 0px 0px; text-align:center;}
#menu .content h2 {line-height: .7em;}
#facebook {position: relative; padding-left: 36px !important;}
#facebook img {position: absolute; top: -2px; left: -1px;}


/**** footer styles ****/
#footer{ position: static; height: 93px; width: 100%; max-width: 1325px;}

#fade {height:0px;}
#bottom {height: 85px; width: 100%; display: table;}
#ribbon {display: table-cell; height: 65px; background: url('img/ribbon.jpg') top right repeat-x; vertical-align: top;}
#ribbonend {display: table-cell; height: 65px; width: 40px; background: url('img/ribbon-end.png') top left no-repeat;}
#lowfade {display: none;}


#footerlinks li{ float: left; margin-left: 1.25%; width: 13%;}
#footerlinks li a {height: 45px; background-color: #51171e;}
#footerlinks li a span {padding: 13px 0px 11px 0px; background-color: #6d1f29; text-align: center;}
#footerlinks li a:hover {height: 42px; background-color: #51171e;}
#footerlinks li a:hover span{ background-color: #6d1f29;}



#wigglet {background: url("img/wiggleticon.jpg") 10px center no-repeat;}
#fantasy {background: url("img/fantasyicon.jpg") 10px center no-repeat;}
#beholder {background: url("img/beholdericon.jpg") 10px center no-repeat;}
#animal {background: url("img/animalicon.jpg") 10px center no-repeat;}
#uniform {background: url("img/uniformicon.jpg") 10px center no-repeat;}
#purse {background: url("img/purseicon.jpg") 10px center no-repeat;}
#other {background: url("img/othericon.jpg") 10px center no-repeat;}

.footerpos{position: fixed !important; bottom: 0; left: 0;}
.footerpos #fade{background: url("img/bg-fade.png") bottom left repeat-x !important; height: 12px;}
.footerpos #bottom {background: url("img/bg.jpg") top left;}
/*** content area ***/

#content {margin-left: 281px; padding-top: 20px; padding-bottom: 20px; max-width: 1045px;}

/* dynamic width content area. */ 
#maincontentwindow{width: 1034px; margin-bottom: 20px;}
#productwindow {width: 241px; margin: 0px 20px 20px 0; float: left; text-align: center;}
#productwindow .imagediv {height: 100px; margin-bottom: 10px;}
#productwindow .helper {display: inline-block; height: 100%; vertical-align: middle; width: 0px;}
#productwindow img {max-width: 181px; max-height: 100%; vertical-align: middle;}
.button-link {text-align: center;}
.button-link span {padding-left: 0;}
#productwindow .button-link:hover {margin-top: 13px;}

#imagewindow {margin: 0px 100px 20px;}

.contentfloatwidth {width: 1020px;}

.topleftcornerpurple {width: 7px; height: 7px; background: url('img/purple-corner-fabric.png') top left no-repeat; float: left;}
.topbarpurple {height: 7px; background: url('img/purple-upper-fabric.jpg') top left; float: left;}
.toprightcornerpurple {width: 7px; height: 7px; background: url('img/purple-corner-fabric.png') top right no-repeat; float: left;}
.leftbarpurple {width: 7px; background: url('img/purple-left-fabric.jpg') top left; display: table-cell;}

.mainzonepurple {background: url('img/purple-fabric-bg.jpg'); display: table-cell;}
.topinnerpurple {height: 13px; background: url('img/purp-hor-stitch.png') top left repeat-x;}
.leftinnerpurple {width: 13px; display: table-cell; background: url('img/purp-vert-stitch.png') top left repeat-y;}
#productwindow .content, #maincontentwindow .content {display: table-cell; color: #fff;}
.rightinnerpurple {width: 13px; display: table-cell; background: url('img/purp-vert-stitch.png') top right repeat-y;}
.botinnerpurple {height: 13px; background: url('img/purp-hor-stitch.png') bottom left repeat-x;}

.rightbarpurple {width: 7px; background: url('img/purple-right-fabric.jpg') top left; display: table-cell;}
.botleftcornerpurple {width: 7px; height: 7px; background: url('img/purple-corner-fabric.png') bottom left no-repeat; float: left;}
.botbarpurple {height: 7px; float: left; background: url('img/purple-lower-fabric.jpg') top left;}
.botrightcornerpurple {width: 7px; height: 7px; background: url('img/purple-corner-fabric.png') bottom right no-repeat; float: left;}


/** product area **/
#imagearea{width: 63%; padding-right: 2%; display: table-cell; vertical-align: top; background: url('img/red-vert-stitch.png') top right repeat-y;}
#imagearea div {text-align: center;}
#imagearea img{max-width: 627px;}
.thumbnails{}
.thumbnails ul {margin: 20px 0 0; padding: 0;}
.thumbnails li {display: inline-block; list-style-type: none; padding: 0 5px;}
#productinfoarea{width: 34%; padding-left: 1%; display: table-cell; vertical-align: top;}
#productinfoarea table {padding: 10px 0; width: 100%;}
#productinfoarea table th {text-align: left; width: 45%; padding: 5px 0;}
#productinfoarea table td {padding: 5px 0;}
#productinfoarea .button-link {max-width: 241px;}

/** swatch area **/
.swatch {display: inline-block; float: left; position: static;}
.swatch img{display: block; width: 76px;}
.swatch h6 {display: none;}

#swatchblock {position: absolute; z-index: 900; width: 275px; padding: 2px; background-color: #000; display: none;}
.ie #swatchblock {padding: 2px 2px 0;}
#swatchblock h6 {position: absolute; top: 10px; left: 20px;}
h6.light {color: #000;}

/** Responsive Styles **/
@media screen and (max-width: 1327px) {
	#maincontentwindow{width: 995px;}
	.contentfloatwidth {width: 981px;}
	#imagewindow {margin: 0px 80px 20px;}
	
	#imagearea img{max-width: 627px;}
	.swatch img{width: 73px;}
}

@media screen and (max-width: 1280px) {
	#maincontentwindow{width: 955px;}
	.contentfloatwidth {width: 941px;}
	#imagewindow {margin: 0px 60px 20px;}
	
	#imagearea img{max-width: 575px;}
	.swatch img{width: 75px;}
}
@media screen and (max-width: 1240px) {
	#maincontentwindow{width: 915px;}
	.contentfloatwidth {width: 901px;}
	#imagewindow {margin: 0px 40px 20px;}
	
	#imagearea img{max-width: 545px;}
	.swatch img{width: 73px;}
}
@media screen and (max-width: 1200px) {
	#maincontentwindow{width: 875px;}
	.contentfloatwidth {width: 861px;}
	#imagewindow {margin: 0px 20px 20px;}
	
	#imagearea img{max-width: 520px;}
	.swatch img{width: 75px;}
}
@media screen and (max-width: 1160px) {
	#maincontentwindow{width: 835px;}
	.contentfloatwidth {width: 821px;}
	#imagewindow {margin: 0px 0px 20px;}
	
	#imagearea img{max-width: 495px;}
	.swatch img{width: 72px;}
}
@media screen and (max-width: 1120px) {
	#maincontentwindow{width: 795px;}
	.contentfloatwidth {width: 781px;}
	
	#imagearea img{max-width: 465px;}
	.swatch img{width: 74px;}
}
@media screen and (max-width: 1080px) {
	#maincontentwindow{width: 755px;}
	.contentfloatwidth {width: 741px;}
	
	#imagearea img{max-width: 446px;}
	.swatch img{width: 71px;}
}
@media screen and (max-width: 1040px) {
	#maincontentwindow{width: 715px;}
	.contentfloatwidth {width: 701px;}
	
	#imagearea img{max-width: 423px;}
	.swatch img{width: 74px;}
}
@media screen and (max-width: 1000px) {
	#maincontentwindow{width: 675px;}
	.contentfloatwidth {width: 661px;}
	
	#imagearea{display: block; width: 100%; margin-bottom: 20px; background-image: none; padding: 0;}
	#productinfoarea{display: block; width: 100%; padding: 0;}
	
	#imagearea img{max-width: 640px;}
	.swatch img{width: 77px;}
	
}
@media screen and (max-width: 960px) {
	#maincontentwindow{width: 635px;}
	.contentfloatwidth {width: 621px;}

	#imagearea img{max-width: 585px;}
	.swatch img{width: 73px;}
}
@media screen and (max-width: 920px) {
	#maincontentwindow{width: 595px;}
	.contentfloatwidth {width: 581px;}
	
	#imagearea img{max-width: 550px;}
	.swatch img{width: 77px;}
}
@media screen and (max-width: 880px) {
	#maincontentwindow{width: 555px;}
	.contentfloatwidth {width: 541px;}
	
	#imagearea img{max-width: 510px;}
	.swatch img{width: 73px;}
}
@media screen and (max-width: 840px) {
	#maincontentwindow{width: 515px;}
	.contentfloatwidth {width: 501px;}
	
	#imagearea img{max-width: 465px;}
	.swatch img{width: 79px;}
}
@media screen and (max-width: 800px) {
	#maincontentwindow{width: 475px;}
	.contentfloatwidth {width: 461px;}
	
	#imagearea img{max-width: 425px;}
	.swatch img{width: 72px;}
}
@media screen and (max-width: 760px) {
	#maincontentwindow{width: 435px;}
	.contentfloatwidth {width: 421px;}
	
	#imagearea img{max-width: 395px;}
	.swatch img{width: 75px;}
}
@media screen and (max-width: 720px) {
	#maincontentwindow{width: 395px;}
	.contentfloatwidth {width: 381px;}
	
	#imagearea img{max-width: 350px;}
	.swatch img{width: 70px;}
}
@media screen and (max-width: 680px) {
	/* here is where the footer needs to change */
	#maincontentwindow{width: 355px;}
	.contentfloatwidth {width: 341px;}
	#ribbonend {display: none;}
	
	#imagearea img{max-width: 310px;}
	.swatch img{width: 73px;}
}
@media screen and (max-width: 640px) {
	#maincontentwindow{width: 315px;}
	.contentfloatwidth {width: 301px;}
	
	#imagearea img{max-width: 270px;}
	.swatch img{width: 70px;}
	
	#swatchblock {width: 230px;}
	#swatchblock img{width: 230px;}
}
@media screen and (max-width: 600px) {
	#maincontentwindow{width: 275px;}
	.contentfloatwidth {width: 261px;}
	
	#wrapper {min-height: 580px;}
	#footer{height: auto;}
	#fade {height: 7px; background: url('img/purple-upper-fabric.jpg') top left; clear: both;}
	#bottom {background: url('img/purple-fabric-bg.jpg'); padding-bottom: 4px;}
	#lowfade{display: block; width: 100%; height: 7px; background: url('img/purple-lower-fabric.jpg') top left;}
	#ribbon {background-image: none;}
	#footerlinks li{ margin-left: 2%; width: 30%; display: block; float: left;}
	#productinfoarea h1 {font-size: 30pt;}
	.thumbnails img {width: 80px;}
	
	#imagearea img{max-width: 230px;}
	.swatch img{width: 77px;}
	
	#swatchblock {width: 207px;}
	#swatchblock img{width: 207px;}
}
@media screen and (max-width: 560px) {
	#maincontentwindow{width: 241px;}
	.contentfloatwidth {width: 227px;}
	
	#imagearea img{max-width: 200px;}
	.swatch img{width: 70px;}
}
@media screen and (max-width: 522px) {
	/* here is where the mobile design will begin. */
	#wrapper {min-height: 100px;}
	#footerlinks li{ margin-left: 0; width: 100%;}
	
	#menu {position: static; display: block; margin: 0 0 10px; width: 100% !important; }
	#menu p {display: none;}
	.botbaryellow {width: 100% !important;}
	.topleftcorneryellow, .topbaryellow, .toprightcorneryellow, .leftbaryellow, .topinnerred, .leftinnerred, .rightinnerred, .rightbaryellow, .botleftcorneryellow, .botrightcorneryellow {display: none;}

#content {padding-bottom: 0px;}

#imagearea img{max-width: 256px;}

.mainzoneyellow {width: 100%; display: block; padding-top: 10px;}
.content {width: 300px; display: block; margin: 0 auto;}
	#menu h2 {display: none;}
	#logo {display: inline;}
	#logo img{height: 80px;}
	#menulinks {display: none;}
	
	#menubutton{display: block; float: right;}
	
	#menubutton{ 
		display: block;
		text-decoration: none;
		color: #fff;
		}
	#menubutton:hover{

		}
	#menubutton:hover span{
		background-color: #af4f9d;
		-webkit-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 5px;
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright: 5px;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
		}		
		
	#menubutton span{ 
		background-color: #883e7a;
		display: block;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		border-radius: 5px;
		padding: 32px 20px 30px;
		}
	
	#content{width: 300px; margin: 0 auto; }
	#footer {position: static;}
	#ribbon {width: 300px; display: block; margin: 0 auto;}
	.contentfloatwidth, .floatwidth {width: 286px;}
	#maincontentwindow, #productwindow, #menu{width: 300px;}
	.highlight {background-color: #af4f9d !important;}
	
#menulinks li a{ 
		height: 39px;
		}
#menulinks li a:hover{
		height: 36px;
		}
#menulinks li a span{ 
		padding: 10px 0 8px 13px;
		}
#facebook {padding-left: 42px !important;}
#facebook img {top: 3px; left: 6px;}
.swatch img{width: 88px;}

	#swatchblock {width: 260px;}
	#swatchblock img{width: 260px;}
}



/* last part preload */
body:after{
    display: none;
    content: url("img/logo.png");
}

204-774-3228