html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, figure, footer, header, 
hgroup, menu, nav, section, menu,
time, mark, audio, video {
  margin:0;
  padding:0;
  border:0;
  outline:0;
  font-size:100%;
  vertical-align:baseline;
  background:transparent;
}

article, aside, figure, footer, header, 
hgroup, nav, section { display:block; }

nav ul { list-style:none; }

blockquote, q { quotes:none; }

blockquote:before, blockquote:after,
q:before, q:after { content:''; content:none; }

a { margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent; }

ins { background-color:#ff9; color:#000; text-decoration:none; }

mark { background-color:#ff9; color:#000; font-style:italic; font-weight:bold; }

del { text-decoration: line-through; }

abbr[title], dfn[title] { border-bottom:1px dotted #000; cursor:help; }

/* tables still need cellspacing="0" in the markup */
table { border-collapse:collapse; border-spacing:0; }

hr { display:block; height:1px; border:0; border-top:1px solid #ccc; margin:1em 0; padding:0; }

input, select { vertical-align:middle; }











body { font:13px sans-serif; *font-size:small; *font:x-small; line-height:1.22; font-family: 'CaviarDreamsBoldItalic', sans-serif; }

table { font-size:inherit; font:100%; }
body:before {/* thanks to Maleika (Kohoutec)*/
content:"";
height:100%;
float:left;
width:0;
margin-top:-32767px;/* thank you Erik J - negate effect of float*/
}

select, input, textarea { font:99% sans-serif; }


/* normalize monospace sizing 
 * en.wikipedia.org/wiki/MediaWiki_talk:Common.css/Archive_11#Teletype_style_fix_for_Chrome
 */
pre, code, kbd, samp { font-family: monospace, sans-serif; }
 


/* 
 * minimal base styles 
 */


/* #444 looks better than black: twitter.com/H_FJ/statuses/11800719859 */ 
body, select, input, textarea { color:#444; }

/* Headers (h1,h2,etc) have no default font-size or margin,
   you'll want to define those yourself. */ 
 
/* www.aestheticallyloyal.com/public/optimize-legibility/ */ 
h1,h2,h3,h4,h5,h6 { font-weight: bold; text-rendering: optimizeLegibility; }

/* maxvoltar.com/archive/-webkit-font-smoothing */
html { -webkit-font-smoothing: antialiased; }

 
/* Accessible focus treatment: people.opera.com/patrickl/experiments/keyboard/test */
a:hover, a:active { outline: none; }

a, a:active, a:visited { color:#607890; }
a:hover { color:#036; }


ul { margin-left:30px; }
ol { margin-left:30px; list-style-type: decimal; }

small { font-size:85%; }
strong, th { font-weight: bold; }

td, td img { vertical-align:top; } 

sub { vertical-align: sub; font-size: smaller; }
sup { vertical-align: super; font-size: smaller; }

pre { 
  padding: 15px; 
  
  /* www.pathf.com/blogs/2008/05/formatting-quoted-code-in-blog-posts-css21-white-space-pre-wrap/ */
  white-space: pre; /* CSS2 */
  white-space: pre-wrap; /* CSS 2.1 */
  white-space: pre-line; /* CSS 3 (and 2.1 as well, actually) */
  word-wrap: break-word; /* IE */
}

/* align checkboxes, radios, text inputs with their label
   by: Thierry Koblentz tjkdesign.com/ez-css/css/base.css  */
input[type="radio"] { vertical-align: text-bottom; }
input[type="checkbox"] { vertical-align: bottom; *vertical-align: baseline; }
.ie6 input { vertical-align: text-bottom; }

/* hand cursor on clickable input elements */
label, input[type=button], input[type=submit], button { cursor: pointer; }


/* These selection declarations have to be separate.
   No text-shadow: twitter.com/miketaylr/status/12228805301 
   Also: hot pink. */
::-moz-selection {background: #847041; color:#fff; text-shadow: none;}
::selection {background:#847041; color:#fff; text-shadow: none;} 

/*  j.mp/webkit-tap-highlight-color */
a:link { -webkit-tap-highlight-color: #847041; } 


/* always force a scrollbar in non-IE */
html { overflow-y: scroll; }

/* make buttons play nice in IE:    
   www.viget.com/inspire/styling-the-button-element-in-internet-explorer/ */
button {  width: auto; overflow: visible; }
 
/* bicubic resizing for non-native sized IMG: 
   code.flickr.com/blog/2008/11/12/on-ui-quality-the-little-things-client-side-image-resizing/ */
.ie7 img { -ms-interpolation-mode: bicubic; }



/* 
 * Non-semantic helper classes 
 */

/* for image replacement */
.ir { display:block; text-indent:-999em; overflow:hidden; background-repeat: no-repeat; }

/* Hide for both screenreaders and browsers
   css-discuss.incutio.com/wiki/Screenreader_Visibility */
.hidden { display:none; visibility:hidden; } 

/* Hide only visually, but have it available for screenreaders 
   www.webaim.org/techniques/css/invisiblecontent/ 
   Solution from: j.mp/visuallyhidden - Thanks Jonathan Neal! */
.visuallyhidden { position:absolute !important;    
  clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
  clip: rect(1px, 1px, 1px, 1px); }

/* Hide visually and from screenreaders, but maintain layout */
.invisible { visibility: hidden; }

/* >> The Magnificent CLEARFIX << */
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.clearfix { display: inline-block; }
* html .clearfix { height: 1%; } /* Hides from IE-mac \*/
.clearfix { display: block; }

body { background:#000;}




 /* Primary Styles
    Author: 
 */
#container {min-height: 100%; background:#F0EEDE;}
#container.home {background:#000;}
#homewrapper {width:850px; background:url(../images/home_bg.jpg) no-repeat center center; margin: 0 auto; color:#FFF;}
header{width:100%; height:155px; background: url(../images/header_repeat.jpg);}
header .content {width:850px; margin:0 auto; min-height:520px;}
header .content h1 {display:block; width:260px; height:100px; background: url(../images/logo_trans.png); text-indent:-5000em; float:left; margin-top:30px;}
header .content h1 a { display:block; width:260px; height:100px; text-indent:-5000em;}
header .content nav { display:block; float:right; height:30px; margin-top:120px;}
header .content nav > ul { display:block; padding:0; margin:0;}
header .content nav > ul > li { display:block; float:left;  height:30px; position:relative;}
header .content nav > ul > li:hover, header .content nav ul > li.selected {background:url(../images/nav_selected.png) bottom center no-repeat;}
header .content nav > ul > li > a { color:#FFF; text-decoration:none; display:block; padding-left:10px;}
header .content nav > ul > li:hover > a, header .content nav ul > li.selected > a {color:#847041;}
header .content nav > ul > li > .dropdown {display:none; position:absolute; margin:0 0 0 -30px; background:url(../images/dropdown_bottom.png) no-repeat bottom; width:150px; padding:19px 5px 10px 5px; z-index:10;}
header .content nav > ul > li:hover > .dropdown {display:block;}
header .content nav > ul > li > .dropdown > ul {display:block; width:150px; margin:0; padding:5px 0 0 0; background:url(../images/dropdown_repeat.png) repeat-y bottom;}
header .content nav > ul > li > .dropdown > ul > li { white-space:nowrap; display:block; width:130px; float:left;  padding:5px 10px; margin:0; list-style-type:none; margin:0;}
header .content nav > ul > li > .dropdown > ul > li > a,
header .content nav > ul > li > .dropdown > ul > li > a:hover, 
header .content nav > ul > li > .dropdown > ul > li:hover > a{color:#39342C; text-decoration:none;}


#main {overflow:none;  padding-bottom: 0; width:850px; margin:0 auto 0 auto;}
#main.home {background:none;}
#main.normal_bg {background:url(../images/main_bg_repeat.png) repeat-y;}
#main.jewel {background:url(../images/jewels_bg.jpg) no-repeat top left; background-repeat: no-repeat !important;}
#main.david_fox {background:url(../images/david_fox_bg.jpg) no-repeat top left;}

#main.page_background {background:url(../images/background_page_bg.jpg) no-repeat top right;}
#main.page_contact {background:url(../images/contact_page_bg.jpg) no-repeat center center;}
#main.page_shoes {background:url(../images/shoes_page_bg.jpg) no-repeat center center;}
#main.page_experience {background:url(../images/experience_page_bg.jpg) no-repeat center center;}
#main.page_design {background:url(../images/design_bg.jpg) no-repeat center center; background-repeat: no-repeat !important;}

#main .content { position:relative: z-index:1; padding-top:10px;}
#main .content .pillar {float:left; position:relative; margin:-10px 0 65px 20px; width:150px; height:664px; background: url(../images/black_overlay.png) repeat;}
#main .content .pillar img {display:block; position:absolute; z-index:2; left:0;}
#main .content .pillar a {display:block; position:absolute; z-index:3; width:150px; left:0; height: 30px; font-size:11px; color:#F0ECDE; text-decoration:none; text-indent: -5000em; }
#main .content .pillar.view_designs img {top:80px;}
#main .content .pillar.view_designs a {top:338px;}
#main .content .pillar.jeweled_shoes img {top:35px;}
#main .content .pillar.jeweled_shoes a {top:209px;}
#main .content .pillar.david_fox img {top:140px;}
#main .content .pillar.david_fox a {top:406px;}

#main .content img.product_image {display:block;float:left; margin-left:0; margin-top:50px; position:relative; z-index:2;}

#main .content img.product_image.right {float:right;}
#main .content img.product_image.middle {display:none;}

#main .content section.boxes {float:right; margin-right:-5px; padding-top:10px;}
#main .content section.boxes .box {position:relative; z-index:2; width:286px; height:141px; margin-bottom:15px;}
#main .content section.boxes .box img {display:block; position:absolute;z-index:2; top:0; left:0;}
#main .content section.boxes .box a {margin-left:1px;display:block; text-decoration:none; position:absolute; z-index:3; left:0; top:45px; background: url(../images/black_overlay.png) repeat; padding:10px 15px; font-size:14px; color:#FFF;}


#main .content section.gallery { float:right; margin-right:-20px; margin-bottom:100px; padding-top:30px; width:340px; padding-bottom:20px;}
#main .content section.gallery a {float:left; margin:0 20px 0 0; margin-bottom:20px; padding:0; display:block; height:115px; position:relative; z-index:2;}
#main .content section.gallery a img { margin:0; padding:0; box-shadow:3px 4px 10px #333333; -webkit-box-shadow:3px 4px 10px #333333;-moz-box-shadow:3px 4px 10px #333333;}
#main .content section.gallery > img, #main .content section.gallery_small > img {float:left; margin:0 20px 0 0; padding:0; display:block; height:115px; position:relative; z-index:2; box-shadow:3px 4px 10px #333333; -webkit-box-shadow:3px 4px 10px #333333;-moz-box-shadow:3px 4px 10px #333333;}

#main .content section.gallery h4 {font-size:14px; color:#000; font-weight:normal; padding:0 0 10px 0; margin:0;}

#main .content section.gallery_small { float:right; margin-right:-20px; padding-top:30px; width:340px; padding-bottom:20px;}
#main .content section.gallery_small a {float:left; margin:0 20px 0 0; padding:0; display:block; height:115px; position:relative; z-index:2;}
#main .content section.gallery_small a img { margin:0; padding:0;}

#main .content section.gallery.twotwenty {width:220px; margin-right:0px;}
#main .content section.gallery.twotwenty a {float:left; margin:0 0 2px 0; height:180px; }
#main .content section.gallery.twotwenty a img {margin:0; padding:0;}

#main .content section.gallery_large{margin-bottom:100px;}
#main .content section.gallery_large > img { box-shadow:3px 4px 10px #333333; -webkit-box-shadow:3px 4px 10px #333333;-moz-box-shadow:3px 4px 5px #333333; display:block; margin-left:20px !important; float:left;}

#main .content section.product {display:none;width:520px; float:left; background:#FFF; margin:56px 0 20px 0; position:relative;}
#main .content section.product a.enlarge {position:absolute; top:0; right:40px; background:url(../images/black_overlay.png) repeat; color:#FFF; text-decoration:none; font-size:14px; padding:5px 10px;}
#main .content section.product.right {float:right; margin-bottom:100px;}
#main .content section.product article {padding:15px 15px 0 15px; width:190px;}
#main .content section.product article h3 {color:#000; font-size:19px; padding:0 0 10px 0; font-weight:normal;}
#main .content section.product article ul, #main .content section.product article ul > li {padding:0; margin:0; list-style-type:none;}
#main .content section.product article ul > li {padding-bottom:3px; color:#847040;}
#main .content section.product article ul > li > span {padding-right:7px; color:#000; display:block; float:left;}
#main .content section.product article a.thumb {display:block; width:90px; height:90px; float:left; margin-right:10px; margin-top:10px;}
#main .content section.product img.main {display:block;float:right;}

#main .content section.text {float:left; width:320px; padding-top:30px; margin-bottom:70px; color:#000; font-size:14px; line-height:20px; text-align:center;}
#main .content section.text h3 {font-size:19px; color:#000; font-weight:normal; padding:0 0 10px 0;}
#main .content section.text .selection {padding-bottom:10px;}
#main .content section.text .selection a {display:block; margin-right:1px; margin-bottom:1px; height:147px;}

#main .content section.textonly {width:650px; float:left;  margin:30px 0 70px 0;}
#main .content section.textonly article {padding:15px; width:650px;}
#main .content section.textonly article p {color:#84703F; font-size:13px; padding:0 0 10px 0; font-weight:normal; }
#main .content section.textonly article h3 {color:#000; font-size:19px; padding:0 0 10px 0; font-weight:normal;}
#main .content section.textonly article ul, #main .content section.textonly article ul > li {padding:0; margin:0; list-style-type:none;}
#main .content section.textonly article ul > li {padding-bottom:3px; color:#847040;}
#main .content section.textonly article ul > li > span {padding-right:7px; color:#000; display:block; float:left;}
#main .content section.textonly article a.thumb {display:block; width:90px; height:90px; float:left; margin-right:10px; margin-bottom:10px;}
#main .content section.textonly img.main {display:block;float:right;}


#main .content section.textonly article a {font-size: 15px !important;  text-decoration: none; color: #a08e60; font-weight: bold;}

#main .content section.textonly.small {width:300px; float:left;  margin:0px 0 20px 0;}
#main .content section.textonly.small article {padding:15px; width:325px;}
#main .content section.textonly.small article p strong { color: #000; font-size: 16px; }
#main .content section.textonly.small article p strong.method { display: block; float: left; width:70px; font-size: 13px; }
#main .content section.textonly.small article h4 {font-size: 14px; font-weight: strong; margin-bottom: 8px; color:#84703F; }

#main .content section.textonly.smaller {width:330px; float:left;  margin:30px 0 20px 0;}
#main .content section.textonly.smaller article {padding:15px; width:300px;}

#main .content section.textonly.small form, #main .content section.textonly.small form > fieldset {  padding:0; margin:5px 0 0 0; }
#main .content section.textonly.small form > fieldset input[type=text]{  background:#EBE6DB;  padding:0px 5px;  line-height:24px;  height:22px;  float:left;  width:220px;  margin-right:20px;  margin-bottom:10px;  color:#a08e60;  border: solid 1px #D6CAB1; }
#main .content section.textonly.small form > fieldset textarea{  background:#EBE6DB;  padding:5px 5px;  height:130px;  float:left;  width:221px; resize:none; margin-bottom:10px;  color:#a08e60;  border: solid 1px #D6CAB1; }
#main .content section.textonly.small form > fieldset input[type=submit]{ display:block; padding:10px; background:#a08e60;  border:none; color:#FFF; margin-bottom:10px; }
#main .content section.textonly.small form > fieldset .form-prompt-text{  color:#2B160D;  margin-top:2px;  line-height:20px;  padding-left:5px;  font-size:12px; }

footer{width:100%; height:255px; background: url(../images/footer_repeat.jpg);   margin-top:-65px; }
footer section {display:block; padding-top:100px; margin:0 auto 0 auto; width:850px;}
footer section nav {float:left; padding-top:30px;}
footer section nav > ul {display:block; font-size:11px; padding:0; margin:0;}
footer section nav > ul > li {display:block; float:left; margin-bottom:10px; }
footer section nav > ul > li {display:block; float:left; color:#928C6C;}
footer section nav > ul > li > a, footer section nav > ul > li > a:visited  {display:block; float:left; color:#928C6C; text-decoration:none; margin-right:10px;}
footer section nav > ul > li > a:hover, footer section nav > ul > li.selected > a {color:#FFF;}
footer section .follow {width:156px; height:50px; background:url(../images/follow_footer.png); float:right; margin-top:8px;}

#container .lightbox_b {display:none; width:100%; height:100%; position:absolute; z-index:5; background:url(../images/lightbox_overlay.png) repeat;}
#container .lightbox_b .product {background:url(../images/white_overlay.png) repeat; width:650px; position:absolute; z-index:6; left:50%; margin-left:-260px;  min-height:150px;}
#container .lightbox_b .product article {padding:15px 15px 0 15px; width:190px;}
#container .lightbox_b .product article h3 {color:#000; font-size:19px; padding:0 0 10px 0; font-weight:normal;}
#container .lightbox_b .product article ul, #main .content section.product article ul > li {padding:0; margin:0; list-style-type:none;}
#container .lightbox_b .product article ul > li {padding-bottom:3px; color:#847040;}
#container .lightbox_b .product article ul > li > span {padding-right:7px; color:#000; display:block; float:left;}
#container .lightbox_b .product article a.thumb {display:block; width:90px; height:90px; float:left; margin-right:10px; margin-top:10px;}
#container .lightbox_b .product img.main {display:block;float:right;}
#container .lightbox_b > img.large {display:block;}
#container .lightbox_b > a.close {display:block; z-index:999999999; position:absolute; top:0; left:0; background:url(../images/black_overlay.png) repeat; color:#FFF; text-decoration:none; padding:10px; font-size:12px;}

.black_large, .black_large:hover, .black_large:visited { text-decoration:none; color:#000 !important; font-size:18px;}


a.follow_fb { display: block; float: right; text-indent: -5000em; outline: none; height: 16px; width: 16px; margin-right: 5px; margin-top: 5px;}
a.follow_tw { display: block; float: right; text-indent: -5000em; outline: none; height: 16px; width: 16px; margin-right: 10px; margin-top: 5px;}
a.follow_bl { display: block; float: right; text-indent: -5000em; outline: none; height: 16px; width: 16px; margin-right: 10px; margin-top: 7px;}

.contactMaths
{
 display:block;
 clear:both;
}

/* 
 * print styles
 * inlined to avoid required HTTP connection www.phpied.com/delay-loading-your-print-css/ 
 */
@media print {
  * { background: transparent !important; color: #444 !important; text-shadow: none; }

  a, a:visited { color: #444 !important; text-decoration: underline; }

  a:after { content: " (" attr(href) ")"; } 

  abbr:after { content: " (" attr(title) ")"; }
  
  .ir a:after { content: ""; }  /* Don't show links for images */
  
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  
  img { page-break-inside: avoid; }

  @page { margin: 0.5cm; }

  p, h2, h3 { orphans: 3; widows: 3; }

  h2, h3{ page-break-after: avoid; }
}



/*
 * Media queries for responsive design
 */

@media all and (orientation:portrait) { 
  /* Style adjustments for portrait mode goes here */
  
}

@media all and (orientation:landscape) { 
  /* Style adjustments for landscape mode goes here */
  
}

/* Grade-A Mobile Browsers (Opera Mobile, iPhone Safari, Android Chrome)  
   Consider this: www.cloudfour.com/css-media-query-for-mobile-is-fools-gold/ */
@media screen and (max-device-width: 480px) {
  
  
  /* Prevent iOS, WinMobile from adjusting font size */
  html { -webkit-text-size-adjust:none; -ms-text-size-adjust:none; } 
}

