/* RESET */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-weight: inherit;
    font-style: inherit;
    font-size: 100%;
    font-family: inherit;
    vertical-align: baseline;
}
/* remember to define focus styles! */
:focus { outline: 0; }
ol, ul { list-style: none; }
/* tables still need 'cellspacing="0"' in the markup */
table {
    border-collapse: separate;
    border-spacing: 0;
}
caption, th, td {
    text-align: left;
    font-weight: normal;
}
blockquote:before, blockquote:after, q:before, q:after { content: ""; }
blockquote, q { quotes: "" ""; }


a {outline:none; text-decoration:none;}

a:hover {}


/* COLOURS 

dkgreen #00937F
ltgreen #A6D6D2
brown #54301A

*/


/* BASE */

html,body{ height: 100% }

body { 
    margin: 0 37px 0 37px;
    padding: 0; 
    font: 14px/16px Arial, Helvetica, sans-serif;
    background-color: #000;
	color:#FFF;
}

#container {width:950px; margin: 0 auto ;  position: relative;}


#header {width:950px; height: 135px; position: relative;}

#menu {width:950px; height: 65px; position: relative;}

#social { position:absolute; right:65px; bottom: 0; height: 41px;}


.social-txt { position:absolute; right:160px; bottom: 0; height: 45px;}



#content {
    width: 950px;
    position: relative;
	background: url(../img/black_trans.png); behavior: url(iepngfix.htc);
	border-top: #FFF 1px solid;
	min-height: 603px;
	height: auto;
}


* html #content {
height: 603px;
}

/* BACKGROUNDS

-------------------------------------------------------------- */

.box {background: #000 url(../img/backgrounds/box.jpg) center 0 no-repeat;}
.pink-shoe {background: #000 url(../img/backgrounds/pink_shoe.jpg) center 0 no-repeat;}
.pink-shoes {background: #000 url(../img/backgrounds/pink_shoes.jpg) center 0 no-repeat;}
.silver-shoes {background: #000 url(../img/backgrounds/silver_shoes.jpg) center 0 no-repeat;}
.handbag {background: #000 url(../img/backgrounds/handbag.jpg) center 0 no-repeat;}
.legs {background: #000 url(../img/backgrounds/legs.jpg) center 0 no-repeat;}



/* HEADER

-------------------------------------------------------------- */


#brand {float: left; width:85px; height: 85px; display: inline; margin-left:10px; margin-top: 38px;}


/* FLASH

-------------------------------------------------------------- */


#flash-quotes {position: absolute; left:150px; bottom: 7px; width:350px; height: 85px;}


/* HEADER NAVIGATION

-------------------------------------------------------------- */

.nav { margin: 0 0 0 10px; padding: 16px 0 0 0; list-style: none; width: 950px;}

.nav li { margin: 0 30px 0 0; padding: 0 0 0 0; display: inline; }

.nav a { border: none; margin: 0; color: #8A9197; text-decoration: none;}

.nav a:hover { color: #FFF; text-decoration: none;}

.nav a.selected { color: #FFF;}

.nav .nomargin {margin-right: 0;}



/* DIV SOCIAL CONTENT

-------------------------------------------------------------- */
#social p {display: inline;}

a.face-book { float:left; width: 30px; height: 30px; background: url(../img/facebook.png) 0 0 no-repeat; behavior: url(iepngfix.htc); text-indent: -3333px; margin-right: 8px;}

a.twitter { float:left; width: 30px; height: 30px; background: url(../img/twitter.png) 0 0 no-repeat; behavior: url(iepngfix.htc); text-indent: -3333px; margin-right: 8px;}

a.youtube { float:left; width: 30px; height: 30px; background: url(../img/youtube.png) 0 0 no-repeat; behavior: url(iepngfix.htc); text-indent: -3333px; margin-right: 8px;}

a.myspace { float:left; width: 31px; height: 31px; background: url(../img/myspace.png) 0 0 no-repeat; behavior: url(iepngfix.htc); text-indent: -3333px; margin-right: 8px;}

a.stumble { float:left; width: 30px; height: 30px; background: url(../img/stumbleupon.png) 0 0 no-repeat; behavior: url(iepngfix.htc); text-indent: -3333px; margin-right: 12px;}

a.bebo { float:left; width: 30px; height: 30px; background: url(../img/bebo.png) 0 0 no-repeat; behavior: url(iepngfix.htc); text-indent: -3333px; margin-right: 8px;}






/* FLAGS LANDING PAGE
-------------------------------------------------------------- */

#flags-col {width: 600px; float: left; display: inline; margin-left: 10px; }

#flags-col p {padding-top: 0px; line-height: 14px;}

.flag-box {float: left; display: inline; margin-left: 10px; width:250px; margin-bottom: 20px;}

.flag-box img {float: left; margin-right: 10px; display: inline;}

.coming-soon {width: 200px;}


/* PRESS AREA FORM RULES
-------------------------------------------------------------- */

#presslogin label {display: block; margin-top: 14px; padding-bottom: 3px;}

#presslogin .inputer {width: 200px; border: 1px solid #00B0CC; padding: 2px; font-size: 14px;}

#presslogin .submiter {behavior: url(iepngfix.htc);  margin-top: 16px; display:block;}



/* SHOP FORM  AND PAGE RULES
-------------------------------------------------------------- */

#red-shoes {width: 255px; min-height:100px; height:auto; height:100px; background: url(../img/shoes/red_shoe.png) right 0 no-repeat; behavior: url(iepngfix.htc); cursor: pointer;}

#black-shoes {width: 255px; min-height:100px; height:auto; height:100px; background: url(../img/shoes/black_shoe.png) right 0 no-repeat; behavior: url(iepngfix.htc); cursor: pointer;}

#gold-shoes {width: 255px; min-height:100px; height:auto; height:100px; background: url(../img/shoes/gold_shoe.png) right 0 no-repeat; behavior: url(iepngfix.htc); cursor: pointer;}

#silver-shoes {width: 255px; min-height:100px; height:auto; height:100px; background: url(../img/shoes/silver_shoe.png) right 0 no-repeat; behavior: url(iepngfix.htc); cursor: pointer;}

#pink-shoes {width: 255px; min-height:100px; height:auto; height:100px; background: url(../img/shoes/pink_shoe.png) right 0 no-repeat; behavior: url(iepngfix.htc); cursor: pointer;}

.input { width: 30px; float: right; border:none; padding: 2px; clear: right; font-size: 12px; margin: 0;}
	
fieldset { border: none; }

label { float: left; clear: left; width: 100px; padding-top: 3px; }

fieldset p { float: left; clear: left; padding: 0 0 5px 0; width: 200px; margin: 0;}

p.price {padding: 4px 0 4px 0; color:#31BBAC;}

p.shoe-name {font-weight: bold;}


.submit { behavior: url(iepngfix.htc);  margin-top: 48px;}

.quant {padding-left: 60px;}

.shipping {font-size: 12px; line-height: 14px;}

.bold {font-weight: bold;}

.leading {padding-bottom: 3px;}


.table-space {margin-top: 32px;}

table td {padding: 2px;}

.table-border {border-top: 1px solid #FFF;}


/* SHOE IMAGE RULES + other png files
-------------------------------------------------------------- */


div#large-shoes {width: 300px; height:130px; margin: 32px 0 32px 0; }

.large-black {width: 300px; height:130px; background: url(../img/shoes/black_large.png) 0 0 no-repeat; behavior: url(iepngfix.htc);}
.large-gold {width: 300px; height:130px; background: url(../img/shoes/gold_large.png) 0 0 no-repeat; behavior: url(iepngfix.htc);}
.large-silver {width: 300px; height:130px; background: url(../img/shoes/silver_large.png) 0 0 no-repeat; behavior: url(iepngfix.htc);}
.large-pink {width: 300px; height:130px; background: url(../img/shoes/pink_large.png) 0 0 no-repeat; behavior: url(iepngfix.htc);}
.large-red {width: 300px; height:130px; background: url(../img/shoes/red_large.png) 0 0 no-repeat; behavior: url(iepngfix.htc);}



.bag {width: 280px; height:230px; background: url(../img/images/bag.png) 0 0 no-repeat; behavior: url(iepngfix.htc);}

.wedding {width: 280px; height:790px; background: url(../img/images/weddings.png) 0 0 no-repeat; behavior: url(iepngfix.htc);}



/* CONTENT AREA STYLES
-------------------------------------------------------------- */



#left-col {width: 300px; float: left; display: inline; margin-left: 10px; }

#mid-col {width: 300px; float: left; display: inline; margin-left: 20px; }

#right-col {width: 280px; float: left; display: inline; margin-left: 20px; }

#double-col {width: 580px; float: left; display: inline; margin-left: 20px;}

p {padding-top: 16px;}



/* CART STYLES
-------------------------------------------------------------- */

#double-col table {float: right; clear: both;}

#double-col table td {padding-bottom: 6px}

.delivery {float: right; clear: both; margin: 0 0 16px 0;}

.total-delivery {float: right; clear: both; margin: 0 0 16px 0;}

.remove {text-align: right;}

.quant {text-align: center;}


.submit { float:right; clear:both; behavior: url(iepngfix.htc);  margin-top: 32px;}


.new-submit {behavior: url(iepngfix.htc);  margin-top: 10px; display: block;}


.inputdetails { width: 250px; float: left; border:1px solid #00B0CC; padding: 2px; font-size: 14px; clear: right; background-color: #FFF;}

#double-col fieldset {
	border: none;
}
#double-col label {
	float: left;
	clear: left;
	width: 200px;
}

#double-col fieldset p {
	float: left;
	clear: left;
	padding: 5px 0 5px 0;
	width: 580px;
}

.proceed { float:right; behavior: url(iepngfix.htc);  margin-top: 32px; margin-right: 125px;}

.backto { float:left; behavior: url(iepngfix.htc);  margin-top: 32px;}


.delivery-details {clear: both; margin: 16px 0 0 0;}

.delivery-details p {margin: 0; padding: 0; font-size: 12px;}


select {font-size: 12px;}

.delivery-option {float: right; display:block; clear: both; padding: 16px 0 8px 0;}

#double-col span {color:#FF00FF;}

.confirmation {float:left; width:190px; }

.pad-bot {padding-bottom: 16px;}

/* page link color styles
-------------------------------------------------------------- */
.pink {color:#FF00FF;}

.pink-links a {color:#FF00FF;}
.pink-links a:hover {color:#FFF;}

.blue {color:#00B0CC;}

.blue-links a {color:#00B0CC;}
.blue-links a:hover {color:#FFF;}

.green {color:#31BBAC;}

.green-links a {color:#31BBAC;}
.green-links a:hover {color:#FFF;}

.club-links a {color:#FFF;}
.club-links a:hover {color:#00B0CC;}


h3 {font-size: 14px; line-height: 14px; margin: 0; padding: 0; }

h3.sub {padding-top: 16px;}

.nopad {padding-top: 0px;}

.sixteen {padding-top: 16px;}

.threetwo {padding-top: 32px;}

.foureight {padding-top: 48px;}

.sixfour {padding-top: 64px;}


/* FLASH
-------------------------------------------------------------- */

#rolling-shoe {width: 550px; height: 220px; position: absolute; left: 0; bottom: 180px;}


/* HACKS

-------------------------------------------------------------- */


/* Clearing floats without extra markup
   Based on How To Clear Floats Without Structural Markup by PiE
   [http://www.positioniseverything.net/easyclearing.html] */

.clearfix:after, #container:after, #content:after, .delivery-details:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}
.clearfix, #container, #content, .delivery-details {display: block;}

/* Regular clearing
   apply to column that should drop below previous ones. */

.clear { clear:both; }




#left-col1 {
	width: 800px;
	float: left;
	display: inline;
	margin-left: 10px;
}