@import url("/style/ui.theme.css");
@import url("/style/ui.core.css");
@import url("/style/ui.datepicker.css");
@import url("/style/ui.dialog.css");
@import url("/style/jquery.bubblepopup.css");

body {  margin:7px 2px 0 !important; padding:0 !important; background: #f0f0f0 url(/art/decor/pagefade.png) 0 0 repeat-x}
body, td, th, button { font-family: arial,helvetica,sans-serif; font-size: 12px }
body.framed { background: #fff; margin:0 !important; padding:0 !important}
td   { vertical-align: top;}
th   { text-align:left; vertical-align: bottom; line-height:1; font-weight:bold;}
input, textarea, select, option   { font-family: arial,helvetica,sans-serif; }

form { margin: 0px; }

a, input.headLoginButton, .searchResult a:hover  { color: #0074be; text-decoration:underline;}
a:hover, input.headLoginButton:hover, .searchResult a { color:#000; text-decoration: none; }
input.headLoginButton                { border:0; background:transparent; padding:0; margin:0; cursor:pointer;}
a img                                { border: none; }
a.locked, a.locked:link, a.locked:visited, a.locked:active, a.locked:hover {text-decoration:underline; color:#959595; cursor:default; text-decoration:none }
.note    { font-size: 10px; font-weight: bold; padding: 0 2px; }
.error   { color: #ff0000; font-weight: bold; padding-bottom: 5px; }
.message { color: #008000; font-weight: bold; padding-bottom: 5px; }
.clear   { clear: both; font-size: 0px; }

/*
 * Framework
 */
.backdrop {text-align:center}
.fullPage  { margin:auto; text-align:left; }
.fullPage, .menucell    { width: 950px; }

.menucell {overflow:hidden;}
.menucell ul { overflow:hidden; width:770px; list-style-type:none; padding:0;}
.menucell .strp {font-size:23pt; display:block; height:93px;}
.menucell .strp span {font-size:13pt; display:block; padding-top:4px}
.menucell .strp div {padding:12px 0 0}
.menucell ul, .menucell .strp { margin:0 0 0 177px }
.menucell ul li { float:left; margin:0 5px 0 0; padding:0; background:#fff url(/art/decor/navigation.png) 0px -27px no-repeat; padding-left:4px }
.menucell li, .menucell li div, .menucell li a { font-size:10pt; height:27px; line-height:27px; padding:0 7px 0 3px; display:block; float:left; font-weight:bold; text-decoration:none; background:#f0f0f0 url(/art/decor/navigation.png) 100% -27px no-repeat }
.menucell a { color:#0468AA }
.menucell a:hover { color:#EF4123 }
.menucell .locked, .locked:link, .locked:visited, .locked:active, .locked:hover {text-decoration:underline; color:#959595; cursor:default; text-decoration:none }

.menucell ul li.active, .menucell ul li.active a { color:#FFD400; background:#0468AA url(/art/decor/navigation.png) 0 0 no-repeat }
.menucell ul li.active a { background-position:100% 0px }

.middlecell { position:relative; overflow:hidden; min-height:80px; background: #fff url(/art/decor/crossbg.png) 100% 0% repeat-y; border: solid #0468AA 0; border-width: 0 2px; z-index:0; zoom:1}
.crsFt { position:absolute; height:40px; right:0; bottom:0; width:170px; background:#ECE9E9 url(/art/decor/sidefoot.png) 0% 100% repeat-x; z-index:-1 }
.panelcell   { float: left; }
.panelcell_collapse   { display:none; }

.contentcell { width: 588px; float: left; margin:15px 0 0 8px }
.contentcell_fullwidth, .contentcell_fullwidth iframe { width: 781px; }
.content {overflow:hidden}

.crosscell   { width:170px; float:right; padding:0 }

.accountForm {width:300px; border:solid black 1px}


body.wide .crosscell, body.wide .crsFt { display:none }
body.wide .middlecell {background: #fff}
body.wide .contentcell {  width:758px; }

/*
 * Paginator
 */

.page { text-align:center; padding:15px 50px 0 50px}
.page .prev { float:left; }
.page .next { float:right; }
.page .num { margin:0 3px 0 3px}
.page .cur { font-weight:bold; text-decoration:none;}


/*
 * header
 */
.headcell {overflow:hidden; padding:0px 6px}
#mainHead { margin-left:168px; zoom:1}
#logo {height:108px; float:left; padding:0; background:none; margin-left: 10px}

#terNav {text-align:right; overflow:hidden }
#terNav .greet {margin-right:15px}
#terNav a {margin:0 5px; font-size:0.8em; text-decoration:none }
#accountBar { color:#fff;  background:#0468AA; height:35px; line-height:35px; vertical-align: }
#accountBar a { color:#fff; }

/* left side */
button.bluBtn, button.redBtn, button.gryBtn {color:#fff; border:0; margin:0;  padding:0; cursor:pointer; background:transparent; height:25px;}
button.gryBtn {color:#000}
button .w, button .e {white-space:nowrap; display:block; height:25px; line-height:24px; background:transparent url(/art/decor/navigation.png) 0 0 no-repeat; zoom:1;  }
button .w {padding:0 0 0 7px; margin-right:7px; position:relative}
button .e {width:7px; position:absolute; top:0; right:-7px;}

button.css3, input.formButton {
  border:0;
  color:#000; padding:0 7px; margin:0 3px 4px 0; height:21px; line-height:21px;
     -moz-border-radius: 5px; /* FF1+ */
  -webkit-border-radius: 5px; /* Saf3-4, iOS 1+, Android 1.5+ */
          border-radius: 5px; /* Opera 10.5, IE9, Saf5, Chrome, FF4 */
  -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box;
     -moz-box-shadow: 0px 1px 5px rgba(0, 0, 0, 0.8);
  -webkit-box-shadow: 0px 1px 5px rgba(0, 0, 0, 0.8);
          box-shadow: 0px 1px 5px rgba(0, 0, 0, 0.8);
  background-color: #efefef;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#e2e2e2)); /* Saf4+, Chrome */
  background-image: -webkit-linear-gradient(top, #ffffff, #e2e2e2); /* Chrome 10+, Saf5.1+ */
  background-image:    -moz-linear-gradient(top, #ffffff, #e2e2e2); /* FF3.6 */
  background-image:     -ms-linear-gradient(top, #ffffff, #e2e2e2); /* IE10 */
  background-image:      -o-linear-gradient(top, #ffffff, #e2e2e2); /* Opera 11.10+ */
  background-image:         linear-gradient(top, #ffffff, #e2e2e2);
            filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#ffffff', EndColorStr='#e2e2e2'); /* IE6-IE9 */
}

button.red {
  color:#fff;
  background-color: #ED2B3C;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#ED7F89), to(#ED1E31)); /* Saf4+, Chrome */
  background-image: -webkit-linear-gradient(top, #ED7F89, #ED1E31); /* Chrome 10+, Saf5.1+ */
  background-image:    -moz-linear-gradient(top, #ED7F89, #ED1E31); /* FF3.6 */
  background-image:     -ms-linear-gradient(top, #ED7F89, #ED1E31); /* IE10 */
  background-image:      -o-linear-gradient(top, #ED7F89, #ED1E31); /* Opera 11.10+ */
  background-image:         linear-gradient(top, #ED7F89, #ED1E31);
            filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#ED7F89', EndColorStr='#ED1E31'); /* IE6-IE9 */
}

input.formButton {margin-left:3px; margin-top:2px}



button.bluBtn .w {background-position:0px -106px}
button.bluBtn .e {background-position:100% -106px}
button.gryBtn .w {background-position:0px -81px}
button.gryBtn .e {background-position:100% -81px}
button.redBtn .w {background-position:0px -54px}
button.redBtn .e {background-position:100% -54px}

#sideBox { width:150px; margin:0 8px; padding:15px 0; line-height:100%; font-weight:bold; font-size:9pt; background:#ECE9E9 url(/art/decor/menufoot.png) 0% 100% no-repeat; }
#sideBox ul, #sideBox li {margin:0; padding:0; overflow:hidden}
#sideBox li { list-style:none; padding:0 0 5px; margin:3px 12px; border-bottom:0px solid #db0;}
#sideBox li.active {  }
#sideBox li li { border-bottom:0; padding:0; margin:8px 0 8px 12px;}
#sideBox li a       { color: #000; text-decoration: none; }
#sideBox li a:hover { color: #000; text-decoration: underline; }

#sideBox legend {font-size:10pt; font-weight:bold;color:#000; padding:0; margin:0 }
#sideBox fieldset {overflow:hidden; border:0; padding:0; display:block; margin:5px 0 0 12px; width:130px }

#sideBox .formElement {border:0; background:#fff }
#sideBox .formButtons {text-align:right; padding-top:3px;}

#sideBox .formElement, #sideBox .formButton {padding:0;}

#foot {font-size:7pt; clear:both; overflow:hidden}
#footBar {background:#0468AA; position:relative;}
#footBar a {color:#fff; text-decoration:none;margin:0 10px }
#footBar a:hover {color:#fff; text-decoration:none}
#footBar { font-size:14px; font-weight:bold;  padding:4px 0 0 5px; text-decoration:none; }

.fllw {position:absolute; right:0; top:4px}
.fllw img {vertical-align:middle}

.pagefoot { height:10px; background:url(/art/decor/footer.png) 0 100% no-repeat; margin-bottom:10px }
.footIcon    { float: right; }
.footIcon a   { text-decoration:none; color:#444; padding:0 5px; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; }
.footIcon a:hover   { color:#000; text-shadow:0 1px 0 #fff; background-image:-moz-linear-gradient(#ebebeb 0%, #e0e0e0 100%); background-image:-webkit-gradient(linear, left bottom, left top, color-stop(0, #e0e0e0), color-stop(1, #ebebeb));}

#accountBar { font-size:90%; overflow:hidden}
#accountBar .condensed {display:block; float:right; overflow:hidden; border:0; padding:0;}
#accountBar .lbl { font-size:120%; font-weight:bold }
#accountBar .lbl, #accountBar .loginbox label, #accountBar .loginbox input {display:block;float:left}
#accountBar label { margin:0 5px 0 10px }
#accountBar input {margin-top:8px; padding:1px 2px;}
#accountBar input, #accountBar input:-webkit-autofill {background:#fff !important; border:0 }
#accountBar button {margin:4px 8px 0 5px; border:0}
#accountBar #lgnPswd, #accountBar #lgnEml {width:90px}
input:-webkit-autofill
/* right side */


#crossBox { position:relative; width:170px; padding:15px 0 0 0; }
#crossBox .cnt { padding:10px 0 0 10px; font-size:12px}
#crossBox div img { margin:2px 25px }
#crossBox p       { color:#000; margin:10px 6px 13px 1px; text-align:center; font-size:1em }
#crossBox img.banner {margin:20px 0 0 10px}

/**/
#srchCode, #srchKywd {width:99%}

#hero {width:588px; margin:-5px 0 0 0; background-position: 380px 50%; background-repeat: no-repeat }
#hero .n {height:18px; background:url(/art/decor/heropane/herohead.png) 0 0 no-repeat; behavior:url(/style/iepngfix.htc)}
#hero .s {height:18px; background:url(/art/decor/heropane/herofoot.png) 0 0 no-repeat; behavior:url(/style/iepngfix.htc); clear:both;}
#hero .cnt {padding:0 225px 0 20px; overflow:hidden; background:url(/art/decor/heropane/heroedge.gif) 0 0 repeat-y}
#hero .cnt p {font-weight:bold}
#hero h2 { font-size:15pt; color:#0468AA; margin-bottom:10px; line-height: 100%; }
#hero .more {zoom:1}

.hero {width:588px; margin:-5px 0 0 0; background-position: 380px 50%; background-repeat: no-repeat }
.hero .n {height:18px; background:url(/art/decor/heropane/herohead.png) 0 0 no-repeat; behavior:url(/style/iepngfix.htc)}
.hero .s {height:18px; background:url(/art/decor/heropane/herofoot.png) 0 0 no-repeat; behavior:url(/style/iepngfix.htc); clear:both;}
.hero .cnt {padding:0 225px 0 20px; overflow:hidden; background:url(/art/decor/heropane/heroedge.gif) 0 0 repeat-y}
.hero .cnt p {font-weight:bold}
.hero h2 { font-size:15pt; color:#0468AA; margin-bottom:10px; line-height: 100%; }
.hero .more {zoom:1}

.contentcell .promo {width:588px; margin:-5px 0 0 0; background-position: 0px 50%; background-repeat: no-repeat }
.promo .n {height:18px; background:url(/art/decor/promo/head.png) 0 0 no-repeat; behavior:url(/style/iepngfix.htc)}
.promo .s {height:18px; background:url(/art/decor/promo/foot.png) 0 0 no-repeat; behavior:url(/style/iepngfix.htc); clear:both;}
.promo .cnt {padding:0 20px 0 225px; overflow:hidden; background:url(/art/decor/promo/edge.gif) 0 0 repeat-y}
.promo .cnt p {font-weight:bold}
.promo h2 { font-size:15pt; color:#0468AA; margin-bottom:10px; line-height: 100%; }
.promo .more {zoom:1}
#sideBox li.promo a {color:#A90A17}


#hero.heroFull {background-position: 10px 50%}
#hero.heroFull .n {background-image:url(/art/decor/heropane/herohead-full.png); behavior:url(/style/iepngfix.htc)}
#hero.heroFull .s {background-image:url(/art/decor/heropane/herofoot-full.png); behavior:url(/style/iepngfix.htc); clear:both;}
#hero.heroFull .cnt {display:block; background-image:url(/art/decor/heropane/heroedge-full.gif)}


.homePage a.jobs { position:relative; display:block; width:574px; height:33px; line-height:33px; color:#000;
                   margin-left:7px; background:url(/art/decor/newsbar.png) 0 0 no-repeat;}
.homePage a.jobs, .homePage a.jobs:hover {text-decoration:none}
.homePage a.jobs .lbl { padding:0 11px;  font-weight:bold; color:#EF4123;}
.homePage a.jobs .btn {  position:absolute; right:0; top:0; padding:0 11px; }

ul.siteMap .listTopLvl { background:none; }
ul.siteMap .listTopLvl.active { background:none;}

.loginLabel  { padding-right: 10px; }
.loginLabel a, input.headLoginButton  { font-size: 8pt; padding:0 9px 0 0; }

.formLabel   { padding-right: 10px; }
.formElement { border: 1px solid #969696; width: 105px; background-color: #fff; padding: 2px; }
.formElement.shortField { width: 55px; }
.formElement.longField { width: 250px; }
.xformButton  { background:#fff8a6; border: outset #fff8a6 1px; cursor:pointer; }
.formButton  { background:#dc2914; color:#fff; border:0; cursor:pointer }
.formButton.disabled  { background:#999; color:#ddd; cursor:normal }
.formButtons {overflow:hidden; zoom:1}

.formList             { }
.formList a           { display: block; }
.formList a.completed { font-weight: bold; }
.formTitle            { font-weight: bold; padding: 2px; background: #f0f0f0; }
.formSubTitle         { font-weight: bold; padding: 2px; background: #f0f0f0; margin-top: 5px; }

.searchResults { padding: 2px; margin-top: 20px; }

.searchResults .listLine0 { background: #f8f8f8; padding: 0 2px }
.searchResults .listLine1 { background: #f0f0f0; padding: 0 2px }

.searchResult .title     { margin-bottom: 5px; }
.searchResult .relevance { font-size: 10px; margin-left: 10px; }
.searchResult .sample    { margin-left: 10px; }



.searchResult  { font-size:130%; }
.searchResult th { color: #0074BE; background: #fff; border-bottom: solid #a1a1a1 2px; }

caption { text-align:left }
.searchResult th, .searchResult td { font-size:100%;padding: 4px; }
.searchResult td.photo { width:45px; }
.searchResult td { cursor:pointer }
.searchResult .photo div { width:45px; height:45px; border:solid #fff 1px; background-color:#fff;background-image:url(/art/decor/noimage.png); background-position:50% 50%; background-repeat:no-repeat; cursor:pointer}
.searchResult .matches {font-weight:bold}
td.noEvProp { cursor:default }

/*
 * Site-wide defaults for the various classes, list type specific values are set below
 */

.blueLine { border-bottom: solid 2px #ffcb00; margin-top: 6px; margin-bottom: 16px; }
.pageFull { margin-left: 12px; }
.pageWide { width: 62%; float: left; margin-right: 12px; }
.pageThin { width: 31%; float: left; }

.regFormLink { margin-top: 20px; background: #d0d0d0; }

.objectForum { border-top: 1px solid #000000; margin-top: 20px; }

.list .title      { padding-top: 8px; font-weight: bold; }
.list .image      { float: left; margin-right: 8px; padding-top: 12px; }
.list .noresults  { padding-top: 8px; font-weight: bold; }

.vacancies .list  .title  {display:inline; padding:0 2em 0 0}
.vacancies .list  .standfirst  {display:inline}
.vacancies .list  .pad  {padding:8px 0}

.item .title      { padding-top: 12px; font-size: 14px; font-weight: bold; color: #0074be; }
.item .standfirst { padding-top: 8px; font-weight: bold; }
.item .body       { padding-top: 8px; }
.item .image { float: right; clear:right }
.item .image img.image { float:none }
.item .image a  { display:block; overflow:hidden; margin: 0 8px 8px 8px; }
.item  table	  { clear:both; margin-top:5px;}

.jobs .item  .date {text-align:right}
.jobs .item  .standfirst { clear:left; padding: 8px 0}
.jobs .item  .body {clear:left}

.separator {clear:left; height:1px}

.categories { padding-top: 8px; float: right; }
.back       { padding-top: 8px; }

.more          { display: block; overflow:hidden }
.more button  { float:right; }

.view .prev { float: left; }
.view .next { float: right; }
.view .num  { margin-left: 2px; margin-right: 2px; }
.view .curr { font-size: 16px; font-weight: bold; }

.files { width: 160px; border: 1px solid #d0d0d0; border-radius:3px; -moz-border-radius:3px;  float: right; margin: 15px 0 0 15px;
-webkit-box-shadow:0 2px 6px rgba(0,0,0,0.1);
   -moz-box-shadow:0 2px 6px rgba(0,0,0,0.1);
        box-shadow:0 2px 6px rgba(0,0,0,0.1);
 }
.knowledgecentre .files         { width: 250px; }
.fileHead      { clear:left; color:#333; background: #d0d0d0; font-weight:bold; margin: 0px; padding-left: 2px;
background-image:-moz-linear-gradient(#e0e0e0, #d0d0d0);
background-image:-webkit-linear-gradient(#e0e0e0, #d0d0d0);
}
.fileSubHead   { clear:left;  padding-left: 4px; }
.files a       {padding:2px 4px}
.files a  img      {margin-right:6px}


.item .image .files  { float:none }
.item .image .files img  { float:left; clear:left; }
.files br { clear:left; line-height:5px;}
.fileTitle {padding-left:15px;}


/*
 * Fun stuff herein
 * Each list type has a class
 * Each list type can appear in a list of as an item
 * Each item attribute has a class
 *
 * e.g. ".news .list .standfirst" refers to the standfirst of a news story in the list context
 *
 * Also the "...read more" and "View the X page" links have a class each of their own
 *
 * Also the "Related Files" boxout has a class
 * The "Related Files" header has a class
 * The file type titles under "Related Files" have a class
 *
 * e.g. ".news .fileHead" refers to the related files header for a news story
 */

.customers .list .title  { padding-top: 8px; font-weight: bold;}

.casestudies .list .date  { padding-top: 8px; }
.casestudies .list .title { font-weight: bold; }

.csr .list .date         { padding-top: 8px; }
.csr .list .title        { font-weight: bold; }

.faqs .list .title       { padding-top: 12px; font-weight: bold; }


.news .list .title      { padding-top: 8px; }
.news .list .title, .news .list .standfirst, .news .list .more, .finstats .list .title, .finstats .list .standfirst, .finstats .list .more   { margin-left: 48px; }

.newsThin .list .title      { padding-top: 8px; }
.newsThin .list .standfirst { font-weight: bold; }
.newsThin .list .image      { display: none; }

.ourcustomers .list .title      { margin-left: 48px; padding-top: 8px; }
.ourcustomers .list .standfirst { margin-left: 48px; }
.ourcustomers .list .more       { margin-left: 48px; }

.hmgrd  {color:#636363}
.hmgrd .list, .hmgrd .separator {width:24px; float:left; clear:none}
.hmgrd .list {width:180px }
.hmgrd .list .image {float:none}
.hmgrd .list a.image {display:block; text-align:center}
.hmgrd p.title a {text-decoration:none; font-size:115%; color:#EF4123; margin: 0 0 5px; }
.hmgrd .button {color:#000}
.hmgrd p.standfirst {font-size:9pt}

.custhome .item0, .custhome .item1 {float:left; margin:0 0 20px; padding:0; width:294px; height:272px; position:relative; overflow:hidden;}

.custhome .item0 p, .custhome .item1 p, .custhome .itemExpand p, .custhome .item0 li, .custhome .item1 li,
.colExpand li {font-size:90%; line-height:150%}

.custhome .item0 .pad, .custhome .item1 .pad {margin:1px 5px 14px}
.hmgrd .emph, .custhome .emph {color:#1366f0}

.colMore, .colLess  {position:absolute;bottom:0px; padding:3px 0 0 3px; width:100% }
.custhome .item0 .colMore, .custhome .item1 .colMore, .custhome .item0 .colLess, .custhome .item1 .colLess { width:98% }

.colMore { } //background:transparent url(/art/decor/tailFade.png); behavior: url(/style/iepngfix.htc) }

.colLess  {right:0;width:auto; background:#fff}
.colMore a, .colLess a  {float:right;background:#fff;display:block;border:solid #2386ff 1px; border-right:0; border-bottom:0; padding:3px;}
.colExpand { background:#fff; }
.colExpand .pad {margin:0 4px 14px}
.custhome .separator {display:none}
/* legacy styles */

a.bulletLink:link, a.bulletLink:active, a.bulletLink:visited, a.bulletLink:hover { color: #000; font-size: 9pt; font-weight: bold; text-decoration: none;}

.mandatory:after {content:'*' }

/* content */

.contentContainer { position:relative; visibility: visible; z-index:0; padding: 0px; } /* width:99%;*/
.orderHeadContainer { padding: 3px 5px 0; vertical-align:bottom; }
.orderListContainer { padding: 3px 5px 0; }
.orderHeadContainer td, .orderListContainer td {border:solid black 1px;}

.copyContainer { padding: 3px 0 5px 5px; }
.copyContainer.browseList br { margin-bottom:25px; vertical-align:top; }
.subHeading, legend { font-size:120%; font-weight:bold; margin-bottom:0; padding-bottom:5px }
.crossHeading { font-size: 10pt; font-weight: bold; margin-bottom:0px; }
ul.ypoBullet { list-style-image: url(/images/bullet1.gif); }
ul.ypoBullet li { margin-bottom: 8px; padding-left: 5px; }
hr.rule { border: 0px; border-bottom: solid black 1px; padding: 5px 0px 5px 0px; }
.textRed { color: #c80d1d }
.objectRight { float: right; margin-left: 10px; }

.rowShade0 { background-color:#ffffdf; }
.rowShade1 { background-color:#fffff5; }

.contractTable { width:540px; margin-left: 20px; }
.contractSelector {float:right; margin:10px 0 10px 0}
.contractTitle {clear:right}

/* table headings */

.sectionTitle { margin-bottom: 5px; }
.listTitle { width:100%; margin-bottom: 0px; }

.titleRedLeft  { background: #c80d1d; width: 7px; text-align: left; }
.titleRedRight { background: #c80d1d; width: 21px; text-align: right; }
.titleRedText  { background: #c80d1d; line-height:1; vertical-align:middle; color: #fff; font-weight: bold; overflow: hidden; padding: 2px 5px 2px 5px }

.titleBlueLeft  { background: #0074be; width: 7px; text-align: left; }
.titleBlueRight { background: #0074be; width: 21px; text-align: right; }
.titleBlueText  { background: #0074be; line-height:1; vertical-align:middle; color: #fff; font-weight: bold; overflow: hidden; padding: 2px 5px 2px 5px }

.titleGreyLeft  { background: #6a6a6a; width: 7px; text-align: left; }
.titleGreyRight { background: #6a6a6a; width: 21px; text-align: right; }
.titleGreyText  { background: #6a6a6a; line-height:1; vertical-align:middle; color: #fff; font-weight: bold; overflow: hidden; padding: 2px 5px 2px 5px }

a.titleRedText, a.titleRedText:link, a.titleRedText:visited, a.titleRedText:hover,
a.titleBlueText, a.titleBlueText:link, a.titleBlueText:visited, a.titleBlueText:hover,
a.titleGreyText, a.titleGreyText:link, a.titleGreyText:visited, a.titleGreyText:hover  { color: #fff; text-decoration: none; width:100%; cursor: pointer; display:block; }

a.button, a.button:link, a.button:visited, a.button:hover { color: #fff; text-decoration: none; width:100%; cursor: pointer; display:block; }

.buttonText, .medButtonText, .longButtonText, .xLongButtonText { text-align:center; vertical-align:middle; white-space: nowrap; line-height:1;  }
.yellowButton a.button, .yellowBar a.button { color: #000; }
.redButton td, .blueButton td, .yellowButton td, .greyButton td {padding:0px !important}



.redButton .buttonText,    .redButton .medButtonText,    .redButton .longButtonText,    .redButton .xLongButtonText,    .redBar .barText    { background: #c80d1d; color: #fff;}
.blueButton .buttonText,   .blueButton .medButtonText,   .blueButton .longButtonText,   .blueButton .xLongButtonText,   .blueBar .barText   { background: #0074be; color: #fff;}
.yellowButton .buttonText, .yellowButton .medButtonText, .yellowButton .longButtonText, .yellowButton .xLongButtonText, .yellowBar .barText { background: #fff469; color: #000;}
.greyButton .buttonText,   .greyButton .medButtonText,   .greyButton .longButtonText,   .greyButton .xLongButtonText,   .greyBar .barText   { background: #6a6a6a; color: #fff;}


.blueBar .buttonDetailRight { width:16px; background:transparent; background-image:url(/art/forms/blueDown.gif) }
.yellowBar .buttonDetailRight { width:16px; background:transparent; background-image:url(/art/forms/yellowDown.gif) }
.blueBar .buttonCloseRight { width:16px; background:transparent; background-image:url(/art/forms/blueClose.gif) }
.yellowBar .buttonCloseRight { width:16px; background:transparent; background-image:url(/art/forms/yellowClose.gif) }

.redButton .buttonDetailRight { background:transparent; background-image:url(/art/forms/redRight.gif) }
.blueButton .buttonDetailRight { background:transparent; background-image:url(/art/forms/blueRight.gif) }
.yellowButton .buttonDetailRight { background:transparent; background-image:url(/art/forms/yellowRight.gif) }
.greyButton .buttonDetailRight { background:transparent; background-image:url(/art/forms/greyRight.gif) }

.redButton .buttonDetailLeft { background:transparent; background-image:url(/art/forms/redLeft.gif) }
.blueButton .buttonDetailLeft { background:transparent; background-image:url(/art/forms/blueLeft.gif) }
.yellowButton .buttonDetailLeft { background:transparent; background-image:url(/art/forms/yellowLeft.gif) }
.greyButton .buttonDetailLeft { background:transparent; background-image:url(/art/forms/greyLeft.gif) }

.blueButton, .redButton, .yellowButton, .greyButton, .blueBar, .redBar, .yellowBar, .greyBar {  line-height:1; font-weight: bold; padding:0px; height: 16px; text-decoration: none; }
.redButton .buttonText, .blueButton .buttonText, .yellowButton .buttonText, .greyButton .buttonText { width: 50px; text-decoration: none; white-space: nowrap;}
.redBar .barText, .blueBar .barText, .yellowBar .barText, .greyBar .barText { line-height:1; text-decoration: none; white-space: nowrap; vertical-align:middle; padding: 0px 5px 0px 5px; }

.redButton .buttonText, .blueButton .buttonText, .yellowButton .buttonText, .greyButton .buttonText                 { width: 50px; text-decoration: none; white-space: nowrap;}
.redButton .medButtonText, .blueButton .medButtonText, .yellowButton .medButtonText, .greyButton .medButtonText     { width: 100px; text-decoration: none; white-space: nowrap;}
.redButton .longButtonText, .blueButton .longButtonText, .yellowButton .longButtonText, .greyButton .longButtonText { width: 160px; text-decoration: none; white-space: nowrap;}
.redButton .xLongButtonText, .blueButton .xLongButtonText, .yellowButton .xLongButtonText, .greyButton .xLongButtonText { width: 190px; text-decoration: none; white-space: nowrap;}

/* ordering */

.entryTitle { width:100%; }
.itemFindPanel, #faveItems form, #savedOrders form {width:100%}

.foundItemsList { width: 99%; }
.itemContainer { padding-top: 3px; }

#additionaInfoContainer, #additionalInfoContainer { display:none; margin: 0 2px; }
#additionalTextInfoContainer, #additionalListInfoContainer { display:none; margin: 0 7px; }
#itemSearch, #favSaveItems { display:none; }

.itemCode { width: 110px; }
.itemCode input { border: 0; padding: 0 3px; }
.itemDetail { height: 18px; overflow:hidden; }
.itemDetail, .itemDetail a { color: #c80d1d; font-weight: bold; overflow:hidden; }
.itemNumeric { width: 50px; text-align:right; white-space:nowrap;}
.itemNumeric input { border: 0px; padding: 0px 3px 0px 3px; }
td.itemAddInfo { padding: 0px 3px 0px 3px ! important; vertical-align:middle ! important; }
td.itemAddInfo input { border: 0px; padding: 0px 3px 0px 3px; }
.itemTitleBar td {}
.itemHeading td { font-size: 11px; background: #fdd6c1; padding: 1px 0; }
.itemValues td { font-size: 11px; background: #fab69a; padding: 1px 0 ; }
.itemFooting td { background: #fdd6c1; }

.itemHeading .itemCode, .itemValues .itemCode { padding: 0 5px; }
.itemHeading .itemNumeric, .itemValues .itemNumeric { padding: 0 5px; }
.itemHeading .itemAddInto, .itemValues .itemAddInto { padding: 0 5px; }

.orderHeadRow, .orderHeadRow a { color: #000; background: #e8e8e8; }
.orderHeadRow td, .orderHeadRow th {  font-size: 12px; font-weight: bold; padding: 2px 3px 1px; border-bottom: solid #a1a1a1 2px; }
#orderDetail, #orderDetail .formButtons, .orderBackground, tr.orderBackground td { background: #e9e9e9; overflow:hidden }
tr.orderItem td, tr.newsItemRow0 td, tr.newsItemRow1 td  { padding: 2px 3px 1px; color: #000; }
.orderItem a, .newsItemRow0 a, .newsItemRow1 a { color: #000; }
td.row0, tr.row0 td, td.newsItemRow0, tr.newsItemRow0 td { background: #e9e9e9; }
td.row1, tr.row1 td, td.newsItemRow1, tr.newsItemRow1 td { background: #fff; }
.orderItem input { width:4ex; border: 0px; }


.orderCell_left {width: 10px}
.orderCell_item {width: 4em}
.orderCell_detail {width: 32px; white-space:nowrap}
.orderCell_desc {}
.orderCell_unit {text-align:center; width: 2em}
.orderCell_qty  {text-align:right; width: 2em}
.orderCell_price {text-align:right; width: auto;}
.orderCell_total {text-align:right; width: 5em;}
.orderCell_delete, .orderlabel_fave {text-align:center; width: 25px}
.orderCell_label {text-align:right}

.itemNo {width: 4em}
.unit {width: 4em}
.priceWas {color:#E10F1A; font-size:80%; text-align:right}
th.price,td.price {text-align:right; width:6em}

.orderItem .icon {width:2em}

.orderCell_left {width: 10px}
.orderCell_item {width: 4em}
.orderCell_detail {width: 32px; white-space:nowrap}
.orderCell_desc {}
.orderCell_unit {text-align:center; width: 2em}
.orderCell_qty  {text-align:right; width: 2em}
.orderCell_price {text-align:right; width: auto;}
.orderCell_total {text-align:right; width: 5em;}
.orderCell_delete, .orderlabel_fave {text-align:center; width: 25px}
.orderCell_label {text-align:right}

.orderCell_qty input.loading {background:#fff url(/art/input_loading.gif) 100% 50% no-repeat;}

/* order tracking */

.orderStatusField { border: solid black 1px; }
.orderStatusButton { border: solid black 1px; height:20px; padding:0px; }
.orderStatusListContainer { border: solid black 1px; width:100%; }
.orderStatusListContainer td { padding:3px; }
.orderStatusListHeader td { border-bottom: solid black 1px; }
.sortDirInd { font-size: 8px; font-weight:bold; vertical-align: super; padding-left: 3px;width:20px;}
.orderStatusListRowEven { background-color: #eef }
.orderStatusListRowEven td, .orderStatusListRowOdd td { padding-right: 10px; }

.orderStatusListFooter td { font-weight: bold; text-align:center; border-top: solid black 1px; }

#orderDetail .formButtons {clear:both;padding:3px 5px}

.formButtons .nega {float:left}
.formButtons .nega button {margin-right:5px;}
.formButtons .posi {float:right}
.formButtons .posi button {margin-left:5px;}

.listNavPostion { width:140px; }
.listNavPrev, .listNavNext {  }
.listNavPrev { padding-right:20px; }
.listNavNext { padding-left:20px; }

a * { cursor: pointer; }

.bold { font-weight:bold; }

.notify { width: 400px; background:#eee; border: solid black 1px; padding:5px; }
#notify { position: absolute; visibility: hidden; z-index: 99;}

.ui-dialog-content select {width:100%}

.prodPromo {padding-bottom:5px; width:150px}
.prodPromo .price {float:right}
#crossBox .prodPromo img {display:block; margin:0 auto; text-align:center}
.prodPromo img.scaled {width:100%}
.prodPromo .title, .prodPromo .price, .reducedPrice {font-weight:bold}
.prodPromo .price, .reducedPrice {margin-left:5px;color:#E10F1A}
#crossBox .prodPromo p {color:#000; line-height:110%; font-size:90%; text-align:justify}

.tip {cursor:default}
#tooltip { position: absolute; z-index: 3000; opacity:0.85; background:#fff; border:solid #0099da 2px; -moz-border-radius: 4px; -webkit-border-radius: 4px;}
#tooltip h3, #tooltip div { margin: 0; padding:0; }
#tooltip h3 {font-size:10pt;padding:6px;}


.greenCnt {width:250px; clear:right;float:right;margin:0; border: solid #08ae62 2px; padding:2px;}
.greenCnt legend {color:#08ae62}
.greenCnt img {clear:left; float:left;}
.greenCnt br {clear:left;}
.greenCnt div {font-size:90%; margin-left:50px;}

fieldset.specs {clear:both}

.invoiceDetail {overflow:auto}
.invoiceDetail .header  {overflow:hidden}
.invoiceDetail .header th {width:9em}
.invoiceDetail fieldset {border:solid black 1px; margin:5px 0}

.holDateIntro legend {font-size:10px}
.holDateIntro p {width:300px; float:right; padding:0; margin:0}
#daterange { width:250px; overflow:hidden }
.dateRange { border:1px solid #ddd; background-color:#fff; padding:2px; margin:0 0 1px 0; clear:both; overflow:hidden }
.dateAdd { float:right; position:relative; padding-right:1.5em }
.dateRange a { float:right; margin:0 }
#dateSend label {width:10em; float:left}
#dateSend div {clear:left}

form.neu {overflow:none}
form.neu label {position:relative; display:block; overflow:hidden; line-height:2em; clear:left }
form.neu label div {width:10em; display:block; clear:left; float:left}
form.neu .chkRad input {position:absolute; left:0}
form.neu .chkRad div {margin-left:3em}
form.neu.wide label div {width:15em}
form.neu .formButtons {margin-left:10em; display:block; float:left; clear:left;}
form.neu fieldset {position:relative; padding:1em; background:#fff; border:solid #eee 1px; border-radius:5px; box-shadow:0 2px 7px rgba(0,0,0,0.1); }
form.neu .formButtons.noAlign {margin:1em 0 0 0;}
form.fldst .formButtons {margin:1em 0 0 11em;}
form.fldst .formButtons.noAlign {margin:1em 0 0 1em;}

.msg {clear:both; font-weight:bold; padding:1em 0;}
.msg img {text-align:center; margin:auto;}
.inLblFcs { color: #666; font-style: italic; }

.dateRangeAdd    { position: absolute; right: 1em; ;background-image:url(/art/jquery/ui-icons_e0fdff_256x240.png); background-position:-16px -128px; background-repeat:no-repeat; width:16px; height:16px; text-indent:-1000px }
.dateRangeEdit   { background-image:url(/art/jquery/ui-icons_056b93_256x240.png); background-position:-64px -112px; background-repeat:no-repeat; width:16px; height:16px; text-indent:-1000px }
.dateRangeDelete { background-image:url(/art/jquery/ui-icons_056b93_256x240.png); background-position:-80px -128px; background-repeat:no-repeat; width:16px; height:16px; text-indent:-1000px }

.range-in .ui-state-default,   .ui-widget-content .range-in .ui-state-default   {border: 1px solid #c47d03; background: #d6ce00 url(/art/jquery/ui-bg_glass_55_d6ce00_1x400.png) 50% 50% repeat-x; color: #000000; }
.range-in .ui-state-active,    .ui-widget-content .range-in .ui-state-active    {border: 1px solid #c47d03; background: #d6ce00 url(/art/jquery/ui-bg_glass_55_d6ce00_1x400.png) 50% 50% repeat-x; color: #000000; }
.range-in .ui-state-highlight, .ui-widget-content .range-in .ui-state-highlight {border: 1px solid #c47d03; background: #d6ce00 url(/art/jquery/ui-bg_glass_55_d6ce00_1x400.png) 50% 50% repeat-x; color: #000000; }

.range-out .ui-state-default,   .ui-widget-content .range-out .ui-state-default   { margin:0 3px 0 0; border: 1px solid #0099da; background: #0099da url(/art/jquery/ui-bg_glass_75_0099da_1x400.png) 50% 50% repeat-x; font-weight: bold; color: #ffffff; outline: none; }
.range-out .ui-state-active,    .ui-widget-content .range-out .ui-state-active    { margin:0 3px 0 0; border: 1px solid #0099da; background: #0099da url(/art/jquery/ui-bg_glass_75_0099da_1x400.png) 50% 50% repeat-x; font-weight: bold; color: #ffffff; outline: none; }
.range-out .ui-state-highlight, .ui-widget-content .range-out .ui-state-highlight { margin:0 3px 0 0; border: 1px solid #0099da; background: #0099da url(/art/jquery/ui-bg_glass_75_0099da_1x400.png) 50% 50% repeat-x; font-weight: bold; color: #ffffff; outline: none; }

.login .ui-dialog-content .loginMsg { margin-bottom: 8px; }
.login .ui-dialog-content .formElement { background: transparent; border: none; width:auto }
.login .ui-dialog-content label { width: 100px; text-align: right; display: block; float: left; clear: left; }
.login .ui-dialog-content input { width: 150px; margin-left: 8px; border: 1px solid #000; background-color: #fffaf0; }


#dlmSurvey .formButtons { float:right; padding:3px 3px 0 0 }
#dlmSurvey fieldset { border:solid #0099DA 1px }
#dlmSrvyCnt.intro fieldset { border:0 }
#dlmSurvey .wrp2 { padding-top:10px }
#dlmSrvyCnt .qtn .formElement {width:90%; padding:0 0 4px 4px}
#dlmSrvyCnt .qtn .formButtons {float:none; text-align:right; display:none; padding-top:15px}
#dlmSrvyCnt.intro .formButtons input {visibility:hidden}
#dlmSrvyCnt.intro .qtn .formButtons input {visibility:visible}
#dlmSrvyCnt.intro .qtn .formButtons {display:block}

button.terms {float:right; margin-bottom:1em}
.mmbrevents {clear:both}
.mmbrevents .split {float:left; width:49%; padding:0; }
.mmbrevents .listHead {border:solid #f0f0f0 1px; border-left:0; border-right:0; }
.mmbrevents .past {float:right}
.mmbrevents .listHead h3 {margin:0; padding:8px 0 8px 5px}
.mmbrevents .item0, .mmbrevents .item1 {margin:0; padding:8px 0; border-bottom:solid #f0f0f0 1px}
.mmbrevents .list .date {font-weight:bold}
.mmbrevents .list .file {margin:5px 0 20px; overflow:hidden}

.mmbrevents .past .item0, .mmbrevents .past .item1 {padding-left:10px}
.mmbrevents .coming .item0, .mmbrevents .coming .item1 {padding-right:10px}

.mmbrevents .past .date,   .mmbrevents .past .file   {padding:0 10px}
.mmbrevents .coming .date, .mmbrevents .coming .file {padding:0 10px}

.mmbrevents .list button {clear:left; float:left; width:6em;}
.mmbrevents .split .title {font-weight:normal; padding:0; margin-left:8em; font-size:85%}

.mmbrevents .cal p {float:left; padding:0 0 0 3em}
.mmbrevents .cal .date {}
.mmbrevents .cal button {float:right; clear:none}
.mmbrevents .cal .item0, .mmbrevents .cal .item1 {clear: both; overflow: hidden}

.pr5 {font-size:70%; text-align:center}

.jbs {margin-top:20px; text-align:center}
.jbs a {font-size:12pt; font-weight:bold; color:#0074BE;text-decoration:none}
.jbs div a {font-size:70%; font-weight:normal;color:#000} .coming .file {padding:0 10px}

.mmbrevents .list button {clear:left; float:left; width:6em;}
.mmbrevents .split .title {font-weight:normal; padding:0; margin-left:8em; font-size:85%}

.mmbrevents .cal p {float:left; padding:0 0 0 3em}
.mmbrevents .cal .date {}
.mmbrevents .cal button {float:right; clear:none}
.mmbrevents .cal .item0, .mmbrevents .cal .item1 {clear: both; overflow: hidden}

.pr5 {font-size:70%; text-align:center}

.jbs {margin-top:20px; text-align:center}
.jbs a {font-size:12pt; font-weight:bold; color:#0074BE;text-decoration:none}
.jbs div a {font-size:70%; font-weight:normal;color:#000}

p.sideExtra,       .sideExtra       a { background: url(/art/decor/newsbar.png)  100%    0px no-repeat; }
p.sideExtraGray,   .sideExtraGray   a { background: url(/art/decor/sidetabs.png) 100%    0px no-repeat; }
p.sideExtraYellow, .sideExtraYellow a { background: url(/art/decor/sidetabs.png) 100%  -59px no-repeat; }
p.sideExtraRed,    .sideExtraRed    a { background: url(/art/decor/sidetabs.png) 100% -118px no-repeat; }
p.sideExtraBlue,   .sideExtraBlue   a { background: url(/art/decor/sidetabs.png) 100% -177px no-repeat; }

p.sideExtraGray, p.sideExtraYellow, p.sideExtraRed, p.sideExtraBlue, p.sideExtra { margin: 19px 0 0 4px; width: 159px; }

.sideExtraGray a, .sideExtraYellow a, .sideExtraRed a, .sideExtraBlue a, .sideExtra a {
  height: 33px;
  display: block;
  padding: 3px 0 0 10px;
  margin-right: 10px;
  background-position: 0 0;
  text-decoration: none;
  text-align: center;
  line-height: 115%; font-weight: bold; font-size: 8pt;
}

.sideExtraGray a, .sideExtraYellow a, .sideExtraRed a, .sideExtraBlue a {
  height: 47px;
  padding: 12px 0 0 10px;
  font-size: 13px;
}

.sideExtraGray   a { background-position: 0px    0px; color: #000000; }
.sideExtraYellow a { background-position: 0px  -59px; color: #000000; }
.sideExtraRed    a { background-position: 0px -118px; color: #ffffff; }
.sideExtraBlue   a { background-position: 0px -177px; color: #ffffff; }

.sideExtra a.small { line-height: 135%; font-size: 7pt; }