﻿/*   GLOBAL SETTINGS
-------------------------------------------------------------------------*/

body {
	margin: 0;
	padding: 0;
	font-family: Arial, Verdana, Tahoma, Geneva, Helvetica, sans-serif;
	font-size: 12px;
	text-align: left;
	color: #333;
	background: #fff url(images/bg_body.gif) left repeat-y;
	min-width: 700px;
	}

.access {display: none; }
.center { text-align: center; }
img { border: 0; }


/*   GENERAL TEXT FORMAT SETTINGS
-------------------------------------------------------------------------*/

p, td, ul, ol, li, h1, h2, h3, h4, h5, h6 {
	font-family: Arial, Verdana, Tahoma, Geneva, Helvetica, sans-serif;
	}

p, td, ul, ol, li  { 
	color: #333;
	font-size: 12px;
	margin-top: 10px;
}
	
hr {
	clear: both;
	height: 1px;
	width: 100%;
	color: #ccc;
	background-color: #ccc;
	text-align: center;
	}

h1 {
	text-align: center;
	text-transform: uppercase;
	font-size: 20px;
	font-weight: bold;
	color: #a00;
	line-height: 115%;
	}

h1 em {
	font-size: 16px;
	font-weight: bold;
	}
	
h2 {
	font-size: 14px;
	font-weight: bold;
	color: #c00;
	margin: 10px 0 3px 0;
	}

h2 a:link {
	font-size: 14px;
	font-weight: bold;
	color: #00f;
	}
	
h3 {
	font-size: 14px;
	font-weight: bold;
	color: #000;
	margin: 0;
	}
	
h4 {
	font-size: 16px;
	font-weight: bold;
	color: #65B21C;
	margin: 0;
	}

h5 {
	font-size: 16px;
	font-weight: bold;
	color: #c00;
	margin: 0;
	}

h6 {
	font-size: 13px;
	color: #a00;
	margin: 0;
	}

h6.about {
	font-size: 10px;
	color: #65B21C;
	margin: 0;
	}

a:link {
	color: #00f;
	text-decoration: underline;
	}

a:visited {
	color: #808;
	text-decoration: underline;
	}

a:hover, a:active {
	color: #00f;
	text-decoration: underline;
	}
	
.scroll { color: #003300; font-size: 11px; }

.scrolldown { color: #003300; font-size: 11px; font-weight: bold; }

.orderinst { color: #003300; font-size: 11px; }
.orderinst:hover { color: #003300; font-size: 13px; }

p.info {
	color: #e00;
	font-size: 13px;
	font-weight: bold;
	}

strong.pricing {
	color: #e00;
	font-size: 13px;
	}

strong.pair {
	color: #000000;
	font-size: 13px;
	}

strong.lacescolor {
	color: #0000FF;
	font-size: 12px;
	}

table.lacesnav a {
	line-height: 28px;
	color: #ff2;
	font-size: 16px;
	text-decoration: none;
	font-weight: bold;
	}

table.lacesnav a:hover {
	line-height: 28px;
	color: #65b21c;
	font-size: 16px;
	text-decoration: underline;
	font-weight: bold;
	}

table.lacesgrp a {
	line-height: 20px;
	text-align: center;
	font-size: 16px;
	font-weight: bold;
	color: #D2000C;
	}

a.wcg {
	font-size: 10px;
	font-style: italic;
	}

/*   INDEX PAGE LINKS AREA - CONTROLS LAYOUT AND PLACEMENT OF BODY TEXT
-------------------------------------------------------------------------*/

#indexlinks a {
	font-size: 16px;
	font-weight: bold;
	color: #65B21C;
	text-decoration: none;
	margin: 0;
	}

#indexlinks a:hover {
	font-size: 16px;
	font-weight: bold;
	color: #65B21C;
	text-decoration: underline;
	margin: 0;
	}
table.indexlinks a {
	color: #000;
	text-decoration: none;
	font-weight: bold;
	}

table.indexlinks a:hover {
	color: #000;
	text-decoration: underline;
	font-weight: bold;
	}
#indexlinksbtd a {
	font-size: 16px;
	font-weight: bold;
	color: #65B21C;
	text-decoration: none;
	margin: 0;
	}

#indexlinksbtd a:hover {
	font-size: 16px;
	font-weight: bold;
	color: #65B21C;
	text-decoration: underline;
	margin: 0;
	}

#indexlinksbtd img {
	float: none;
	padding: 0px;
	padding-right: 0;
	margin: 0px;
	margin-right: 0;
	width:300px;
	height:auto;
	}


/*   INDEX PAGE with images - CONTROLS LAYOUT AND PLACEMENT OF BODY TEXT
-------------------------------------------------------------------------*/
table.index2 {
	width: 100%;
}

td.index2 {
	width: 50%;
	vertical-align: middle;
	text-align: center;
}

#indexlinks2 a {
	font-size: 16px;
	font-weight: bold;
	color: #65B21C;
	text-decoration: none;
	margin: 0;
	}

#indexlinks2 a:hover {
	font-size: 16px;
	font-weight: bold;
	color: #65B21C;
	text-decoration: underline;
	margin: 0;
	}

/*   MENU INDEX PAGE with images - CONTROLS LAYOUT AND PLACEMENT OF BODY TEXT
-------------------------------------------------------------------------*/
table.menuindex {
	width: 100%;
}

td.menuindex {
	width: 33%;
	vertical-align: middle;
	text-align: center;
}

#menuindexlinks a {
	font-size: 16px;
	font-weight: bold;
	color: #65B21C;
	text-decoration: none;
	margin: 0;
	}

#menuindexlinks a:hover {
	font-size: 16px;
	font-weight: bold;
	color: #65B21C;
	text-decoration: underline;
	margin: 0;
	}

/*   MAIN CONTENT AREA - CONTROLS LAYOUT AND PLACEMENT OF BODY TEXT
-------------------------------------------------------------------------*/

#content {
	position: absolute;
	z-index: 4;
	top: 180px;
	left: 177px;
	width: 623px;
	background: transparent url(images/quality2.gif) top left no-repeat;
	}

#maincontent {
	padding: 35px 15px 0 15px;
	}
	
#maincontent img {
	float: none;
	padding: 0px;
	padding-right: 0;
	margin: 0px;
	margin-right: 0;
	}

#maincontent img.llleft {
	float: left;
	padding: 0px;
	padding-right: 0;
	margin: 0px;
	margin-right: 0;
	}

#maincontent img.lllogo {
	float: none;
	padding: 0px;
	padding-right: 0;
	margin: 0px;
	margin-right: 0;
	}

#maincontent img.llright {
	float: right;
	padding: 0px;
	padding-right: 0;
	margin: 0px;
	margin-right: 0;
	}
	
#maincontent img.static {
	display: block;
	float: none;
	}

#maincontent table.split {
	text-align: left;

	}

#maincontent li h3 {
	display: inline;
	font-size: 12px;
	color: #444;
	}

.pcartbutton {
	text-align: center;
	}

input.button {
	background-color:red;
	}

input.cartbutton {
	background-color:red;
	}

.cartbutton {
	text-align: center;
	font-family: Arial, Verdana, Tahoma, Geneva, Helvetica, sans-serif;
	font-size: 40px;
	font-weight: bold;
	}

#maincontent .shoetype {
	color: #000000;
	font-size: 12px;
	font-weight: bold;
	background-color:#FFFF00
}

/*
.cartbutton {
	text-align: center;
	margin: 40px auto;
	}
*/
/*   CARTCODE AREA - DEFINES SETTINGS FOR PAGE CARTCODE AREA, ETC.
-------------------------------------------------------------------------*/
#cartcode h2 {
	font-size: 16px;
	font-weight: bold;
	color: #65B21C;
	margin: 0;
	}

#cartcode h4 {	
	font-size: 18px;
	font-weight: bold;
	color: #000;
	margin: 0;
	}
	
#cartcode h6 {
	font-size: 9px;
	color: #65B21C;
	margin: 0;
	}

#cartcode table {
	width: auto;
	text-align:center;
	margin:auto;
}

#cartcode img {
	float: none;
	padding-right: 0;
	margin-right: 0;
	margin-left: 0px;
	margin-top: 0px;
	margin-bottom: 0px;
	padding-left: 0px;
	padding-top: 0px;
	padding-bottom: 0px;
}

#cartcode td.tips {
	background-color: #FF0000;
	text-align:center;
}

#cartcode .tips {
	color: #FFFFFF;
	font-size: 13px;
	font-weight: bold;
}
#cartcode td.colorlength {
	background-color: #65B21C;
	text-align:center;
}
#cartcode .colorlength {
	color: #000000;
	font-size: 12px;
	font-weight: bold;
}

#cartcode td.pairpackbar1 {
	background-color: #65B21C;
	text-align:center;
}
#cartcode .pairpackbar1 {
	color: #000000;
	font-size: 14px;
	font-weight: bold;
}

#cartcode td.pairpackbar2 {
	background-color: #65B21C;
	text-align:center;
}
#cartcode .pairpackbar2 {
	color: #000000;
	font-size: 14px;
	font-weight: bold;
}
#cartcode .spanpair2 {
	color: #000000;
	font-size: 14px;
	font-weight: bold;
	background-color:#65B21C;
}
#cartcode td.pairpackbar12 {
	background-color: #65B21C;
	text-align:center;
}
#cartcode .pairpackbar12 {
	color: #000000;
	font-size: 14px;
	font-weight: bold;
}
#cartcode .spanpair12 {
	color: #000000;
	font-size: 14px;
	font-weight: bold;
	background-color:#65B21C;
}
#cartcode .spanpair1 {
	color: #000000;
	font-size: 14px;
	font-weight: bold;
	background-color:#65B21C;
}

#cartcode td.pair2 {
	background-color: #D3BD8E;
	text-align:center;
}
#cartcode td.pair1 {
	background-color: #FCF781;
	text-align:center;
}
#cartcode td.pair12 {
	background-color: #99CCFF;
	text-align:center;
}

#cartcode table.productinfo {
	border: 0px;
	text-align:center;
	margin:auto;
	width: 95%;
}

#cartcode td.productinfo {
	border:0px;
	text-align:center;
}

#cartcode td.productimg {
	border:0px;
	text-align:right;
	margin:	auto;
}


/*   Buy the Dozen PRODUCTS AREA - DEFINES SETTINGS FOR PAGE CARTCODE AREA, ETC.
-------------------------------------------------------------------------*/
#products td.length {	
	font-size: 14px;
	font-weight: bold;
	color: #FFFFFF;
	margin: 0;
	background-color: #FF0000;
}
	
#products h2 {	
	font-size: 14px;
	font-weight: bold;
	color: #000;
	margin: 0;
	}
	
#products h3 {	
	font-size: 16px;
	font-weight: bold;
	color: #FF0000;
	margin: 0;
	}
	
#products h4 {	
	font-size: 12px;
	font-weight: bold;
	color: #000;
	margin: 0;
	}
	
#products h5 {	
	font-size: 15px;
	font-weight: bold;
	color: #FF0000;
	margin: 0;
	}
	
#products h6 {
	font-size: 10px;
	color: #65B21C;
	margin: 0;
	}
	
#products td {
border: 1px solid #808080;
text-align:center;
}

#products table {
	border: 1px solid #808080;
	width: 100%;
	}

#products table.productinfo {
	border: 0px;
	width: auto;
	text-align:center;
	margin:auto;
	width: 95%;
}

#products td.productinfo {
	border:0px;
	text-align:center;
}

#products td.productimg {
	border:0px;
	text-align:center;
	margin:	auto;
}

table.index {
	width: 100%;
}

td.index {
	width: 100%;
vertical-align:top;
}

/*   HEADER AREA - DEFINES SETTINGS FOR PAGE HEADER, LOGO, ETC.
-------------------------------------------------------------------------*/
#header {
	position: absolute;
	z-index: 1;
	top: 0;
	left: 0;
	width: 100%;
	height: 118px;
	margin: 0;
	padding: 0;
	background: #3d1008 url(images/logo_shoelacesexpress.gif) top left no-repeat;
	}

#header img {
	position: absolute;
	top: 15px;
	left: 41%;
	}

/*   TOP NAVIGATION - CONTROLS APPEARANCE OF TOP RIGHT NAV LINKS
-------------------------------------------------------------------------*/

#topnav {
	position: absolute;
	z-index: 6;
	top: 13px;
	right: 154px;
	width: 140px;
	height: 105px;
	}
	
	
#topnav ul {
	padding: 0;
	margin: 0;
	list-style: none;
	color: #fff;
	}
	
#topnav li {
	padding: 0;
	margin: 0;
	line-height: 125%;
	color: #fff;
	}
	
#topnav a {
	color: #ff2;
	background: #3d1008 url(images/bullet-olive.gif) left no-repeat;
	padding-left: 14px;
	text-decoration: none;
	font-size: 10px;
	}

#topnav a:hover {
	color: #65b21c;
	text-decoration: none;
	}

/*   TOP Cart Summary - CONTROLS APPEARANCE OF TOP RIGHT NAV LINKS
-------------------------------------------------------------------------*/

#topcart {
	position: absolute;
	z-index: 7;
	top: 1px;
	right: 2px;
	width: 150px;
	height: 118px;
	}

#topcart img {
	position: absolute;
	top: 95px;
	left:20%;
	}
	
/*   MAIN NAVIGATION - CONTROLS APPEARANCE OF MAIN NAV LINKS BELOW HEADER
-------------------------------------------------------------------------*/

#headernav {
	position: absolute;
	z-index: 2;
	top: 118px;
	left: 0;
	height: 61px;
	width: 100%;
	background: #65b21c url(images/bg_sidestripe.gif) top left repeat-y;
	text-align: left;
	}

#headernav ul {
	margin: 0;
	margin-left: 10px;
	padding: 0;
	}

#headernav li {
	display: inline;
	margin: 0;
	padding: 0 1%;
	line-height: 28px;
	}

#headernav a {
	line-height: 28px;
	color: #ff2;
	text-decoration: none;
	font-weight: bold;
	}

#headernav a:hover {
	line-height: 28px;
	color: #d0000c;
	text-decoration: underline;
	font-weight: bold;
	}

#headernav div {
	margin-top: -6px;
	margin-left: 20px;
	margin-right: 20px;
	text-align: left;
	}

/*   SIDEBAR - CONTROLS LEFT MENU BEHAVIOUR
-------------------------------------------------------------------------*/

#sidebar {
	position: absolute;
	z-index: 3;
	top: 178px;
	left: 20px;
	padding: 5px 0 20px 3px;
	width: 157px;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 154px;
	}

/*   box model hack   */ 

html>#sidebar {
		width: 154px;
	}
	
#sidebar p {
	color: #f21;
	}

#sidebar h2 {
	font-size: 16px;
	font-weight: bold;
	color: #d2000c;
	margin-bottom: 0;
	}

#sidebar ul {
	margin: 0;
	margin-left: 20px;
	padding: 0;
	list-style: circle url(images/bullet-olive.gif);
	}

#sidebar li {
	color: #fff;
	margin: 0;
	padding: 0;
	line-height: 115%;
	}

#sidebar a {
	color: #ff2;
	text-decoration: none;
	font-weight: bold;
	}
	
#sidebar a:hover {
	color: #65b21c;
	text-decoration: none;
	font-weight: bold;
	}

/*   FOOTER - CONTROLS APPEARANCE OF FOOTER LINKS AND TEXT
-------------------------------------------------------------------------*/

#footer {
	clear: right;
	padding: 0 15px;
	}

#footer p {
	text-align: center;
	font-size: 10px;
	}

#footer h5 {
	font-size: 16px;
	font-weight: bold;
	color: #c00;
	margin: 0;
	}

#footer p.carthelp { font-size: 12px; }

#footer p.copyright { text-align: center; }

#footer #footlinks a { color: #777; }

/*   Free Shipping in Footer
-------------------------------------------------------------------------*/

strong.freeshipping {
	font-size: 20px;
	}

strong.contiguous {
	font-size: 12px;
	}

td.freeshipping {	
	font-weight: bold;
	color: #FFFFFF;
	margin: 0;
	background-color: #FF0000;
	text-align:center;
}

table.freeshipping {
	width:100%;
}

/*   SITE MAP LAYOUT
-------------------------------------------------------------------------*/

#sitemaplist ul {
	list-style: url(images/bullet-sitemap.gif);
	}
	
#sitemaplist li {
	line-height: 110%;
	}
	
/*   CLOCK DIV
-------------------------------------------------------------------------*/

#clock {
	position: absolute;
	z-index: 99;
	top: 184px;
	left: 583px;
	width: 179px;
	height: 35px;
	}
.split2 {
	text-align: left;

}
.heading {
	font-size: 16px;
	font-weight: bold;
	color: #d2000c;
	margin-bottom: 0;
}

/*   HOT LINKS POSITIONING
-------------------------------------------------------------------------*/

.HotLinks {
	clear: all;
	margin: 20px auto;
	padding: 0;
	text-align: center;
	}

/*   Neon Table
-------------------------------------------------------------------------*/

#neon table {
	border: 1px solid #808080;
	}
	
#neon td.header {
border: 1px solid #808080;
text-align:center;
	font-size: 13px;
	color: #e00;
	margin: 0;
font-weight:bold;
}

#neon td {
border: 1px solid #808080;
text-align:center;
	font-size: 13px;
	color: #e00;
	margin: 0;
}

/*   SSLINDEX PAGE - CONTROLS LAYOUT AND PLACEMENT OF BODY TEXT
-------------------------------------------------------------------------*/
table.sslindex {
	border-width: 2px;
	border-color: #6D6D6D #6D6D6D #6D6D6D #6D6D6D;
	border-style:solid solid solid solid;
	text-align: center;
}
td.sslindex {
	width: 25%;
	vertical-align: top;
	text-align: center;
	border-color:#6D6D6D;
	border-width:2px;
	border-style:solid solid solid solid;
}
#sslindex {
	text-align:center;
	background-color:#FFFFFF;
}
#sslindex a {
	font-size: 16px;
	font-weight: bold;
	color: #6E6D6B;
	text-decoration: none;
	margin: 0;
}
#sslindex a:visited {
	font-size: 16px;
	font-weight: bold;
	color: #9D785D;
	text-decoration: none;
	margin: 0;
}
#sslindex a:hover {
	font-size: 16px;
	font-weight: bold;
	color: #9D785D;
	text-decoration: underline;
	margin: 0;
}
#sslindex img {
	float: none;
	padding-right: 0;
	margin-right: 0;
	margin-left: 0px;
	margin-top: 0px;
	margin-bottom: 0px;
	padding-left: 0px;
	padding-top: 0px;
	padding-bottom: 0px;
}

/*


   Magic Zoom Plus v4.5.17 
   Copyright 2013 Magic Toolbox
   Buy a license: www.magictoolbox.com/magiczoomplus/
   License agreement: http://www.magictoolbox.com/license/


*/


/* Style of the small image link */
.MagicZoomPlus, .MagicZoomPlus:hover {
    display: inline-block;
    cursor: url(graphics/zoomin.cur), pointer;
    outline: 0 !important;
    font-size: 0 !important;
    line-height: 100% !important;
    direction: ltr;
    max-width: 100%;
}

/* Style of the small image */
.MagicZoomPlus img {
    border: 0 !important;
    margin: 0 !important;
    outline: 0 !important;
    padding: 0 !important;
    height: auto;
}

.MagicZoomPlus > img {
    width: 100%;
}

.MagicZoomPlus.magic-for-ie8 > img {
    max-width: none !important;
}

.MagicZoomPlus.magic-for-ie7 > img, .MagicZoomPlus.magic-for-ie5 img {
    width: auto;
}

td > .MagicZoomPlus > img, td > .MagicZoomPlus.magic-for-ie8 > img {
    max-width: none;
    width: auto;
}


/* Style of the span inside the small image link */
.MagicZoomPlus span {
    display: none !important;
}

/* Style of hint box */
.MagicZoomPlusHint {
    background: url(graphics/hint.gif) no-repeat 2px 50%;
	background-color:#FFFFFF;
    color: #000000;
    font-family: sans-serif;
    font-size: 8pt;
    line-height: 10px;
    margin: 0;
    min-height: 10px;
    padding: 2px 2px 2px 20px !important;
    text-align: left;
    text-decoration: none;
}

.MagicZoomPlusLoading {
    background: #fff url(graphics/loader.gif) no-repeat 2px 50%;
    border: 1px solid #ccc;
    color: #444;
    font-family: sans-serif;
    font-size: 8pt;
    line-height: 1.5em;
    margin: 0;
    padding: 4px 4px 4px 24px !important;
    text-align: left;
    text-decoration: none;
}


/* Style to hide external title or caption on a page. Only needed for #id method */
.MagicZoomPlus-ExternalText {
    display: none;
}


/* Style of the zoomed image */
.MagicZoomBigImageCont {
    background: #ffffff;
    border: 1px solid #999;
    -webkit-transition: none !important;
    -moz-transition: none !important;
    transition: none !important;
}

.MagicZoomBigImageCont img {
    max-width: none !important;
    max-height: none !important;
    height: auto !important;
    width: auto !important;
}

/* Style of text on the zoomed image */
.MagicZoomHeader {
    background: #666;
    color: #fff;
    font-size: 10pt !important;
    line-height: normal !important;
    text-align: center !important;
}

/* Style of square magnify area under the cursor */
.MagicZoomPup {
    background: #dadad1;
    border: 3px solid #aaa;
    cursor:url(graphics/zoomin.cur),pointer;
}

/* Style of loading message and icon shown during load */
.MagicZoomLoading {
    background: #fff url(graphics/loader.gif) no-repeat 2px 50%;
    border: 1px solid #ccc;
    color: #444;
    font-family: sans-serif;
    font-size: 8pt;
    line-height: 1.5em;
    margin: 0;
    padding: 4px 4px 4px 24px !important;
    text-align: left;
    text-decoration: none;
}

/* Style of hotspots */
.MagicHotspots {
display: none;
visibility: hidden;
}
.MagicHotspots a {
border: 1px solid #ccc;
display: block !important;
position: absolute !important;
}
.MagicHotspots a:hover {
border: 1px solid red;
}

/* Style of the small image when the large image is expanded */
.MagicThumb-expanded-thumbnail {
    cursor: default;
}

/* Style of the expanded image */
.MagicThumb-expanded {
    background: #ffffff;
    border: 1px solid #ccc;
    cursor: url(graphics/zoomout.cur), pointer;
    outline: 0;
    padding: 0;
    -webkit-transition: none !important;
    -moz-transition: none !important;
    transition: none !important;
}

.MagicThumb-expanded img {
    background: #ffffff;
}

/* Style of the caption for the expanded image */
.MagicThumb-caption {
    background: #ccc;
    border: 0 !important;
    color: #333;
    font: normal 10pt Verdana, Helvetica;
    min-height: 18px !important;
    padding: 8px;
    outline: 0 !important;
    text-align: left;
}

/* Style of the close/next/previous buttons */
.MagicThumb-buttons {
    background: transparent url(graphics/buttons1.png) no-repeat 0 0;
    display: block;
    height: 24px;
}

.MagicThumb-buttons a {
    height: 24px;
    margin: 0px 1px !important;
    overflow: hidden;
    width: 24px;
}

.MagicThumb-expanded > div > div > div > img {
    max-height: none !important;
    max-width: none !important;
    height: auto !important;
    width: auto !important;
}

.MagicThumb-background {
    -webkit-transition: none !important;
    -moz-transition: none !important;
    transition: none !important;
}

.magic-temporary-img img {
    max-height: none !important;
    max-width: none !important;
}

/* Style of shadow effect behind zoomed image */
.MagicBoxShadow {
-moz-box-shadow: 3px 3px 4px #888888;
-webkit-box-shadow: 3px 3px 4px #888888;
box-shadow: 3px 3px 4px #888888;
border-collapse: separate;
/* For IE 5.5 - 7 */
filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#888888') !important;
/* For IE 8 */
-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#888888')" !important;
}

/* Style of glow effect behind zoomed image */
.MagicBoxGlow {
-moz-box-shadow: 0px 0px 4px 4px #888888;
-webkit-box-shadow: 0px 0px 4px 4px #888888;
box-shadow: 0px 0px 4px 4px #888888;
border-collapse: separate;
/* For IE 5.5 - 7 */
filter: progid:DXImageTransform.Microsoft.Glow(Strength=4, Color='#888888') !important;
/* For IE 8 */
-ms-filter: "progid:DXImageTransform.Microsoft.Glow(Strength=4, Color='#888888')" !important;
}
