﻿/*-------------generic styles------------------------------------------------------------ */
body
{
    margin: 0 auto;
    background-color: #d6d0c7;
    font-family: Verdana;
    margin-top: 10px;
}
img
{
    border: 0px;
}


/* -----------content panel------------------------------------------------------ */



.contentcontainer
{
	margin: 0 auto;
	width: 898px;
	text-align: center;

}
 
.header-container
{
    float: left;
    width: 898px;
    height: 154px;
	background-image: url(images/header-bg.jpg);
    background-position: top center;
    background-repeat: no-repeat;
}

.header
{
    float: left;
    width: 898px;
}

.header-strip
{
    float: left;
    width: 898px;
    height: 10px;
    background-color: #e9e7e8;
}
    
.header-right
{
    float: left;
    width: 693px;
}

.telephone
{
    float: right;
    width: 400px;
    margin: 60px 20px 0px 0px;
    font-size: 13px;
    text-align: right;
}

.basket-header
{
    float: left;
    width: 100%;
    font-size: 12px;
    color: #004177;
}

.logo-container
{
    float: left;
    width: 205px;
    height: 130px;
    margin-top: 10px;
}

.search-container
{
    float: left;
    width: 189px;
    height: 41px;
    background-image: url(images/searchbg.png);
    background-position: center left;
    background-repeat: no-repeat;
}

.search-padding
{
    float: left;
    width: 200px;
    margin: 10px 0px 0px 13px ;
}

.content
{
    float: left;
    width: 899px;
    margin-top: 20px;
}

.main-content
{
    float: left;
    width: 898px;

}

.adverts
{
    float: left;
    width: 898px;
}

.advert-text
{
    float: right;
    width: 420px;
}

.advert-text-padding
{
    float: right;
    width: 420px;
    margin: 30px 0px 0px 0px;
    text-align: left;
}

.text-container
{
    float: left;
    width: 898px;
    background-color: #e9e7e8;
}
   
.main-content-contact
{
    float: left;
    width: 200px;
}


.main-content-image
{
    float: left;
    width: 679px;
}

.main-content-image-overlay
{
    float: right;
    z-index: 2;
    position: absolute;
    width: 679px;
    height: 100px;
    margin-top: 180px;
    background-image: url(images/middle-overlay.png);
    background-position: top right;
    background-repeat: no-repeat;
}

.right-content-images
{
    float: left;
    width: 219px;
}

.range
{
    float: left;
    width: 219px;
    height: 147px;
}

.range-overlay
{
    float: left;
    z-index: 2;
    position: absolute;
    width: 177px;
    height: 22px;
    margin-top: 100px;
    background-image: url(images/range-over.png);
    background-position: top left;
    background-repeat: no-repeat;
}

.range-overlay-text
{
    float: left;
    width: 177px;
    font-size: 12px;
    color: #2a2a2a;
    text-align: left;
    margin: 3px 0px 0px 10px;
}

.content-padding
{
    margin: 0 auto;
    width: 905px;
    background-color: #fff;
}


/*----Text content-------------------------------------------------*/


.text-content-header
{
    float: left;
    width: 460px;
    font-size: 24px;
    font-family: Georgia;
    color: #a0a0a0;
    text-align: left;
}



.right-text-content
{
    float: left;
    width: 219px;
    background-color: #fff;
}

.right-text-content-pad
{
    float: left;
    width: 199px;
    padding: 10px;
    font-size: 14px;
    color: #424747;
    text-align: left;
}


.text-content
{
    float: left;
    width: 679px;
}

.text-content-padded
{
    float: left;
    width: 619px;
    padding: 10px 30px 10px 30px;
    font-size: 12px;
    text-align: left;
    line-height: 1.5;
    color: #000000;
    font-weight: normal;
}



/*-----------Middle----------------------------Image-----------*/

.middle-image-container
{
    float: left;
    width: 700px;
    background-color: #fff;
}

.middle-box
{
    float: left;
    width: 698px;
    background-color: #fff;
}


/* ---footer --------------------------------------------------------------*/

.footer
{
    float: left;
    width:898px;
    background-color: #e9e7e8;
}

.footer-logos
{
    float: left;
    width: 898px;
    margin-top: 10px;
}

.footer-padded
{
    float: left;
    width: 879px;
    padding: 10px;
}

.footer-left
{
    float: left;
    width: 400px;
    margin-top: 10px;
    margin-left: 10px;
    font-size: 11px;
    font-weight: bold;
    text-align: left;
    color: #878787;
    font-family: arial;
}

.footer-right
{
    float: right;
    width: 282px;
    font-size: 11px;
    font-weight: bold;
    text-align: right;
    color: #858585;
    padding-top: 5px;
}



/*----navigation--------------------------------------------------------*/

.links-container
{
    float: right;
    width: 700px;
}

.links-container-padded
{
    float: left;
    width: 700px;
    padding-top: 15px;
}

.align-links
{
    float: left;
    width: 600px;
    margin: 0px 0px 0px 0px;
}

.link
{   
    float: left;
    min-width: 50px;
    text-align: center;
}

.link:hover
{   
    float: left;
    min-width: 50px;
    text-align: center;
    background-image: url(images/link-bg.jpg);
    background-position: top left;
    background-repeat: repeat-x;
}

.link-pad
{   
    float: left;
    padding: 12px 4px 10px 4px   ;
    min-width: 50px;
    text-align: center;
}

.link-divider
{
    float: left;
    width: 12px;
    height: 12px;
    padding-top: 14px;
} 




/*----------------------left-content-header-------------------------*/

.left-links
{
    float: left;
    width: 200px;
}

.left-links-box
{
    float: left;
    width: 200px;
    background-color: #9c9c9c;
    text-align: left;
    margin-bottom: 3px;
    padding: 4px;
    color: #ffffff;
}

.left-links-box:hover
{
    float: left;
    width: 200px;
    background-color: #7b7b7b;
    text-align: left;
    margin-bottom: 3px;
    padding: 4px;
    color: #ffffff;
    font-weight: bold;
}





.main-links
{
    float: left;
    width: 200px;
}

.main-links-box
{
    float: left;
    width: 200px;
    background-color: #ffffff;
    text-align: left;
    margin-bottom: 3px;
    padding: 4px;
    color: #000000;
}

.main-links-box:hover
{
    float: left;
    width: 200px;
    background-color: #fec83a;
    text-align: left;
    margin-bottom: 3px;
    padding: 4px;
}

.main-links-box2
{
    float: left;
    width: 200px;
    background-color: #ffffff;
    text-align: left;
    margin-bottom: 3px;
    padding: 4px;
    color: #000000;
    font-weight: bold;
}

.main-links-box2:hover
{
    float: left;
    width: 200px;
    background-color: #fec83a;
    text-align: left;
    margin-bottom: 3px;
    padding: 4px;
    font-weight: bold;
}





.left-links-box2
{
    float: left;
    width: 200px;
    background-color: #7b7b7b;
    text-align: left;
    margin-bottom: 3px;
    padding: 4px;
}

.left-links-box2:hover
{
    float: left;
    width: 200px;
    background-color: #9c9c9c;
    text-align: left;
    margin-bottom: 3px;
    padding: 4px;
}

.links-left
{
    font-family: Arial;
    font-size: 12px;
    color: #000;
    text-decoration: none;
    text-align: left;
    margin-left: 5px;
}

.links-left2
{
    font-family: Arial;
    font-size: 12px;
    color: #000;
    text-decoration: none;
    text-align: left;
}

.left-content
{
    float: left;
    width: 205px;
    margin-top: 10px;
}

.left-content-padded
{
    float: left;
    width: 205px;
    padding-right: 8px;
}

.left-part
{
    float: left;
    width: 197px;
    margin-bottom: 10px;
}

.left-part-top
{
    float: left;
    width: 197px;
    height: 32px;
    background-image: url(images/nav-left-head.jpg);
    background-position: top left;
    background-repeat: no-repeat;
}

.left-part-mid
{
    float: left;
    width: 197px;
    min-height: 86px;
    background-image: url(images/nav-left-mid.jpg);
    background-position: top left;
    background-repeat: no-repeat;
}

.left-part-repeat
{
    float: left;
    width: 197px;
    min-height: 15px;
    background-image: url(images/nav-left-repeat.jpg);
    background-position: top left;
    background-repeat: repeat-y;
}


.left-part-bot
{
    float: left;
    width: 197px;
    height: 9px;
    background-image: url(images/nav-left-bot.jpg);
    background-position: top left;
    background-repeat: no-repeat;
}

.left-content-header
{   
    float: left;
    width: 177px;
    padding: 10px;
    font-family: Arial;
    font-size: 12px;
    color: #0076bc;
    text-align: left;
 }
 
 .left-link-container
 {
     float: left;
     width: 177px;
     margin: 5px;
     text-align: left;
     padding-left: 10px;
}
 
 /*----------------------right-content-header-------------------------*/

.right-content
{
    float: left;
    width: 698px;
    margin-top: 10px;
}

 /*----------------------featured-content-------------------------*/
 
.featured-product-container
{
    float: left;
    width: 696px;
    margin: 10px 0px 10px 0px;
}
 
.featured-product-container2
{
    float: left;
    width: 696px;
    margin: 0px 0px 10px 0px;
}
  

.featured-product-top
{
    float: left;
    width: 696px;
    height: 31px;
    background-image: url(images/feature-head.jpg);
    background-position: top left;
    background-repeat: no-repeat;
}

.featured-product-mid
{
    float: left;
    width: 696px;
    min-height: 227px;
    background-image: url(images/feature-mid.jpg);
    background-position: top left;
    background-repeat: no-repeat;
}

.featured-product-mid-padding
{
    margin: 0 auto;
    width: 666px;
}


.featured-product-bot
{
    float: left;
    width: 696px;
    height: 11px;
    background-image: url(images/feature-bot.jpg);
    background-position: top left;
    background-repeat: no-repeat;
}

.featured-product-mid-repeat
{
    float: left;
    width: 696px;
    min-height: 10px;
    background-image: url(images/feature-repeat.jpg);
    background-position: top left;
    background-repeat: repeat-y;
}


.middle-dots
{
    float: left;
    width: 1px;
    height: 234px;
    background-image: url(images/dots.png);
    background-position: top left;
    background-repeat: no-repeat;
    margin-top: 15px;
}


.left-content-header
{   
    float: left;
    width: 177px;
    padding: 10px;
    font-family: Arial;
    font-size: 12px;
    color: #0076bc;
    text-align: left;
 }
 
.mailer-input
{
    border: solid 1px #858585;
    color: #858585;
    padding: 5px;
    font-size: 12px;
    width: 80%;
    margin-bottom: 4px;
    margin-top: 4px;
}

fieldset
{
    border: none;
}

.product-container
{   
    float: left;
    width: 150px;
}

.product-image-container
{
    float: left;
    width: 100%;
}

.product-text
{
    float: left;
    width: 100%;
    text-align: left;
    font-family: Arial;
    font-size: 11px;
    color: #444444;
}

.product-text-padded
{
    float: left;
    width: 80%;
    padding: 5px 3px 5px 3px;
}

.product-bullets
{
    float: left;
    width: 120px;
    padding: 10px 10px 10px 40px ;
    text-align: left;
}

.product-link
{
    width: 100%;
    text-align: center;
}

.detail-image-container
{
    float: left;
    margin-top: 20px;
    margin-bottom: 10px;
    width: 100%;
}

.detail-content-header
{   
    float: left;
    width: 500px;
    padding: 10px;
    font-family: Arial;
    font-size: 12px;
    color: #0076bc;
    text-align: left;
 }
 
 /*-Enquiry Box--------------*/
 
 .enquiry-form
 {
    float: left;
    width: 100%;
    margin-top: 10px;
 } 
 
.enquiry-top
{
    float: left;
    width: 551px;
    height: 15px;
    background-image: url(images/contact-top.png);
    background-position: top left;
    background-repeat: no-repeat;
}

.enquiry-mid
{
    float: left;
    width: 551px;
    min-height: 15px;
    background-image: url(images/contact-mid.png);
    background-position: top left;
    background-repeat: repeat-y;
}

.enquiry-bot
{
    float: left;
    width: 551px;
    height: 15px;
    background-image: url(images/contact-bot.png);
    background-position: top left;
    background-repeat: no-repeat;
}

.contact-text
{
    float: left;
    width: 250px;
    margin: 10px 20px 10px 20px;
    text-align: left;
    color: #0f2f4f;
    font-size: 12px;
}

/*----------products-------------*/

.product-detail-container
{
    float: left;
    width: 858px;
    margin: 10px 20px 10px 20px;
}


.product-list
{
    float: left;
    width: 420px;
}

.product-description
{
    float: left;
    width: 430px;
    background-color: #fff;
    border: solid 1px #004177;
}

.product-description-padding
{
    float: left;
    width: 400px;
    margin: 15px;
}

.product-thumbnails
{
    float: left;
    width: 100%;
    margin-top: 10px;
    height: 120px;
}

.thumbnail
{
    float: left;
    width: 100px;
}

.view-page-container
{
    float: left;
    width: 100%;
    background-color: #9c9c9c;
    color: #fff;
    margin-top: 10px;
    padding: 5px;
}

.view-page
{
    float: left;
    width: 100%;
    font-size: 11px;
}

.left-basket
{
    float: left;
    width: 205px;
    background-color: Gray;
    margin-top: 10px;
    font-family: Arial;
    font-size: 12px;
    text-align: left;
    color:#fff;
}

.left-basket-padding
{
    float: left;
    width: 205px;
    padding: 10px 0px 10px 20px;
}

.crumbtrail
{
    clear: both;
    float: left;
    width: 100%;
    font-size: 12px;
}
a.link2
{
    font-size: 12px;
}

/*--------Gallery Container-------------------*/

.gallery-container
{
    float: left;
    width: 860px;
    margin: 10px 0px 10px 0px;
}

.gallery-left
{
    float: left;
    width: 200px;

}

.gallery
{
    float: left;
    width: 660px;

}

.gallery-titles
{
    float: left;
    width: 200px;
    padding: 10px;
}

.gallery-links-format
{
    font-style: italic;
    font-weight: bold;
    font-size: 14px;
    color: #004177;
    text-align: left;
    text-decoration: none;
}

/* new styles */ 
.slideshow
{
    clear: both;
    width: 100%;
    height: 250px;
    display: table;
    border: solid 1px black;
}

.slideshow-panel
{
    float: left;
    width: 415px;
    height: 250px;
}

.side-boxes
{
    float: right;
    width: 193px;
    height: 243px;
}

.side-boxes img
{
    margin-top: 9px;
    margin-bottom: 0px;
}

.slideshow-panel-container
{
    width: 415px;
    height: 250px;
    text-align: left;
}
#portfolio ul
{
    list-style:none;  
    margin: 0px 0px 0px 0px;
}
#portfolio li
{
    list-style:none;  
    margin: 0px 0px 0px -40px;
}

.product-box
{
    width: 190px;
    height: 220px;
    border: solid 1px #c3c3c3;
    background-color: #ffffff;
    padding: 3px 3px 3px 3px;
}
.item-name
{
    width: 100%;
    font-size: 14px;
    color: #5c5c5c;
    text-align: left;
    border-bottom: solid 1px #5c5c5c;
    min-height: 45px;
    margin-bottom: 15px;
}

.brands
{
    width: 100%;
    text-align: center;
}
.brands img
{
    background-color: #ffffff;
    padding: 2px 2px 2px 2px;
    border: solid 1px #c3c3c3;
    margin: 2px 2px 2px 2px;
}
