/* CSS file for diablomanagement.com by DianeV. Web Design Studio */
/* widened 780px => 840px 04/08/09 /dv */

html {margin:0; padding:0}
body {color:#000; margin:16px auto 32px auto; padding:0; font-size:82.5%; text-align:center; font-family:arial,helvetica,sans-serif; background:#666 url(images/l/bk.gif) repeat-x}

#pagewrap {width:840px; margin:0 auto; text-align:left}

/* HEADER */
#headerwrap {width:824px; margin:auto; height:65x; background:#000; padding-right:6px}
#logo {float:left; width:221px; margin:0}
#logo img {width:221px; height:65px; border:none}
#logo a img {border:none}

/* TNAVs */
#tnavcont {float:right; width:570px; padding-right:6px; border-right:1px solid #676767}
ul#ttnav, ul#tbnav {float:right; width:570px; text-align:right; color:#ab4130; font-size:12px; margin:0; padding:00; list-style:none; margin-bottom:30px}
ul#ttnav li, ul#tbnav li {color:#ab4130; display:inline}
ul#ttnav li a, ul#tbnav li a {color:#ab4130; display:inline; padding:2px 10px; margin-right:-4px; font-weight:bold; text-decoration:none; border-left:1px solid #ab4130}
ul#ttnav li a:hover, ul#tbnav li a:hover {color:#ccc; text-decoration:none; background:#333}

ul#tbnav {clear:both; margin-bottom:0}
ul#tbnav li.tnavleft a {border-left:none}

/* metal strip */
#hstrip {clear:both; width:820px; height:16px; margin:0 auto; padding:0; background:url(images/l/bkhstrip.jpg) repeat-x}

/* CONTENT AREA */
#contentwrap {width:840px; margin:0 auto; background:url(images/l/bkpage.jpg) repeat-y}
#contentgradwrap {width:840px; margin:0; background:url(images/l/bkgrad.jpg) no-repeat; border-top:none}

#thecontent {width:800px; margin:auto; padding:0 20px} 

	/* contentgrad area */
#contentgrad {height:138px; color:#A0A0A0; font-size:14px; font-weight:bold; padding-top:4px; margin-bottom:6px}
#contentgrad h1, #contentgrad h2, #contentgrad .h1, #contentgrad .h2 {color:#A54131; font-weight:normal; margin:0 0 3px 0}
#contentgrad p {color:#A0A0A0; margin:0; letter-spacing:1px; line-height:1.5em}

	/* see also biolist */
ul#contentgradlist {color:#ccc; font-size:11px; font-weight:normal; margin:0 8px; padding:0 8px; line-height:1.2em; font-family:Verdana, Arial, Helvetica, sans-serif}
ul#contentgradlist a {color:#ccc; text-decoration:underline}
ul#contentgradlist a:hover {color:#0A6A7E; text-decoration:none}

/* FOOTER */
#bkbtm {clear:both; width:840px; height:54px; margin:0 auto; background:url(images/l/bkbtm.jpg) no-repeat}
#btmaddy {width:700px; margin:auto; font-size:12px}

#c {width:780px; margin:0 auto; color:#B6B6B6; font-size:10px; letter-spacing:2px}
#c a {color:#B6B6B6; text-decoration:underline}
#c a:hover {color:#fff; text-decoration:none}

/* END LAYOUT STYLES */
#breadcrumbs {color:#7A7A7A; font-size:10px; margin-bottom:1em}
#breadcrumbs a {color:#7A7A7A; letter-spacing:2px; text-decoration:underline}
#breadcrumbs a:hover {color:#B43728; text-decoration:none}

ul.nextlist {color:#999}

/*                                            */
h1,h2,h3,h4,.h1,.h2,.h3,.h4 {color:#C43A29; font-weight:bold} 
h1,.h1 {font-size:18px}
h2,.h2 {font-size:18px}
h3,h4,.h3,.h4 {font-size:16px}

h2.h2lg {font-size:24px; font-weight:bold}

.b {font-weight:bold}
.i {font-style:italic}
.bi {font-weight:bold; font-style:italic}

.white {color:#fff}
.black {color:#000}
.green {color:#1A7684}
.dv {color:#CC0099; font-weight:bold; font-style:italic}
.tinymedgrey {color:#666; font-size:12px}

.mt0 {margin-top:0}
.mb0 {margin-bottom:0}

ul {list-style:square}
ul.ul1 li, ol.ol1 li {padding-bottom:1em}
ul.ul15 li {padding-bottom:1.5em}
ul.ul5 li {padding-bottom:.5em}

div.onecolpadding {padding:0 40px}

a.announcementlink:link, a.announcementlink:visited {color:#B03A2C}
a.announcementlink:hover {color:#ccc}

/* homeautofade */

/* single column border */
div.singlecolbord {padding:0 10px; border-left:25px solid #1A7684}

/* site map */
ul.ulsitemap ul {color:#000; font-size:12px; font-weight:normal; margin-left:15px; padding-left:15px}

/* theslide */
#theslide {float:right; width:250px; height:450px; margin-top:10px}
#theslide img {width:250px; height:450px}
#theslide a img {border:1px solid #bbb; text-decoration:none}
#theslide a:hover img {border:1px solid #1B7684; text-decoration:none}

/* tablechart (Services) */
.tablechart {border:1px solid #ccc; border-top:none; background:url(images/l/bkbtmgradgrey.jpg) center bottom repeat-x}
.tablechart th {border-top:1px solid #568287; text-align:center; background:url(images/l/bkbioinset.jpg) repeat-x}
.tablechart td {padding:3px 5px; vertical-align:top; border-bottom:1px solid #ccc}

/* biopanel */
#biopanel {float:left; margin-top:10px; width:250px; padding-right:10px}
.bioinfotitle {color:#222; font-weight:bold; padding-left:2px; background:url(images/l/bkhstrip.jpg) repeat-x}
div.bioinfobox {margin-bottom:10px; border:1px solid #B4BEC1; border-top:none; background:url(images/l/bkbtmgradgrey.jpg) center bottom repeat-x}
div.bioinfobox ul {color:#666 /*3F8A9C*/; list-style:square; margin:4px 2px 4px 15px; padding:4px 2px 4px 15px}
div.bioinfobox li {padding-bottom:4px}
div.bioinfobox ul.biolist a {color:#666; text-decoration:underline}
div.bioinfobox ul.biolist a:hover {color:#0A6A7E; text-decoration:none}

#contentgrad ul.consultantlist {color:#ccc; font-size:11px; font-weight:normal; margin:0 8px; padding:0 8px; line-height:1.1em; font-family:Verdana, Arial, Helvetica, sans-serif}
#contentgrad ul.consultantlist a {color:#ccc; text-decoration:underline}
#contentgrad ul.consultantlist a:hover {color:#0A6A7E; text-decoration:none}

/* generic box */
.boxcont {float:right} /* set width in page code */
.boxconttitle {color:#222; font-weight:bold; padding-left:2px; text-align:center; background:url(images/l/bkhstrip.jpg) repeat-x}
div.boxcont {margin-bottom:10px; border:1px solid #B4BEC1; border-top:none; background:url(images/l/bkbtmgradgrey.jpg) center bottom repeat-x}
div.boxcont ul {color:#666 /*3F8A9C*/; list-style:square; margin:4px 2px 4px 15px; padding:4px 2px 4px 15px}
div.boxcont li {padding-bottom:4px}
div.boxcont ul  a {color:#666; text-decoration:underline}
div.boxcont ul a:hover {color:#0A6A7E; text-decoration:none}


/* CASE STUDIES */
#casescrollercont {width:250px; height:140px; border:1px solid #ccc; background:url(images/l/bkbtmgradgrey.jpg) center bottom repeat-x}
div#casescrollertitle {color:#222; width:250px; height:16px; font-weight:bold; text-align:center; background:url(images/l/bkhstrip.jpg) repeat-x}
div#casescrollertitle a {color:#222; font-weight:bold; text-decoration:none}
div#casescrollertitle a:hover {color:#0A6A7E; text-decoration:none}

#casescroller {width:240px; height:124px; margin:auto; font-size:11px}
#casescroller p {padding-bottom:15px; border-bottom:1px dotted #ccc}
#casescroller b {color:#C43A29}
#casescroller a {text-decoration:none}
#casescroller a:hover {color:#0A6A7E; text-decoration:underline}

	/* home scroller */
.homescroller {color:#dedede; font-size:11px; font-weight:normal; line-height:1.1em}
.homescroller b {color:#3F96A7; font-weight:bold}
#pagewrap .homescroller p {margin:1em 0; padding-bottom:1em; border-bottom:1px dotted #777}
#pagewrap .homescroller a {color:#cdcdcd; text-decoration:none}
#pagewrap .homescroller a:hover {color:#bbb; text-decoration:underline}

.homescroll {position:absolute; visibility:visible; top:133px; left:auto; width:475px; z-index:1}

	/* case studies - consultant thumbnails -- see also CONSULTANTS */
#caseconsultthumbs {width:801px; margin:0 auto; text-align:center; color:#ccc; font-size:10px; font-weight:bold}
#caseconsultthumbs div {float:left; width:87px; padding:0 1px} /* leave width at 88px for names */
#caseconsultthumbs img {width:76px; height:76px; border:none}
#caseconsultthumbs a img {border:1px solid #ccc}
#caseconsultthumbs a:hover img {border:1px solid #B03A2C}

	/* consultant case studies lists */
h3.casetitleimg {color:#000; width:355px; background:#efefef}
h3.casetitleimg img {width:76px; height:76px; vertical-align:middle; margin-right:5px}
h3.casetitleimg a img {border:1px solid #ccc}
h3.casetitleimg a:hover img {border:1px solid #B03A2C}

	/* case chart tables */
table.casechart {width:620px; float:left; border:1px solid #ccc; background:url(images/l/bkbtmgradgrey.jpg) center bottom repeat-x}
table.casechart th.casecharttop {height:16px; padding:0; background:url(images/l/bkhstrip.jpg) repeat-x}
table.casechart th {color:#222; text-align:left; padding:5px; text-align:center; text-transform:capitalize; border-bottom:1px solid #ddd}
table.casechart td {padding:5px; border-bottom:1px solid #ddd}
table.casechart td ul li, table.casechart td ol li {padding-bottom:.4em}

.casestaffbox {float:right; width:160px}
.casestafftitle {color:#222; font-weight:bold; padding-left:2px; text-align:center; background:url(images/l/bkhstrip.jpg) repeat-x}
div.casestaffbox {margin-bottom:10px; border:1px solid #B4BEC1; border-top:none; background:url(images/l/bkbtmgradgrey.jpg) center bottom repeat-x}
div.casestaffbox ul {color:#666 /*3F8A9C*/; list-style:square; margin:4px 2px 4px 15px; padding:4px 2px 4px 15px}
div.casestaffbox li {padding-bottom:4px}
div.casestaffbox ul.biolist a {color:#666; text-decoration:underline}
div.casestaffbox ul.biolist a:hover {color:#0A6A7E; text-decoration:none}

/* CONSULTANTS */
.consultthumbs {list-style:none; margin:0; padding:0}
.consultthumbs li {padding-bottom:3px}
.consultthumbs img {width:100px; height:100px; vertical-align:middle}
.consultthumbs a img {border:1px solid #888}
.consultthumbs a img:hover {border:1px solid #1A7684}
.consultthumbs a.consultlink {margin-left:8px; font-weight:bold}

/* VIDEO POPUPS */
body#media #pagewrap {width:100%; margin:0 auto; text-align:left}
body#media #headerwrap {width:500px; margin:auto; height:65x; background:#000}
body#media #hstrip {clear:both; width:100%; height:16px; margin:0 auto; padding:0; background:url(images/l/bkhstrip.jpg) repeat-x}
body#media #contentwrap {width:100%; text-align:center; background:#444}
body#media #thecontent {width:100%; margin:auto; color:#dedede; padding:5px 0; border-top:1px solid #ccc}
body#media #bkbtm {clear:both; width:500px; height:5px; margin:0 auto; background:none}

body#media #c {width:500px; margin:10px auto; color:#B6B6B6; font-size:10px; letter-spacing:1px}
body#media #c a {color:#B6B6B6; text-decoration:underline}
body#media #c a:hover {color:#fff; text-decoration:none}

body#media #contentwrap a {color:#000; font-size:11px; padding:2px 4px; text-decoration:none; background:#777}
body#media #contentwrap a:hover {color:#000; text-decoration:none; background:#aaa}

	/* video page link TO popup */
.videocont {color:#fff; font-size:14px; font-weight:bold; text-align:center; border-bottom:1px solid #651B13; background:#B03A2C}
.videocont a img {border:none; border-top:3px solid #B03A2C; border-bottom:3px solid #B03A2C; text-decoration:none}
.videocont a:hover img {border-top:3px solid #C8C8C8; border-bottom:3px solid #C8C8C8; text-decoration:none}
.videocont a {text-decoration:none}

/* TESTIMONIALS */

.testimonials {padding: 2px 8px; margin-bottom:10px; border:1px solid #3F96A7; background:url(images/l/bkbtmgradgrey.jpg) center bottom repeat-x}
.testimonials img {float:left; width:76px; height:76px; margin:0 10px 5px 0; border:1px solid #ccc}

#testimonialthumbs {width:720px; margin:0 auto; text-align:center; color:#ccc; font-size:11px; font-weight:normal}
#testimonialthumbs div {float:left; width:88px; padding:0 15px; font-size:11px; line-height:11px}
#testimonialthumbs img {width:76px; height:76px}
#testimonialthumbs a img {border:1px solid #888}
#testimonialthumbs a img:hover {border:1px solid #1A7684}
/*#testimonialthumbs a img {border:1px solid #ccc}
#testimonialthumbs a:hover img {border:1px solid #B03A2C}*/

/* CLIENT ANNOUNCEMENTS */
div.clientinfobox {margin-bottom:10px; border:1px solid #B4BEC1; padding-left:10px; background:url(images/l/bkbtmgradgrey.jpg) center bottom repeat-x}
div.clientinfobox ul {color:#666 /*3F8A9C*/; list-style:square; margin:4px 2px 4px 15px; padding:4px 2px 4px 15px}
div.clientinfobox li {padding-bottom:4px}
div.clientinfobox ul.biolist a {color:#666; text-decoration:underline}
div.clientinfobox ul.biolist a:hover {color:#0A6A7E; text-decoration:none}

/* tnav red: ab4130 B03A2C A44237 9C3D2E bluegreen: 1A7684 0A6A7E */
a:link, a:visited {color:#000; text-decoration:underline}
a:hover {color:#1A7684; text-decoration:none}