/*================================================== LAYOUT STYLES */
/*
    CSS Document for Diageo Annual Review 2009
    Build: Julien Decaudin on behalf of SAS - 24/08/2009
*/

html, body
{
    margin: 0;
    padding: 0;
    border: 0;
    height: 100%;
}

body
{
    background-repeat: repeat-y;
    background-position: center top;
}

/*--------------------------------------------------=> HEADERS */
/* H1 */
h1
{
    padding-bottom: 20px;
}

/* H2 */
h2
{
    padding-bottom: 20px;
}

/* H3 */
h3
{
    padding-bottom: 5px;
}

h3 span
{
    display:block;
}

/*--------------------------------------------------=> CONTENT ELEMENTS */
/*-------------> Global */
.content_holder
{
    padding: 20px 20px 20px 20px;
}

#flash_placeholder
{
 text-align: center;
}

/*-------------> Lines */
.hr
{
    height:5px;
    background-repeat: repeat-x;
    background-position: left bottom;
    margin:20px 0 10px 0;
}

.hr_light
{
    height:5px;
    background-repeat: repeat-x;
    background-position: left bottom;
    margin:10px 0 10px 0;
}

/*-------------> Paragraph */
p
{
    padding-bottom: 10px;
    margin: 0;
}

p.intro
{
    padding-bottom: 15px;    
}

/*-------------> Links */
#logo
{
    float:left;
    display: block;
}

a.arrow_top,
a.arrow_down
{
    background-repeat: no-repeat;
    background-position: left 0px;
    padding-left:20px;
    padding-top:1px;
    display: inline-block;
}

a.arrow_top:hover,
a.arrow_down:hover
{    
    background-position: left -51px;    
}

/*-------------> Images */
img
{
}

/*-------------> Lists */
/* simple list */
ul.simple_list li
{
    margin-bottom: 5px;
}

/* link list */
ul.link_list li
{
    margin-bottom: 5px;
}

ul.link_list li a
{
    background-repeat: no-repeat;
    background-position: left 6px;
    padding-left: 15px;
}

/* bullet list */
ul.bullet_list
{
    list-style-type: square;
    padding-left: 25px;
}

ul.bullet_list li
{
    padding-bottom: 10px;
}

ul.bullet_list li ul
{
    padding-top: 10px;
    padding-left: 12px;
}

/* ordered list */
ol
{
    list-style-type: decimal;
    padding-left: 5px;
    margin-left: 20px;
}

ol li
{
    padding: 0 0 5px 0;
}

/* Sitemap */
#sitemap
{
    padding-left: 5px;
    width: 529px;
}

#sitemap ul
{
    padding-top: 0px;
    padding-bottom: 1px;
}

#sitemap ul li
{
    background-repeat: no-repeat;
    background-position: 0 5px;
    padding-left: 11px;
    margin-top: 15px;
}

#sitemap ul li ul
{
    padding-left: 10px;
    padding-top: 3px;
}

#sitemap ul li ul li
{
    padding-top: 4px;
    padding-left: 0px;
    margin-top: 0px;
}

/* definition list */
dl
{
    margin-bottom: 15px;
}

dt, dd
{
    padding-bottom: 5px;
    margin-bottom: 5px;
}

/*-------------> Modules */

/*-------------> Misc */
/* Brands */
.brand_item
{
    float:left;
    width:100px;
    padding-left:15px;
    height: 410px;
}

.brand_item li
{
    padding-bottom: 8px;
}

.brand_item strong
{
    display: block;    
    padding-bottom: 4px;
}

.brand_item a
{
    display: block;
}

.js .brand_item li span
{
    display: none;
}

.brand_list li ul
{
    padding-top: 16px;
}



/*--------------------------------------------------=> FORMS */

/*--------------------------------------------------=> CONTENT LAYOUT */
/*-------------> Columns */
/* unique */
#column_header_left
{
    float: left;
    width: 245px;
}

#column_header_right
{
    float: right;
    width: 655px;
}

.column_content_left
{
    float:left;
    width: 260px;
}

.column_content_right
{
    float:right;
    width: 655px;
}

/* utilities */
.column_half_left
{
    float: left;
    width: 49.1%;
}

.column_half_right
{
    float: right;
    width: 49.1%;
}

.column_twothird_left
{
    float: left;
    width: 64.2%;
}

.column_twothird_right
{
    float: right;
    width: 64.2%;
}

.column_third_right
{
    float: right;
    width: 32.1%;
}

.column_third
{
    float: left;
    width: 32.1%;
}

.column_quarter
{
    float: left;
    width: 25%;
}

.column_threequarter
{
    float: right;
    width: 75%;
}

.column_fourth
{
    float: left;
    width: 25%;
}

.column_five
{
    float: left;
    width: 20%;
    
}

.column_ten
{
    float: left;
    width: 9%;
    
}

.column_one_quarter
{
    float: left;
    width: 134px;
    padding-left: 12px;
    padding-top:10px;
}

.column_last
{
    margin-right: 0;
}

/*--------------------------------------------------=> MASTER LAYOUT */
#page
{
    width: 980px;
    height:100%;
    margin: 0 auto 0 auto;
    padding-left: 10px;
    background-repeat: no-repeat;
    background-position: left top;
}

#header
{
    background-repeat: repeat-x;
    background-position: left bottom;
    padding-bottom:15px;
    margin-bottom:10px;
}

#banner
{
    position:fixed;
    bottom:-15px;
    height: 120px;
    width: 950px;
    background-repeat: no-repeat;
    background-position: left top;
    margin-left:10px;
}

#banner .content_holder
{
    padding:25px;
}

#content,
#content_top,
#content_inner,
#content_bottom
{
    width:969px;
}

#content_top
{
    height:18px;
    background-repeat: no-repeat;
    background-position: left top;
}

#content_inner
{    
    background-repeat: repeat-y;
    background-position: left top;
    padding-bottom:110px;
}

#content_bottom
{
    height:18px;
    background-repeat: no-repeat;
    background-position: left bottom;
}

#content_home
{
   width:969px;
   height:600px;
}

#content_portal
{
    text-align:center;
    width:969px;
    height:550px;
    padding-top:25px;
}

#content .content_holder
{
    padding:0 20px;
}

#content_main
{
    float: left;
    width: 574px;
}

#footer
{
    width: 574px;
    margin: 0px 0 0 173px;
}

/*--------------------------------------------------=> NAVIGATION */
/* Portal */
#portal_list
{
    float:left;
    width:600px;
    margin:20px 0 0 190px;
}

#portal_list li
{
    float:left;    
}

#portal_list a
{
    display:block;
}

#portal_list a span
{
    display:block;
    background-position:0 0;
    background-repeat:no-repeat;
    margin:0 auto;
    cursor:pointer;
}

#portal_review
{
    margin-right:30px;
}

#portal_review a,
#portal_report a,
#portal_review span,
#portal_report span
{
    width:281px;    
    height:192px;
}

#portal_review a:hover span,
#portal_report a:hover span
{
    background-position:0 -192px;
}

#portal_download 
{
    margin-top:55px;
    margin-left:115px;
}

#portal_download a
{
    width:370px;        
}

#portal_download span
{
    width:130px;    
    height:132px;
}

#portal_download a:hover span
{
    background-position:0 -132px;
}

/* Main navigation */
#main_nav
{
    float: left;            
}

#main_nav li
{
    float: left; 
    position:relative;
}

#main_nav a
{
    display: block;
    background-repeat: no-repeat;
    background-position: left 0px;
    padding-left: 10px;
    width: 133px;
    height:70px;  
    position:relative;   
    z-index:1;    
}

#main_nav .nav_popup
{
    display:none;
    width:128px;
    height:136px;
    position:absolute;
    top:-190px;
    left:-13px;
    padding:23px 22px;
}

#main_nav .nav_popup p
{
    position:absolute;
    width:127px;
    left:22px;
    bottom:13px;
}

/* Anchor list */
#anchor_list
{
    float:left;
}

#anchor_list li
{
    float:left;
    margin-right:15px;
    width:152px;
}

#anchor_list li.last
{
    margin-right:0;
}

#anchor_list a img
{    
    padding-bottom:5px;
}

#anchor_list a span
{
    display:block;
    background-repeat: no-repeat;
    background-position: left 0px;
    padding-left:20px;
    padding-top:1px;
}

#anchor_list a:hover span
{    
    background-position: left -51px;    
}

/* Anchor navigation */
.anchor_nav li
{
    padding-bottom:3px;
}

/* Support navigation */
.support_nav
{
    float: left;
    background-repeat: no-repeat;
    background-position: left 0px;
    padding-left: 10px;
    height:70px;  
}

#support_nav1
{
    width:88px;
}

#support_nav2
{
    width:70px;
}

/*--------------------------------------------------=> UTILITY CLASSES */
.floatLeft
{
    float: left;
}

.floatRight
{
    float: right;
}

.halfwidth
{
    float: left;
    width: 50%;
}

.halfwidth_right
{
    float: right;
    width: 50%;
}

.thirdwidth
{
    float: left;
    width: 33%;
    padding: 3px 0 10px 0;
}

.nodisplay
{
    display: none;
}

.nopadding_top
{
    padding-top: 0;
}

.nopadding_bottom
{
    padding-bottom: 0;
}

.nopadding_vertical
{
    padding-top: 0;
    padding-bottom: 0;
}

.clearmargin
{
    margin: 0;
    padding: 0;
}

.clearer
{
    clear: both;
    height: 0;
    padding: 0;
    margin: 0;
}

.spacer
{
    clear: both;
    height: 25px;
    padding: 0;
    margin: 0;
}

/*-------------> Tables */
table
{
    table-layout: fixed;
    width: 100%;
    margin-bottom: 12px;
}

.datatable th
{
    vertical-align: bottom;
    padding-bottom: 8px !important;
    vertical-align: bottom !important;
}

.datatable .colspan th
{
    padding-bottom: 2px !important;
}

.datatable .firstrow td
{
    padding-top: 2px !important;
}

.datatable .paddingtop td, .datatable .paddingtop th
{
    padding-top: 12px !important;
}

.datatable td, .datatable th
{
    text-align: right;
    padding: 2px 6px 2px 6px;
    border-bottom: 1px solid #dad6d6;
    vertical-align: bottom;
}

.datatable .row_header
{
    text-align: left;
}

.datatable .linebtm_dark td, th.linebtm_dark, .linebtm_dark th
{
    border-bottom: 1px solid #463031;
}

.datatable .linebtm_thick td
{
    border-bottom: 2px solid #463031;
}

.datatable td.loss
{
    padding-right: 2px;
}

.standardtext td
{
    vertical-align: bottom;
}

.generaltable th
{
    text-align: left;
}

.generaltable td
{
    padding: 2px 0px;
}

.generaltable td.row_header
{
    padding-top: 12px;
}

.generaltable td.indent
{
    padding-left: 35px;
}

table.align_left
{
    text-align: left !important;
}

/*image text module*/
.image_text_module
{
    float: right;
    padding-bottom: 12px;
}

.image_text_module .image_container
{
    float: left;
    width: 38px;
}

.image_text_module .text_container
{
    float: left;
    width: 140px;
}
