﻿/* layout section - place visual styling in section below
** for height and width only do not use padding or border
** so page will layout similarly between browsers */
body
{
    text-align: center; /* align in middle of browser */
    font-family: Arial, Helvetica, sans-serif;
    font-size: 16px;
}
*
{
    /* fix to ensure common starting point between IE and other browsers */
    margin: 0;
    padding: 0;
}
/*div 
{
    border: 1px solid #ccc; // debug
}*/
form
{
    /* top grading colour */
    background: #FFF url('../../Images/TopAreaGrade.gif') left top repeat-x;
}
#o2oWrapper
{
    /* width of page layout */
    width: 982px;
    margin: 0px auto;
    text-align: left;
}
#o2oTopArea
{
    height: 80px;
}
html > body #o2oTopArea
{
    margin-bottom: 8px;
}
#o2oTopLogo
{
    width: 68px;
}
#o2oTopLogo img
{
    float: left;
    margin: 8px;
    height: 64px;
}
#o2oHomeContact
{
    height: 24px;
    float: right;
}
#o2oTopContent
{
    clear: right;
    padding-top: 1em;
    margin-left: 80px;
    height: 32px;
    text-align: right;
}
#o2oSearchArea
{
    float: right;
    width: 200px;
    height: 28px;
    overflow: hidden;
}
#o2oCompanySlogan
{
    width: 600px;
    text-align: center;
}
/*#o2oOnlineLogin
{
    text-align: right;
}
#o2oOnlineLogin fieldset
{
    width: 300px;
}
html>body #o2oOnlineLogin fieldset
{
    width: 520px;
}*/
#o2oMain
{
    clear: both;
}
#o2oTopNavigation
{
    height: 26px;
    margin-bottom: 8px; /*width: 982px;     overflow: hidden;*/
}
#o2oMainArea
{
    clear: both;
}
#o2oSideColumns
{
    float: right;
    width: 223px;
}
#o2oSideTop
{
    /* to fix bug in IE for height of empty text nodes removed min-height */ /*min-height: 262px;     height: auto !important;*/
    height: 262px;
    margin-bottom: 8px;
    overflow: hidden;
}
#o2oSideTop img
{
    width: 223px; /*height: 262px;*/
}
.newsList
{
    min-height: 262px;
    height: auto !important;
    height: 262px;
}
#o2oSideInfo
{
    /*min-height: 130px;     height: auto !important;*/
    height: 132px;
    margin-bottom: 8px;
    overflow: visible;
}
.sharePriceContent
{
    /*min-height: 132px;     height: auto !important;*/
    height: 132px;
    background-color: #ADD2C2; /* green */
}
#o2oContent
{
    width: 750px;
}
#o2oPageContent
{
    min-height: 402px;
    height: auto !important;
    height: 402px;
    margin-bottom: 8px;
}
#o2oTradingBrands
{
}
#o2oTopPictureHolder
{
    margin-bottom: 8px;
    height: 262px;
    overflow: hidden;
}
#o2oTopPictureHolder img
{
    width: 750px;
    height: 262px; /*overflow: hidden;*/
}
#o2oMenuBlock
{
    clear: both;
}
#o2oSlogan
{
    /*min-height: 132px;     height: auto !important;*/
    height: 132px;
    color: #FFF;
    background-color: #026; /* #0054A6; blue */
    overflow: hidden;
    margin-bottom: 8px;
}
#o2oFooter
{
    clear: both;
    background: url('../../Images/ColumnGrade.gif') left top repeat-x;
}
#o2oFooterContent
{
    vertical-align: top;
    line-height: 4.5em;
}
.boxModel .linkList
{
    width: 226px;
    margin-right: 24px;
}
.boxModel .linkLast
{
    margin-left: 8px;
    margin-right: 0;
    width: 215px;
}
html > body .boxModel .linkLast
{
    width: 223px;
}
.leftColumn
{
    float: left;
}
.rightColumn
{
    float: right;
}

/* styling section - keep layout style in section above use this for visual effects */
/* general elements */
.hidden, .elementEnd, .easterEgg
{
    /* rather than display: none; for accessibility screen readers */
    height: 1px;
    left: 0;
    overflow: hidden;
    position: absolute;
    top: -500px;
    width: 1px;
}
.simpleFormat
{
    padding: 8px;
}
/* default link attributes */
a
{
    font-weight: normal;
    text-decoration: none;
    color: #CC6600; /* #339966; #73B59D;*/
}
a:hover
{
    font-weight: normal;
    text-decoration: underline;
}

/* header elements */
#o2oHomeContact
{
    font-size: 1em;
}
#o2oHomeContact ul
{
    list-style: none;
    padding: 0;
    margin: 0;
}
#o2oHomeContact li
{
    float: left;
}
#o2oHomeContact a
{
    color: #FFF;
    background: #026 url('../../Images/topLeftTab.gif') left top no-repeat;
    padding-left: 10px;
    cursor: pointer !important;
    margin-right: 2px;
    text-align: center;
    width: 149px !important;
}
html > body #o2oHomeContact a
{
    width: 152px !important;
}
#o2oHomeContact a span
{
    color: #FFF;
    background: url('../../Images/topRightTab.gif') right top no-repeat;
    font-size: 0.8em;
    padding-right: 0px;
    width: 150px !important;
    line-height: 1.8em;
}
html > body #o2oHomeContact a span
{
    width: 152px !important;
}
#o2oHomeContact a, #o2oHomeContact a span
{
    display: block;
    height: 26px !important;
}
#o2oHomeContact a:hover
{
    color: #000;
    text-decoration: none;
    background: #7DA7D9 url('../../Images/topLeftTabHover.gif') left top no-repeat;
}
#o2oHomeContact a:hover span
{
    background: url('../../Images/topRightTabHover.gif') right top no-repeat;
    color: #000;
}
/* search box */
#o2oSearchBox
{
    font-size: 0.7em;
}
#o2oSearchArea fieldset
{
    border: 0;
}
.searchBox
{
    /*float: right;*/
    text-align: right;
    margin-right: 80px; /*margin-bottom: 3px !important;*/
}
html > body .searchBox
{
    /*margin-bottom: 6px !important;*/
}
.searchText
{
    width: 100px;
}
.searchResults dt
{
    font-size: 1.4em;
}
.searchURL
{
    padding-bottom: 1em;
}
#o2oTopLogo img
{
    border: none !important;
}

/* main elements */
/* Slogan */
.o2oBreadCrumb
{
    clear: right;
    text-align: right;
    padding: 0 16px 0 0;
    font-size: 0.6em;
    height: 1px;
    overflow: visible;
}
.o2oBreadCrumb span span, .o2oBreadCrumb a
{
    height: 0px;
    overflow: visible;
}
.o2oContent
{
    font-size: 0.75em;
}
.o2oContent ul, .o2oContent ol
{
    list-style-position: outside;
    margin-left: 24px;
    padding-bottom: 0.5em;
}
.o2oContent img
{
    padding: 0 8px 8px 0;
    border: none;
}
.formatContent
{
    padding: 0px 32px 0px 0px;
}
.o2oContent h1
{
    font-size: 2.1em !important;
    color: #D98736 !important; /* orange */
}
.o2oContent h2
{
    font-size: 1.5em !important;
    font-weight: normal !important;
}
.o2oContent h3
{
    font-size: 1em !important;
    font-weight: bold !important;
}
.o2oContent h4
{
    font-size: 1em !important;
    font-weight: normal !important;
    font-style: italic !important;
}
.o2oContent h1, .o2oContent h2, .o2oContent h3, .o2oContent h4
{
    padding-bottom: 0.5em !important;
}
.o2oContent p
{
    padding-bottom: 1em !important;
}
.o2oContent li
{
    padding-bottom: 0.5em !important;
}
.o2oContent li ul, .o2oContent li ol
{
    padding-top: 0.5em !important;
    padding-bottom: 0 !important;
}
.o2oContent h1 em, .o2oContent h2 em, .o2oContent h3 em, .o2oContent h4 em
{
    font-style: normal !important;
    color: #D98736 !important; /* orange */
}
.o2oContent table
{
    padding-bottom: 1em;
}
.o2oContent thead
{
}
.o2oContent tfoot
{
}
.o2oContent tbody
{
}
.o2oContent tr
{
    height: 22px !important;
    vertical-align: middle;
}
.o2oContent th
{
    text-align: left;
}
.o2oContent td
{
    text-align: left;
    padding: 2px 0px 1px 0px !important;
}
.o2oContent .thinBlueTable tr
{
    height: 23px !important;
}
.o2oContent .thinBlueTable th, .o2oContent .thinBlueTable td
{
    border-bottom: 1px solid #3366CC; /* blue */
}
html > body .o2oContent .thinBlueTable tr
{
    height: 28px !important;
}
.thinBlueLine
{
    height: 23px !important;
}
.thinBlueLine td, .thinBlueLine th
{
    border-bottom: 1px solid #3366CC; /* blue */
}
html > body .thinBlueLine
{
    height: 28px !important;
}

#o2oSlogan
{
    font-size: 0.9em;
    line-height: 1.4em;
    font-weight: normal;
}
#o2oSlogan h1
{
    font-size: 2em !important;
    color: #FFF !important;
}
#o2oSlogan h1 em
{
    color: #D98736; /* orange */
}
#o2oSlogan .simpleFormat
{
    padding: 16px 16px 0px 16px;
}
/* RNS NEWS */
#rnsNewsContent iframe
{
    border: none;
}
.tableRNS
{
    width: 718px;
}
/*.tableRNS tr
{
    height: 26px;
}
.tableRNS th, .tableRNS td
{
    padding-right: 8px;
    border-bottom: 1px solid #ADD2C2;
}
.tableRNS table th, .tableRNS table td
{
    border-bottom: none;
}*/
.dateCol
{
    white-space: nowrap;
    width: 92px;
}

/* sidebar elements */
/* Latest News */
#o2oSideColumns
{
    font-size: 1em;
}
#o2oSideTop h2
{
    font-size: 1.3em !important;
    padding-bottom: 1em !important;
}
#o2oSideTop h3
{
    font-size: 1em !important;
    font-weight: bold !important;
    padding-bottom: 0.3em !important;
}
.newsList
{
    color: #FFF;
    font-size: 0.8em;
    background: #026 url('../../Images/LatestNewsGrade.gif') top left repeat-x;
}
.newsList .readMore
{
    text-align: right;
}
.newsContent
{
    padding-bottom: 1em;
}
.newsContent a
{
    color: #FFF;
}
.pubDate
{
    font-size: 0.8em;
}
.newsMasterList
{
    width: 718px;
}
/* share price */
.o2oSharePrice
{
    padding: 8px;
}
.o2oSharePrice h3
{
    font-size: 1em;
    padding-bottom: 0.5em;
}
.o2oSharePrice .priceInfo
{
    float: left;
    width: 100px;
}
.sharePrice
{
    color: #015696;
    font-size: 1.4em;
    font-weight: bold;
    text-align: right;
    padding-right: 16px;
}
.shareDiff
{
    color: #F00;
    text-align: right;
    font-weight: bold;
    padding-right: 16px;
    line-height: 2em;
}
.sharePriceText
{
    font-size: 0.6em;
    padding-top: 1em;
}

/* footer elements */
#o2oFooterContent
{
    font-size: 0.7em;
}
#o2oFooterContent ul
{
    float: right;
    list-style-type: none !important;
    margin-left: 16px !important;
    padding-top: 18px;
}
html > body #o2oFooterContent ul
{
    padding-top: 0px;
}
#o2oFooterContent li
{
    float: left;
    margin-right: 8px !important;
    padding-left: 16px !important;
    color: #88B540;
}
#o2oFooterContent a
{
    color: #000;
}
#o2oCopyright
{
    margin-left: 8px;
}

/* user controls */
/* RNS News */
#rnsNewsPopup, #preLoaderOuter
{
    text-align: center;
    border: 0;
    width: 100%;
}
#rnsNewsContent
{
    background-color: #FFFFFF;
    border: 2px solid #8D8D8D;
    padding: 3px;
    height: 425px;
    width: 900px;
    margin: 0 auto;
    text-align: right;
}
#preLoader, #preLoaderContent
{
    margin: 0 auto;
}
#o2oRNSNews
{
    height: 390px;
    margin: 0;
    overflow: auto;
    width: 895px;
}
.RNSNewsPager td
{
    border: none !important;
}
.RNSNewsPager td span, .RNSNewsPager td a
{
    padding-right: 8px;
}
/* .RNSNewsPager a, .bannerItem a, .sf_pager a
{
    color: #73B59D;
}*/
/* orderCatalogue and forms */
.formContainer
{
    width: 500px; /*border: 1px dotted #ADD2C2;*/
}
.formContainer p
{
    padding: 12px;
}
.formContainer fieldset
{
    border: none;
    padding: 8px 0 8px 0;
}
.formContainer input.txt
{
    width: 200px;
}
.formContainer fieldset p
{
    clear: left;
    padding: 5px 5px 5px 0px;
}
.formContainer textarea
{
    width: 250px;
    height: 80px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1em;
}
.formContainer p label
{
    float: left;
    width: 22%; /*text-align: right;     font-weight: bold;*/
    padding-right: 5px;
}
.formContainer p.chkBoxList label
{
    float: left;
    width: 32%;
    text-align: left; /*font-weight: bold;*/
    padding-right: 5px;
}
.formContainer select
{
    margin-right: 3px;
    width: 200px;
}
.formContainer legend
{
    /*font-weight: bold;*/
    padding: 0 0 8px 8px;
    font-size: 1.1em;
    color: #333;
}
.formContainer input.btn
{
    float: right;
    margin: 0 8px 0 8px;
}
.formContainer p span.chkBox label
{
    float: right;
    text-align: left; /*font-weight: bold;*/
    width: 75%;
}
.formContainer p span.chkBox input
{
    float: left;
    margin-left: 75px;
    margin-top: 0px;
}
.formContainer .chkBox label
{
    float: right;
    text-align: left;
    width: 355px;
    margin-left: 16px;
}
.formContainer .chkBox input
{
    float: left;
    margin-left: 75px;
    margin-top: 0px;
}
.formContainer p.radio
{
    font-weight: bold;
    margin-bottom: 1px;
}
.formContainer p span.radioBtn label
{
    float: right;
    text-align: left;
    font-weight: bold;
    width: 75%;
}
.formContainer p span.radioBtn input
{
    float: left;
    margin-left: 75px;
    margin-top: -2px;
}
.formContainer input.send
{
    padding: 0 0 0 255px;
}
.shareInfo
{
    padding-right: 8px;
}
iframe.chart
{
    float: right;
    width: 400px;
    height: 540px;
    overflow: hidden;
}
.sharechart div
{
    display: none;
}
.tableShares
{
    width: 262px;
    font-size: 1em;
}
.shareTable p
{
    text-align: left;
}
.tableShares caption
{
    padding-bottom: 1em;
}
.tableShares tr
{
    vertical-align: bottom;
    line-height: 1.5em;
}
.tableShares td
{
    text-align: right;
}
.pdfList
{
    padding-top: 1em;
}
.contentTable
{
    width: 718px;
}
.contentTable th, .contentTable td
{
    padding-right: 8px;
}
.pdfList tbody td .rightIt
{
    text-align: right;
}
.filePager
{
    height: 2em;
    list-style: none !important;
    padding: 0 0 0 8px !important;
    margin: 0 !important;
}
.filePager li
{
    float: left !important;
    padding-right: 4px !important;
}

/* general styling */
.firstParagraph
{
    font-weight: bold;
    font-size: 1.2em;
}
.boxStyle
{
    color: #009;
    font-size: 0.8em;
}
.boxStyle h2
{
    padding-bottom: 0.2em;
    font-size: 1.9em;
}
.boxStyle h2 em
{
    font-style: normal;
    color: #88B540; /* dark green */
}
.boxStyle h3
{
    padding-bottom: 0.2em;
    font-size: 1.2em;
}
.boxStyle ul, .boxStyle ol
{
    list-style-type: none;
    list-style-position: outside;
    margin-left: 16px;
    margin-bottom: 8px;
}
.boxStyle li
{
    /*color: #009; /* green */
    list-style-image: url('../../Images/BlueBullet7x7.gif');
}
.boxStyle a
{
    color: #009;
}
#o2oTradingBrands h2 em
{
    font-style: normal;
    color: #D98736; /* orange */
}
.errMessage
{
    color: #F00;
}
.border
{
    border: 1px dashed #666;
}

/* online login form */
.onlineLoginForm
{
    width: 221px;
    height: 130px;
    font-size: 11px;
    z-index: 100;
    color: #009;
    background: #FFF url('../../Images/BannerOrderOnline.gif') left top repeat-x;
    border: 1px solid #009;
}
html > body .onlineLoginForm
{
    width: 221px;
    height: 130px;
}
.onlineLoginForm fieldset
{
    overflow: visible;
    padding: 3px 8px 0 12px;
    border: none;
}
.onlineLoginForm fieldset legend
{
    display: none;
}
.onlineLoginForm label
{
    display: block;
    font-size: 0.8em;
}
.onlineLoginForm input
{
    margin-right: 8px;
}
.onlineLoginForm .inputSize
{
    width: 120px;
}
.onlineLoginForm h3
{
    font-size: 1.2em;
}
.onlineFormGroup p
{
    margin: 2px 0 0 0 !important;
    padding: 0px !important;
}
.onlineFormGroup .forgottenDetails
{
    text-align: right;
}
.onlineFormGroup .requestCatalogue
{
    font-size: 1.2em;
}
.onlineFormGroup .requestCatalogue a
{
    color: #009;
    font-weight: bold;
}
.onlineLoginForm br
{
    clear: both;
}
.onlineLinks
{
    margin: 4px 0 0 0;
}
.submitImageButton
{
    position: absolute;
    margin-left: 8px;
}
.forcedLoginBox
{
    padding-bottom: 1em !important;
}

/* the adverts */
.advertBox img
{
    border: 0px;
    margin-bottom: 6px;
    width: 223px;
}
.ajax__validatorcallout
{
    position: relative !important;
    left: 0px !important;
    top: -32px !important;
    z-index: 1000;
}
