/*

	IRobot At Home -  by Booyant, Inc.
	Contact Info: team@booyant.com  / 978.729.8408
	VERSION 1.0
	
	CONTENTS ----------
	
	   1.BODY
	   2.DEFAULT STYLING
	   3.HEADINGS
	   4.LINKS
	   5.IMAGES
	   6.LAYOUT
	   7.BRANDING/MASTHEAD
	   8.NAVIGATION
	   9.SITEINFO/FOOTER
	   10. HOME PAGE
	   11.PRIMARY CONTENT
	   12.SECONDARY CONTENT
	   13. LIGHTBOX EFFECT
	   14.FORMS
	   
	   
    -------------------
	
*/



@import url(reset.css); /* RESET CSS */




/* 1.BODY
---------------------------------------------------------------------- */

body {font-family: Georgia, "Times New Roman", Times, serif; font-size: 62.5%; color: #666; background: #e6e7e5 url(/images/bg-body.jpg) left top repeat-x; }
html {height: 100%; margin-bottom: 1px;}
ul#nav_access { position:absolute; top:-9999px; left:-9999px; }



/* 2.DEFAULT STYLING
---------------------------------------------------------------------- */
div#content-primary {font-size: 1.2em; line-height: 1.58em;}
div#content-primary ul { margin: 0.8em 0em 1.4em 0em;}
div#content-primary ul li { margin: 0em 0em 0.3em 1.5em; padding-left: 1em; background: url(/images/bg-bullet.gif) left 50% no-repeat;}
div#content-primary ul li ul {margin: 0.3em 0em 0.6em 1em; list-style: circle; }
div#content-primary ul li ul li {background: none; padding-left: 0;}
div#content-primary dl {} 
div#content-primary dt {font-weight: bold; margin-bottom: 0.2em;}
div#content-primary dd {margin-bottom: 0.6em;}
div#content-primary ol { list-style:decimal; list-style-position:outside; color: #f25613; margin: 0.8em 0em 1.4em 0em;}
div#content-primary ol li { margin-left:3em; }
div#content-primary ol li span {color: #666;}

p {margin-bottom: 1.2em;}
hr { height:0; border:0; border-top:1px dotted #d5d6d8; margin: 0.8em 0 0.2em 0; }
 
blockquote {padding-right: 20px; color: #007229;}
blockquote cite { font-weight: bold; float: right; font-style: italic; font-size: 0.9em;}

pre {  }
pre code {  }
code {  }

abbr { border-bottom:1px solid #ccc; cursor:help; }
abbr:hover { border-color:#999; }
del { color:#999; }
strong { font-weight:bold; }
em { font-style: italic; }
sup { font-size:0.75em; position:relative; top:-3px; }

em {font-style:italic;}





/* 3.HEADINGS
---------------------------------------------------------------------- */

h1,h2,h3,h4,h5,h6 { margin-bottom: 0.3em; font-family:Arial, Helvetica, sans-serif; font-weight: normal;}
h1 {text-indent: -9999em; background-position: 0 0; background-repeat: no-repeat; margin-bottom: 1.8em; background-image: url(/images/titles/hdr-irah.gif); width: 366px; height: 30px;} /* Reserved for logo image replacement */
h2 {color: #f25613; font-size: 1.8em; margin-bottom: 0.6em; letter-spacing: 0.00em;}
h3 {font-weight: bold; font-size: 1.16666em; color: #f25613;}

h4 {font-size: 1.08333333em; color: #6ca606; padding: 4px 0;}



body.pg-home h1 {background-image:url(/images/titles/hdr-welcome-irah.gif); width: 416px; height: 65px;}

#content-secondary h2 {color: #007229; font-weight: normal;}
#faq-dialog h3 {font-family: Georgia, "Times New Roman", Times, serif;}


/* 4.LINKS
---------------------------------------------------------------------- */
a {color:#007229; }
a:link,
a:visited, {  }
a:hover,
a:focus {color:#000; text-decoration: underline;}


/* 5.IMAGES
---------------------------------------------------------------------- */

img {}

img.fl { float:left; }
img.fr { float:right; }




/* 6.LAYOUT
---------------------------------------------------------------------- */

/*Apply the float class as additional to push content to the right or left*/
.fl { float:left; }
.fr { float:right;  }




/*div#wrap {margin:0 auto; width: 896px; background: url(/images/bg-cp-bottom.png) left bottom no-repeat;  margin-top: 14px; }*/
div#wrap {margin:0 auto; width: 896px; background: url(/images/bg-wrap-body.png) left top repeat-y; margin-top: 14px; }
div#content-primary-wrap {float: right; background: url(/images/bg-cp-top.gif) right top no-repeat; padding-top: 11px; margin-bottom: 0px;}
div#content-primary {/*background: url(/images/bg-cp-body.png) right top repeat-y; */width: 550px; padding: 8px 39px 20px 36px; min-height: 706px;}

div#content-primary div.col-left {float: left; width: 288px;}
div#content-primary div.col-right {float: right; width: 240px;}

div#content-primary div.col-left-shorter {float: left; width: 270px;}
div#content-primary div.col-right-wider {float: right; width: 247px; margin-right: 17px;}

div#content-secondary {width: 271px; float: left; font-family: Arial, Helvetica, sans-serif; background: #d5d6d8; font-size: 1.2em;}
div.img-placeholder {background: #b7b8ba; padding: 0px 0 20px 6px;}

a#link-back {background: #b7b8ba url(/images/bg-irobot-logo.png) 50% 16px no-repeat; width: 100%; text-indent: -9999em; display: block; padding: 16px 0 20px 0;}

div.feature {position: relative; width: 530px; left: -36px; background: #e1e2e4 url(/images/bg-feature-top.gif) left top no-repeat; color: #007229; font-family: Arial, Helvetica, sans-serif; padding: 14px 24px 14px 35px;  line-height: 1.2857em; margin: 30px 0 40px 0;}
.bigtext {font-size: 1.1666666em;}

div#footer {margin:0 auto; width: 848px; font-size: 1.1em; font-family: Arial, Helvetica, sans-serif; padding: 30px 24px; line-height: 1.3em; background: url(/images/bg-cp-bottom.png) left top no-repeat;  }



/*Self clearing floats - if used outside of .group class make sure to update IE6 stylesheet*/
.clear {clear: both; height: 0px; line-height: 0px; overflow: hidden; margin: 0; padding: 0; display: block;}
.group:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}
.clearit {clear: both;}

/* 7.BRANDING/MASTHEAD
---------------------------------------------------------------------- */

/*============Global Header============*/
#header { text-align: left; margin:0 auto; width: 896px;}
#header .wrap { position: relative; }
#header ul, #header li { list-style-type: none; margin: 0; padding: 0; display: inline; }



.hidden {display:none;}


/* 8.NAVIGATION
---------------------------------------------------------------------- */

/*============Top Nav============*/
#topNav { height:38px; position:relative; z-index:1100; }
#topNav ul { float: right; margin: 0; padding: 0; }
#topNav #rightNav { height: 27px; }
#topNav #rightNav li { float: left; position:relative; z-index:1000 }
#topNav #rightNav li a { display: inline; float: left; height: 27px; }
#topNav #rightNav li.irobot a { width:124px; background: url('/images/header/superNav.png') no-repeat 0px 0px; }
#topNav #rightNav li.explore a { width:147px; background: url('/images/header/superNav.png') no-repeat -124px 0px; cursor:hand; }
#topNav #rightNav li.irobot a:hover { background-position: 0px -27px !important; }
#topNav #rightNav li.explore a:hover { background-position: -124px -54px; }
#topNav #rightNav span { display: none; }

/*===================begin super nav dropdown===================*/
.irobot { z-index:100000 !important; }
#rightNav li.explore  { position:relative; z-index:99000; }
#rightNav li.explore ul.exploreDrop { position:absolute; left:-132px; top:0px; display:none; width:287px; height:128px; padding:26px 0px 0px 9px; background:url(../images/header/superNav_explore.png) no-repeat; z-index:99001; }
#exploreDrop li { width:270px; height:27px; float:left; }
#exploreDrop li a { background:none !important; width:270px !important; }
#exploreDrop li a img { margin:6px 0px 0px 15px; }

#li1_img { margin:0px; background:url(/images/header/superNav_about.png) no-repeat 15px 6px; height:27px; }
#li2_img { margin:0px; background:url(/images/header/superNav_international.png) no-repeat 15px 6px; height:27px; }
#li3_img { margin:0px; background:url(/images/header/superNav_gov.png) no-repeat 15px 6px; height:27px; }
#li4_img { margin:0px; background:url(/images/header/superNav_dev.png) no-repeat 15px 6px; height:27px; }
#li1_img span, #li2_img span, #li3_img span, #li4_img span { display:none; }

.exploreDropFix  { display:block !important; z-index:99002; position:absolute; left:-132px; top:0px; width:287px; height:128px; padding:26px 0px 0px 9px !important; background:url(/images/header/superNav_explore.png) no-repeat; }
.exploreafix { background-position: -124px -54px; }
.exploreDrop_li_hoverFix { background:#696969; }

#topNav #leftNav { margin: 7px 10px 0 0; height: 12px; }
#topNav #leftNav li { float: left; }
#topNav #leftNav li a { display: inline; float: left; height: 17px; }
#topNav #leftNav li.gallery a { width:105px; background: url('/images/header/topNav.png') no-repeat 0px 0px; }
#topNav #leftNav li.email a { width:227px; background: url('/images/header/topNav.png') no-repeat -105px 0px;  left:227px;}
#topNav #leftNav li.order a { width:91px; background: url('/images/header/topNav.png') no-repeat -332px 0px; left:91px; }
#topNav #leftNav li.gallery a:hover { background-position: 0px -17px; }
#topNav #leftNav li.email a:hover { background-position: -105px -17px; }
#topNav #leftNav li.order a:hover { background-position: -332px -17px; }
#topNav #leftNav span { display: none; }

#topNav #leftNav { margin: 7px 26px 0 0; height: 12px; }



/* 9. SITEINFO/FOOTER
---------------------------------------------------------------------- */
div#footer {}
div#footer div {text-align: center;}
ul#retailers {float: left;}
ul#retailers li {float: left; margin-right: 30px;}
ul#retailers li {display: block; height: 26px; background-repeat: no-repeat; text-indent: -9999em;}

ul#retailers li.bed-bath {background-image: url(/images/logos/bed-bath.gif); width: 111px;}
ul#retailers li.best-buy {background-image: url(/images/logos/best-buy.gif); width: 35px;}
ul#retailers li.kohls {background-image: url(/images/logos/kohls.gif); width: 65px;}
ul#retailers li.sears {background-image: url(/images/logos/sears.gif); width: 52px;}
ul#retailers li.target {background-image: url(/images/logos/target.gif); width: 29px;}

div.retailer-wrap {width: 445px; float: left;}
div.visit-store-wrap {width: 281px; float: right;}

a.store-button {background-image: url(/images/btn-store.gif); background-position: 0 0; background-repeat: no-repeat; display: block; width: 138px; height: 24px; margin: 0 auto;}
a.store-button:hover {background-position: 0 -24px;}

/* 10.HOME PAGE
---------------------------------------------------------------------- */


/* 11.PRIMARY CONTENT
---------------------------------------------------------------------- */

p.description {font-size: 1.08333333em; color: #6ca606; font-family: Arial, Helvetica, sans-serif;} /*one off occurence, not realla header, no SEO heavy search terms so I jsut "class"'d it*/
div#content-primary ul#robots {width: 553px; margin: 2.7em 0 0 0; line-height:1em;  }
div#content-primary ul#robots h3 {color:#007229; margin-top: 0.6em;}
div#content-primary ul#robots h3 span {display: block; color: #76b900; font-size: 0.85em; padding-top: 4px;background: none; }
div#content-primary ul#robots li {width: 260px; float: left;  padding: 0 16px 0 0; margin: 0; }
div#content-primary ul#robots li.roomba {background: url(/images/bg-roomba.jpg) right top no-repeat;  }
div#content-primary ul#robots li.scooba {padding: 0 0 0 16px; background: url(/images/bg-scooba.jpg) right top no-repeat; }
ul#robots img {float: right; margin-left: 5px;}
ul#robots p {margin-bottom: 0.6em; color: #666;}
ul#robots li span {color: #f25613; font-size: 0.9em; background: url(/images/bg-arrow.png) right 50% no-repeat; padding-right: 8px; font-family: Arial, Helvetica, sans-serif;}
ul#robots li a { text-decoration: none; }
ul#robots a:hover span {text-decoration: underline;}
ul#robots a:hover h3 span {text-decoration: none; }

div#content-primary ul.reviews {width: 256px; float: left; }
div#content-primary ul.reviews li {background: none; padding: 0; margin: 0 0 8px 0;}
ul.reviews a {background: url(/images/bg-arrow.png) right 50% no-repeat; padding-right: 8px; }
ul.reviews span {height: 9px; display: block; float: left; }
ul.reviews blockquote:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;} 
ul.reviews blockquote p {margin: 0;}

span.five-stars {background: url(/images/5stars.gif) left top no-repeat; width: 57px;}

a.purchase-link {height: 43px; width: 387px; display: block; margin-bottom: 1.2em; background-position: 0 0; background-repeat: no-repeat;}
a.purchase-link:hover {background-position: 0 -45px;}
a.roomba {background-image:url(/images/btn-purchase-roomba.gif);}
a.scooba {background-image:url(/images/btn-purchase-scooba.gif);}
a.bring-roomba {background-image:url(/images/btn-bring-roomba.gif);}
a.bring-scooba {background-image:url(/images/btn-bring-scooba.gif);}

ul#links-back a {background: url(/images/bg-arrow.png) right 50% no-repeat; padding-right: 8px; color: #666; text-decoration: none;}
ul#links-back a:hover {text-decoration: underline;}
ul#links-back { margin: 0.8em 0em 1.4em 0em; border: 1px solid #d5d6d8; border-left: none; border-right: none; font-family: Arial, Helvetica, sans-serif; font-size: 0.85em; padding: 8px 10px; line-height: 1.4em;}
#content-primary ul#links-back li { margin: 0; padding-left: 0em; background: none; float: left; width: 170px; margin-right: 10px;}
#content-primary ul#links-back li.last {margin-right: 0;}

ul#faq a {display: block; background-color: #7abb06; background-image: url(../images/bg-faq-arrow.gif); background-position: 6px 50%; background-repeat: no-repeat; text-decoration: none; font-weight: bold; color: #fff; border-bottom: 2px solid #fff; padding: 2px 24px;} 
div#content-primary ul#faq a#open {background-image: url(../images/bg-faq-arrow-open.gif);}

div.more-info {background: #d9f4a7; padding: 6px 20px; font-family: Arial, Helvetica, sans-serif; color: #000;}
div#content-primary ul#faq { margin: 0; font-family: Georgia, "Times New Roman", Times, serif;}
div#content-primary ul#faq li { margin: 0; padding-left: 0em; background: none;}

div.where-to-buy hr {border-top: 1px solid #d5d6d8;margin: 0.8em 0 0.6em 0; padding-top: 6px; }
div.where-to-buy a.store-button {margin: 0;}


a.more-faq {background: url(/images/bg-arrow.png) right 50% no-repeat; padding-right: 8px; color: #f05100; font-size: 0.9em; font-family: Arial, Helvetica, sans-serif; display: block; width: 56px; margin-bottom: 20px;}

dl.sales-locations {margin-bottom: 1.2em;}
dl.sales-locations dd {float: left; margin-left: 26px; width: 150px;}
dl.sales-locations dt {font-weight: bold;}

/* 12.SECONDARY CONTENT
---------------------------------------------------------------------- */

div#content-secondary img {margin: 0 auto; display: block;}

div.feature div.media-highlight {float: right;}

div.media-highlight { margin: 24px auto 10px auto; text-align: center; width: 244px; background:  url(/images/bg-lup-bottom.png) left bottom no-repeat; padding-bottom: 11px; font-family: Arial, Helvetica, sans-serif;  }
div.media-highlight div.gutter {background: url(/images/bg-lup-body.png) left top repeat-y; padding: 8px 8px 8px 4px; width: 232px;}
div.media-highlight p a {color: #f25613; background: url(/images/bg-arrow.png) right 50% no-repeat; padding: 0 10px 0 18px; text-decoration: none; height: 16px; font-size: 0.95em;}
div.media-highlight p a:hover {text-decoration: underline;}
div.media-highlight p.photo-link {background: url(/images/icn-camera.jpg) 22px top no-repeat; padding: 2px 4px; margin: 4px 0 0 0; line-height: 1em; }

#content-primary div.media-highlight {margin: 0 0 0.6em 0;}
div.media-highlight h4 {line-height: 1em;}
div.green h4 {color: #fff; text-transform: uppercase; background: url(/images/bg-lup-top.png) left top no-repeat; margin: 0; }
div.white h4 {color: #007229; font-weight: bold; background: url(/images/bg-lup-top-white.png) left top no-repeat; margin: 0; font-size: 0.95em; padding: 6px 0 2px 0; line-height: 1em;}


div.sidebar-info {width: 236px; margin: 20px auto;font-size: 0.9em; }
div.sidebar-info p {letter-spacing: 0.02em; line-height: 1.5em;}
div.sidebar-info p span {line-height: 1.1em;}
div.sidebar-info a {color: #f25613; background: url(/images/bg-arrow.png) right 50% no-repeat; padding-right: 8px; text-decoration: none;}
div.sidebar-info a:hover {text-decoration: underline;}
div.sidebar-info dt {float: left; width: auto; font-weight: bold; padding-right: 4px; }
div.sidebar-info dd {margin-bottom: 10px;}
div.sidebar-info dd p {font-size: 0.9em; margn-top: 5px;}

/* 13. LIGHTBOX EFFECT / DIALOG BOX
---------------------------------------------------------------------- */

div.dialog {color: #666; font-size: 1.05em; line-height: 1.4em; letter-spacing: 0.02em; padding-bottom: 20px;background: url(../images/dialog/amended/dialog-bottom.png) left bottom no-repeat; margin: 0; display: none;} 
div.dialog div.gutter {padding: 20px 44px 30px 44px; margin:0; background: url(../images/dialog/amended/dialog-body.png) left top no-repeat; min-height: 420px; }
div.scrollbar {background: #fff url(../images/bg-dialog.gif) left top no-repeat; height: 383px; overflow-y: scroll; padding: 20px; border: 1px solid #d3d1d1; border-right: none;}
div.dialog h2 {margin-bottom: 20px;}
div.dialog h3 {color: #007229;}
div.col1 {width: 240px; float: left; }
div.col2 {width: 240px; float: right; }


div#contact a {color: #f25613; background: url(/images/bg-arrow.png) right 50% no-repeat; padding-right: 8px; text-decoration: none;}
div#contact dt {float: left; width: auto; font-weight: bold; padding-right: 4px; }
div#contact dd {margin-bottom: 10px;}
div#contact dd p {font-size: 0.9em; margn-top: 5px;}


div.vcard p {margin-bottom:10px;}
.org {font-weight: bold;}
.tel, .email {margin-top: 5px;}
.email {margin-bottom: 1.2em;}


ul#gallery-strip {margin: 10px auto;}
ul#gallery-strip li {float: left; margin-right: 13px; height: 56px;}
ul#gallery-strip li.forward {margin-right: 0;}
ul#gallery-strip li a {display: block; }
ul#gallery-strip li.back a {background-image: url(/images/icn-back.png); background-position: 0 0; background-repeat: no-repeat; width: 19px; height: 19px; margin-top: 18px;}
ul#gallery-strip li.forward a {background-image: url(/images/icn-forward.png); background-position: 0 0; background-repeat: no-repeat; width: 19px; height: 19px; margin-top: 18px;}
ul#gallery-strip li a#off {background-position: 0 -19px;}

img#lg-image {display: block; margin: 0 auto;}

#faq-dialog p {padding-left: 20px; margin-top: 10px;}

/* 14.FORMS
---------------------------------------------------------------------- */

div#errors {display: none;}
div.captioning {width: 489px; margin: 0 auto;}
div.captioning blockquote {font-family: Georgia, "Times New Roman", Times, serif; font-size: 1.2em; padding: 20px 0 40px 0; margin-bottom: 20px;border-bottom: 1px dashed #f90;}
div.captioning blockquote cite {text-align: right; font-weight: normal; font-size: 0.9em;}
div.captioning blockquote span {display: block; font-size: 0.8em;}

form#entryform {font-size: 1.1em;}

form#entryform dl input {width: 300px;}
form#entryform dl {float: left; width: 100%;}
form#entryform dt {float: left; width: 100px; text-align: right; padding-right: 20px;}
form#entryform div.submit {clear: both; }
form#entryform dt span {color: #7abb06; }
form#entryform dd {margin-bottom: 10px;}

form#entryform dl.text-area {clear: both; float: none;}
input.submit {margin-left: 120px;}



.disclaimer {font-size:0.9em; line-height: 1.1em; font-style: italic;}
