.foo { }
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*
	HTML GENERAL 
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
body, h1, h2, h3, h4, h5, h6, address, blockquote, dd, dl, hr, form, input { margin: 0; padding: 0; }
body { font-family: Calibri,Corbel,Lucida Grande,Tahoma,Lucida Sans Unicode, Segoe UI, Verdana; font-size: 12px; text-align: center; 
       /*background: #020202 url(images/bodybg.jpg) no-repeat scroll center top;     
		background:transparent url(http://www.yourpersonaljeweller.co.uk/App_Themes/DavidLaw/images/bg.jpg) no-repeat fixed center top;   
       background:url(images/body-background.jpg) repeat-x fixed center top #fff;*/ 
color: #3A4045;  background: #346590 url(images/bg_body.jpg) repeat-x scroll 0 0;  }

input,select{font-family:Calibri, Corbel,Tahoma,Lucida Sans Unicode, Segoe UI, Verdana; font-size: 12px;}
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*
	SHARED
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
.round { -webkit-border-radius: 3px; -moz-border-radius: 3px; }
.hide { display: none; }
.iconright { background-image: url(images/gray_right.gif); background-repeat: no-repeat; padding-left: 10px; background-position: 0 4px; }

select { border: 1px solid #96A6C5; color: #333333; padding:2px; }
select option{ text-indent:1px;}
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*
	LINKS
a:hover { color: #3C3C3C; text-decoration: underline; }
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
a { color: #3C3C3C; text-decoration: none; }
a:hover { color: #3C3C3C; text-decoration: underline; }

a img { border: 0; }
a.button { background: transparent url(images/button_right.png) no-repeat scroll right top; color: #FFFFFF; display: inline-block; font-size: 12px; height: 25px; line-height: normal; margin-right: 6px; padding-right: 18px; text-decoration: none; }
a.button span { background: transparent url(images/button_left.png) no-repeat scroll 0 0; display: inline-block; padding: 5px 0 5px 18px; cursor: pointer; }

.bluebutton{ display:inline-block; background-image:url(/images/buttonbg.gif); cursor:pointer; text-decoration:none; border:none; font-size:12px;
              background-repeat:no-repeat; width:106px; height:26px; line-height:26px; color:White; text-align:center; font-weight:bold;}
.bluebutton:hover{ color:White; text-decoration:none;}              
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*
	IMAGES
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
img { border: none; }

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*
	HEADINGS & TEXT
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

h1, h2, h3, h4, h5, h6 { }

h2, h3 { font-size: 16px; }

.sectiontitle { color: #ff9933; font-size: 1.3em; font-weight: bold; }

.sectionsubtitle { color: #555; font-size: 1.1em; font-weight: bold; }

.sectiontitle-blue { color: #608fc8; font-size: 1.3em; font-weight: normal; }

.smallprint { font-size: x-small; }
.small{ font-size:10px;}

em { font-style: normal; font-weight: normal; }

.node, .board { padding-left: 8px; background: url(images/bullet.gif) no-repeat 0 2px; }

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*

	TABLES

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

td { vertical-align: middle; }

td.fieldname { font-size: 12px; }

.TableContainer { }

.TableContainer .Row { }
.TableContainer .Row .ItemName { width: 150px;font-size: 12px; font-weight:bold; }
.TableContainer .Row .ItemValue { padding: 3px 0px 0px 0px; vertical-align: middle; height:26px; line-height:26px; }
.TableContainer .Row .ItemValue label{ margin: -5px 18px 0 2px;}

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*

	LISTS

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
ul, ol { margin: 0px; list-style: none; padding: 0px; }
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*

	STATIC PAGES

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/


.htmlcontent { padding-bottom: 5px; }

.htmlcontent-title { padding: 0;margin: 0; }

.htmlcontent-header { font-size: 1.2em; font-weight: bold; }

.htmlcontent-body { padding:0; }

.htmlcontent-body ul li { list-style-type: disc; list-style-position: inside; }
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*

	MISC. CLASSES

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.clear { border: medium none; clear: both; float: none; font-size: 0; height: 0; line-height: 0; }

.linkButton { color: #3664A5; background-color: inherit; text-decoration: underline; font-weight: bold; }

a.linkButton:hover { }

.dropDownLists {font-size: 10px; padding-left: 2px; }

.textBox { border-right: #dfe5e7 1px solid; border-top: #a8bac2 1px solid; border-left: #a8bac2 1px solid; border-bottom: #dfe5e7 1px solid; background: url(Images/bgTextBox.gif) white repeat-x left top; color: #11354A; font-size: 12px; width: 250px; padding-top: 3px; height: 20px; line-height: 20px; }
.textBox:focus { background-color: #FFFFCC; background-image: none; border: 1px solid #CCCC88; }
.messageError { font-size: 12px; font-weight: bold; color: red; padding-top:10px; }
.required { color: #FF7F00; font-weight: bold; }

.info, .success, .warning, .error { border:2px solid #eee; border-style:none solid solid none;margin: 10px 0px; padding: 15px 10px 15px 50px; background-repeat: no-repeat; background-position: 10px center; -webkit-border-radius: 3px; -moz-border-radius: 3px; }

.info { color: #00529B; background-color: #BDE5F8; background-image: url(   'images/message/info.png' ); }
.success { color: #4F8A10; background-color: #DFF2BF; background-image: url(   'images/message/success.png' ); }
.warning { color: #9F6000; background-color: #FEEFB3; background-image: url(   'images/message/warning.png' ); }
.error { color: #fff; background-color: #FFBABA; background-image: url(   'images/message/error.png' );font-weight:bold; }

.imessage { padding: 10px; border: 2px solid #ddd; background-color: #eee; color: #222; }
.inotice { background: #FFF6BF; color: #817134; border-color: #FFD324; }
.isuccess { background: #E6EFC2; color: #529214; border-color: #C6D880; }
.ierror { background: #FBE3E4; color: #D12F19; border-color: #FBC2C4; }



.copyright { float: right; padding-right: 10px; font-size: 10px; }

.copyright a { color: #3664A5; background-color: inherit; }


/* =ROUNDED CORNERS
   ----------------------------------------------------*/

.standard-header, .standard .standard-header { color: #4D4E4F; border: 1px solid #CCECFF; background: #f9fcff url(images/standard-header-bg.png) repeat-x 0 0; }

.inverse-header { color: #fff; background: #7b9fb2; border: 0; }
.standard-container { margin-bottom: 10px; border: 1px solid #CCECFF; }
.inverse-container { border-color: #b9cbd4; }

.borderless-bottom, .standard-header { border-bottom: 0; }
.borderless-top { border-top: 0; }
.corner-container { display: block; clear: both; }

/*  For browsers that support pretty rounded corners
    Current that includes Webkit 3 and Firefox 3. */
.round-x, x:-moz-any-link, /* this makes sure only Firefox 3 will see this b/c FF 2's rounded corners look like poop */ x:default { -moz-border-radius: 7px; }
.round-x { -webkit-border-radius: 7px; }

.round-x-top, .standard-header, x:-moz-any-link, x:default { -moz-border-radius: 7px 7px 0 0; }
.round-x-top, .standard-header { -webkit-border-top-left-radius: 7px; -webkit-border-top-right-radius: 7px; }

.round-x-bottom, .standard-container, x:-moz-any-link, x:default { -moz-border-radius: 0 0 7px 7px; }
.round-x-bottom, .standard-container { -webkit-border-bottom-left-radius: 7px; -webkit-border-bottom-right-radius: 7px; border-radius: 0 0 7px 7px; }



/*Blue Box*/
.bluebox { background-image: url(images/bar/bluebox.gif); background-position: center bottom; background-repeat: repeat-x; border: 1px solid #90C9EC; margin-bottom: 10px; padding: 1px; }
.roundpanel { margin-bottom: 15px; padding-bottom: 5px; padding-left: 0; background: #FFF url(http://www.mixx.com/images/layout/comment-supermixxer.png) repeat-x scroll 0 0; border: 1px solid #B0E3F6; }
.roundpanel .title { border-bottom: dotted 1px #eee; }



/*User  friendly  Table*/
.friendlytable a { color: #c75f3e; }

.friendlytable { width: 100%; padding: 0; margin: 0 auto; margin-bottom: 5px; }

.friendlytable caption { padding: 0 0 5px 0; width: 100%; text-align: right; }

.friendlytable th { color: #4f6b72; border-right: 1px solid #C1DAD7; border-bottom: 1px solid #C1DAD7; border-top: 1px solid #C1DAD7; text-align: left; font-size: 12px; background: #CAE8EA url(/images/table/bg_header.jpg) no-repeat; text-align: center; height: 32px; }

.friendlytable th.header { color: #4f6b72; border: 1px solid #C1DAD7; letter-spacing: 2px; text-align: left; padding: 6px 6px 6px 12px; background: #CAE8EA url(/images/table/bg_header.jpg) repeat-x; text-align: center; height: 20px; font-size: 11px; font-weight: bold; text-align: left; }

.friendlytable th.nobg { border-top: 0; border-left: 0; border-right: 1px solid #C1DAD7; background: none; color: #E97400; }

.friendlytable td { border-right: 1px solid #C1DAD7; border-bottom: 1px solid #C1DAD7; background: #fff; font-size: 11px; padding: 5px 6px 5px 12px; color: #4f6b72; text-align: center; }


.friendlytable td.alt { background: #F5FAFA; color: #797268; }

.friendlytable th.spec { border-left: 1px solid #C1DAD7; border-top: 0; background: #fff url(/images/table/bullet1.gif) no-repeat; }

.friendlytable th.specalt { border-left: 1px solid #C1DAD7; border-top: 0; background: #f5fafa url(/images/table/bullet2.gif) no-repeat; color: #797268; }

.green { color: Green; font-weight: bold; }
.bold { font-weight: bold; }

/*********Select Panels*********/
.option li, .option-multi li { float: left; line-height: 20px; list-style: none; margin: 0 4px 0 0; padding: 1px; position: relative; vertical-align: middle; cursor: pointer; -moz-user-select: none; -khtml-user-select: none; }
.option li a, .option-multi li a { border: 1px solid #C8C9CD; color: #000; display: block; min-width: 10px; padding: 3px; text-align: center; text-decoration: none; white-space: nowrap; width: auto !important; }
.option li.selected a, .option-multi li.selected a { background-image: url(images/box/select_icon.gif); background-position: right bottom; background-repeat: no-repeat; border: 2px solid #FF6701; margin: -1px; }
.option h2, .option-multi h2 { margin: 0px; padding: 0px; font-size: 11px; font-weight: normal; height: 24px; line-height: 24px; }
.option li a span { font-size: 10px; color: #aaa; }

/*This element is wrapped by jCarousel around the list*/
.jcarousel-container { position: relative; }
.jcarousel-clip { z-index: 2; padding: 0; margin: 0; overflow: hidden; position: relative; }
.jcarousel-list { z-index: 1; overflow: hidden; position: relative; top: 0; left: 0; margin: 0; padding: 0; }
.jcarousel-list li, .jcarousel-item { float: left; list-style: none; width: 75px; height: 75px; }
.jcarousel-next { z-index: 3; display: none; }
.jcarousel-prev { z-index: 3; display: none; }

/*tabs*/
.ui-tabs { zoom: 1; }
.ui-tabs .ui-tabs-nav { list-style: none; position: relative; padding: 0; float: left; width: 100%; background-image: url(images/header/b2c_detail_lm_bg_line.gif); background-position: bottom; background-repeat: repeat-x; }
.ui-tabs .ui-tabs-nav li { position: relative; float: left; border-bottom-width: 0 !important; margin: 3px 5px 0 0; padding: 0; background-image: url(images/header/b2c_detail_lm_bg_t_c.gif); background-repeat: repeat-x; height: 24px; }
*html .ui-tabs .ui-tabs-nav li { width: 180px; }
* + html .ui-tabs .ui-tabs-nav li { width: 160px; }
* + html .jtabs { margin-bottom: 10px; }
.ui-tabs .ui-tabs-nav li a { float: left; text-decoration: none; padding: .5em 1em; outline: none; text-shadow: 1px 1px #EFEFEF; }
.ui-tabs .ui-tabs-nav li.ui-tabs-selected { padding-bottom: 1px; border-bottom-width: 0; background-image: url(images/header/b2c_detail_lm_bg_to_c.gif); background-repeat: repeat-x; height: 29px; margin-top: 0px; }
.ui-tabs .ui-tabs-nav li.ui-tabs-selected a, .ui-tabs .ui-tabs-nav li.ui-state-disabled a, .ui-tabs .ui-tabs-nav li.ui-state-processing a { cursor: text; }
.ui-tabs .ui-tabs-nav li a, .ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a, .ui-tabs .ui-tabs-nav li.ui-tabs-selected a { cursor: pointer; }
.ui-tabs .ui-tabs-panel { padding: 1em 1.4em; display: block; background: none; border: 1px solid #A7D6F4; border-top: none; }
.ui-tabs .ui-tabs-hide { display: none !important; }

.ui-tabs .ui-tabs-nav li span.left { float: left; background-image: url(images/header/b2c_detail_lm_bg_t_l.gif); background-repeat: no-repeat; width: 5px; height: 24px; }
.ui-tabs .ui-tabs-nav li span.right { float: right; background-image: url(images/header/b2c_detail_lm_bg_t_r.gif); background-repeat: no-repeat; width: 5px; height: 24px; }
.ui-tabs .ui-tabs-nav li.ui-tabs-selected span.left { float: left; background-image: url(images/header/b2c_detail_lm_bg_to_l.gif); background-repeat: no-repeat; width: 5px; height: 29px; }
.ui-tabs .ui-tabs-nav li.ui-tabs-selected span.right { float: right; background-image: url(images/header/b2c_detail_lm_bg_to_r.gif); background-repeat: no-repeat; width: 5px; height: 29px; }


/* Datepicker
----------------------------------*/
.ui-datepicker { width: 17em; padding: .2em .2em 0;z-index:999; }
.ui-datepicker .ui-datepicker-header { position:relative; padding:.2em 0; }
.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next { position:absolute; top: 2px; width: 1.8em; height: 1.8em; }
.ui-datepicker .ui-datepicker-prev-hover, .ui-datepicker .ui-datepicker-next-hover { top: 1px; }
.ui-datepicker .ui-datepicker-prev { left:2px; }
.ui-datepicker .ui-datepicker-next { right:2px; }
.ui-datepicker .ui-datepicker-prev-hover { left:1px; }
.ui-datepicker .ui-datepicker-next-hover { right:1px; }
.ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span { display: block; position: absolute; left: 50%; margin-left: -8px; top: 50%; margin-top: -8px;  }
.ui-datepicker .ui-datepicker-title { margin: 0 2.3em; line-height: 1.8em; text-align: center; }
.ui-datepicker .ui-datepicker-title select { font-size:1em; margin:1px 0; }
.ui-datepicker select.ui-datepicker-month-year {width: 100%;}
.ui-datepicker select.ui-datepicker-month, 
.ui-datepicker select.ui-datepicker-year { width: 49%;}
.ui-datepicker table {width: 100%; font-size: .9em; border-collapse: collapse; margin:0 0 .4em; }
.ui-datepicker th { padding: .7em .3em; text-align: center; font-weight: bold; border: 0;  }
.ui-datepicker td { border: 0; padding: 1px; }
.ui-datepicker td span, .ui-datepicker td a { display: block; padding: .2em; text-align: right; text-decoration: none; }
.ui-datepicker .ui-datepicker-buttonpane { background-image: none; margin: .7em 0 0 0; padding:0 .2em; border-left: 0; border-right: 0; border-bottom: 0; }
.ui-datepicker .ui-datepicker-buttonpane button { float: right; margin: .5em .2em .4em; cursor: pointer; padding: .2em .6em .3em .6em; width:auto; overflow:visible; }
.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current { float:left; }
/* IE6 IFRAME FIX (taken from datepicker 1.5.3 */
.ui-datepicker-cover {
    display: none; /*sorry for IE5*/
    display/**/: block; /*sorry for IE5*/
    position: absolute; /*must have*/
    z-index: -1; /*must have*/
    filter: mask(); /*must have*/
    top: -4px; /*must have*/
    left: -4px; /*must have*/
    width: 200px; /*must have*/
    height: 200px; /*must have*/
}