@charset "utf-8";
  
  .clearfix:after {
    content:".";
    display:block;
    height:0;
    clear:both;
    visibility:hidden;
  }
  .clearfix {display:inline-block;}
  /* Hide from IE Mac \*/
  .clearfix {display:block;}
  /* End hide from IE Mac */
  
  *  {
  	padding:0;
  	margin:0;
  	outline: none;
  }

  body  {
  	background: url('/images/BGbody.gif');
  	margin: 4px 0 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
  	padding: 0;
  	text-align: center;
  	font-size: small;
  }
  
  hr {
    border: 1px solid #CCCCCC;
  }

  p {
  	padding-bottom: 0.8em;
  	/*line-height: 1.3em;*/
  }

  a {
  	color: #1182CC;
  	text-decoration: none;
  	outline: none;
  }

    a:visited {
    	color: #1182CC;
    	text-decoration: none;
    }

    a:hover {
    	color: #134B6F;
    	text-decoration: underline;
    }
    
    a img {
      border: 0;
    }
    
  h3 {
    margin: 3px 0px 3px -8px;
    
  }
  
  .strong { font-weight: bold; }
  .center { margin: 0 auto; text-align: center;}

  .arrowGold {
  	background: url('/images/pointer_east_gold.gif') no-repeat left center;
  	padding-left: 15px;
  }

  #siteContainer {
  	width: 1000px;  /* This is the overall container for the whole site */
  	margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
  	text-align: left;
  }

  #sidebar {
  	float: right; /* since this element is floated, a width must be given */
  	width: 180px; /* the actual width of this div, in standards-compliant browsers, or standards mode in Internet Explorer will include the padding and border in addition to the width */
  	padding: 0px;
  	margin-top: 20px;
  	display: inline; /*included in every floated element to avoid IE doubling margin */
  	margin-bottom: 15px;
  }

  #sidebar .widget {
  	margin-top: 10px;
  	padding: 0px;
  	background: #FFFFFF;
  }

  #sidebar .widget  h2 {
  	font: bold 85% Arial, Helvetica, sans-serif;
  	margin: 0px;
  	padding-bottom: 8px;
  	color: #FFFFFF;
  	background: #134B6F;
  	padding-left: 10px;
  	padding-top: 8px;
  	text-transform: uppercase;
  }
  #sidebar .widget p {
  	padding: 8px 10px 15px;
  	margin: 0px;
  }


  /* Following is formatting for Sidebar accordion boxes */
  #sidebar .Accordion {
  	border-left: 1px solid #CCCCCC;
  	border-right: 1px solid #CCCCCC;
  	border-bottom: 1px solid #CCCCCC;
  	overflow: hidden;
  	font-family: Arial, Helvetica, sans-serif;
  }

  /* This is the selector for the AccordionPanel container which houses the
   * panel tab and a panel content area. It doesn't render visually, but we
   * make sure that it has zero margin and padding.
   *
   * The name of the class ("AccordionPanel") used in this selector is not necessary
   * to make the widget function. You can use any class name you want to style an
   * accordion panel container.
  */
   #sidebar .AccordionPanel {
  	margin: 0px;
  	padding: 0px;
  }

  /* This is the selector for the AccordionPanelTab. This container houses
   * the title for the panel. This is also the container that the user clicks
   * on to open a specific panel.
   *
   * The name of the class ("AccordionPanelTab") used in this selector is not necessary
   * to make the widget function. You can use any class name you want to style an
   * accordion panel tab container.
   */
  #sidebar .AccordionPanelTab {
  	border-top: 1px solid #CCCCCC;
  	border-bottom: 1px solid #CCCCCC;
  	padding: 4px 2px 2px 10px;
  	cursor: pointer;
  	-moz-user-select: none;
  	-khtml-user-select: none;
  	text-transform: uppercase;
  	color: #222;
  	margin: 0px;
  	font: bold 85% Arial, Helvetica, sans-serif;
  }

  /* This is the selector for a Panel's Content area. It's important to note that
   * you should never put any padding on the panel's content area if you plan to
   * use the Accordions panel animations. Placing a non-zero padding on the content
   * area can cause the accordion to abruptly grow in height while the panels animate.
   *
   * Anyone who styles an Accordion *MUST* specify a height on the Accordion Panel
   * Content container.
   *
   * The name of the class ("AccordionPanelContent") used in this selector is not necessary
   * to make the widget function. You can use any class name you want to style an
   * accordion panel content container.
   */
  #sidebar .AccordionPanelContent {
  	overflow: auto;
  	margin: 0px;
  	font: 85% Arial, Helvetica, sans-serif;
  	color: #222;
  	padding: 0px;
  }

  /* This is an example of how to change the appearance of the panel tab that is
   * currently open. The class "AccordionPanelOpen" is programatically added and removed
   * from panels as the user clicks on the tabs within the Accordion.
   */
  #sidebar .AccordionPanelOpen .AccordionPanelTab {
  	font-weight: bold;
  	color: #134B6F;
  	background: url('/images/arrow_south_BG_white.gif') no-repeat 75% 80%;
  }

  /* This is an example of how to change the appearance of the panel tab as the
   * mouse hovers over it. The class "AccordionPanelTabHover" is programatically added
   * and removed from panel tab containers as the mouse enters and exits the tab container.
   */
  #sidebar .AccordionPanelTabHover {
  	color: #555555;
  	background: #D2EBFB url('/images/arrow_east_BG_LTblue.gif') no-repeat 75% center;
  }

  #sidebar .AccordionPanelOpen .AccordionPanelTabHover {
  	color: #134B6F;
	
  }

  /* This is an example of how to change the appearance of all the panel tabs when the
   * Accordion has focus. The "AccordionFocused" class is programatically added and removed
   * whenever the Accordion gains or loses keyboard focus.
   */
  #sidebar .AccordionFocused .AccordionPanelTab {
  	background-color: #3399FF;
  }

  /* This is an example of how to change the appearance of the panel tab that is
   * currently open when the Accordion has focus.
   */
  #sidebar .AccordionFocused .AccordionPanelOpen .AccordionPanelTab {
  	background-color: #33CCFF;
  }

  #sidebar .AccordionPanelContent ul {
  	margin-top: 8px;
  	margin-left: 10px;
  	margin-bottom: 15px;
  }

  #sidebar .AccordionPanelContent li {
  	list-style: none;
  }

  /* end formatting for Sidebar accordion boxes */
  #navMain #menu1 {
  	background: url('/images/BGnavMain_ProductsSupport.gif') no-repeat center top;
  	margin-right: 220px;
  	width: 292px;
  }
  
  #navMain #menu2 {
  	display: inline;
  	background: url('/images/BGnavMain_Experience.gif') no-repeat center top;
  	float: right;
  	width: 173px;
  	margin-right: 13px;
  }
  
  #mainContainer {
  	width: 800px;
  	float: left;
  } 
  
    #mainContainer #header {
    	background: #FFFFFF;
    	border-bottom: 15px solid #134B6F;
    	height: 77px;
    }

  #navMainTab  {
  	color: #999999;
  	margin: 0px;
  	padding: 2px 0px 0px;
  	background: url(/images/BGnavMainTab.gif) no-repeat bottom;
  	text-align: right;
  	line-height: 20px;
  }

    #navMainTab li {
    	font: bold 75% Arial, Helvetica, sans-serif;
    	color: #999999;
    	display: inline;
    	padding-right: 3px;
    	padding-left: 3px;
    }

    #navMainTab a {
    	font-weight: bold;
    	color: #999999;
    	text-decoration: none;
    }

    #navMainTab  a:visited  {
    	color: #999999;
    	text-decoration: none;
    }

    #navMainTab a:hover {
    	color: #333333;
    	text-decoration: underline;
    }

  #navMainTab ul {
  	display: inline;
  	list-style: none;
  	padding-right: 30px;
  	padding-bottom: 0px;
  	margin: 0px;
  }

  #navMain  {
  	color: #134B6F;
  	float: right;
  	display: inline;
  	width: 520px;
  	margin-right: 20px;
  	font-size: 95%;
  	margin-top: 30px;
  }

    #navMain a:link {
    	color: #134B6F;
    	text-decoration: none;
    }

    #navMain a:visited {
    	color: #134B6F;
    	text-decoration: none;
	
    }

    #navMain a:hover {
    	color: #EABB00;
    	text-decoration: none;
    }

    #navMain .active {
    	color: #1395EC;
    	text-decoration: none;
    	padding-bottom: 15px;
    }

    #navMain ul {
    	text-align: center;
    	margin: 0px;
    	padding: 22px 0px 0px;
	
    }
    #navMain li {
    	display: inline;
    	font: bold 90% Tahoma, Geneva, sans;
    	color: #134B6F;
    	margin: 0px 4px;
    	padding: 0px;
    	list-style: none;
    }


  #mainImage  {
  	border-top: 1px solid #FFFFFF;
  	margin: 0px;
  	padding: 0px;
  	background: #FFF;
  	border-bottom: 1px solid #FFFFFF;
	
  }

  #contentContainer {
  	background: #FFFFFF;
  	padding-bottom: 15px;
  	border-bottom: 4px solid #134B6F;
  	border-top-style: none;
  	border-right-style: none;
  	border-left-style: none;
  	margin: 0px;
  	padding-top: 0px;
  	font-family: Tahoma,Geneva,sans;
  }

  #footer  {
  	border-top: 9px solid #F3F3F3;
  	font: 70% Verdana, Arial, Helvetica, sans-serif;
  	color: #222;
  	padding-right: 10px;
  	padding-left: 10px;
  	padding-top: 5px;
  }

    #footer p {
    	margin: 0px;
    	padding: 2px 0px;
    }

  .fltrt { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
  	float: right;
  	display: inline; /*included in every floated element to avoid IE doubling margin */
	
  }
  .fltlft { /* this class can be used to float an element left in your page */
  	float: left;
  	display: inline; /*included in every floated element to avoid IE doubling margin */
	
  }

  .clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
  	clear:both;
      height:0;
      font-size: 1px;
      line-height: 0px;
  }

  .footer_tagline {
  	font-weight: bold;
  	color: #134B6F;
  }

    .footer_tagline span {
    	margin-left: 4em;
    }
    
  #searchbox {
  	background: #134B6F url(/images/search_text.gif) no-repeat top;
  	width: 180px;
  	font: 90% Tahoma, Geneva, sans;
  	color: #134B6F;
  	margin: 0px;
  	padding: 15px 0px 0px;
  }

    #searchbox .email_signup {
    	margin: 0px;
    	padding: 2px 0px 10px;
    }

    #searchbox form {
    	padding-left: 24px;
    	margin: 0px;
    	padding-top: 15px;
    }

    #searchbox .label {
    	font-size: 1px;
    	line-height: 1px;
    }

    #searchbox .text {
    	width: 120px;
    	display: inline;
    	float: left;
    }

    #searchbox .searchbutton {
    	margin: 0px;
    }

  #subNav  {
  	padding: 35px 0px 15px;
  	font: bold 85% Tahoma;
  	color: #134B6F;
  	list-style: none;
  	margin: 0px 380px 0px 25px;
  	width: 150px;
  }
  
  div.ie-bug-widget {
    *font-size: 70%;
  }
  
  ul.inner-list {
    margin-top: 0px;
    padding-top: 0px;
  }
  
  #subNav h1 {
    _margin-bottom: -17px;
  }
  
  #subNav.ie-bug ul {
  	*font-size: 70%;  
  	margin: 0;
  }

    #subNav li {
    	margin: 0px 0px 0.5em;
    	line-height: normal;
    	padding: 0px;
    }

    #subNav a:link  {
    	color: #134B6F;
    	text-decoration: none;
    }

    #subNav  a:visited {
    	color: #134B6F;
    	text-decoration: none;
    }

    #subNav a:hover {
    	color: #3EA9EF;
    	text-decoration: none;
    }

    #subNav .active {
    	text-decoration: none;
    	color: #134B6F;
    	background: url(/images/pointer_east_gold.gif) no-repeat left center;
    	padding-left: 12px;
	
    }

    #subNav li ul {
    	padding-left: 8px;
    	padding-top: 6px;

    }

    #subNav ul {
    	color: #134B6F;
    	margin: 0px;
    	list-style: none;
    	padding: 0px 0px 0px 5px;

    }
    #subNav li li {
    	font-size: 100%;
    	font-weight: normal;
    	padding: 0px;
    }
    #subNav .additional-items {
        padding-left: 5px;
    }

  #videoPlayer {
  	text-align: center;
  }
  #header img {
  	margin-left: 15px;
  	margin-top: 5px;
  }

  ul.missions li {
    margin: 0.25em 0pt;
  }

  h2 span.date {
    font-size: 0.75em;
  }

  #quotes_new #contentContainer table,
  #quotes_create #contentContainer table {
    margin-left: 5em;
  }

  #quotes_create h2,
  #quotes_create p,
  #quotes_new h2,
  #quotes_new p {
    width: 500px;
    padding: 0.5em 0 0.5em 2em;
  }

  #quotes_create table th,
  #quotes_new table th {
    text-align: left;
  }

  #quotes_create #quote_business_other,
  #quotes_new #quote_business_other {
    margin-top: 0.5em;
  }

  .button {
  	color: black;
  	border-left: 1px solid #fff;
  	border-top: 1px solid #fff;
  	border-right: 1px solid #999;
  	border-bottom: 1px solid #999;
  	margin: 5px 0px;
  	padding: 8px;
  	font-size: 1em;
  	cursor: pointer;
  }

  #errorExplanation {
    width: 400px;
    border: 2px solid red;
    padding: 7px;
    padding-bottom: 12px;
    margin-bottom: 20px;
    margin: 0 auto;
    background-color: #f0f0f0;
  }

    #errorExplanation h2 {
      font-family: helvetica, arial, sans-serif;
      text-align: left;
      font-weight: bold;
      padding: 5px 5px 5px 15px;
      font-size: 12px;
      margin: -7px -7px 3px -7px;
      background-color: #c00;
      color: #fff;
      width: auto;
    }

    #errorExplanation p {
      color: #333;
      margin-bottom: 0;
      padding: 5px;
    }

    #errorExplanation ul li {
      font-size: 12px;
      margin-left: 2em;
      list-style: square;
    }

  .flash {
  	color: #0a0;
  	background-color: #fff;
  	font-weight: bold;
  	font-size: 14px;
  	font-style: italic;
  	margin: 15px;
  	padding: 1em;
  }

  .warn {
  	color: #a00;
  }
  
  h1.products a {
    display: block;
    width: 3.5em;
    height: 1em;
  }
  
  #main-picture {
    width: 200px;
    height: 176px;
    margin: 19px 4px 13% 0px;
  }

  #product-pictures {
    margin-right: 18px;
    list-style: none;
  }
  
    #product-pictures li {
      display: block;
      float: left;
      width: 95px;
      height: 95px;
      margin-left: 3px;
      padding-top: 2px;
    }
    
  #accessories_show .accessory-pictures {
    margin-right: 18px;
    list-style: none;
  }
  
    #accessories_show .accessory-pictures li {
      display: block;
      float: left;
      width: 95px;
      height: 95px;
    }

/*==================/categories/overview thumbnails==================*/

  ul#products {
    padding-left: 2.5em !important;
    *padding-left: 0em;
  }
    
  ul#products.thumbnails {
    list-style: none;
    margin-bottom: 1em;
  }
  
    ul#products.thumbnails li {
      display: block;
      overflow: hidden;
      width: 150px;
      height: 140px;
      float: left;
      margin: 0 0 2em 2em;
      padding-bottom: 25px;
      border: 1px solid #fc0;
    }
    
      ul#products.thumbnails li div.header {
        height: 27px;
        text-align: center;
        font-size: 0.9em;
        font-weight: bold;
        margin: 3px 3px 0;
      }
      
      ul#products.thumbnails li div.image {
        display: block;
        width: 150px;
      }
      
/*==================/categories/overview featured products==================*/
      
  table#featured-accessories {
    border: 2px solid yellow;
  }
  
    table#featured-accessories td {
      border-bottom: 1em solid white;
    }
    
  div.story-image {
    float: left;
    width: 150px;
    height: 150px;
    overflow: hidden;
  }
  
  div#compare-bar p {
    margin: 8px;
  }
  
  dl.id-field dt {
    font-weight: bold;
    text-align: center;
  }
  
  form#compare-fields dl#field-first {
    float: left;
    margin-left: 1em;
  }
  
  form#compare-fields dl#field-second {
    float: right;
    margin-right: 1em;
  }
  
  div#compare-products {
    margin: 1em 0;
  }
  
  div#compare-products #product_first {
    float: left;
    margin-right: 1em;
  }
  
  div#compare-products #product_second {
    float: right;
  }
  
  div#compare-products dl.products {
    width: 275px;
    *width: 270px;
    height: auto;
    margin: 0 1em;
    background-color: #eee;
    text-align: center;
  }
  
  dl.products dt {
    margin: 5px 0 0;
    font-size: 1.1em;
  }
  
  dl.products dd {
    margin: 0 0 10px;
    font-weight: bold;
  }
  
  dl.products dt.heading,
  dl.products dt.title {
    font-size: 1.1em;
    margin: 10px 0;
    font-weight: bold;
  }
  
  hr.picture-divider {
    width: 525px; 
    margin: 0 auto;
  }
  
  ul#press_assocs {
    list-style: none;
  }
  
  ul#press_assocs li {
    list-style: none;
    margin-bottom: 1em;
  }
  
  ul.story_images {
    list-style: none;
  }
  
  ul.story_images li {
    float: left;
    display: block;
    width: 150px;
    height: 150px;
    margin-left: 1em;
    text-align: center;
  }
  
  #contact-segments dl dt {
    margin: 0.5em 0;
    font-size: 14px;
    font-weight: bold;
  }
  
  #contact-segments {
    list-style: none;
  }
  
  #contact-segments li {
    float: left;
    display: block;
    width: 225px;
    margin-right: 1em;
  }
  
  #stories_index .pagination,
  #stories_index .year_pagination {
    float: right;
  }

/* ===========================================
  Product registration
==============================================*/

  #register-product {
    border: 2px solid #ccc;
    padding: 2em;
  }
  
  #side_buttons {
      text-align: center;
      margin-top: 0.25em;
  }

  #side_buttons img {
      margin: 0.25em 0;
  }