/* Main content styles */

*
{
    font-family: Arial, Helvetica, sans-serif;
}

.clearfix:after { 
   content: "."; 
   visibility: hidden; 
   display: block; 
   height: 0; 
   clear: both;
}

body
{
    font-size: 12px;
    padding: 0;
    margin: 0; /* Editable */
    color: #333333;
/*    background: #CCCCCC;*/
}

h1, h2, h3, h4
{
    margin: 0 0 16px 0;
    color:#7f7f7f;
    font-weight: bold;
}

table h2
{
    margin-bottom: 0;
    margin-top: 16px;
}

h1
{
    font-size: 22px;
}

h2
{
    font-size: 16px;
}

p
{
    margin: 0 0 16px 0;
}

p, li
{
    line-height: 140%;
}

img
{
    border: none;
}

a
{
    color: #222222;
    text-decoration: underline;
}

a:hover
{
    text-decoration: none;
}

a img
{
    text-decoration: none;
}

p img
{
    vertical-align: middle;
}

/* Main page components */

#Container
{
    border: 10px solid #fff;
    background: #fff;
    width: 968px;
    margin: 0 auto;
    padding: 0;
}

#HeaderWrap
{
      border: 10px solid #fff;
      background: #fff;
      width: 968px;
      margin: 0 auto;
      padding: 0;
}

#Header
{
    clear: both;
    position: relative; /* Used to allow positioning of content */
    min-height: 50px;
    width: 100%;
}

#Content
{
    clear: both;
}


/* Header components */

#Header .HeaderContent
{
    height: 100%;
    overflow: auto;
    background: #fff;
}

#Header .HeaderContent .Logo, #Header .HeaderContent .BannerHeaderMiddle
{
    float: left;
    margin-right: 10px;
}

#Header .HeaderContent .Logo
{
    padding:20px 0 32px 0;
    margin:0;
}

#Header .HeaderContent .Logo img
{
    vertical-align: middle;
}


#Header .HeaderContent .Logo .LogoWrapper
{
    font-size: 0;
}


#Header .HeaderContent .HeaderContact
{
    float: right;
    padding: 42px 0 0;
}

#Header .HeaderContent .HeaderContact p
{
    margin: 0 0 10px;
    padding: 0;
}

#Header .HeaderContent .HeaderContact .SearchBox input.Text
{
    margin-right: 10px;
    width: 175px;
    font-weight: normal;
    position: relative;
    top: 1px;
}

#Header .HeaderContent .HeaderContact .SearchBox
{
    padding-right: 6px;
}

#Header .HeaderContent .HeaderContact .SearchBox .SearchButton
{
    border: none;
    font-size: 0;
    padding: 0;
    cursor: pointer;
    text-decoration: none;
    display: block;
    float: right;
}


#Header .HeaderContent .HeaderContact .SearchBox .SearchButton .Icon
{
    font-size: 20px;
}

#Header .BannerHeaderTop, #Header .BannerHeaderBottom
{
    clear: both;
    width: 100%;
    text-align: center;
}

#Header .BannerHeaderTop img, #Header .BannerHeaderBottom img
{
    margin-bottom: 10px;
}

#Header .HeaderNav
{
}

#Header .HeaderNav ul
{
    list-style:none;
    float:right;
    padding:0;
    margin:0;
}

#Header .HeaderNav ul li
{
    float:left;
}

#Header .HeaderNav ul a
{
    text-decoration:none;
    display:block;
    padding:6px 0;
    margin-left:16px;
    color:#7f7f7f;
    font-weight:bold;
    font-size:16px;
}

#Header .HeaderNav ul li:first-child a
{
    margin-left:0px;
}

#Header .HeaderNav ul a:hover
{
    color:#000;
}

#SearchWrap
{
    background:#f5f5f5;
    margin-bottom:16px;
    line-height:100%;
}

#SearchWrap .SearchBox
{
    width:928px;
    margin:0 auto;
    padding:0 20px;
    overflow:auto;
}

#SearchWrap .SearchBox input.Text
{
    border:0px;
    background:none;
    height:20px;
    line-height:20px;
    font-size:14px;
    outline:none;
    font-weight:bold;
    color:#a2a2a2;
    margin:20px 0;
    width:380px;
    float:left;
}

#SearchWrap .SearchBox .SearchButton
{
    text-decoration:none;
    font-size:20px;
    line-height:20px;
    margin:20px 0;
    display:block;
    float:left;
    color:#a2a2a2;
}

#SearchWrap .SearchBox .SearchButton:hover,
#SearchWrap .SearchBox .SearchButton:focus
{
    color:#000;
}

/* End of Header components */

/* Top Navigation Components */

#TopNav
{
    background-color: #0097d5;
    padding: 0 10px; /* Forces Height to include all floating elements */
    height: 46px;
    margin-bottom: 10px;
    color: #fff;
    position: relative;
}

#TopNav #TopNavInner
{
    width:988px;
    margin:0 auto;
}

#TopNav ul
{
    list-style: none;
    margin: 0;
    padding: 0;
}

#TopNav ul li
{
    float: left;
    position: relative;
}

#TopNav ul li a
{
    color: #fff;
    text-decoration: none;
    padding: 0 12px;
    height:46px;
    line-height: 46px;;
    display: block;
}

#TopNav ul li .Icon
{
    margin-right: 6px;
}

#TopNav ul li:first-child a
{
    border-left: none;
}

#TopNav ul li:hover
{
    background-position: 0 0;
}

/* End of Top Navigation Components */

/* Left Navigation Components */

#Navigation
{
    width: 210px;
    float: left;
    padding: 0;
}

#Navigation .NavContainer
{
    margin-bottom: 15px;
    /*background-color: #f5f5f5;*/
}

.NavContainer ul
{
    list-style: none;
    margin: 0;
    padding: 0;
}

.NavContainer ul li
{
    padding: 0;
    border-bottom: 2px solid transparent;
}


.NavContainer ul li a
{
    text-decoration: none;
    color: #a2a2a2;
    padding:16px 12px;
    font-weight:bold;
    font-size:13px;
    display: block;
    background-color: #f5f5f5;
}

.NavContainer ul li a:hover,
.NavContainer ul li a.OpenSub
{
    background:#747474;    
    color:#fff;
}

.NavContainer ul li .Icon
{
    margin-right: 6px;
}

li.containsSub
{
    
}

.NavContainer ul.Sub-Nav
{
    display: none;
    /*padding: 0 15px 0 0;*/
    background: #fff;
    border-bottom:1px solid #747474;
    
    padding-bottom:6px;
    padding-top:4px;
    margin-bottom:4px;
    padding-left:3px;
    padding-right:3px;
}

#Navigation ul li ul li
{
    border-top: 2px solid #fff;
    border-bottom: none;
}

#Navigation ul li ul li a
{
    background-position: 0 top;
}

#Navigation ul li ul li a:hover
{
    background-position: 0 bottom;
}






#Navigation .CSVUploadFormContainer
{
    margin-bottom: 15px;
}

#Navigation .CSVUploadFormContainer h2
{
    background-position: 0 bottom;
    background-repeat: repeat-x;
    background-color: #333333;
    color: #fff;
    padding: 5px 10px;
    margin: 0 0 4px;
    font-weight: normal;
    font-size: 12px;
    position: relative;
}

#Navigation .CSVUploadFormContainer h2 a.CSVHelp
{
    color: #fff;
    text-decoration: none;
    cursor: pointer;
    font-size: 16px;
    position: absolute;
    top: 4px;
    right: 5px;
}

#Navigation .CSVUploadForm
{
    padding: 5px;
    border: 1px solid #333333;
    font-size: 11px;
}

#Navigation .CSVUploadForm p
{
    margin: 0 0 5px;
}


#Navigation .CSVUploadForm .Submit
{
    text-align: right;
    margin: 0;
}

#CSVUploadHelp
{
}

#CSVUploadHelp .UploadSteps
{
    height: 100%;
    overflow: auto;
    clear: both;
    margin-bottom: 10px;
}

#CSVUploadHelp .UploadSteps h4
{
    margin: 0 0 5px;
}

#CSVUploadHelp .UploadSteps img
{
    float: left;
    margin-right: 20px;
}

#Navigation .NavBanner
{
    margin-bottom: 10px;
}

#Navigation .SocialLink
{
    float: left;
    margin: 0 10px 10px 0;
}

/* End of Left Navigation Components */

/* Primary Content Components */

#PrimaryContent
{
    width: 742px;
    float: left;
    padding: 0;
    margin: 0 0 10px 16px;
}

/* End of Primary Content Components */

/* Footer Components */

#FooterWrapper
{
    background:#262626;
}

#Footer
{
    width:968px;
    margin:0 auto;
    clear: both;
    padding:12px 0;
    font-size: 11px;
    overflow:auto;
    padding: 5px 10px;
    color: #828282;
}

#FooterLinksWrapper
{
    border-top:1px solid #3f3f3f;
    background:#0f0f0f;
    padding:14px 0;
}

.FooterLinks
{
    width:988px;
    margin:0 auto;
    color:#828282;
    font-size:14px;
}

.FooterLinks a
{
    color:#828282;
    text-decoration:none;
}

#Footer a
{
    color: #828282;
    text-decoration: none;
}

#Footer h2
{
    color:#fff;
    font-size:14px;
    text-transform:uppercase;
}

#Footer a:hover
{
    text-decoration: underline;
}

#Footer p
{
    margin: 0 10px;
}

#Footer p.FooterMobileLinks
{
    text-align: center;
    margin: 5px 10px 0;
}

#Footer p.FooterMobileLinks a
{
    font-weight: bold;
}

#Footer .Icon
{
    margin-right: 6px;
}

.FooterCols
{
    float:left;
}

.FooterCols .FooterCol
{
    float:left;
    padding:20px 0 32px 0;
    margin-right:20px;
    
}

.FooterSearchBox input.Text
{
    padding:15px;
    border:0px;
    outline:none;
    background:#141414;
    float:left;
    margin-right:8px;
}

.FooterSearchBox .SearchButton
{
    font-size:22px;
    float:left;
    display:block;
    margin:8px 0;
}

.FooterSearchBox .SearchButton:hover,
.FooterSearchBox .SearchButton:hover .Icon
{
    text-decoration:none;
    color:#000;
}


.BannerFooterTop img
{
    margin-bottom: 10px;
    clear: both;
}

.BannerFooterBottom img
{
    margin-top: 10px;
    clear: both;
}

/* End of Footer Components */

table th
{
    text-align: left;
}

table th, table td
{
    padding-right: 20px;
}


/* Navigation components */

#Breadcrumbs
{
    font-size: 11px;
    margin-bottom: 16px;
}

#Breadcrumbs a
{
    text-decoration: none;
}

.Repeater
{
    clear: both;
    margin: 0;
    padding-bottom: 8px;
    width: 100%;
    height: 100%;
    overflow: auto;
}

.Repeater .Previous
{
    width: 14.9%;
    float: left;
    text-align: left;
    margin: 0;
}

.Repeater .Position
{
    width: 70%;
    float: left;
    text-align: center;
    margin: 0;
}

.Repeater .Next
{
    width: 14.9%;
    float: right;
    text-align: right;
    margin: 0;
    padding-bottom: 8px;
}

.Next
{
    text-align: right;
    margin-top: 5px;
}

table.Products .Next
{
    text-align:center;
}

table.Products .SpinnerContainer
{
    min-width: 90px;
}

table.Products .SpinnerContainer,
table.Products .Next
{
    width:auto;
}

.BuyBox fieldset label
{
    width: 90px;
    left: -115px;
}

#MatrixGrid table
{
    border-collapse: collapse;
    width: 100%;
}

#MatrixGrid th, #MatrixGrid td
{
    border-top: 1px solid #bbbbbb;
    border-bottom: 1px solid #bbbbbb;
    padding-top: 5px;
    padding-bottom: 5px;
}

#MatrixGrid img
{
}


.CrossSell, .Alternative
{
    padding-top: 25px;
}

.Delivery select
{
    max-width: 475px;
}

input.Midi
{
    width: 75px;
}

.Login fieldset div
{
    margin-left: 125px;
}

.Intro
{
    width: 49%;
    float: right;
}

.Intro img
{
    float: right;
    padding: 0 5px 5px 5px;
}

/*** Home Page Components ***/
.HomeSlider
{
    text-align: center;
    margin-bottom: 10px;
    width: 742px !important;
    z-index: 9;
}

.HomeSlider div
{
    width: 742px !important;
}

.FeaturedProducts
{
    clear: both;
    padding-top: 5px;
}

.FeaturedProducts h2
{
    margin: 0;
}


/*** End of Home Page Components ***/

/*** Cookie Concent ***/

.CookieConsent
{
    position: fixed;
    bottom: 0;
    left: 0;
    padding: 5px 0;
    width: 100%;
    background: #fff;
    border-top: 1px solid #333333;
    z-index: 999999;
    color: #333333;
}

.CookieConsent
{
    color: #333333;
}

.CookieConsent .CookieContent
{
    float: left;
    width: 60%;
    margin: 2px 0 0 10px;
}

.CookieConsent .CookieContent p
{
    margin: 0;
    padding: 0;
}

.CookieConsent input
{
    float: right;
    margin-right: 5px;
    cursor: pointer;
}

/*** All elements using gradient image ***/

#Navigation .CSVUploadFormContainer h2,
input.Button, input.NextStep,
input.PreviousStep,
input.LoginBtn, 
.Wizard .Sidebar table a, 
input.PaymentBtn, 
.LoginBox a.LinkButton, 
.ajax_BasketMessageBox,
.MiniBasket .Button
{
    background-image: url(images/background-gradient-alt.png);
}

.ProductDetails
{
    float: left;
}

.CurrencySelect /*The original dropdown*/
{
    width: 182px;
}

#CurrencySelect /*Containing Div*/
{
    padding: 5px 0;
}

.TokenPayment td
{
    vertical-align: middle;
}

.TokenPayment h2
{
    margin-bottom: 10px;
}

.ajax_BasketMessageBox
{
    display:none;
    position:fixed;
    width:16%;
    padding:1% 2%;
    left:40%;
    top:0px;
    color:#fff;
    text-align:center;
    background-position: 0px bottom;
    background-repeat: repeat-x;
    background-color: #333;
}

.ajax_BasketMessageBox a
{
    color:#fff;
    text-decoration:underline;
}

.ajax_BasketMessageBox a:hover
{
    text-decoration:none;
}

.MessageLines
{
    margin: 10px 0;
}

.MessageLine 
{
    padding: 5px 0;
}

.MessageLine label
{
    font-weight: bold;
    width: 17.5%;
    display: inline-block;
}

.MessageLine input.Text
{
    width: 99%;
    display: inline-block;
}

.MessageLine input.Button
{
    width: 10%;
    display: block;
    margin: 0.3rem 0;
    float: right;
}

.PaintColourLine td
{
    border: none;
}

/*  Items cannot be added to basket blah blah... */
.CategoryWarning
{
    color: Red;
    font-weight: bold;
    text-align: right;
}

#AccessoryReminder {
  display: none;
}

.HomePPCDates
{
    margin-top:-40px;
    float:right;
}


/* Mini Basket */

.AjaxMiniBasket
{
    background-color:rgba(245, 245, 245, 0.94);
    color:#a2a2a2;
    padding:15px;
    display:none;
    position:absolute;
    top:100%;
    margin-top:5px;
    left:0;
    z-index:10;
    border:1px solid #a2a2a2;
}

.AjaxMiniBasket.Show
{
    display:block;
}

.MiniBasketProducts
{
    overflow:auto;
    width:300px;
}

.MiniBasketProducts.Scroll
{
    width:330px;
}

.MiniBasket .MiniBasketRow,
.MiniBasket .TotalsRow,
.MiniBasket .Next,
.MiniBasket .SubTotal 
{
    clear:both;
}

.MiniBasket .MiniBasketRow
{
    width:300px;
}

.MiniBasket .ProductImage
{
    float: left;
    padding: 0;
    text-align: center;
    width: 100px;
}

.MiniBasket a
{
    padding:0 !important;
    border:none !important;
    color:#a2a2a2 !important;
    line-height:24px !important;
    height:auto !important
}

.MiniBasket .ProductInfo 
{
    padding:0 0 0 15px;
    float:left;
    width:185px;
    line-height:24px;
}

.MiniBasket .ProductInfo .StockCode
{
    display: block;
    font-size: small;
    font-weight: bold;
    line-height: 24px;
}

.MiniBasket .SubTotal 
{
    line-height:30px;
    text-align:right;
}

.MiniBasket .ProductInfo label,
.MiniBasket .ProductInfo .MiniBasketButton
{
    padding:0;
}

.MiniBasket .ProductInfo .Qty .QtyInput,
.MiniBasket .ProductInfo .Qty .MiniBasketButton
{
    width:50%;
    float:left;    
}

.MiniBasket .ProductInfo .Qty label
{
    line-height:34px;
}

.MiniBasket .ProductInfo input.Quantity
{
    text-align:center;
}

.MiniBasket .ProductInfo .MiniBasketButton .Button
{
    float: left;
    margin-left: 4%;
    width: 46%;
    padding:0;
    text-align:center;
}

.MiniBasket .ProductInfo .MiniBasketButton .Button .Icon
{
    line-height:34px;
    margin:0 !important;
    color:#fff;
}

.MiniBasket .TotalsRow .Total,
.MiniBasket .TotalsRow .Price
{
    padding:10px 0;
    text-align:right;
    float:left;
}

.MiniBasket .TotalsRow .Total
{
    width:60%;
}

.MiniBasket .TotalsRow .Price
{
    width:40%;
}


.MiniBasket .TotalsRow.GrandTotalRow
{
    font-weight:bold;
}

.MiniBasket .Next
{
    padding:10px 0 0;
}

.MiniBasket .Next a.Button
{
    text-align:center;
    color:#fff !important;
}


/* End of Mini Basket */

td._6 
{
  width:400px;
}

/* Markdown styles */

.MarkDownStyle table
{
    border-collapse:collapse;
}

.MarkDownStyle table td,
.MarkDownStyle table th
{
    padding: 4px; 
    border: 1px solid #000;
}