/*  

  aon-manchester.com stylesheet
  v 1.0
  
  author: bryan@bryanlademann.com

                                                            


  notes: ===================================================
============================================================

  COLOR SCHEMA  
  
  text:     #404040 
    
  aon red:  #e11b22
  
  
  Always minimize your CSS before deploying:  
  http://www.cssdrive.com/index.php/main/csscompressor/
  

  Z-INDEX BLOCKING
  http://designindevelopment.com/css/z-index-blocking/
  
  901-1000 – Error Message Windows (if modal)
  801-900 – Modal Windows
  701-800 – Primary Navigation
  601-700 – Page Based Error Messaging
  501-600 – Open
  401-500 – Open
  301-400 – Open
  201-300 – Open
  101-200 – Promotional/Advertising
  1-100 – General Content   
  



  table of contents  ========================================
============================================================
  
    * @imports
    * Resetz
    * Base
    * Typography  
      - Headings
      - Text Elements   
      - Lists 
      - Tables
    * Forms
        - Error
    * Navigation systems
      - global
      - social-media
    * Structure  
      - Layout
        - *block level elements
      - template specific styles
    * plugins
    * Misc styles
    * Troubleshooting
    * Media Queries
      - print
      - mobile
  
  
  
  
  @imports =================================================
============================================================ 


/*  @fontface
------------------------------ 
@import url(_fonts/font-face.css) all; 





  
/*  reset.css =================================================
 
    html5doctor.com Reset Stylesheet 
    (Eric Meyer's Reset Reloaded + HTML5 baseline)
    v1.4 2009-07-27 | Authors: Eric Meyer & Richard Clark
    html5doctor.com/html-5-reset-stylesheet/
============================================================ */

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, a, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, figure, footer, header, 
hgroup, menu, nav, section, menu,
time, mark, audio, video {
  background:transparent;
  border:0;
  font-size:100%;
  margin:0;
  padding:0;
  outline:0;
  vertical-align:baseline;  
  }     
             
article, aside, canvas, details, 
embed, figcaption, figure, footer, 
header, hgroup, menu, nav, section, 
summary { display: block; }

command, datalist, keygen, mark, 
meter, progress, rp, rt, ruby, time, 
wbr { display: inline; }

/* Tables still need 'cellspacing="0"' in the markup. */
table           { border-collapse: collapse; border-spacing: 0; }
caption, th, td { text-align: left; font-weight: normal; }
table, td, th   { vertical-align: middle; }

/* Removes possible quote marks (") from <q>, <blockquote>. */
blockquote, q { quotes:none; }

blockquote:before, 
blockquote:after,
q:before, q:after { content:''; content:none; }

/* Removes border on linked images. */
a img, :link img, :visited img { border: none; }

a        { color:inherit; text-decoration:none;}  
a:hover,  
a:active { text-decoration:none; outline: none;}


::-moz-selection { background: #fff200; color:#111; text-shadow: none; }
::selection      { background: #fff200; color:#111; text-shadow: none; } 

/*  j.mp/webkit-tap-highlight-color  
changes default tap color on mobile devices from grey to... */
a:link { -webkit-tap-highlight-color: #fff200; } 





  
/*  base.css ==================================================
============================================================ */

html, body { height: 100%; }

/* prevents visual 'page jump' effect when scrollbar appears 
with content that extends beyond bottom of viewport. */  
html       { overflow-y:scroll; } 

/* create slightly smoother font display, but can cause 
problems in other rendering engines :: salt to taste */
html       { -webkit-font-smoothing: antialiased; }

.strong    { font-weight: 700; }
.em        { font-style:italic; }
.underline { text-decoration: underline; }

.uppercase { text-transform:uppercase; letter-spacing:0.1em; font-weight:normal; }
.lowercase { text-transform:lowercase; }

.hide      { position:absolute; text-indent:-9999px; display: none; }      

img        { margin:0; }
.polaroid  { background: #fff; padding: .9em .9em 1.8em; }

.center    { text-align:center; margin: 0 auto; }
.clear     { clear: both; }
.right     { float:right; }
.left      { float:left; }
       

/*  The New Clearfix Method                                       
http://perishablepress.com/press/2009/12/06/new-clearfix-hack/ */
.clearfix:after {
  visibility: hidden;
  display: block;
  font-size: 0;
  content: " ";
  clear: both;
  height: 0;
  }
* html .clearfix             { zoom: 1; } /* IE6 */
*:first-child+html .clearfix { zoom: 1; } /* IE7 */

/* enhances user experience when links are clicked */
a        { position: relative;}
a:active { }

/* prevents nasty looking multi-lined links in body copy */
p a { white-space: nowrap; }

hr { display:block; height:1px; border:0; border-top:1px solid #ccc; margin:1em 0; padding:0; }

/* Use whenever encapsulation is needed */
.container   { margin: 0 auto; }






/*  typography.css ============================================

    - default font size is 10px.
    - vertical rythym set to 17px (1.7) line height.
    - 17/(element's font size) = line height                              
============================================================ */
  
body    { color: #4d4f53; font: 62.5%/1.7 arial, sans-serif; }
a       { color: #4d4f53; }
a:hover { color: #e11b22;}
    

/*  Headings
------------------------------ */

h1, h2, h3, 
h4, h5, h6 {  line-height: 1;  }

h1  { font-size: 5.5em;  } 
h2  { font-size: 3.4em; }  
h3  { font-size: 2.1em; }
h4  { font-size: 1.5em; }
h5  { font-size: 1.4em; color:#666; text-transform:uppercase; letter-spacing: .1em; word-spacing: .2em; }
h6  { font-size: 1.1em;color:#666; font-weight: 700; font-style:italic; }


/*  Text Elements
------------------------------ */

p { font-size:1.4em; line-height: 1.35; margin-bottom: 1.35em; text-align:left; }

/* Gives ampersands a typographic makeover */
.amp { font-family: "Hoefler Text", Garamond, Baskerville, "Goudy Old Style", "Palatino", "Book Antiqua", serif; font-weight: normal; font-style: italic; }  

blockquote  { 
  color: #666; 
  font-style: italic; 
  font-size: 1.4em; 
  line-height: 1.285em;  
  margin: 1.285em 1.8em; 
  text-indent: -.9em; 
  }
small    { }  
strong   { font-weight: 700; }
em,dfn   { font-style: italic; }
dfn      { font-weight: 700; }
sup, sub { line-height: 0; }
sub      { vertical-align: sub; font-size: smaller; }
sup      { vertical-align: super; font-size: smaller; }

abbr[title], 
dfn[title],
acronym { cursor:help; border-bottom: 1px dotted #79804D; letter-spacing:0.1em; margin: 0 2em 1.5em; }

address { margin: 0 2em 1.5em; font-style: italic; }
del     { color:#666; text-decoration: line-through; }
mark    { background-color:#ff9; color:#000; font-style:italic; font-weight:bold; }
ins     { background-color:#ff9; color:#000; text-decoration:none; }

pre     { 
  margin: 1.5em 1.5em; 
  /* www.pathf.com/blogs/2008/05/formatting-quoted-code-in-blog-posts-css21-white-space-pre-wrap/ */
  white-space: pre; /* CSS2 */
  white-space: pre-wrap; /* CSS 2.1 */
  white-space: pre-line; /* CSS 3 (and 2.1 as well, actually) */
  word-wrap: break-word; /* IE */ 
  }
  
pre, code, 
tt, kbd,
samp { font: 1em 'andale mono', 'lucida console', monospace; line-height: 1.5; margin:0 2em 1.5em; }

  
/* Lists
------------------------------ */

/* top-level lists */
ul, ol { margin-bottom: 1.5em; }
ol     { list-style-type: decimal; }

ul > ul {margin-left: 2em; margin-bottom: 0; }

ul.no-bullet      { list-style: none; margin-left: 0; }
  ul.no-bullet li { margin-left: 0; }


li { font-size: 1.4em; line-height: 1.35; }

/* nested lists */
li ul, 
li ol  { margin-left: 2em; }
  
dl     { margin: 0 0 1.5em 0; font-size: 1.4em; }
  dt   { font-weight: bold; float: left; }
  dd   { margin-left: 1.5em;}   


/* Tables
------------------------------ */

table         { margin-bottom: 1.8em; }
thead th      { background: #c3d9ff; font-weight: 700; }
th,td,caption { padding: 4px 10px 4px 5px; }
tr.even td    { background: #e5ecf9; }
tfoot         { font-style: italic; }
caption       { background: #eee; }
td, td img    { vertical-align:top; } 






/*  forms.css ===================================================     
============================================================== */

form    { }
form ol { list-style:none; margin: 0; }
form li { margin-bottom:.8em; } 
@media screen and (-webkit-min-device-pixel-ratio:0){
/* Targets Webkit based browsers: Safari, Chrome */
form li { margin-bottom:.9em; }
}

fieldset {}
legend   {}
label  {               
  font-size: .95em;
  display: block; 
  margin-bottom: .1em;
  float: left; 
  width: 140px;                                    
  }  

form p { margin:0;padding:0;}   
  


/* Form fields
------------------------------ */

/* align checkboxes, radios, text inputs with their label
   by: Thierry Koblentz tjkdesign.com/ez-css/css/base.css  */
input[type="radio"]    { vertical-align: text-bottom; }
input[type="checkbox"] { vertical-align: bottom; *vertical-align: baseline; }
*input                 { vertical-align: text-bottom; }

/* hand cursor on clickable input elements */
label, input[type=button], input[type=submit], button, select, .pointer { cursor: pointer; }

input, select { vertical-align:middle; }

select, input, textarea { font:99% sans-serif; }

input, 
textarea {
  *margin-left: -20px;
  }

input.text,
input[type=text]  {
  padding: .05em .1em;
  font-size: .9em;
  width: 200px;     
  height: 1.8em;
  }

input.text:focus,
textarea:focus {
  }  

textarea {
  padding: 0.3em;
  width: 200px;
  font-size: .9em;
  line-height: 1.; 
  height: 6.1em;    
  }

select { width: 208px; }


/* Buttons                                  
------------------------------ */

form button { border: none; margin: 0 0 0 140px;  padding: .4em .8em; background: #e11b22; color: #fff; text-transform: uppercase;  }

.button, 
button.button {
  } 

.button:hover,
.button:focus  {                          
  }  

.button:active, 
button.button:active {  
  }                        






/*  Success, notice and error boxes ===========================
============================================================ */

.error,
.notice, 
/*.success   { padding: .8em; margin-bottom: 1em; border: 2px solid #ddd; }*/
.success   { padding: 0; margin-bottom: 0; border: 2px solid #ddd; }

.error     { background: #FBE3E4; color: #8a1f11; border-color: #FBC2C4; }
.notice    { background: #FFF6BF; color: #514721; border-color: #FFD324; }
.success   { background: #E6EFC2; color: #264409; border-color: #C6D880; } 

.error a   { color: #8a1f11; }
.notice a  { color: #514721; }
.success a { color: #264409; }

 
/*  Navigation systems ========================================
============================================================ */


/* Use for horizontal navs/lists */
.horizontal       { float: left; list-style: none; margin: 0;}
  .horizontal li  { float: left; display: inline; } 
    .horizontal a { display: block; text-decoration: none; }
  
    
#global { margin: 0 auto; list-style: none; height: 40px;  position: absolute; top: -2px; width: 960px; }



#global #mycarousel { 
  position: relative;
  width: 635px;
  float:right;
  height: 50px; 
 /* z-index: 101; */
 z-index:700;
  }


#global #mycarousel .scroller li.jcarousel-item  {  
  background: url(_img/bg.schedule.dotted.line.png) no-repeat left;
  height: 40px; 
  padding: 10px 12px 0 12px;
  height: 50px;
  width: 235px;
  }

      #global #mycarousel .scroller li p           { width: auto; margin: 0; }
      #global #mycarousel .scroller li p.vs        { font-size: 12px; line-height: 1.35; text-transform: uppercase;}
        /* #global #schedule .scroller li p.vs span { color: #e21a22; } */
        #global #mycarousel .scroller li p.vs span { color: #e11b22; }
        
      #global #mycarousel .scroller li p.game-meta { font-size: 12px; line-height: 1.35; }


  #global #mycarousel p.intro { 
    cursor: pointer;
    display: block;
    height: 49px; 
    padding: 0;
    position: absolute; 
    line-height: 49px;
    right: 0;
    padding-right: 58px; 
    top: 0; 
    text-transform: uppercase;
    z-index: 302;   
    }

    #global #mycarousel button.button-prev { 
      background: url(_img/btn.schedule.left.png) no-repeat; 
      border: none; 
      cursor: pointer;
      display: none;
      height:49px; 
      left: 0;
      position: absolute;
      top: 0; 
      width: 50px;
      z-index: 301;
      }

    #global #mycarousel button.button-next { 
     /*background: url(_img/btn.schedule.right.png) no-repeat; */  
        background: url(_img/open-fixture.png) no-repeat 7px 7px; 
      border: none; 
      cursor: pointer;
      display: block;
      height:49px; 
      position: absolute;
      right: 0;
      top: 0;
      width: 50px; 
      z-index: 301;
      }
  
    #global #mycarousel button#button-reset-slider { 
      background: url(_img/btn.schedule.reset.jpg) no-repeat; 
      border: none; 
      cursor: pointer;
      display: none;
      height:49px; 
      position: absolute;
      right: 51px;
      top: 0;
      width: 20px; 
      z-index: 301;
      text-indent:-9999em;
      }

  .jcarousel-skin-tango .jcarousel-prev-horizontal.jcarousel-prev-disabled-horizontal {
    background: url(_img/fixture-nextBtn-inactive.png) 7px 7px no-repeat; 
    display: none;
    }
  
  .jcarousel-skin-tango .jcarousel-next-horizontal.jcarousel-next-disabled-horizontal {
    background: url(_img/fixture-backBtn-inactive.png) 7px 7px no-repeat; 
  display: none;
  }



/* scrolling controller for fixture schedule  */
.jcarousel-skin-tango .jcarousel-container {
  background: url(_img/bg.header.png) repeat-x right 2px;
  position: relative;
  width: 520px;
  height: 50px; 
  overflow: hidden;
  }

.jcarousel-skin-tango .jcarousel-direction-rtl {
  direction: rtl;
  }

.jcarousel-skin-tango .jcarousel-clip {
  height: 50px;
  left: 48px;        
  overflow: hidden;
  width: 520px;
  }

.jcarousel-skin-tango .jcarousel-list {
  display: none;
  height: 50px;
  left: 48px;        
  overflow: hidden;
  width: 520px;
  }

/* Horizontal Buttons */
.jcarousel-skin-tango .jcarousel-next-horizontal {
  position: absolute;
  cursor: pointer;
  border: none; 
  display: block;
  height:49px; 
  right: 0;
  top: 0;
  width: 50px; 
  z-index: 301;
  font-size: 42px;
  line-height: 49px;
  }

.jcarousel-skin-tango .jcarousel-next-disabled-horizontal,
.jcarousel-skin-tango .jcarousel-next-disabled-horizontal:hover,
.jcarousel-skin-tango .jcarousel-next-disabled-horizontal:focus,
.jcarousel-skin-tango .jcarousel-next-disabled-horizontal:active,
.jcarousel-skin-tango .jcarousel-prev-disabled-horizontal,
.jcarousel-skin-tango .jcarousel-prev-disabled-horizontal:hover,
.jcarousel-skin-tango .jcarousel-prev-disabled-horizontal:focus,
.jcarousel-skin-tango .jcarousel-prev-disabled-horizontal:active {
  cursor: default;
  }

.jcarousel-skin-tango .jcarousel-prev-horizontal {
  background: url(_img/btn.schedule.left.png) no-repeat; 
  border: none; 
  cursor: pointer;
  display: none;
  height:49px; 
  left: 0;
  position: absolute;
  top: 0; 
  width: 50px;
  z-index: 301;
  }


.jcarousel-skin-tango .jcarousel-direction-rtl .jcarousel-prev-horizontal {
  background: url(_img/btn.schedule.left.png) no-repeat; 
  border: none; 
  cursor: pointer;
  display: none;
  height:49px; 
  left: 0;
  position: absolute;
  top: 0; 
  width: 50px;
  z-index: 301;
  }



  #global #contact-aon {
    display:block;
    position: absolute; 
    left: 0;
    top:84px;
    width:939px;
    height:20px;
    background-color:#000;
    text-align:right;
    z-index:3;
    }
  
  #global .contact-aon {
    display:inline-block;
    width:100px;
    background: url(_img/blt.arrow.right.png) no-repeat right 11px;
    border: none; 
    /* color: #e21a22; */
    color: #e11b22; 
    font-size: 1.2em; 
    line-height: 29px; /* cufon alignment fix */ 
    position:relative;
    top:-4px;
    padding-right:10px;
    }
   
  #global ul    { position: absolute; right:0; top: 83px; }
  #global ul.parent-links {top:51px;z-index:100;right:0;}
    #global li  { display: inline; float: left; position: relative; line-height:1;  }
      #global ul a {
        display: block;
        border-bottom: none;
        border-right: 1px solid #111;
        line-height: 34px; /* cufon alignment fix */
        font-size: 15px;
        text-decoration: none;
        text-align: center;
        color: #efefef;
        padding:0 21px 0 22px;
        }
        #global ul a:hover {  }
        #global ul a:active  { top: 0; }
        
        /* sets interactive response for element */
        #global ul a:hover,
        #global li.parent-link:hover a, a.corner_fix { background: url(_img/bg.nav.png) repeat-x 0 -40px; text-shadow: 0 1px 1px #222;  }


      /* category: about aon */
      body.about-aon #global ul a.about-aon, 
      body.empowering-results #global ul a.about-aon,
      body.history #global ul a.about-aon,

      /* category: work with aon */ 
      body.work-with-aon #global ul a.work-with-aon, 

      /* category: join aon */
      body.join-aon #global ul a.join-aon, 

      /* category: a united partnership */
      body.partnership #global ul a.partnership, 
      body.about-manchester-united #global ul a.partnership, 
      body.fixtures #global ul a.partnership, 
      body.clients #global ul a.partnership, 
      body.communities #global ul a.partnership, 
      body.colleagues #global ul a.partnership, 

      /* category: media */
      body.media #global ul a.media, 
      body.in-the-news #global ul a.media, 
      body.inquiries #global ul a.media, 
      body.fact-sheet #global ul a.media, 
      body.press-releases #global ul a.media,
 
      /* category: galleries */
      body.galleries #global ul a.galleries,
      body.videos #global ul a.galleries,
      body.photos #global ul a.galleries { background: url(_img/bg.nav.png) repeat-x 0 -40px; text-shadow: 0 1px 1px #222;  }




       
  /* mega dropdowns */
  #global li div.sub { 
    display: none; 
    background: #fff url(_img/bg.nav.sub.panel.png) repeat-x 0 0; 
    left: 0; 
    position: absolute; 
    top: auto; 
    width:422px; 
    min-height: 200px;
    text-align: left;
    z-index: 999;
    }
  /* appear upon parent link's hover event */
  /* #global li:hover div { display: block; } */
  /* prevents media and gallery-page dropdown from appearing outside main layout area */
  #global li.parent-link-3:hover div.sub { left:-246px; ; }
  #global li.parent-link-4:hover div.sub { left:-337px; ; }
  #global li.parent-link-5:hover div.sub { left:-322px; ; } /* gallery-page */

    /* top area */
    #global li div.sub .top { border-bottom: 1px solid #eeefee; padding: 18px 0;  }
    #global li div h2 { line-height: 15px; font-size: 21px; color: #777; margin:6px 20px 0 10px; width:150px; float: left; font-weight: normal; } 
      #global li div h2 span {  font-size: 27px; }
    
    /* link list */
    #global li div.sub .top ul { display: inline; width: 240px; *width: 200px; float: left; position: relative; top: 0; margin: 0; list-style: none;left:0px; }
      #global li div.sub .top li { background: url(_img/brdr.dropdown.link.png) no-repeat bottom;  display: block; float: none; *width: 200px;}
      
      #global li div.sub .top .last { background-image: none; }  
        #global li div.sub .top a { 
          background: none;
          border: none; 
          left:-17px;
          color:#252525;
          font-size: 17px; 
          line-height: 34px !important; 
          text-align: left;  
          text-shadow: none;
          width: 240px;
          *width: 225px;
          }

          #global li div.sub .top a:hover { color: #e11b22; }        
            #global li div.sub .top ul ul { float: none; }
            #global li div.sub .top ul ul a { background: url(_img/blt.nav.tertiary.links.png) no-repeat 0 50% ; padding-left: 10px; width: 230px; *width: 200px; font-size: 15px; color: #777; line-height: 33px;left:2px;top:-2px; }
        
      /* bottom area */
      #global li div.sub .bottom { 
        background: #c9cac8 url(_img/bg.dropdown.bottom.png) repeat-x;
        border-top: 1px solid #c9cac8;   
        padding: 10px;  
        }
        
        #global li div.sub .bottom img { 
          border: 1px solid #bdbdbd; 
          height:90px; 
          width:140px;  
          float: left;  
          }
        #global li div.sub .bottom .left {
          margin: 0 0 0 20px;
          width: 200px;
          }  
          #global li div.sub .bottom .left h3 { font-size: 17px; color: #000; margin-bottom: 6px; line-height: 17px; }
          #global li div.sub .bottom .left p  { font-size: 14px; margin-bottom: 8px;  }
          #global li div.sub .bottom .left a  {background: url(_img/btn.grey.arrow.right.png) no-repeat right 5px; border: none; text-align: left; text-shadow:none; font-size: 14px; line-height: 22px; display: inline; color: #4d4f53; padding-right: 4px;left:-19px;}

            #global li div.sub .bottom .left a:hover { color: #e11b22; }

/* footer function nav */
#function { position: relative; float: right; margin-right: 22px; }
  #function li { display: inline; line-height: 26px; }
    #function a { display: inline; font-size: .95em; }
      #function a:hover { color: #e11b22; }
      #function li.copyright { margin-left: 6px; } /* cufon alignment fix */

/* footer social media buttons */
#social-media { float: right; margin-top: 2px; position: relative; }
  #social-media a {  
    background: url(_img/sprite.social.media.png) no-repeat;
    font-size: .95em;
    position: relative;
    line-height: 23px; 
    text-indent: -9999px;  
    width: 22px;
    margin-left: 6px;
    }
  #social-media a.twitter  { background-position: -27px  0; left: 0; bottom:0; }
  #social-media a.linkedin { background-position: -54px  0 }     



/* secondary navigation on child pages */
.secondary  {  position: relative;  top: 0; left: -60px; z-index:601;    }
  .secondary .horizontal  {  background: url(_img/bg.nav.child.png) repeat-x; position: relative; height: 57px; min-width: 530px; }

    .in-the-news .secondary .horizontal { min-width: 570px; }  

    .secondary span { display: block;  position: absolute;  }
    .secondary .left  { background: url(_img/bg.nav.child.left.png) no-repeat; height:49px; top: 2px; width:20px;  }
    .secondary .right { background: url(_img/bg.nav.child.right.png) no-repeat; height:37px; width:37px;  right: -37px; }
    .secondary a {
      color: #3f3f3e;
      line-height: 26px; 
      height: 28px;
      padding:0 18px;
      margin-top: 3px;
      border-left: 1px solid #d6d6d6;
      }
      .secondary a.last { border-right: none; }

      .secondary a:hover,
      .secondary a.landmark { background: url(_img/bg.nav.child.hover.png) repeat-x;}

      .secondary a.parent-link img { display: block; float: left; margin-top: 8px; }



  /* homepage slideshow nav */
  .no-js #navigation      { display: none; } /* turn off if no javascript */
  .js #navigation         { position: absolute; width: 100%; top: 53%; z-index: 999;}
      .js #navigation span { background: url(_img/sprite.homepage.controls.png) no-repeat; height:58px; width:67px; display: block; position: absolute; cursor: pointer; }

          .js #navigation .prev:hover { background-position: 0 -117px; }
        .js #navigation .next         { background-position: 0 -59px; right:0;  }
          .js #navigation .next:hover { background-position: 0 -176px; }

          .js #navigation span:active { top: 1px; }


 

/* breadcrumbs
------------------------------ */

.breadcrumbs { position: absolute; top: 15px; left: 32px; }
  .breadcrumbs li { margin-right: 10px; }
  .breadcrumbs span { display: block; background: url(_img/btn.grey.arrow.right.png) no-repeat; height:10px; width:5px; margin-top:4px;}
  .breadcrumbs a { font-size: .8em; }
  .breadcrumbs span.landmark{ background: none; color: #e11b22; width: auto; height: auto; font-size: .8em; margin-top: 0;  }






/*  Structure =================================================== 
============================================================== */


/*  layout
------------------------------ */

body { background: #fff; position: relative; }

.container { 
  margin:0 auto; 
  position: relative; 
  width: 960px;
  }

  /* masthead */  
  header {
    background: url(_img/bg.header.png) repeat-x right top;
    position:fixed;
    height: 102px;
    min-width: 960px;
    width: 100%;
    z-index: 701;
    }
    header span.left { background: url(_img/bg.header.span.left.png) repeat-x; display: block;  text-align: left; width: 50%; left: 0; height: 86px; position: absolute; } 
    header .container { background: url(_img/bg.header.png) repeat-x right top; position: relative;  height: 118px;  }    

    #logo       { border: none; position: absolute; z-index: 999;  } /* removes default link bottom border style */
      #logo img {  } /* salt to taste */
      a#logo:active { top: auto; } /* disables link interaction animation*/
    .tagline  { }
  

  /* central content area */   
  #content {   
    position:relative; 
    clear: both;  
    height: auto;
    }    
    #content-featured { position: relative; z-index: 1;}    
    #content-main { position: relative; padding-bottom: 40px; padding-bottom: 180px\9; } 
  

  aside {  } 

  footer {        
    background: #fff;
    bottom: 0;
    clear:both;     
    height: 26px;     
    min-width: 960px; 
    width: 100%;   
    z-index: 701;
    position:fixed;
    }                         
    /* footer promos */
   .anchored-promos { display: block; position: absolute; text-indent: -9999px; }
      #home-kit { 
        background: url(_img/sprite.footer.promos.png) no-repeat; 
        height:103px; 
        top: -34px;
        left: 0;
        width:240px;
        z-index:111
        }
        #home-kit:hover,
          #home-kit .hover { background: url(_img/bg.promo.home.kit.hover.png) no-repeat; height: 163px; left: -26px; top: -96px; width: 452px; position: absolute; z-index: 301; }
          #home-kit:hover a { display: block; left: 180px; height:35px; position: absolute;  text-indent: -9999px; top:118px; width:132px; } 

      #tour { 
        background: url(_img/sprite.footer.promos.png) no-repeat -240px 0; 
        height:103px; 
        top: -34px;
        left: 240px;      
        width:237px; 
        z-index:111;
        }
        #tour:hover,
          #tour .hover a { background: url(_img/bg.promo.tour.hover.png) no-repeat; top: -149px; height: 216px; left: -31px; width: 465px; position: absolute; z-index: 301; }
          #tour:hover a { display: block; left: 222px; height:37px; position: absolute;  text-indent: -9999px; top:171px; width:132px; }

        /* news scroller */
        #news-carousel { height: 70px; background: #fff url(_img/bg.footer.png) repeat-x; position: absolute; left: 474px; }
          #news-carousel h3 { font-size: 1.7em; line-height: 70px; position: absolute; font-weight: normal; left: 0; width: 120px; }

    /* visit us at Aon.com */
    footer p.left { position: relative; margin-left: 20px; line-height:26px; color: #999; }
    footer p.left a { color: #999; }
    footer p.left a:hover { color: #e11b22; }


/*  tempalate-specific ========================================
============================================================ */


/* homepage 
============================== */

/* turn off site if javascript is disable to allow for
   fade in effect on page load */
.js .home { display: none;  }

.home .content .content-main { 
  width: 960px; 
  margin: 0 auto;
  position: relative;
  z-index:10;
  }

/* intro copy */
.home .content-featured {
  width: 960px; 
  margin: 0 auto;
  position: relative;
  z-index:10;
  }
  .home .content-featured .container {
    background: url(_img/bg.headline.png);
    padding: 22px 0 0 18px;
    width: 352px;
    min-width: 352px; /* override of line 742 */
    left: 40px;
    position: absolute;
    top: 158px;
    z-index: 10;
    text-align: left;
    background-color:#000;
    }
  .home .content-featured .container h1 { color: #fff; line-height: 40px; text-transform: uppercase; margin-bottom: 15px; letter-spacing: -2px }
    /* fixed line-height issue when using cufon */
    .home .content-featured .container h1 cufon { margin-bottom: -10px; }
    .home .content-featured .container h1 span { color: #e11b22; }
  
  .home .content-featured .container p { color: #fff; font-size: 1.5em; line-height: 16px; width: 310px; margin-bottom: 16px; }
   .home .content-featured .container p.no-bottom { margin-bottom: 0; }
  .home .content-featured .container span.bottom { display:inline-block; background: url(_img/bg.headline.btm.png) no-repeat -40px 0; height:45px; width: 370px; position:absolute; left: 0;}



/* info panel
------------------------------ */


.icon-map {
/*  background: url(_img/sprite.icons.png) no-repeat; */
  background-color:#000;
  position: absolute;
  z-index: 601;
  right: 0;
  top: 158px;
  height:144px;
  width:65px;
}

  .icon-map button { background: url(_img/sprite.icons.png) no-repeat -10px -10px; position: absolute; text-indent:-9999px; width: 48px; height: 39px; border: none; left: 10px; top: 10px; }

  .icon-map .twitter   { background-position:-10px -10px; }
/*  .icon-map .fact      { background-position:-10px -51px; top:51px; }*/
  .icon-map .video     { background-position:-10px -94px; top:51px; }
  .icon-map .snapshots { background-position:-10px -138px; top:94px; }  

/*  .icon-map .twitter:hover   { background-position:-10px -195px; }
  .icon-map .fact:hover      { background-position:-10px -236px; }
  .icon-map .video:hover     { background-position:-10px -279px; }
  .icon-map .snapshots:hover { background-position:-10px -323px; } */


/* info panel */
.info-panel { background: #fff; height:185px; width:467px; position: absolute; top: 158px; right: 66px; z-index: 601; display: none;}

  .info-panel a.close { background: url(_img/btn.close.png) no-repeat; display: block; height: 17px; width: 17px; position: absolute; right: 7px; top: 7px; z-index: 701; }  


  .info-panel section { position: absolute; text-align: left; display: none; }

    .info-panel section img,
    .info-panel section video { position: absolute; left: 211px; top: 7px; }
    .info-panel section video { left: 207px; }

    .info-panel section p { margin: 100px 7px 0; width: 185px; line-height: 1.2; }
    .info-panel section a.view-all { position: absolute; font-size: 15px;  top: 154px; left: 7px;width:150px; }

    .info-panel section span.header { background: url(_img/sprite.info.panel.png) no-repeat; display: block; height: 86px; width: 198px; position: absolute; left: 7px; top: 7px; }

    .info-panel section.twitter span.header   { background-position: 0 0; }
    .info-panel section.fact span.header      { background-position: 0 -86px; }
    .info-panel section.video span.header     { background-position: 0 -172px; }
    .info-panel section.snapshots span.header { background-position: 0 -258px; }


  /* tweets */
 .info-panel section.twitter .tweetpic { margin: 121px 10px 18px 18px; float: left; }
    .info-panel section.twitter p { top: 22px; position: absolute; margin: 0; left: 272px; }
      .info-panel section.twitter .tweeter   { color: #000; font-size: 14px; font-weight: 700; }
      .info-panel section.twitter .full-name { font-size: 12px; text-transform: lowercase; }
      .info-panel section.twitter .tweet     { font-size: 14px; display: block; margin: 15px 0; }
      .info-panel section.twitter .tweet a   { color: #e11b22; font-size: 13px; text-transform: uppercase; }
      .info-panel section.twitter .date      { font-size: 12px; display: block; margin-top: 16px; } 

/* fact */
  .info-panel section.fact p { top: 32px; position: absolute; width: 220px; margin: 0; left: 215px; }



/* page template  
============================== */

	#loader { position:absolute; top:50%; left:50%; z-index:10; width:60px; height:60px; margin:-30px 0 0 -30px; text-indent:-999em; background:#111 url(_img/progress.gif) no-repeat center center; background:rgba(0,0,0,0.8) url(_img/progress.gif) no-repeat center center; -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px;}
	

/* overlay container */
.overlay-panel { position: relative; top: 130px; left: 12px; width: 918px; margin: 0 auto; z-index: 601; }
  .overlay-panel .top { display: block; background: url(_img/bg.content-main.top2.png); height:11px ; width: 100%;background-repeat:repeat-y;position:relative; }
  .overlay-panel .close { background: url(_img/btn.close.child.png) no-repeat; display: block; height: 33px; width: 33px; position: absolute; right: 13px; text-indent: -9999px; }  
  .overlay-panel .bottom { clear: both; display: block; background: url(_img/bg.content.child.bottom.png); height:50px; width: 918px;}

 
  /* content pane */
  .pane { background: url(_img/bg.content.child.png) repeat-y; padding: 35px 40px 20px; }
  .no-js .pane { height: auto; overflow: hidden; }

    .pane .container { float: left; width: 570px; margin-left: 0 /* override auto*/;  margin-right: 0;}  
    .pane aside { float: left; width: 230px;  } 
    
    /* panel title */
    .pane hgroup      { position: relative; left: -10px; margin-bottom: 20px;width:540px; }
      .pane h1        { font-size: 3.5em; text-transform: uppercase; }
        /* .pane h1 span { color:#e21a22;} */
        .pane h1 span { color:#e11b22;}
      .pane h2        { font-size: 1.8em; margin: 0; min-height: 18px; }  

    /* panel copy */
    .copy {  padding-right:10px; margin-left: -10px; position: relative;}
      .copy h3 { font-size: 1.7em; margin-bottom: 6px;  }
      
      /* body copy links */
      .copy p a { padding-right: 12px; background: url(_img/btn.grey.arrow.right.png) no-repeat right 5px; }
      .copy .no-arrows p a { background: none;padding:0; }
      .copy p a,
      .copy li a       { color:#e11b22; }
      .copy p a:hover,
      .copy li a:hover { border-bottom: 1px solid;  }

      .copy li { margin-left: 1.3em; }


.video-player { position: relative; z-index: 501 }

    /* social bookmarks */  
    .social-marketing { position: absolute; top: 76px; width: 350px; }   
      .social-marketing span {  }
        .social-marketing span.stButton img { left: 0 !important; right: 0 !important; }
      .gallery-page .social-marketing { margin-top: 10px } 
     

    /* promo area */
    .pane aside .promos { margin-top:80px; } 
      .pane aside .promos a {  margin-bottom:5px;  } 






/* gallery template 
============================== */

 .gallery-page .pane { min-height: 450px; }
    .gallery-page .pane .container { width: 552px; margin-right: 0; }
    .gallery-page .pane hgroup { margin-bottom: 8px; left: -3px;} 
    .gallery-page .promos { margin-top: 0 }
      .gallery-page .promos a { margin-bottom:20px; }

    .gallery-page .image-carousel-container { position: relative; top: 80px; left: -18px; }

     .gallery-page .image-carousel-container .image-carousel  { position: absolute; height: 420px; width: 586px; }
     .gallery-page .image-carousel-container .image-carousel ul { position: absolute; height: 400px; margin-left: 18px; list-style-type: none; } 
       .gallery-page .image-carousel-container .image-carousel img { position: absolute; left:0;  height: 300px; width: 552px; }


      .gallery-copy { 
        /*margin: 614px 0 0 40px;*/ 
        margin:10px 0 0 10px;
        padding: 5px 0 0 10px; 
        position: relative; 
        margin-top: 300px; 
        z-index: 300; 
        width: 552px;
        height: 101px;
        }
        .gallery-copy p.left { width: 550px; margin: 10px 0 10px; }
        .gallery-copy p.right { margin:0 10px 0 0;  }

      .gallery-page .pane aside { position: absolute; top: 0; left: 624px; }     


        .gallery-page .gallery-array { position: relative; margin-top: 126px; width:265px; height: 110px; overflow: hidden; }
          .gallery-page .gallery { width: 265px; margin-left: 5px;}
            .gallery-page .gallery a           { float: left; height: 110px; margin-right: 5px; width: 130px; position: relative; }
            .gallery-page .gallery img { height: 110px; width: 130px; position: absolute; z-index: 201;}
              .gallery-page .gallery img.thumb { z-index: 301; }



        .gallery-page .pane aside .thumbs-pager { margin: 10px 0 0 122px; height:10px; width: 40px; text-align: center; }
          .gallery-page .pane aside .thumbs-pager a { background: url(_img/sprite.gallery.thumbs.nav.png) -20px 0; text-indent: -9999px; height: 10px; width:10px; margin-right: 10px; float: left;  }
          .gallery-page .pane aside .thumbs-pager a.activeSlide { background-position: 0 0; }
          
        .gallery-page .pane aside .promos { margin-top: 10px; }
        .videos .gallery-page .pane aside .promos { margin-top: 100px; }


   /* galleries slideshow nav */
    .no-js .gallery-page .image-carousel .carousel-controls  { display: none; } /* turn off if no javascript */
      .js .gallery-page .image-carousel .carousel-controls { position: absolute; z-index: 601; top:0;}
    .js .gallery-page .image-carousel .carousel-controls span {  background: url(_img/sprite.gallery.controls.png) no-repeat; position: absolute; top: 121px;  height:49px; width:56px; display: block; cursor: pointer;  }

      .js .gallery-page .image-carousel .carousel-controls .prev:hover { background-position: 0 -100px; }
    .js .gallery-page .image-carousel .carousel-controls .next { background-position: 0 -50px; left:530px; }
      .js .gallery-page .image-carousel .carousel-controls .next:hover { background-position: 0 -150px; }
 .js .gallery-page .image-carousel .carousel-controls span:active { top:122px }



/* video player */

.video-player { clear: both; float: left; background: none !important; z-index: 501;}

.video-player object { clear: both; float: left; background: none !important; }




 
/*  plugins ===================================================
============================================================ */ 




/* jquery cycle scroller
------------------------------------------------------------ */
footer .scroller {
  height: 70px;
  left: 133px;
  overflow: hidden;
  position: absolute;
  top: 0;
  width: 326px;
  text-align: center;
  }
  footer .scroller li { line-height: 70px; background: #fff url(_img/bg.footer.png) repeat-x; text-align: center; width: 326px; }

  footer .arrow-prev,
  footer .arrow-next   { 
    background: url(_img/btn.scroller.controls.png) no-repeat center 0; 
    display: block;
    position: absolute;
    height:46px;
    left:90px; 
    top: 11px;
    width: 42px; 
    cursor: pointer;
    }
    footer .arrow-next { background-position: -15px -46px; left: 460px; top: 13px; }



/* jScrollPane
------------------------------------------------------------ */

.jspContainer {
	overflow: hidden;
	position: relative;
}

.jspPane{
	position: absolute;

}

.jspVerticalBar{
	position: absolute;
	top: 0;
	right: 0;
	width: 11px;
	height: 100%;
	background: red;
}

.jspHorizontalBar{
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 11px;
	background: red;
}

.jspVerticalBar *,
.jspHorizontalBar * {
	margin: 0;
	padding: 0;
}

.jspCap {
	display: none;
}

.jspHorizontalBar .jspCap {
	float: left;
}

.jspTrack {
	background: #c9cac8;
	position: relative;
}

.jspDrag {
	background: #727476;
	position: relative;
	top: 2px;
	left: 2px;
	cursor: pointer;
  width: 7px;
}

.jspHorizontalBar .jspTrack,
.jspHorizontalBar .jspDrag {
	float: left;
	height: 100%;
}

.jspArrow {
	background: #50506d;
	text-indent: -20000px;
	display: block;
	cursor: pointer;
}

.jspArrow.jspDisabled {
	cursor: default;
	background: #80808d;
}

.jspVerticalBar .jspArrow {
	height: 16px;
}

.jspHorizontalBar .jspArrow {
	width: 11px;
	float: left;
	height: 100%;
}

.jspVerticalBar .jspArrow:focus {
	outline: none;
}

.jspCorner {
	background: #eeeef4;
	float: left;
	height: 100%;
}

/* Yuk! CSS Hack for IE6 3 pixel bug :( */
* html .jspCorner {
	margin: 0 -3px 0 0;
}



/* plax plugin
------------------------------------------------------------ */


.js .image-container { display: none; }

.image-container { 
  position:fixed; 
  left:0; 
  top:0; 
  overflow:hidden; 
  height:100%; 
  width:100%;
  }

.image-carousel { position: relative; width: 100%; height: 100%; text-align: center; overflow: hidden;} 


.image-pane { 
  position: relative;
  width: 100%;
  height: 100%; 
  }
  .image-pane img {  position: absolute; top: 0; left: 0;}

.js img#trafford-security { z-index: 5; }
.js img#trafford-ball     { z-index: 4; }
.js img#trafford-goalie   { z-index: 3; }
.js img#trafford-field    { z-index: 2; }
.js img#trafford-sky      { z-index: 1; }

.js img#crowd-foreground,
.js img#players-foreground { z-index: 3; }
.js img#crowd-midground,
.js img#players-midground  { z-index: 2; }
.js img#crowd-bg,        
.js img#players-bg         { z-index: 1; }  
 

.js img#bus-photographer { z-index: 6; left: -150px }
.js img#bus-girls        { z-index: 5; }
.js img#bus-men          { z-index: 4; }
.js img#bus-crowd        { z-index: 3; }
.js img#bus-bus          { z-index: 2; }
.js img#bus-bg           { z-index: 1; }





/*  Misc classes ==============================================
============================================================ */ 

.small      { font-size: .8em; margin-bottom: 1.875em; line-height: 1.875em; }
.large      { font-size: 1.2em; line-height: 2.5em; margin-bottom: 1.25em; }

.quiet      { color: #666; }
.loud       { color: #000; }
.highlight  { background:#ff0; }
.added      { background:#060; color: #fff; }
.removed    { background:#900; color: #fff; }

.first      { margin-left:0; padding-left:0; border-left: 0; }
.last       { margin-right:0 !important; padding-right:0; border-right: 0; }
.no-top     { margin-top:0; padding-top:0; }
.no-bottom  { margin-bottom:0; padding-bottom:0; }






/*  Troubleshooting styles ====================================                        
============================================================ */

/* grid: 6px baseline - 80px columns - 20px gutter 
html     { background: url(_img/_grid/grid.baseline.6.png); }
body     { background: transparent; }
#column-overlay { 
  background: url(_img/_grid/grid.column.80.20.png); 
  position: fixed; 
  left: 0; 
  height: 101%; 
  width: 100%; 
  z-index: 999; 
  } 

/* add to element to aid in positioning */
.outline { outline: 1px solid gold; }

/* don't believe the hype, it too is a joke. */
hr#fold  { 
  background: cyan; 
  border: none; 
  height: 1px; 
  left: 0;
   position: fixed; 
  top: 540px; 
  z-index: 998; 
  width: 100%;
  }

/* forces 'for pement only' image to stretch to fit element */
img.fpo  { width: 100%; height: 100%;}




/*  print styles ==============================================

    inlined to avoid required HTTP connection 
    www.phpied.com/delay-loading-your-print-css/     
============================================================ */
@media print {

  * { font-size: 80%; background: transparent !important; color: #444 !important; text-shadow: none; }

  a, a:visited { color: #444 !important; text-decoration: underline; }

  a:after { content: " (" attr(href) ")"; } 

  abbr:after { content: " (" attr(title) ")"; }
  
  .ir a:after { content: ""; }  /* Don't show links for images */
  
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  
  img { page-break-inside: avoid; }

  @page { margin: 0.5cm; }

  p, h2, h3 { orphans: 3; widows: 3; }

  h2, h3{ page-break-after: avoid; }

}






/*  Media queries for responsive design ======================= 
============================================================ */


@media all and ( min-width: 769px ) {  /* narrow layout rules */
 


}


/* Grade-A Mobile Browsers (Opera Mobile, iPhone Safari, Android Chrome)  
   Consider this: www.cloudfour.com/css-media-query-for-mobile-is-fools-gold/ */
@media all and ( max-width: 499px) {

  /* Prevent iOS, WinMobile from adjusting font size */
  html { -webkit-text-size-adjust:none; -ms-text-size-adjust:none; } 
}



/* CSS for Fixture Schedule
*/
.fixture-schedule {width:100%; font-family:Helvetica, Arial, Sans-serif;font-size:13px;margin:10px 0 30px;}
.fixture-schedule thead,
.fixture-schedule thead th
{background-color:#C70101;color:#fff;font-size:15px;}

.fixture-schedule thead th
{padding:3px 0 1px 5px;line-height:1.15em;}

body.contact-aon .button {display:inline-block;text-indent:-9999em;background-image:url(_img/send-btn.png);background-repeat:no-repeat;background-color:transparent;width:105px;height:43px;}

#resizeButton 
{display:inline-block;width:110px;height:17px;position:absolute;right:40px;top:58px;z-index:10400;cursor:pointer;text-indent:-9999em;background:url(_img/btn.full-screen.png) top center no-repeat;}

.left-contact-bg,
.right-contact-bg
{width:50%;position:absolute;height:20px;top:82px;background-color:transparent;z-index:2;}
.left-contact-bg{background-color:#000;}
#contact-bg {position:absolute; right:-22px;top:0;}

/*
body.home .jcarousel-skin-tango 
{
    width:960px;
    background:red;
    height:53px;
    z-index:500;
    background:url(_img/bg.fixture.png) repeat-x bottom left transparent;
}

*/

.landing-feature
{
    display:inline-block;
    width:275px;
    margin:0;
    padding:0;
    float:left;
    position:relative;
    left:5px;
}

.landing-feature:first-child {left:0;}

.landing-feature h4 {font-size:1.9em;margin:15px 0;}
.landing-feature p {margin-bottom:30px;}
.landing-feature a {font-size:1.5em; padding-right:15px;background:url(_img/blt.landing-feature.arrow.png) no-repeat right 50% transparent;}
div#corner_fix {
  width:125px;
  height:40px;
  position:absolute;
  display:inline;
  left:230px;
  top:45px;
  z-index:4000;
  cursor:pointer;
}
.no_uppercase { text-transform:none; }
footer p.left, footer p.left a { color:#666; }
form#registration_form {
  width:838px;
  position:relative;
}
form#registration_form label {
  display:block;
  float:inherit;
  padding:4px 0 0 0;
}
form#registration_form input {
  display:block;
  float:inherit;
}
form#registration_form li { margin:0;padding:0; }
fieldset#right { float:right;position:relative;left:-120px; }
fieldset#left { float:left; }
div.submit{ float:right;position:relative;left:-120px; }
form#registration_form textarea {
  width:400px;
  height:260px;
-webkit-appearance: textfield;
-webkit-rtl-ordering: logical;
-webkit-user-select: text;
background-attachment: scroll;
background-clip: border-box;
background-color: white;
background-image: none;
background-origin: padding-box;
border-bottom-style: inset;
border-bottom-width: 2px;
border-left-style: inset;
border-left-width: 2px;
border-right-style: inset;
border-right-width: 2px;
border-top-style: inset;
border-top-width: 2px;
color: black;
cursor: auto;
display: block;
float: none;
font-family: sans-serif;
font-size: 13px;
font-style: normal;
font-variant: normal;
font-weight: normal;
letter-spacing: normal;
line-height: normal;
list-style-image: none;
list-style-position: outside;
list-style-type: none;
margin-bottom: 0px;
margin-left: 0px;
margin-right: 0px;
margin-top: 0px;
padding-bottom: 0px;
padding-left: 1px;
padding-right: 1px;
padding-top: 0px;
text-align: -webkit-auto;
text-indent: 0px;
text-shadow: none;
text-transform: none;
vertical-align: middle;
word-spacing: 0px;
}
h2 { padding:0 0 0 2px; }
div.video_left {
  float:left;
  position:relative;
}
div.video_right {
  float:right;
  position:relative;
  top:32px;
  left:-6px;
}
section.video {
  clear:both;
  position:relative;
}
div.image-pane img.resize { position:relative;top:80px; }