/* GLOBAL STYLES FOR POST-IT - GENERATION 2
December 2008 to April 2009
======================================== */


/* To retain the breadcrumb and position it beneath the new navigation
======================================== */
#cShellBcrumb { background: none; position: absolute; top: 115px; }
#cShellBcrumb p { margin: 0; border-top: none; padding: 5px 0 7px 0; font-size: 90%; }


/* To override the standard body and font styles
======================================== */
body { width: 955px; margin: 0 auto; padding: 0; color: #000; font: 76%/1 arial, sans-serif; background: #fff; position: relative; }
h1, h2, h3, h4, p, div, ul { font-family: arial, sans serif; }


/* Clears for all pages
======================================== */
div.clearl { clear: left; font-size: 10%; }
div.clearr { clear: right; font-size: 10%; }
div.clearb { clear: both; font-size: 10%; }


/* For the nav when JS detects no Flash
======================================== */
#flashnavcontent { width: 955px; height: 110px; margin: 5px 0 20px 0; background: url("/images/en_gb/nav/Postit_EU_Gen2_NavBG_img_GBEN.gif") bottom left no-repeat; }
#flashnavcontent div#topnav { height: 110px; padding: 0; margin: 0; }
#flashnavcontent div#topnav img.logo { padding-right: 10px; float: left; }
#flashnavcontent div#topnav div.navitem { float: left; text-align: center; white-space: nowrap; margin: 0 5px; }
/* ie6 fix - a width must be specified otherwise each div is treated as a block, display: inline doesn't help */
/*\*/ * html #flashnavcontent div#topnav div.navitem { width: 100px; } /**/
/* the links had to go inside the spans due to an ie6 issue */
#flashnavcontent div#topnav div.navitem a img { height: 54px; padding: 0; margin: 0; }
#flashnavcontent div#topnav div.navitem a:hover img { padding: 0; }
#flashnavcontent div#topnav div.navitem span a { display: block; height: 23px; color: #000; font-weight: bold; line-height: 120%; text-decoration: none; padding: 6px 12px 0 12px; margin: 0; }
#flashnavcontent div#topnav div.navitem span a:hover { color: #000; font-weight: bold; text-decoration: underline; background: url("/images/en_gb/nav/Postit_EU_Gen2_NavOnBG_img_GBEN.gif") repeat-x; }
/* order online button */
#flashnavcontent div#topnav div.order { float: right; display: inline; margin-top: 54px; padding: 0; background: url("/images/en_gb/nav/Postit_EU_Gen2_Nav_OrderOnlineRight_img_GBEN.gif") right top no-repeat; }
#flashnavcontent div#topnav div.order a { display: block; font-weight: bold; color: #000; white-space: nowrap; text-decoration: none; text-align: center; padding: 7px 20px 15px 50px; background: url("/images/en_gb/nav/Postit_EU_Gen2_Nav_OrderOnlineLeft_img_GBEN.gif") left top no-repeat; }
#flashnavcontent div#topnav div.order a:hover { color: #000; font-weight: bold; text-decoration: underline; }


/* For the Send a Post-it link on both the home and inside pages
======================================== */
#sendit { float: left; width: 130px; min-height: 106px; padding: 20px 10px 10px 16px; margin: 0; background: url("/images/en_gb/rhs/Postit_EU_Gen2_SendaPost-it_img_GBEN.jpg") no-repeat top left; }
/* ie6 fix - a height must be specified otherwise the full background won't show */
/*\*/ * html #sendit { height: 106px; }
#sendit p { font-family: times new roman, sans serif; font-style: italic; font-size: 120%; line-height: 120%; margin-bottom: 0.5em; }
#sendit p a { color: #fe4e00; text-decoration: none; }
#sendit p a:hover { color: #fe4e00; text-decoration: underline; }


/* For the main content column on the inside pages
======================================== */
#postitbody { width: 541px; padding: 0 10px 0 15px; }
#postitbody a { color: #fe4e00; text-decoration: none; }
#postitbody a:hover { color: #fe4e00; text-decoration: underline; }
#postitbody table td, #postitbody table td { vertical-align: top; }
#postitbody img { border: solid 1px #ccc; padding: 0; }

/* header */
#postitbody div#headerbg { padding: 0; margin: 0; }
#postitbody div#headerbg div.h142 { min-height: 142px;  }
/*\*/ * html #postitbody div#headerbg div.h142 { height: 142px; } /**/
#postitbody div#headerbg div.headerend1 { height: 10px; font-size: 1%; padding: 0; margin: 0; background: url("/images/en_gb/Postit_EU_Gen2_AllHeadersBottom1_img_GBEN.gif") left top no-repeat; }
#postitbody div#headerbg div.container { min-height: 95px; padding-top: 25px; }
/*\*/ * html #postitbody div#headerbg div.container { height: 95px; } /**/
#postitbody div#headerbg h1 { margin-top: 6px; margin-right: 200px; padding-bottom: 5px; font-size: 170%; }
#postitbody div#headerbg h2 { color: #dd4f02; font-size: 120%; font-weight: bold; margin: 5px 200px 20px 0; }
#postitbody div#headerbg p { margin-right: 175px; }

/* products pages */
/* product page bg, top, divider, middle and bottom */
#postitbody div#details { clear: both; padding: 0; margin: 0; background: url("/images/en_gb/Postit_EU_Gen2_AllProductsBG_img_GBEN.gif") repeat-y; }
#postitbody div#details div.detailshead { height: 8px; font-size: 1%; background: url("/images/en_gb/Postit_EU_Gen2_AllProducts_Top_img_GBEN.gif") top left no-repeat; }
#postitbody div#details div.divider { clear: left; height: 10px; font-size: 1%; background: url("/images/en_gb/Postit_EU_Gen2_AllProducts_Divider_img_GBEN.gif") top left no-repeat; }
#postitbody div.bodyend { margin: 0; padding: 0; height: 16px; font-size: 1%; background: url("/images/en_gb/Postit_EU_Gen2_AllProducts_Bottom_img_GBEN.gif") left top no-repeat; }

/* product page styles */
#postitbody div#details div.content { padding: 0 15px; }
#postitbody div#intro { padding: 7px 15px; }
#postitbody div#details div.content table.landr { width: 100%; margin-bottom: 8px; }
#postitbody div#details div.content table.landr td, #postitbody div#intro table.landr td { padding-bottom: 8px; }
#postitbody div#details div.content table.landr td img, #postitbody div#intro table.landr td img { margin: 0 10px; }
#postitbody div#intro ul li { margin: 0 0 8px 0; padding: 5px 0 5px 24px; background: url("/images/en_gb/Postit_EU_Gen2_BulletonWhiteBG_img_GBEN.gif") left top no-repeat !important; }
#postitbody div#details div.content div.prod { text-align: center; float: left; width: 150px; padding: 5px 15px 0 5px; margin: 0; } 
#postitbody a img { border: solid 1px #ccc; }
#postitbody h3 { color: #f77219; font-size:1.2em; padding: 5px 0 3px 0; }
#postitbody h3 a { color: #f77219; text-decoration: none; }
#postitbody h3 a:hover { color: #f77219; text-decoration: underline; }
#postitbody ul { margin: 0 0 8px 5px; padding: 0; list-style-type: none; }
#postitbody ul li { margin: 0; padding: 5px 0 5px 24px; background: url("/images/en_gb/Postit_EU_Gen2_Bullet_img_GBEN.gif") left top no-repeat; }

/* more padding to prevent headers paragraphs overlapping the product image in the bg */
#postitbody div#headerbg #emailpg p { padding-right: 75px; }

/* email a friend header bgs */
#postitbody div.bg2 { background: url("/images/en_gb/email/Postit_EU_Gen2_HeaderBG_EmailaFriend_img_GBEN.gif") repeat-y; }
#postitbody div#headerbg div#emailpg { padding: 0 18px 3px 18px; margin: 0; background: url("/images/en_gb/email/Postit_EU_Gen2_Header_EmailaFriend_img_GBEN.jpg") no-repeat; }


/* email a friend form */
#postitbody form span.req { color: #fea600; font-size: 1.5em; font-weight: bold; vertical-align: bottom; }
#postitbody form label { display: block; padding: 8px 0 5px 0; }
#postitbody form input { border: solid 1px #f8ac27; padding: 2px 5px; font-family: arial,sans serif; font-size: 100%; }
#postitbody form div.nobord input { border: 0; }
#postitbody form div.when { margin-left: 50px; padding: 0; }
#postitbody form textarea { border: solid 1px #f8ac27; padding: 2px 5px; font-family: arial,sans serif; font-size: 100%; }
#postitbody form div.check { margin: 3px 0; padding: 0; }
#postitbody form span.check { padding: 5px 10px 0 0; }
#postitbody .error_field {border:1px solid #CC0000 !important; outline-color:#CC0000 !important; outline-width:1px !important; outline-style:solid !important;}
#postitbody #error_message {color:#CC0000; font-weight:bold;}
#postitbody form div.check input { border: 0; }

#postitbody div.formleft { width: 280px; padding: 0; float: left; }
#postitbody div.formright { width: 220px; padding: 0; float: left; }
#postitbody div.formleft div.msg { width: 240px; min-height: 270px; padding: 5px 15px; margin: 0; background: url("/images/en_gb/email/Postit_EU_Gen2_FormBG_YellowNote_img_GBEN.gif") top left no-repeat; }
/*\*/ * html #postitbody div.formleft div.msg { height: 270px; } /**/

#postitbody div.preview { float: left; display: block; padding: 0; margin: 15px 10px 10px 0; background: url("/images/en_gb/Postit_EU_Gen2_Button_PreviewandSendRight_img_GBEN.gif") right top no-repeat; }
#postitbody div.preview a { display: block; color: #fff; text-decoration: none; font-weight: bold; white-space: nowrap; padding: 10px 20px 15px 20px; background: url("/images/en_gb/Postit_EU_Gen2_Button_PreviewandSendLeft_img_GBEN.gif") left top no-repeat; }
#postitbody div.preview a:hover { color: #fff; text-decoration: underline; }
#postitbody div.preview input { display: block; cursor: pointer; color: #fff; text-decoration: none; border: 0; font-weight: bold; white-space: nowrap; padding: 8px 4px 15px 10px; background: url("/images/en_gb/Postit_EU_Gen2_Button_PreviewandSendLeft_img_GBEN.gif") left top no-repeat; }
#postitbody div.preview input:not([attr*=""]) { padding: 8px 20px 15px 20px; }

#postitbody div.formright div { width: 110px; float: left; }
#postitbody div.formright div img, #postitbody div.formright div input { display: block; margin: 5px auto; border: 0; }
/* end */


/* Left hand side styles for pods, ideas and newsletters
======================================== */
/* Overrall features div */
#features { width: 204px; margin: 17px 0 10px 0; padding-left: 7px; }
#features ul { margin: 0 10px; padding: 0; list-style-type: none; }
#features ul li { margin: 0; padding: 5px 0 5px 20px; background: url("/images/en_gb/Postit_EU_Gen2_BulletSmall_img_GBEN.gif") left top no-repeat; }

/* Main feature styles */
#features div.pod { width: 204px; margin-bottom: 7px; background: url("/images/en_gb/lhs/Postit_EU_Gen2_LHSBox_BG_img_GBEN.gif") top left repeat-y; }
#features div.pod div.head { width: 204px; height: 15px; font-size: 1%; }
#features div.pod .blue { background: url("/images/en_gb/lhs/Postit_EU_Gen2_LHSBox_BlueTab_img_GBEN.gif") top left no-repeat; }
#features div.pod .orange { background: url("/images/en_gb/lhs/Postit_EU_Gen2_LHSBox_OrangeTab_img_GBEN.gif") top left no-repeat; }
#features div.pod h3 { font-family: times new roman, sans serif; font-size: 120%; font-style: italic; font-weight: normal; padding: 4px 10px; margin: 0 4px 0 0; background: #fff; }
#features div.pod h3 a { color: #000; text-decoration: none; }
#features div.pod h3 a:hover { color: #000; text-decoration: underline; }
#features div.pod p { padding: 8px 12px 0 10px; }
#features div.pod img { padding: 3px 7px 3px 6px; float: right; }
#features div.pod img.big { padding: 0 !important; border: solid 1px #ccc; margin: 7px; }
#features div.pod img.fl { float: left !important; }
#features div.pod div.podend { clear: left; width: 204px; height: 10px; font-size: 1%; padding: 0; margin: 0; background: url("/images/en_gb/lhs/Postit_EU_Gen2_LHSBox_Bottom_img_GBEN.gif") no-repeat; }

/* Feature with drop down and links */
#features div.pod form, #features div.pod noscript ul { margin: 0 4px 0 0; padding: 8px 10px; background: #e9f0f6; }
#features div.pod form select { width: 170px; border: solid 1px #f8ac27; background: #fff; padding: 1px 0; font-size: 90%; }
#features div.pod noscript ul li { background: url("/images/en_gb/lhs/Postit_EU_Gen2_BulletSmallBlue_img_GBEN.gif") left top no-repeat !important; }
#features div.pod div.alllink { width: 204px; padding: 0; text-align: center; background: url("/images/en_gb/") top left repeat-y; }
#features div.pod div.alllink a { display: block; padding: 5px 8px 3px 8px; color: #fff; font-weight: bold; text-decoration: none; }
#features div.pod div.alllink a:hover { color: #fff; font-weight: bold; text-decoration: underline; }
#features div.pod div.alllink div.linkend { width: 204px; height: 5px; font-size: 1%; background: url("/images/en_gb/") top left no-repeat; }

/* Buy it now button for features */
#features div.buyitnow { float: left; display: block; padding: 0; margin: 5px 0 8px 8px; background: url("/images/en_gb/lhs/Postit_EU_Gen2_Button_LHS_BuyitNowRight_img_GBEN.gif") right top no-repeat; }
#features div.buyitnow span { display: block; color: #fff; font-weight: bold; white-space: nowrap; padding: 10px 20px 15px 20px; background: url("/images/en_gb/lhs/Postit_EU_Gen2_Button_LHS_BuyitNowLeft_img_GBEN.gif") left top no-repeat; }
#features div.buyitnow span a { color: #fff; text-decoration: none; }
#features div.buyitnow span a:hover { color: #fff; text-decoration: underline; }

/* Right hand side styles for pods, ideas and newsletters
======================================== */
/* Overrall pods div */
#pods { width: 178px; margin: 16px 0 10px 0; padding: 0; }
#pods ul { margin: 0 10px; padding: 0; list-style-type: none; }
#pods ul li { margin: 0; padding: 5px 0 5px 20px; background: url("/images/en_gb/Postit_EU_Gen2_BulletSmall_img_GBEN.gif") left top no-repeat; }

/* Ideas pod with handwriting on the lined paper */
#ideas { background: url("/images/en_gb/rhs/Postit_EU_Gen2_RHS_IdeasBG_blue_img_GBEN.gif") repeat-y left top; margin-bottom: 7px; width: 177px; }
#ideas div.head { background: url("/images/en_gb/rhs/Postit_EU_Gen2_RHS_IdeasTop_blue_img_GBEN.gif") no-repeat left top; width: 177px; height: 12px; }
#ideas h3 { font-size: 2em; padding: 3px 6px; margin: 0; }
#ideas h4 { font-size: 1.5em; padding: 3px 6px; margin: 0; }
#ideas h3 a { color: #000000; text-decoration: none; }
#ideas h3 a:hover { color: #000000; text-decoration: underline; }
#ideas img { display: block; padding: 3px 0 7px 0; }
#ideas div.foot { background: url("/images/en_gb/rhs/Postit_EU_Gen2_RHS_IdeasBottom_blue_img_GBEN.gif") no-repeat left top; width: 177px; height: 14px; }

/* Main pods styles for the tab, background and arrow */
#pods div.pod { width: 178px; margin-bottom: 7px; font-size: 90%; background: url("/images/en_gb/rhs/Postit_EU_Gen2_RHSBox_BG_img_GBEN.gif") top left repeat-y; }
#pods div.pod div.head { width: 178px; height: 15px; font-size: 1%; }
#pods div.pod .pink { background: url("/images/en_gb/rhs/Postit_EU_Gen2_RHSBox_PinkTab_img_GBEN.gif") top left no-repeat; }
#pods div.pod .blue { background: url("/images/en_gb/rhs/Postit_EU_Gen2_RHSBox_BlueTab_img_GBEN.gif") top left no-repeat; }
#pods div.pod .orange { background: url("/images/en_gb/rhs/Postit_EU_Gen2_RHSBox_OrangeTab_img_GBEN.gif") top left no-repeat; }
#pods div.pod div.podimg { width: 170px; min-height: 89px; margin: 0 8px 0 0; padding: 0px; background-position: top right; background-repeat: no-repeat; }
#pods div.pod table { padding: 0; margin: 0; }
#pods div.pod table td { vertical-align: top; }
#pods div.pod table td.left { width: 82px; padding: 8px 10px; vertical-align: top; }
#pods div.pod table td.right { width: 57px; vertical-align: top; padding: 50px 3px 6px 0; }
#pods div.pod h3 { font-family: times new roman, sans serif; font-size: 140%; font-style: italic; font-weight: normal; padding: 4px 10px; margin: 0 8px 0 0; background: #fff; }
#pods div.pod h3 a { color: #000; text-decoration: none; }
#pods div.pod h3 a:hover { color: #000; text-decoration: underline; }
#pods div.pod div.bod { padding: 8px 10px 0 10px; }
#pods div.pod div.bod p { padding-right: 60px; }
#pods div.pod div.podend { clear: left; width: 178px; height: 10px; font-size: 1%; padding: 0; margin: 0; background: url("/images/en_gb/rhs/Postit_EU_Gen2_RHSBox_Bottom_img_GBEN.gif") no-repeat; }

/* Newsletters pod using some of the normal pod styling */
#pods div.pod div#newsletter form { float: left; display: inline; padding: 3px 10px 0 10px; margin: 0; line-height: 100%; width: 155px; }
#pods div.pod div#newsletter form .fields { float: left; }
#pods div.pod div#newsletter form .fields input { font-size: 90%; float: left !important; padding: 1px 3px; }
#pods div.pod div#newsletter form .fields input.check { margin: 0 5px 3px 0; border: none !important; }
#pods div.pod div#newsletter form .fields .w135 { width: 135px; margin-bottom: 5px; }
#pods div.pod div#newsletter form .fields label { margin: 0 0 3px 0; display: block; padding: 0 !important; font-size: 100%; font-weight: bold; }
#pods div.pod div#newsletter form .fields select { font-size: 90%; float: left; padding: 1px 0; width: 150px; margin-bottom: 5px; }
#pods div.pod div#newsletter form .fields span.check { padding: 5px 10px 0 0; }
#pods div.pod div#newsletter form div.clearb { font-size: 50%; }
#pods div.pod div#newsletter form input.send { float: right; margin: 0 10px 10px 0; border: none; }
#pods div.pod div#newsletter form div#secondselect { display: none; }


/* To style the footer
======================================== */
#postitfooter { width: 785px; margin: 20px auto 10px auto; border-top: solid 1px #989898; padding-top: 10px; }
#postitfooter table { width: 707px; margin: 0 0 0 78px; padding: 2px 0 0 0; }
#postitfooter table td { text-align: center; color: #666; font-size: 90%; padding: 3px 0; }
#postitfooter table td a { color: #666; text-decoration: none; padding: 0 6px 0 5px; border-right: solid 1px #666; }
#postitfooter table td a.nobord { border-right: solid 1px #fff; }
#postitfooter table td a:hover { color: #666; text-decoration: underline; }
#postitfooter table td.logo { width: 78px; padding: 0; margin: 0; }
#postitfooter table td.logo img { vertical-align: bottom; float: right; }
#postitfooter table td.logo a { border: none !important; }
.cb {
	clear:both;
	font-size:0px;
	line-height:0px;
}
.user_error {
  background:transparent url(/images/en_gb/error.jpg) no-repeat scroll left top !important;
}
#captcha {
  margin:20px 0 0 0;
}
#shape-holder {
  margin:0 auto;
}
.shape_1 {
  background:url(/images/en_gb/shapes/shape_1.jpg) no-repeat center center;
  height:255px;
  padding:80px 50px 0 20px;
  width:262px;
}
.shape_2 {
  background:url(/images/en_gb/shapes/shape_2.jpg) no-repeat center center;
  height:257px;
  padding:80px 50px 0 50px;
  width:215px;
}
.shape_3 {
  background:url(/images/en_gb/shapes/shape_3.jpg) no-repeat center center;
  height:156px;
  padding:35px 60px 0 60px;
  width:282px;
}
.shape_4 {
  background:url(/images/en_gb/shapes/shape_4.jpg) no-repeat center center;
  height:242px;
  padding:50px 70px 0;
  width:182px;
}
.shape_5 {
  background:url(/images/en_gb/shapes/shape_5.jpg) no-repeat center center;
  height:231px;
  padding:85px 40px 0 20px;
  width:256px;
}
.shape_6 {
  background:url(/images/en_gb/shapes/shape_6.jpg) no-repeat center center;
  height:259px;
  padding:150px 60px 0 40px;
  width:183px;
}
.shape_7 {
  background:url(/images/en_gb/shapes/shape_7.jpg) no-repeat center center;
  height:270px;
  padding:110px 90px 0;
  width:183px;
}
.shape_8 {
  background:url(/images/en_gb/shapes/shape_8.jpg) no-repeat center center;
  height:255px;
  padding:40px 30px 0;
  width:235px;
}
