/*
Copyright (c) 2009, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.net/yui/license.txt
version: 2.8.0r4
*/
html{color:#000;background:#FFF;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td{margin:0;padding:0;}
table{border-collapse:collapse;border-spacing:0;}
fieldset,img{border:0;}
address,caption,cite,code,dfn,em,strong,th,var,optgroup{font-style:inherit;font-weight:inherit;}
del,ins{text-decoration:none;}
caption,th{text-align:left;}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}
q:before,q:after{content:'';}
abbr,acronym{border:0;font-variant:normal;}
sup{vertical-align:baseline;}
sub{vertical-align:baseline;}
legend{color:#000;}
input,button,textarea,select,optgroup,option{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;}
input,button,textarea,select{*font-size:100%;}
/* end of yui reset */

/*
#header
  #iconbar
    #icons
      .icon
wrapper
*/

html { 
  background: #F2F3E7 url("/assets/images/bg/bg_main.png") repeat-x left 126px;
  color: #333;
  }
body {
  margin: 0;
  font: 13px / 1.231 arial, helvetica, clean, sans-serif;*
  font-size:small;
  * font:x-small;
  text-align: center;
  font-family: Arial, Helvetica, sans-serif;
  text-align: left;
  color: #333;
  }

/* main html elements */
h1, h2, h3, h4 {
  font-family: Byington, Centaur, Georgia, "Times New Roman", serif;
  }

ul, ol {
   margin:auto -3em 1em 0;
   padding:0;
   position:relative;
   /* left:-3em; */
   margin-right: 1em;  
   overflow:hidden;
}
li {
   margin-top:0.25em;
   margin-bottom:0.25em;
}
ul ul, ul ol,
ol ol, ol ul {
   margin-left:1em;
   padding-left:0;
}
ul li, ol li {
   margin-left:5em;
}
li li {
   margin-left:1em;
}

strong {
  font-weight: bold;
  }
em {
  font-style: italic;
  }
blockquote {
  margin: 1em 2em;
  padding: 1em;
  background-color: #E7EADA;
  font-size: 110%;
  overflow: auto;
  }

blockquote.pullquote {
  width: 200px; 
  text-align: center; 
  border-top: 1px solid #d7daca;
  border-bottom: 1px solid #d7daca;
  padding: 10px; 
  margin: 5px 20px;
}
blockquote.pullquote.right {
  margin-right: 0;
  }
blockquote.pullquote.left {
  margin-left: 0;
  }

/* links */
a:link,
a:visited {
  color: #333333;
  text-decoration: none;
  }
a:focus,
a:hover,
a:active {
  text-decoration: underline;
  }

  
/* styling classes */
.left        { float: left; }
.right      { float: right; }
.center    { text-align: center; }
.hrclear  { display: block; visibility: hidden; clear: both; margin: 0; padding: 0; height: 1px; }
.underline { border-bottom: 1px solid #828470; }

.ok { color: #009b0b; }
.warn { font-weight: bold; color: #cc6a00; }
.error { font-weight: bold; color: #b50303; }

noscript h1 {
  background-color: white;
  border: 2px solid red;
  padding: 10px;
  font-weight: bold;
  color: #b50303;
}

/* page header */
#header { 
  background: #3A2823;
  color: #a7948f;
  color: white;
  }
  
  /* top icon bar */
  #header div#iconbar	{
    position: absolute;
    background-color: #231714;
    background-color: #170b08;
    top: 0px;
    left: 0px; 
    height: 26px;
    width: 100%;
    min-width: 984px;
    line-height: 26px;
    font-size: 80%;
    text-align: right;
    }
    
    /* container for icons on right-hand side */
    #header div#iconbar div#icons {
      margin: 0 20px 0 2em;
      display: inline;
      height: 26px;
      }
      
      /* individual icons */
      #header div#iconbar div#icons img.icon  {
        vertical-align: middle;
        margin-right: 10px;
        }

  /* title bar */
  #header div.title {
    background: #3A2823 url(../images/header_halo.png) no-repeat -50px top;
    height: 72px;
    min-width: 984px;
    margin: 26px 0 0 0;
    }
    #header div.title img#logo {
      position: absolute;
      top: 5px;
      left: 20px;
      z-index: 10;
      }
    
    #header div.title h1,
    #header div.title h2 {
      padding-top: 5px;
      font-size: 30px;
      margin-left: 150px; /* move out past logo */
      color: #FFFFFF;
      }
      
    #header div.title h2 {
      font-size: 16px;
      }
  
  /* subheader (tagline) */  
  #header div#subheader {
    position: relative; 
    background-color: #513b36;
    background-color: #452f2a;
    background-color: #59433e;
    height: 28px;
    line-height: 28px;
    min-width: 984px;
    overflow: hidden; /* IE7 fix */
    clear: both;
    }
    #header div#subheader p {
      margin-left: 150px;
    }

/* wrapper for everything except the header and footer */

/* links */
#wrapper a:link,
#wrapper a:visited {
  color: #5f614d;
  text-decoration: underline;
  }
#wrapper a:focus,
#wrapper a:hover,
#wrapper a:active {
  color: #828470;
  }

        #wrapper h1 {
          font-size: 167%; /* 22px */
          color: #443;
          margin: 0.5em 0 20px 0;
          }
          
        #wrapper > h1 {
          margin-top: 10em;
          }
          
        #wrapper h2 {
          font-size: 138.5%; /* 18px */
          color: #443;
          margin: 1em 0 .5em 0;
          }
        #wrapper h3 {
          font-size: 120%;
          color: #433;
          margin: 1em 0 .5em 0;
          }
          
#wrapper {
  padding: 28px;
  padding-bottom: 100px;
  }
  
    /* all non-header and non-footer content */
    #wrapper #contents {
      /* position: relative; */
      width: 984px;
      margin: 0 auto;
      }

      /* For all boxes, the following rules are true:
         .box-top is the top and top-right
         .box-top DIV is the top-left
         .box-left is the left-side border
         .box-center is the content wrapper.
         .box-right is the right-side border
         .box-bottom is the bottom and bottom-right
         .box-bottom DIV is the bottom-left
      */
      
      /* outer content box */
      #wrapper #contents div.outer-box {
        *padding-top: 20px; /* IE hack */
        }
        
        #wrapper #contents div.outer-box div.box-top {
          height: 17px;
          margin: 0 0 0 18px;
          background: url(../images/boxes/box_outer_top_bottom.png) no-repeat 100% 0;
          width: auto;
          }
          
          #wrapper #contents div.outer-box div.box-top div {
            position: relative;
            left: -18px;
            width: 18px;
            height: 17px;
            background: url(../images/boxes/box_outer_top_bottom.png) no-repeat 0 0;
            font-size: 0;
            line-height: 0;
            }
            
        #wrapper #contents div.outer-box div.box-bottom {
          height: 14px;
          margin: 0 0 0 16px;
          background: url(../images/boxes/box_outer_top_bottom.png) no-repeat 100% 100%;
          }
          
          #wrapper #contents div.outer-box div.box-bottom div {
            position: relative;
            left: -16px;
            width: 16px;
            height: 14px;
            background: url(../images/boxes/box_outer_top_bottom.png) no-repeat 0 100%;
            font-size: 0;
            line-height: 0;
          }
          
        #wrapper #contents div.outer-box div.box-left {
          padding: 0 0 0 8px;
          background: url(../images/boxes/box_outer_left.png) repeat-y 0 0;
          }
          
        #wrapper #contents div.outer-box div.box-right {
          padding: 0 8px 0 0;
          background: url(../images/boxes/box_outer_right.png) repeat-y 100% 0;
          }
          
        #wrapper #contents div.outer-box div.box-center {
          display: block;
          padding: 5px 20px;
          color: #333;
          background: url(../images/boxes/box_outer_center.png) repeat left top;
          }
          
        /* inner content box */
        #wrapper #contents div.outer-box div.inner-box {
          width: 100%;
          } 

          #wrapper #contents div.outer-box div.inner-box div.box-top {
            width: auto;
            height: 16px;
            margin: 0 0 0 18px;
            background: url(../images/boxes/box_inner_top_bottom.png) no-repeat 100% 0;
            }

            #wrapper #contents div.outer-box div.inner-box div.box-top div {
              position: relative;
              left: -18px;
              width: 18px;
              height: 16px;
              background: url(../images/boxes/box_inner_top_bottom.png) no-repeat 0 0;
              font-size: 0;
              line-height: 0;
              }

          #wrapper #contents div.outer-box div.inner-box div.box-bottom {
            height: 14px;
            margin: 0 0 0 16px;
            background: url(../images/boxes/box_inner_top_bottom.png) no-repeat 100% 100%;
            }

            #wrapper #contents div.outer-box div.inner-box div.box-bottom div {
              position: relative;
              left: -16px;
              width: 16px;
              height: 14px;
              background: url(../images/boxes/box_inner_top_bottom.png) no-repeat 0 100%;
              font-size: 0;
              line-height: 0;
              }

          #wrapper #contents div.outer-box div.inner-box div.box-left {
            background: url(../images/boxes/box_inner_left.png) repeat-y 0 0;
            padding: 0 0 0 8px;
            }

          #wrapper #contents div.outer-box div.inner-box div.box-right {
            background: url(../images/boxes/box_inner_right.png) repeat-y 100% 0;
            padding: 0 8px 0 0;
            }

          #wrapper #contents div.outer-box div.inner-box div.box-center {
            background: url(../images/boxes/box_inner_center.png) repeat left top;
            display: block;
            color: #333;
            min-height: 75px;
            padding: 1px 20px;
            position: relative;
            }

        /* error messages */
        #wrapper #contents div.outer-box div.inner-box div.error-box {
          width: 100%;
          color: white;
          padding: 15px 0;
          }
          
          #wrapper #contents div.outer-box div.inner-box div.error-box div.box-top {
            width: auto;
            height: 16px;
            margin: 0 0 0 18px;
            background: url(../images/boxes/box_error.png) no-repeat 100% 0;
            }
            
            #wrapper #contents div.outer-box div.inner-box div.error-box div.box-top div {
              position: relative;
              left: -18px;
              width: 18px;
              height: 16px;
              background: url(../images/boxes/box_error.png) no-repeat 0 0;
              font-size: 0;
              line-height: 0;
              }
              
          #wrapper #contents div.outer-box div.inner-box div.error-box div.box-bottom {
            height: 20px;
            margin: 0 0 0 16px;
            background: url(../images/boxes/box_error.png) no-repeat 100% 100%;
            }
            
            #wrapper #contents div.outer-box div.inner-box div.error-box div.box-bottom div {
              position: relative;
              left: -16px;
              width: 16px;
              height: 20px;
              background: url(../images/boxes/box_error.png) repeat 0 100%;
              font-size: 0;
              line-height: 0;
              }

          #wrapper #contents div.outer-box div.inner-box div.error-box div.box-left {
            padding: 0 0 0 7px;
            background: transparent;
            }

          #wrapper #contents div.outer-box div.inner-box div.error-box div.box-right {
            padding: 0 7px 0 0;
            background: transparent;
            }
          
          #wrapper #contents div.outer-box div.inner-box div.error-box div.box-center {
            display: block;
            padding: 0 10px;
            color: #b00;
            color: white;
            background: #F2C9C9;
            background: #f66;
            min-height: 15px;
            }
            
        #wrapper #contents div.outer-box div.inner-box #main.full_page {
          width: 100%;
          background: none;
          padding: 0;
          float: none;
          padding-top: 10px;
          }

          #wrapper #contents div.outer-box div.inner-box #main P {
            margin: .5em 0;
            }
          
          #wrapper #contents div.outer-box div.inner-box #narrative P {
            margin: .5em 1em;
            }
          #wrapper #contents div.outer-box div.inner-box #narrative > P {
            margin-left: 2em;
            }
          #wrapper #contents div.outer-box div.inner-box #narrative h1 {
            font-size: 200%;
            }
            
          #wrapper #contents div.outer-box div.inner-box #narrative h2 {
            font-size: 167%;
            margin-top: 2em;
            margin-bottom: 1em;
            }
          #wrapper #contents div.outer-box div.inner-box #narrative h3 {
            font-size: 138.5%;
            }

          
        #wrapper #contents div.outer-box div.inner-box div.sidebar-box {
          color: white;
          padding: 10px 0 0 0;
          padding: 0;
          width: 100%;
          }
          
          #wrapper #contents div.outer-box div.inner-box div.sidebar-box .box-top {
            width: auto;
            height: 16px;
            margin: 0 0 0 18px;
            background: url(../images/boxes/box_sidebar.png) no-repeat 100% 0;
            }
            
            #wrapper #contents div.outer-box div.inner-box div.sidebar-box .box-top div {
              position: relative;
              left: -18px;
              width: 18px;
              height: 16px;
              background: url(../images/boxes/box_sidebar.png) no-repeat 0 0;
              font-size: 0;
              line-height: 0;
              }
              
        #wrapper #contents div.outer-box div.inner-box div.sidebar-box .box-bottom {
          background: url(../images/boxes/box_sidebar.png) no-repeat 100% 0;
          width: auto;
          height: 16px;
          margin: 0 0 0 18px;
          }
          
          #wrapper #contents div.outer-box div.inner-box div.sidebar-box .box-bottom div {
            background: url(../images/boxes/box_sidebar.png) no-repeat 0 0;
            position: relative;
            left: -18px;
            width: 18px;
            height: 16px;
            font-size: 0;
            line-height: 0;
            }
            
        #wrapper #contents div.outer-box div.inner-box div.sidebar-box .box-bottom {
          background: url(../images/boxes/box_sidebar.png) no-repeat 100% 100%;
          height: 20px;
          margin: 0 0 0 16px;
          }

        #wrapper #contents div.outer-box div.inner-box div.sidebar-box .box-bottom div{
          background: url(../images/boxes/box_sidebar.png) repeat 0 100%;
          position: relative;
          left: -16px;
          width: 16px;
          height: 20px;
          font-size: 0;
          line-height: 0;
          }
          
        #wrapper #contents div.outer-box div.inner-box div.sidebar-box .box-left {
          padding: 0;
          background: transparent;
          }

        #wrapper #contents div.outer-box div.inner-box div.sidebar-box .box-right {
          padding: 0;
          background: transparent;
          }

        #wrapper #contents div.outer-box div.inner-box div.sidebar-box .box-center {
          position: relative;
          display: block;
          padding: 5px 20px;
          background: #EFF0E9;
          min-height: 20px;
          }

        #wrapper #contents div.outer-box div.inner-box div.sidebar-box.left,
        #wrapper #contents div.outer-box div.inner-box div.sidebar-box.right {
            width: 208px !important;                                              /* !important required because of over-specificity? */
            min-height: 90px;
            margin: 0;
        }    

        #wrapper #contents div.outer-box div.inner-box div.sidebar-box.right { float: right; margin-left: 10px !important; }
        #wrapper #contents div.outer-box div.inner-box div.sidebar-box.left { float: left; clear: left; margin-right: 10px !important;}

        #wrapper #contents div.outer-box div.sidebar-box .box-content {
            margin: 0;
            clear: both;
        }
        
        #wrapper #contents div.outer-box div.sidebar-box .box-content :first-child {
            margin-top: 0;
        }
        
        #wrapper #contents div.outer-box div.sidebar-box .box-content :last-child {
            margin-bottom: 0;
        }


#footer {
  background-color: #B1B39F;
  background-color: #a5a793;
  color: white;
  overflow: hidden;
  margin: 0;
  padding: 0 0 30px 0;
  clear: both;
  }
  
  #footer .subfooter { 
    background: #bec0ab; 
    height: 16px;
    padding: 11px 0;
    }

  #footer div.footer-links { 
    width: 974px;
    margin: 0 auto;
    }
  
    #footer div.footer-links ul {
      list-style: none;
      }
      #footer div.footer-links ul > li {
        float: left;
        margin: 10px 25px;
      }

/* Three-state hover button. Sprite contains off, hover, and click states from top to bottom.
   the height and width need to be specified in another class to make this portable.
 */
.three-state-button {
  background-position: top;
}
.three-state-button:hover {
	background-position: center;
}

.three-state-button:active {
	background-position: bottom;
}

/* Two-state hover button. Sprite contains off and hover states from top to bottom.
   the height and width need to be specified in another class to make this portable.
 */
.two-state-button {
  background-position: top;
}
.two-state-button:hover {
	background-position: bottom;
}

    /* Big buttons */
    
      p.button a.rollover {
        display: inline-block;
        display: block;
        color: #033;
        font-size: 167%;
        line-height: 89px;
        text-align: center;
        text-decoration: none;
        text-shadow: 0 0 5px #fff;
        outline: none;
        overflow: hidden;
        }
      p.button#gsw a.rollover {
        background-image: url(/assets/images/buttons/get_started_webinar.png);
        width: 334px;  
        height: 89px;
        }

      p.button a.rollover img {
        border: none;
        }
      p.button a.rollover:hover {
        text-decoration: none;
        }