/*---------------------------------------------
|  (C) 2006 Companion Computers Limited (CCL)
|       www.companioncomputers.co.uk
|      info@compan.net
|----------------------------------------------
|     site : www.companioncomputers.co.uk
|   author : Andrew Scott (andrew@compan.net)
|     date : 17/01/2010
----------------------------------------------*/
* { font-size: 12px; font-family: Arial, Tahoma, Verdana ; box-sizing: border-box; padding:0px; margin:0px;}
.cleared { display:block; width:100%; height:2px; clear:both; overflow:hidden;}

html { overflow:visible; margin:0px; padding:0px;  }

body { background-image:url(/images/bg2.gif); background-repeat:repeat-x; color: #000000; background-color:#f3f8fc;  margin:auto; overflow:auto; text-align:center; position:relative;}

/* Main Layout*/
#container { width:900px; position:relative;  height:613px; padding: 0px 0px 0px 0px; text-align:left; margin:auto; background-color:White; margin-top:5px; }
#header { width:900px; position:relative;  margin:0px 0px 2px 0px;}
#content { width:900px; position:relative; float:left; padding:0px;}
#inner { float: left; width:100%; background-color:White; }
#submenu { position:relative; left:0px; width:200px; float:left; clear:none; overflow:visible; margin-bottom:40px;}
#sectiondetails { width:698px;  position:relative; padding:0px 14px 0px 15px; color:#333333; float:right;  }
#side_menu { position:relative; float:left; }
#main_content { position:relative; left:200px; float:left; }

/* borders */
#header {border:solid 1px #e1e1e1; border-bottom:solid 0px white; }
#content { border:solid 1px #e1e1e1;  border-bottom:solid 2px #e1e1e1; border-top:solid 0px white;}
#footer { border:solid 1px #e1e1e1; }

.CompanionComputersLogo {}

#header img { border:0px; top:15px; left:20px; position:absolute;}
#header #miscmenu { width:100%; height:85px; color:#9a8484; }
#header #miscmenu ul { top:56px; left:630px; width:400px; height:20px; position:absolute; }
#header #miscmenu ul li { float:left; height:21px; background-position:right; background-repeat:no-repeat; background-image:url(/Images/MenuDivider.jpg); padding:0px 7px 0px 6px; line-height:19px; list-style-type:none; } 
#header #miscmenu ul li a { color:#848484; text-decoration:none; height:21px; font-size:11px; float:left; padding-top:1px; } 
#header #miscmenu ul li a:hover { text-decoration:underline;} 
#header #miscmenu ul li.last { background:none;}

#header #menu { width:100%;  position:relative; left:0px; background-color:#084c8b; border-top:solid 3px #ececec;  float:left; height:28px;   } 
#header #menu ul { margin:0px; padding:0px 2px 0px 2px; }
#header #menu ul li { display:block; float:left; color:White; border-left:dotted 1px white; overflow:visible; height:25px;  } 
#header #menu ul li a { color:white; text-decoration:none; font-size:11px; font-weight:bold; display:block; float:left; width:178px; text-align:center; padding:6px 0px 3px 0px; text-transform:uppercase; height:25px;  } 
#header #menu ul li a:hover { background-color:#247cbb;  } 
#header #menu ul li.first { border:solid 0px white;}


#footer { width: 900px; height:65px; text-align:center; font-size:7px; background-color:White; padding:17px 0px 0px 0px;  border:solid 1px #e1e1e1; margin-top:2px; color:#666666; float:left;  }
#footer a { color:#666666; text-decoration:none; display:inline-block; font-size:10px; } 
#footer a:hover { text-decoration:underline; } 
#footer div  { float:left; text-align:left; }
#footer div p { font-size:10px;}
#footer div.LHS { width:550px; margin-left:22px; font-size:10px;}
#footer div.LHS a { text-decoration:none; color:#137a33; font-size:10px; }
#footer div.LHS a:hover { text-decoration:underline; }
#footer div.RHS { width:300px; }


.submenupanelT { position:absolute; top:120px; left:5px; width:200px; }
.submenupanelTL { background: url(/images/corners.png) no-repeat 0px 0px; position: absolute;  left: 0px; top: 0px; width: 9px; height: 9px}
.submenupanelTC { border-top: #b7bfc1 1px solid; background: #fff; margin: 0px 9px; height: 8px}
.submenupanelTR { background: url(/images/corners.png) no-repeat -9px 0px; position: absolute; right: 0px;  width: 9px; top: 0px; height: 9px}
.submenupanelB { position:absolute; top:129px; left:5px;  width:200px; height:500px;  }
.submenupanelBL { background: url(/images/edgefade.gif) #b7bfc1 no-repeat 50% bottom; position: absolute; top: 0px; left: 0px; width: 1px; min-height: 100px; }
.submenupanelBC { padding-right: 1em; padding-left: 1.5em; background: #ffffff; left: 9px; padding-bottom: 2em; padding-top: 1px; height:500px;}
.submenupanelBR { background: url(/images/edgefade.gif) #b7bfc1 no-repeat 50% bottom; position: absolute; top: 0px; right: 0px; min-height: 100px; width: 1px; }

.contentpanelT { position:absolute; top:120px; left:210px; width:565px;  }
.contentpanelTL { background: url(/images/corners.png) no-repeat 0px 0px; position: absolute; top: 0px; left: 0px; width: 9px; height: 9px;}
.contentpanelTC { border-top: #b7bfc1 1px solid; background: #ffffff; margin: 0px 9px; height: 8px}
.contentpanelTR { background: url(/images/corners.png) no-repeat -9px 0px; width: 9px; position: absolute; top: 0px; right: 0px; height: 9px;}
.contentpanelB { position:absolute; top:129px; left:210px;  width:565px; height:500px;  }
.contentpanelBL { background: url(/images/edgefade.gif) #b7bfc1 no-repeat 50% bottom; position: absolute; top: 0px;left: 0px; width: 1px; min-height: 100px; }
.contentpanelBC { padding-right: 1em; padding-left: 1.5em; background: #ffffff; left: 9px; padding-bottom: 2em; padding-top: 1px; height:500px;}
.contentpanelBR { right: 0px; min-height: 100px; background: url(/images/edgefade.gif) #b7bfc1 no-repeat 50% bottom; width: 1px; position: absolute; top: 0px}

#submenutop {  height:1px; width:180px; margin-left:12px; background-color:#bac8d2; position:relative; overflow:hidden; }
#sectiondetailstop   { background-color:#bac8d2; height:1px; width:100%; overflow:hidden;  }
#sectiondetailstopII { background-color:#bac8d2; height:1px; width:100%; overflow:hidden; margin-top:1px; float:left; border-bottom:solid 15px white; border-top:solid 1px #bac8d2; }

#submenu ul { margin-top:7px; display:block; float:left; clear:both; padding:0px 0px 0px 10px; margin-bottom:6px;}
#submenu ul li { list-style-type:none; width:100%; height:25px;  border-bottom:solid 1px #e8f7ff; display:block; float:left; clear:both;}
#submenu ul li a {  text-decoration:none; color:#084c8b; font-size:11px; width:180px; display:block;  height:100%; padding:5px 0px 5px 15px; }
#submenu ul li a:hover { color:#3e93e2; background-color:#f9fdff; display:block;}
#submenu ul li.first { height:30px;  }
#submenu ul li.first a { color:#395f92; font-weight:bold; background-color:#f4fbff; border-right:solid 1px #d7eefb;  border-bottom:solid 1px #d7eefb; border-top:solid 1px #e8f7ff; border-left:solid 1px #e8f7ff; font-size:11px;  padding:8px 0px 5px 10px; }
#submenu ul li.first a:Hover { background-color:#f4fbff;}

#submenu img { float:left; margin-left:30px; text-align:center; margin-top:20px; }

#breadcrumbs { position:absolute; left:212px; top:15px; color:#a2a2a2; font-size:10px; }
#breadcrumbs a { text-decoration:none; color:#a2a2a2; font-size:11px; padding:0px 3px 0px 3px; }

#submenu H2 { color:#007fe0; font-size:16px; padding-top:10px; }

#sectionbanner { margin-top:7px; float:left; width:100%; height:200px; left:0px; top:0px; color:white; padding:0px; overflow:hidden; }
#sectionbanner.purple    { background-color:#b87ec1; }
#sectionbanner.lightblue { background-color:#57bdf8; }
#sectionbanner.orange    { background-color:#f2b600; }
#sectionbanner.green     { background-color:#83be5b; }
#sectionbanner.turquoise { background-color:#2eadb5; }
#sectionbanner.darkblue  { background-color:#2e6e93; }


#sectionbanner p { float:left; margin-left:10px; margin-top:10px; margin-bottom:7px; }
#sectionbanner span { margin-left:20px; }

#sectionbanner img { top:0px; left:0px; position:relative;}

#sectionquote { position:relative; left:420px; top:0px; color:White; border:solid 1px red; }

#sectionportfoliobanner { margin-top:11px; float:left; width:330px; height:230px; left:0px; top:0px;}
#sectionportfoliotestmonial { float:left; margin-top:11px; width:210px; height:230px; margin-left:20px; color:#484848; }
#sectionportfoliotestmonial span { margin-left: 20px;}

#admin { color:#2e6e93; }
#admin span { width:130px; }
#admin input,textarea { margin-right:10px; margin-top:7px;}

body.enquiry  div#container div#textarea table tr td p font { font-size:10px; }
body.enquiry  div#container div#textarea table tr td font { font-size:10px; }
body.enquiry  div#container div#textarea table tr td textarea { font-size:13px; }

strong#LocalNo { position:absolute; top:15px; right:23px; font-size:11px; color:#2e7ea7;}
strong#LocalNo a { text-decoration:none; color:#2e7ea7;}

div.popup_edit { position:absolute; top:50px; left:10px;}

/* Login */
div#loginPane { width:500px; margin:0px; font-size:12px; padding-top:0px; position:absolute;  } 
div#loginPane p { margin:0px; padding:5px; } 
div#loginPane p label { width:150px; text-align:right; color:#1053a5; padding-right:5px; } 
div#loginPane p input { width:142px; }
div#loginPane p input.button { width:132px; margin-left:150px;}

/* Special CCL Menu */
#CCLMenu { position:absolute; top:0px; right:0px; width:150px; min-height:183px; margin:0px; border:solid 1px black; background-color:#2e7ea7; text-align:left;  padding:5px 10px 5px 5px;  }
#CCLMenu:hover { opacity:1;}
#CCLMenu h2 { font-size:14px; color:White; margin:0px; padding:0px; } 
#CCLMenu a { margin:0px; padding:0px; color:white; font-size:13px;  text-decoration:none; display:inline-block; border-bottom:dotted 1px #4075b7; margin-bottom:2px; }
#CCLMenu a:hover { color:white; border-bottom:solid 1px white;  }


.popup-bg-overlay { position:absolute; top:0px; left:0px;  width:100%; height:100%;  display:none; background-color:#0a0e2b; opacity:0.6; }
.popup_edit { position:absolute; background-color:transparent; border:none; background-color:white; border:solid 3px #085696; width:750px; height:250px; display:none; font-family:Arial; text-align:left;  padding:20px; }  
.popup_edit h1 { margin-bottom:5px;}
.popup_edit table { margin:0px; padding:0px;  font-size:12px;  }    
.popup_edit table tr td.legend { width:150px; text-align:right; color:#085696; font-weight:bold; }
.popup_edit table tr td input { width:600px; }
.popup_edit table tr td select { width:600px; }
.popup_edit div.NavigationButtons { position:absolute; width:450px; text-align:center; top:200px; }
.popup_edit div.NavigationButtons a { margin-right:10px; color:#085696;}

/*




#textarea P { font-size:12px; font-family:Tahoma, verdana, arial, helvetica, sans-serif; color: #333; }
#textarea h2 { padding-bottom: 3px; margin: 0pxl font-weight: bold; font-size:14px; font-family:arial, helvetica, sans-serif; color: #004eaf; padding-top: 3px}
#textarea A { text-decoration:none; color:#447a33; font-weight:bold; } 
#textarea A:Hover { text-decoration:underline;}
#textarea A.bullit { background-image:url(/images/anchorbullit.jpg); background-position:0px 3px; padding-left:15px; background-repeat:no-repeat;}
#textarea A.sitemap { background-image:url(/images/anchorbullit.jpg); background-position:0px 3px; padding-left:15px; background-repeat:no-repeat;}
#textarea A.level1 { margin-top:20px; height:20px; }
#textarea A.level2 { margin-left:20px;}
#textarea A.level0 { margin-left:0px;}
#textarea input { height:25px; line-height:20px; padding-left:5px;}
#textarea textarea { height:300px; padding-left:5px; padding-top:2px;}
#textarea input, textarea { border-left:solid 1px #d7d7d7; border-top:solid 1px d7d7d7; border-right:solid 1px #f3f3f3; border-bottom:solid 1px #f3f3f3; }
#textarea table a { text-decoration:none; border:solid 0px white; }

#textarea A.button { height:22px; text-align:center; color:White; font-weight:bold; line-height:22px; font-size:10px; background-repeat:no-repeat; display:block;}
#textarea A.button:Hover { height:22px; text-decoration:none; background-repeat:no-repeat; } 

#textarea A.button100       { background-image:url(/images/Button100.jpg);      width:100px;  }
#textarea A.button100:Hover { background-image:url(/images/ButtonHover100.jpg); width:100px;  }
#textarea A.button140       { background-image:url(/images/Button140.jpg);      width:140px;  }
#textarea A.button140:Hover { background-image:url(/images/ButtonHover140.jpg); width:140px;  }
#textarea A.button160       { background-image:url(/images/Button160.jpg);      width:160px;  }
#textarea A.button160:Hover { background-image:url(/images/ButtonHover160.jpg); width:160px;  }
#textarea A.button180       { background-image:url(/images/Button180.jpg);      width:180px;  }
#textarea A.button180:Hover { background-image:url(/images/ButtonHover180.jpg); width:180px;  }
#textarea A.button200       { background-image:url(/images/Button200.jpg);      width:200px;  }
#textarea A.button200:Hover { background-image:url(/images/ButtonHover200.jpg); width:200px;  }
#textarea A.button220       { background-image:url(/images/Button220.jpg);      width:220px;  }
#textarea A.button220:Hover { background-image:url(/images/ButtonHover220.jpg); width:220px;  }
 

*/

#sectiondetails ul { margin-left:50px; }
#sectiondetails p { padding:5px 0px 5px 0px; color:#333333; line-height:18px; font-family:Arial; }
#sectiondetails h2 { padding:13px 0 1px 0px; color:#006699; font-size:13px;}
#sectiondetails h3 { padding:18px 0px 1px 0px; color:#006699; font-size:12px;}
#sectiondetails ul li { list-style-type:none; 
background-image:url("/images/anchorbullit.jpg");
background-position:0 3px;
background-repeat:no-repeat;
padding-left:15px; margin-bottom:3px; }

#sectionheader {  position:relative; width:900px; left:0px; height:56px; border-right:solid 1px #e1e1e1; background-image:url(/Images/HeaderArrow.jpg); background-repeat:no-repeat; background-position:174px 34px; border-left:solid 1px #e1e1e1; float:left;  }
#sectionheader H1 { color:#4a4a4a; position:absolute; left: 215px; top: 28px; font:18px/18px arial,helvetica,sans-serif;}

#sectiondetails a { color:#004eaf; text-decoration:none; }
#sectiondetails a:hover { text-decoration:underline;}