/* -------------------------------------------------------------- 
  
   DataDog Screen Styles, Woof!
   Modified: 1.9.08

-------------------------------------------------------------- */
/*
	font-sizes:
	.833em = 10px; .917em = 11px; 
	1em = 12px *default after reset
	1.083em = 13px; 1.167em = 14px; 1.25em = 15px; 1.33em = 16px; 1.5em = 18px; 1.833em = 22px; 2em = 24px

	colours:
	#eeefd5 = tan-light; #cccd9a = tan-dark
	#edf4fa = blue-light; #caddee = blue-med; #b1c4d5 = blue-med2; #2a5a86 = blue-dark
	#616226 = green-dark; #8e8f5f = green-med
*/
/* Reset */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit;   }
body { font-size: 75%; font-family: Arial, Helvetica, sans-serif; color: #454545; line-height: 1.5; background: #454545; }
html>body { font-size: 12px; }
table { border-collapse: collapse; border-spacing: 0; }
caption, th, td { text-align: left; font-weight:400; }
blockquote:before, blockquote:after, q:before, q:after { content: ""; }
blockquote, q { quotes: "" ""; }
a img { border: none; }

a { color: #2a5a86; text-decoration: none; outline: none; }
a:hover { background: #caddee; }


/* =Page structure
-------------------------------------------------------------- */

.wrapper { margin: 0 auto; width: 786px; /*position: relative;*/ }
#horizon { padding-bottom: 15px; background: #eeefd5 url(../images/site/nav-bg.gif) repeat-x top left; position: relative; }
#main { background: #fff url(../images/site/main-bg.gif) repeat-x top left; }
#main .wrapper { background: transparent url(../images/site/sidebar-bg.gif) no-repeat 0 0; }
#content { float: left; width: 460px; padding: 25px 0; }
#sidebar { float: right; width: 290px; padding: 25px 0; }

/* subnav adjustments */
body.toolbox #horizon, body.about #horizon { padding-bottom: 0; }
body.about #subnav { padding-left: 250px; } /* nudge closer to tab */


/* =Typography
-------------------------------------------------------------- */

h1,h2,h3,h4,h5,h6 { font-family:  Helvetica, Arial, sans-serif; font-weight: normal; color: #8e8f5f;}

h1 { font-size: 1.833em; line-height: 1; margin-bottom: 0.5em; text-transform: uppercase; color: #616226; }
h2 { font-size: 1.5em; line-height: 1; margin-bottom: 0.5em; }
h3 { font-size: 1.5em; line-height: 1.25; margin-bottom: 0.5em; }
h4 { font-size: 1.2em; line-height: 1.25; margin-bottom: 1.25em; font-weight: bold; }
h5 { font-size: 1em; margin-bottom: 1.5em; font-weight: bold; }
h6 { font-size: 1em; font-weight: bold; }

h1.title, h2.title { margin: 0; }
h2.byline, h3.byline { margin-top: .5em; }

p { margin: 0 0 1.5em; }

ul, ol { margin: 0 1.5em 1.5em 1.5em; }
ul { list-style-type: square; }
ol { list-style-type: decimal; }

dl { margin: 0 0 1.5em 0; }
dl dt { font-weight: bold; }
dl dd { margin-left: 1.5em; }

abbr, acronym { border-bottom: 1px dotted #000; }
address { margin-top: 1.5em; font-style: italic; }
del { color: #000; }

blockquote { margin: 1.5em }
strong { font-weight: bold; }
em, dfn { font-style: italic; }
dfn { font-weight: bold; }
pre, code { margin: 1.5em 0; white-space: pre; }
pre, code, tt { font: 1em monospace; line-height: 1.5; } 
tt { display: block; margin: 1.5em 0; line-height: 1.5; }




/* =Content
-------------------------------------------------------------- */

#content blockquote {
	margin-left: 0; padding: 10px 18px;
	border-left: 4px solid #caddee;
	background: #f1f6fb;
	color: #5f86aa;
}
#content blockquote p {
	margin: 0;
}

ul.target {
	list-style: none;
}
ul.target li {
	padding: 2px 0 2px 18px;
	background: url(../images/site/bullet-blue.png) no-repeat 0 8px;
}

/* checklist */
ul.checklist { 
	margin: 0 0 1.5em; padding: 0;
	list-style: none;
}
ul.checklist li {
	padding: 0 0 0 25px;
	background: url(../images/site/bullet-check-blue.gif) no-repeat 0 0;
}
/* add borders to lists */
ul.entry { 
	margin: 0 0 2em; padding: 0;
	list-style: none;
	border-top: 1px dashed #c7c7c7;
}
ul.entry li {
	padding: 15px 0 15px 30px;
	border-bottom: 1px dashed #c7c7c7;
	background: url(../images/site/bullet-check-blue.gif) no-repeat 0 17px;
}

/* portfolio thumbs */
#content ul.pf-thumbs {
	margin: 0 0 1.5em; padding: 0;
	list-style: none;
}
#content ul.pf-thumbs li {
	float: left;
	width: 115px;
	margin: 0 0 18px;
}
#content ul.pf-thumbs li a {
	float: left;
	height: 75px; width: 90px; overflow: hidden; /* force the thumb size */
	border: 5px solid #cccd9a;
	background: #fff;
}
#content ul.pf-thumbs li a:hover {
	border-color: #6992b8;
}

/* promo boxes (Toolbox) */
div.promo {
	margin: 0 0 1.5em; padding: 20px 20px 15px 20px;
	border-bottom: 1px solid #dfe0bd;
	background: #fbfbd5; /*#ffffe7;*/
}
div.promo h2, div.promo h2 a {
	margin: 0 0 .2em;
	color: #616226;
	background: none;
}
div.promo h2 a:hover {
	color: #323304;
	background: none;
}
div.promo p {
	margin: 0 0 10px;
	font-style: italic;
	line-height: 1.2em;
	color: #9d9e56;
}
ul.promo-links {
	margin: 0; padding: 0;
	list-style: none;
}
ul.promo-links li {
	float: left;
	margin: 0 20px 0 0; padding: 0;
}
ul.promo-links li a {
	float: left;
	color: #616226;
	padding-left: 20px;
	background: transparent url(../images/site/icn-more-round.png) no-repeat left center;
}
ul.promo-links li a:hover {
	color: #9d9e56;
}



/* =Sidebar
-------------------------------------------------------------- */

#sidebar h2 { font-family: Arial, Helvetica, sans-serif; font-size: .833em; text-transform: uppercase; font-weight: bold; color: #2a5a86;	line-height: 1em; margin: 0 0 1em 0; }
#sidebar h3 { font-family: Arial, Helvetica, sans-serif; font-size: 1em; font-style: italic; font-weight: bold; color: #2a5a86; line-height: 1em; }

#sidebar h2.padlock {
	padding: 6px 0 7px 22px;
	border-bottom: 1px solid #c4d6e5;
	background: transparent url(../images/site/icn-lock.png) no-repeat 0 0;
}
.feature-box {
	margin: 0 0 10px; padding: 10px 15px 15px;
	color: #2a5a86;
	background: #edf4fa;
	border: 1px solid #c4d6e5;
	line-height: 1.3em;
}
.feature-box img { /* full-width images should be 248w */
	margin: 0 0 4px; padding: 4px;
	border: 1px solid #d0dfec;
	background: #fff;
}
.feature-box img.figure {
	float: right;
	margin: 0 0 4px 8px;
}
.feature-box ul {
	margin-left: 0;
	list-style: none;
}
.feature-box ul li {
	padding: 2px 0 2px 18px;
	background: url(../images/site/bullet-blue.png) no-repeat 0 3px;
}

/* customer spotlight - logo images must be 258w x 115h */
#spotlight-rotator {
	width: 256px; height: 115px;
	border: 1px solid #d0dfec;
	background: #fff;
	overflow: hidden;
}
#spotlight-rotator img { border: 0; padding: 0; }

/* Case Studies + feature box */
div.case-studies { padding: 1px 0 0; }
dl#case-studies { margin: 0; }
#case-studies dt {
	margin: 0 1px 1px;
	padding: 8px 15px 8px 28px;
	font-size: .833em;
	text-transform: uppercase;	
	font-weight: bold;
	color: #2a5a86;
	line-height: 1em;
	background: #caddee url(../images/site/toggle-off.png) no-repeat 6px 5px;
	cursor: pointer;
}
#case-studies dt.active {
	color: #edf4fa;
	background: #4e79a1 url(../images/site/toggle-on.png) no-repeat 6px 5px;
}
#case-studies dd {
	margin: 0;
	padding: 0;
	color: #2a5a86;
}
#case-studies div.cs-wrap { /* extra div to set padding fixes accordion problem */
	padding: 15px 15px 1px 15px; 
	background: #edf4fa;
}
#case-studies dd h3 {
	font-size: 1em;
	font-style: italic;
	font-weight: bold;
	color: #2a5a86;
	line-height: 1em;
}

/* DDIU signup */
#ddiu {
	height: 166px; width: 290px;
	background: url(../images/site/ddiu-bg.gif) no-repeat 0 0;
	position: relative;
}
#ddiu h2, #ddiu p {
	text-indent: -9999px;
}
#ddiu #btn-subscribe a {
	position: absolute; bottom: 15px; left: 13px;
	height: 32px; width: 124px;
	text-indent: -9999px;
	background: transparent url(../images/site/btn-subscribe.gif) no-repeat 0 0;
	display: block;
}
#ddiu #btn-subscribe a:hover { background-position: 0 -32px; }


/* =Home Page-specific
-------------------------------------------------------------- */

body.home #horizon { padding: 0; }
#banner { padding: 10px 0 6px 0; }
#banner img { border: 5px solid #dadcb4; }

ul#nav-feature { margin: 0 0 1.5em 0; padding: 0; list-style: none; }
ul#nav-feature li {	float: left; margin: 0; padding: 0; }
ul#nav-feature li#btn-toolbox { margin-right: 13px; }

ul#nav-feature li#btn-portfolio a,
ul#nav-feature li#btn-toolbox a { float: left; width: 220px; height: 66px; text-indent: -9999px; display: block; }
ul#nav-feature li#btn-portfolio a  { background: url(../images/site/btn-portfolio.gif) no-repeat 0 0; }
ul#nav-feature li#btn-toolbox a { background: transparent url(../images/site/btn-toolbox.gif) no-repeat 0 0; }

ul#nav-feature li#btn-portfolio a:hover,
ul#nav-feature li#btn-toolbox a:hover { background-position: 0 -66px; }


/* =Sitemap
-------------------------------------------------------------- */

#sitemap { 
	padding: 25px 0;
	background: #454545; 
	display: none; /* hidden initially to avoid flicker on load */
	color: #bebebe;
}
#sitemap .wrapper {
	background: transparent url(../images/site/sitemap-bg.gif) repeat-y 0 0;
}
#sitemap div.col {
	float: left;
	width: 150px;
}
#sitemap ul {
	margin: 0 15px;
	padding: 0;
	list-style: none;
}
#sitemap ul ul {
	margin: 4px 0 0;
}
#sitemap li {
	line-height: 1.2em;
}
#sitemap a {
	color: #bebebe;
	background: none;
	font-weight: bold;
	font-size: 1em;	
	display: block;
	padding: 2px;
}
#sitemap a:hover {
	color: #fff;
	background: #6b6b6b;
}
#sitemap li li a { font-size: 1em; font-weight: normal; background: none; }


/* =Header
-------------------------------------------------------------- */

#header { position: relative; background: #fff url(../images/site/header-bg.gif) repeat-x 0 0; }
#header .wrapper { width: 786px; height: 79px; margin: 0 auto; }
#header #logo { padding: 20px 0 0 7px; }
#header #logo a { background: transparent; }
#header #tab-sitemap { position: absolute; top: 0; right: 50px; width: 121px; height: 25px; }
#header #tab-sitemap a { width: 121px; height: 24px; text-indent: -9999px; background: transparent url(../images/site/btn-sitemap.gif) no-repeat 0 0; border: 0; display: block; }
#header #tab-sitemap a:hover { background-position: 0 -24px; }
#header #tab-sitemap a.active { background-position: 0 -48px; }


/*  =Navigation
-------------------------------------------------------------- */

#nav { margin: 0; padding: 0 0 0 2px; height: 32px; background: url(../images/site/nav-divider.gif) no-repeat bottom left;}
#nav li { float: left; list-style: none; margin: 0; padding: 0 2px 0 0; background: url(../images/site/nav-divider.gif) no-repeat bottom right; }

#n-home a      { width: 71px; background: url(../images/site/nav-home.gif) no-repeat 0 0; }
#n-portfolio a { width: 106px; background: url(../images/site/nav-portfolio.gif) no-repeat 0 0; }
#n-toolbox a   { width: 97px; background: url(../images/site/nav-toolbox.gif) no-repeat 0 0; }
#n-learning a { width: 152px; background: url(../images/site/nav-learning.gif) no-repeat 0 0; }
#n-about a { width: 100px; background: url(../images/site/nav-about.gif) no-repeat 0 0; }
#n-contact a   { width: 104px; background: url(../images/site/nav-contact.gif) no-repeat 0 0; }

#nav li a { float: left; display: block; height: 32px; text-indent: -9999px; }
#nav li a:hover { background-position: 0 -32px; }

/* You-are-here: remove divider line from active and previous tabs */
body.home #nav, body.home li#n-home,
body.portfolio li#n-home, body.portfolio li#n-portfolio,
body.toolbox li#n-portfolio, body.toolbox li#n-toolbox,
/*body.learning li#n-toolbox, body.learning li#n-learning,
body.about li#n-learning,*/ body.about li#n-toolbox, body.about li#n-about,
body.contact li#n-about, body.contact li#n-contact { padding: 0; background: none; }

/* You-are-here: higlight tab */
body.home #nav li#n-home a,
body.portfolio #nav li#n-portfolio a,
body.toolbox #nav li#n-toolbox a,
body.learning #nav li#n-learning a,
body.about #nav li#n-about a,
body.contact #nav li#n-contact a { background-position: 0 -64px; }

/* Subpage Navigation */
#subnav { margin: 0; padding: 0; background: #eeefd5; list-style: none; }
#subnav li { float: left; list-style: none; margin: 0; padding: 0; font-size: .917em; line-height: 1; background: url(../images/site/subnav-divider.gif) no-repeat top left;}
#subnav li:first-child { background: none; }
#subnav li a { float: left; display: block; color: #838468; font-size: 1em; text-decoration: none; padding: 8px 15px 8px 15px;}
#subnav li a:hover { color: #616226; text-decoration: none; background-color: transparent; }
#subnav li.active a, body#list-building li#n-list-building a,
body#email-marketing li#n-email-marketing a, body#sem li#n-sem a,
body#integrated li#n-integrated a { color: #616226; background: url(../images/site/subnav-on.gif) no-repeat bottom center; }


/* =Extra
-------------------------------------------------------------- */

#extra { padding: 25px 0; background: #edf4fa url(../images/site/extra-bg.gif) repeat-x top left; color: #2a5a86; }

#extra #col-1 { float: left; width: 220px; margin-right: 20px; }
#extra #col-2 { float: left; width: 220px; }
#extra #col-3 {	float: right; width: 290px; }

#extra h2 {	
	margin: 0 0 1.25em 0; padding: 6px 10px;
	font-family: Arial, Helvetica, sans-serif; font-size: .833em; text-transform: uppercase; font-weight: bold; color: #2a5a86; line-height: 1em;
	background: #caddee; 
}

/* link list */
#extra ul {
	margin: 0; padding: 0;
	list-style: none;
}
#extra ul li {
	margin: 0; padding: 0;
}
#extra ul li a {
	display: block;
	padding: 3px 10px;
	color: #2a5a86;	text-decoration: none;
	border-bottom: 1px solid #caddee;
}
#extra ul li a:hover {
	background: #dde8f1;
}

/* teaser list with images */
#extra dl.teaser {
	float: left;
	width: 290px;
	margin: 0 0 1em;
	padding: 0 0 1em 0;
	border-bottom: 1px solid #caddee;
}
#extra dl.teaser dt {
	padding-left: 10px;
}
#extra dl.teaser a span {
	display: block; float: right;
	height: 68px; width: 165px;
	margin: 0 0 0 10px;
	border: 4px solid #ddebf6;
	background: url(../images/site/logo-artmail-sprite.gif) no-repeat 0 0;
}
#extra dl.teaser a:hover span {
	border-color: #aec7dd;
	background-position: 0 -68px;
}
#extra dl.teaser dd {
	margin: 0 175px 0 0;
	padding-left: 10px;
	line-height: 1.2em;
}
/*
#extra dl.teaser dt {
	padding-right: 10px;
}
#extra dl.teaser img {
	float: left;
	margin: 0 10px 0 0;
	border: 4px solid #caddee;
}
#extra dl.teaser a:hover img {
	border-color: #aec7dd;
}
#extra dl.teaser dd {
	margin: 0 0 0 100px;
	padding-right: 15px;
	line-height: 1.2em;
}
*/

/* vCard / hCard */
.vcard { font-size: .917em; line-height: 1.3em; padding-bottom: 5px; border-bottom: 1px solid #caddee; }
.vcard .fn { padding: 0 15px; font-weight: bold; font-size: 1.091em; }
.vcard .adr { padding: 0 15px 5px 15px; margin-bottom: 5px; border-bottom: 1px solid #caddee; }
.vcard .tel { padding: 0 15px; }
.feature-box .vcard { border: 0; }
.feature-box .vcard .fn, .feature-box .vcard .adr, .feature-box .vcard .tel { padding-left: 0; }


/* =Footer
-------------------------------------------------------------- */

#footer { padding: 20px 0; background: #454545 url(../images/site/footer-bg.gif) repeat-x top left; }
#footer p {	color: #bebebe;	font-size: .917em; }
#footer a#top-link { float: right; color: #bebebe; background: none; }
#footer a:hover#top-link { float: right; color: #fff; }


/* =Tables (Data tables only!)
-------------------------------------------------------------- */

table { margin-bottom: 1.4em; }
th { border-bottom: 2px solid #ddd; font-weight: bold; }
td { border-bottom: 1px solid #ddd; }
th,td { padding: 4px 10px 4px 0; }
tfoot { font-style: italic; }
caption { background: #ffc; }


/* =Forms
-------------------------------------------------------------- */

fieldset { padding: 1.4em; margin: 0 0 1.5em 0; border: 1px solid #cccd9a; background: #fffff5; color: #787878; }
legend { padding: 0 .4em; font-weight: bold; font-size: 1.1em; color: #616226; }
label { font-weight: bold; color: #787878; }
textarea { background: #fff; border: 1px solid #e3e4c5; border-top-width: 2px; font-size: .917em; }
label strong { color: #711d1c; font-weight: bold; }

/* datadog form */
form.dform ul { margin: 0; padding: 0; list-style: none; }
form.dform li { margin: 0; padding: 8px 0; border-bottom: 1px solid #e3e4c5; clear: both;}
form.dform li label { float: left; width: 130px; padding-right: 10px; line-height: 1.2em; }
form.dform li input { width: 240px; border: 1px solid #e3e4c5; border-top-width: 2px; }
form.dform li textarea { width: 240px; }
form.dform li select { width: 240px; }
form.dform p.submit { text-align: center; margin: 0; padding: 15px 0 0 0; }
/* multi-field rows with captions */
form.dform li div { width: 240px; float: left; }
form.dform li div span { float: left; padding-right: 4px;}
form.dform li div span input { width: auto; }
form.dform li div span label { width: 100%; float: none; display: block; margin: 3px 0 0 2px; font-weight: normal; font-size: .75em; }
/* shaded checkbox full rows */
form.dform li.checkbox { padding-bottom: 0; vertical-align: middle; line-height: 1; }
form.dform li.checkbox div { width: auto; float: none; margin: 0 0 6px; padding: 6px; background: #eeefd5; }
form.dform li.checkbox label { line-height: 1.2em; display: block; width: 380px; margin: 1px 0 0 6px; font-weight: normal; padding: 0; vertical-align: baseline; }
form.dform li.checkbox span.intro { display: block; margin-bottom: 6px; }
form.dform li.checkbox input { float: left; margin: 0; padding: 0;  }
/* reset inputs */
form.dform input.submit { width: auto; margin: 0; }
form.dform input.checkbox { width: auto; border: 0; }
form.dform input.radio { width: auto; border: 0; }

input.error { background: #fbe3e4; }
div.error { padding: 15px 15px 15px 30px; margin-bottom: 1em; color: #D12F19; border: 2px solid #FBC2C4; background: #FBE3E4 url(../images/site/icn-error.png) no-repeat 10px 15px; }
div.error a { color: #D12F19; }


/* =Lightbox (Slimbox)
-------------------------------------------------------------- */

#lbOverlay{position:absolute;left:0;width:100%;background-color:#000;cursor:pointer;}
#lbCenter,#lbBottomContainer{position:absolute;left:50%;overflow:hidden;background-color:#fff;}
.lbLoading{background:#fff url(../images/lightbox/loading.gif) no-repeat center;}
#lbImage{position:absolute;left:0;top:0;border:10px solid #fff;background-repeat:no-repeat;}
#lbPrevLink,#lbNextLink{display:block;position:absolute;top:0;width:50%;outline:none;}
#lbPrevLink{left:0;}
#lbPrevLink:hover{background:transparent url(../images/lightbox/prevlabel.gif) no-repeat 0% 15%;}
#lbNextLink{right:0;}
#lbNextLink:hover{background:transparent url(../images/lightbox/nextlabel.gif) no-repeat 100% 15%;}
#lbBottom{font-family:Verdana,Arial,Geneva,Helvetica,sans-serif;font-size:10px;color:#666;line-height:1.4em;text-align:left;border:10px solid #fff;border-top-style:none;}
#lbCloseLink{display:block;float:right;width:66px;height:22px;background:transparent url(../images/lightbox/closelabel.gif) no-repeat center;margin:5px 0;}
#lbCaption,#lbNumber{margin-right:71px;}
#lbCaption{font-weight:normal; margin-bottom: 4px;}


/* =sIFR
-------------------------------------------------------------- */

/* These are standard sIFR styles... do not modify */
.sIFR-flash{visibility:visible !important;margin:0;}
.sIFR-replaced{visibility:visible !important;}
span.sIFR-alternate{position:absolute;left:0;top:0;width:0;height:0;display:block;overflow:hidden;}
/* Hide Adblock Object tab:the text should show up just fine, not poorly with a tab laid over it. */
.sIFR-flash + div[adblocktab=true]{display:none !important;}

/* These "decoy" styles are used to size the block the swf replacement text will occupy */
.sIFR-hasFlash #content h1{visibility:hidden;font-family:arial;font-size:24px;line-height:24px;margin-bottom:6px;}
.sIFR-hasFlash #content h1.title{margin-bottom: 0;}
.sIFR-hasFlash #content h2{visibility:hidden;font-family:arial;font-size:20px;line-height:20px;letter-spacing:-1px;margin-bottom: 6px;}
.sIFR-hasFlash #content h2.byline{margin-top: 6px;}
.sIFR-hasFlash #content .promo h2{visibility:hidden;font-family:arial;font-size:18px;line-height:18px;letter-spacing:-1px;}
.sIFR-hasFlash #content h3{visibility:hidden;font-family:arial;font-size:18px;line-height:18px;letter-spacing:-1px;}


/* =Misc
-------------------------------------------------------------- */

.hide { display: none; }
.highlight { background: #ffc; }

/* Clearing floats without extra markup  */
.wrapper, .wrap, #nav, #subnav, .promo, .dform li { display: inline-block; }
.wrapper:after, .wrap:after, #nav:after, #subnav:after, .promo:after, .dform li:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
* html .wrapper, * html .wrap, * html #nav, * html #subnav, * html .promo, * html .dform li { height: 1%; }
.wrapper, .wrap, #nav, #subnav, .promo, .dform li { display: block; }

/* buh-bye */