/*CSS QUICK REFERENCE*/
/*Stylesheets allow inheritance & cascading of styles, this means that if you have a smallish font set on a div tag then it can decrease in size with every div element you add inside the original div (ie: if you make a second div with a font size set .8em, this means the second div will make the .8em sizing a portion of the original div rather than what you think it should be).So if something doesn't see to look right check for anything that is been inherited*/
/*The words at the very start are what you are applying the style changes to*/
/*The aqua words are core html words*/
/*You must always enclose css change information in curly brackets*/
/*The blue words inside the curly brackets are what type of changes are being made and must always end with a full colon*/
/*The red(standard core words) or black words after the : in blue are the amount or style of change being made and must always finish with a semi colon*/
/*Any font name must be written inside "(quotation marks)*/
/*SIZING RULES*/
/* When specifying measurements for page division, tables etc it is often better to use % rather than px in the reference*/
/*For font sizing use em as this will set the font size based on the size of an M in the users default font rather than forcing the size on the user, you can also use the default settings of small medium large super sub etc as this again goes on the users default settings rather than over-riding them */
/*SYMBOL MEANINGS*/
/* A single .(full stop) before a word on a stylesheet means that the word is a class and can be used in almost any elemnt on a web page. A class is written in the element tag (ie <p class="blue"> this will turn the contents between the p tags blue and will end when the closing tag is written </p>). Classes can be used just about anywhere*/
/*A single :(full colon before a word on a stylesheet means that it is a pseudo class, these allow you to do things that are not necessarily done in normal html markup a good example of this is the :hover used with the a tag. This gives a mouseover effect which is not really possible in html markup without the use of javascript.*/
/*An *(Asterisk)is used to apply styles and rules to all elements on a page such as font colour and style*/
/*****************************************************************/


/*BASIC PAGE FORMATING INFOMATION*/
/*Removes the automatic padding & margins that IE adds to all html pages*/
html {margin:0px;padding:0px;}
/*Sets the colour theme for the whole site - individual pages can be changed by using a class rule in the body tag*/
body {background-color:#000000; background-image:url(back2.jpg); color:#ffff00; padding:5px; margin:0px;}

/*FONT INFORMATION*/
/*The asterix represents infrmation that is used on the whole website*/
*{font-family:"Palatino Linotype", "Times New Roman", serif; font-weight:normal;}
/*Information dealing with the p tag*/
p{font-size:1.1em; text-align:left; padding:10px 15px 10px 15px; margin:2px;}

/*Font sizing*/
h1,h2,h3,h4,h5,h6{font-weight:bold;}
h1 {margin:0px;}
/*font classes*/
.xx-small{font-size:.5em; }
.x-small{font-size:.7em; }
.small{font-size:.9em; }
.medium{font-size:medium; }
.large{font-size:large;}
.x-large{font-size:2em inherit;}
.xx-large{font-size:2.5em;}
.superscript {vertical-align: super; font-size:.7em;}
.subscript {vertical-align: sub; font-size:.7em;}


/*LINK INFORMATION*/
/*Contains all information dealng with hyperlinks*/
a, a:link, a:visited {color:#F55101; background-color:transparent; font-weight:bold; border:0px; margin:0px;}


/*DIV INFORMATON*/
/*Formats the divs containing logo images*/
.logo {padding:15px 30px 15px 20px; text-align:left; float:left; clear:left; position:relative; }

/*Sets information dealing with divs in general*/
div {padding:2px; margin:auto;}

/*Formats the information dealing with anything in the link DIV*/
.navlink{font-size:1.2em;font-weight:bold;}
.link_indent{text-align:center; text-indent:220px;}


/*SPAN & CLASS INFORMATION*/
span {border:0px; margin:0px;}
/*aligns company information spans on top end product distributors page*/
.category  {width:250px; padding:0px; margin:0px; text-align:left;}
.dist_comp{width:500px; padding-right:0px; margin:0px; text-align:left; color:#F55101;}
/*information spans on contact page*/
/*aligns contact information*/
.address_name {width:400px; padding-left:200px; text-align:left;}
.address_info {width:500px; padding-right:0px; margin:auto; text-align:left;}

/*P0SITIONING INFORMATION*/
/*Positions images or text to the Left - Block Level*/
.lft{text-align:left; float:left; position:relative;}

/*Positions images or text to the Right - Block Level*/
.rgt{text-align:right; float:right; position:relative;}

/* centres images or text - Block Level*/
.cntr {text-align:center;}
/*Centres with an ident so that 
/*COLOUR*/
.color-blue {color:#0000ff;}


/*IMAGE & HORIZONTAL RULE INFORMATION*/
/*Contains information dealing with the img tag*/
img{border:none;}


/*CONTROLS THE HR TAG FORMATING*/
hr {width:95%; text-align:center;}


/*DEALS WITH THE UN-ORDERED AND ORDER LIST FORMATTING*/
ul{list-style:none;}
li{color:#ffff00; background-color:none;}



/* DEALS WITH ALL INFORMATION FOR TABLES*/
table {border:0px; padding:0px; margin:0px;}
.divtable1,.divtable2 {text-align:center; font-size:medium; margin:auto;}