/*------------------------------------------------------------------------------------------------*/
/*-                                            STLYES.CSS                                        -*/
/*-                     THIS IS USED TO DECLARE TEXT STYLES AND CONTENT STYLES ONLY              -*/
/*-                                   IT DOES NOT DECLARE LAYOUT.                                -*/
/*------------------------------------------------------------------------------------------------*/

/*set overall body text colour, set a base font size of 62.5% which is 10px and a 
  base line height for the whole document, the percentage of 62.5% which is a 10px 
  line-height is aleady set in the reset style sheet*/
body {
 color: #424242;
 font: 62.5%/1.6em Arial, Verdana, Sans-Serif
}

#headerLinks a {
display:block;
color: #fff;
float: left;
padding: 0px 25px 0px 0px;
text-decoration: none;
font-size:11px;
}

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

/*################################################### COPY STYLES ####################*/

/*Set website wide styles for everything swirl can out put*/
/*anything that is outside of the base styles can be redeclared after to override the 
  base style, quoteboxes for example*/
#ctl00_maincontainer {
 font-size: 1.3em;
 line-height: 1.6em
}

#ctl00_maincontainer h1 {
margin:0px 0px 15px 0px;
padding: 0px 0px 3px 0px;
border-bottom: solid 1px #c2c2c2;
color: #424242;
font-size: 1.6em;
font-weight: normal;
}

#ctl00_maincontainer h2 {
 color: #3aa0ff;
 font-size: 1.35em;
 margin: 0px 0px 10px 0px;
 font-weight: normal;
}

#ctl00_maincontainer h3 {
 color: #003579;
 font-weight: bold;
 margin: 0px 0px 0px 0px
}

#ctl00_maincontainer h4 {
 color: #003579;
 font-size: 1.0em;
 font-weight: bold;
 margin: 0px 0px 0px 0px
}

#ctl00_mainarea_content1 h1,
#ctl00_mainarea_content1 h2 {
display: block;
width: 311px;
height: 50px;
text-align: center;
background: url(../images/home_h1.png) no-repeat top left;
border: 0;
color: #fff;
font-weight: normal;
padding: 14px 0px 0px 0px;
font-size: 1.4em;
margin:0px 0px 30px 0px;
float: left;
}

#ctl00_mainarea_content1 h2 {
margin:0px 24px 30px 0px;
float: right;
}

#ctl00_mainarea_content1 h1 a,
#ctl00_mainarea_content1 h2 a {
color: #fff;
}

#ctl00_maincontainer p {
 margin: 0px 0px 20px 0px;
 text-align: justify;
}

#ctl00_maincontainer a {
 color: #a31b35;
 font-weight: normal;
 text-decoration: none
}

#ctl00_maincontainer a:hover {
 text-decoration: underline
}

#ctl00_maincontainer strong {
 font-weight: bold;
}

#copyarea #ctl00_mainarea_content2.copy strong {
 font-weight: bold;
 color: #020202;
}

#ctl00_maincontainer em {
 font-style: italic
}

#ctl00_maincontainer ul {
 margin: 0px 0px 10px 20px;
 padding: 0px 0px 0px 0px
}

#ctl00_maincontainer ul li {
 list-style: none none;
 margin: 0px 0px 0px 0px;
 padding: 3px 0px 3px 23px;
 background: url(../images/bullet.gif) no-repeat left 11px;
}

#ctl00_maincontainer ol {
 list-style: decimal;
 margin: 0px 0px 10px 23px;
 padding: 0px 0px 0px 0px;
}

#ctl00_maincontainer ol li {
 list-style: decimal;
 padding: 0px 0px 10px 0px;
}

/* start to declare more specific stylings if required if they are slightly different to the base styles*/
/* a linked h2 needs to redeclared as the browser will use defaults for example*/


#copyarea #ctl00_mainarea_content2.copy ul.SiteMap {
 list-style: none;
}

#copyarea #ctl00_mainarea_content2.copy ul.SiteMap li {
 list-style: none; 
 background: none;
 padding: 2px 0px 2px 0px;
}

#copyarea #ctl00_mainarea_content2.copy ul.SiteMap li a strong {
 color: #a31b35;
}

#copyarea #ctl00_mainarea_content2.copy ul.contactAddress {
padding: 0px 0px 10px 0px;
margin:0px;
}

#copyarea #ctl00_mainarea_content2.copy ul.contactAddress li{
  list-style: none none;
  padding: 0px;
  margin: 0px;
  background:none;
}

#ctl00_mainarea_content1.page p{
margin:5px 0px 5px 0px;
}

/* ############################################# BLOG AREA STYLES ###################################*/

#categories h3 {
color: #fff;
background: url(../images/nav_bg.png) repeat-x left top;
height:29px;
padding: 5px 0px 0px 10px;
font-weight: normal;
}

#ctl00_mainarea_content2.copy p.blogTitle {
color: green;
font-size: 1.2em;
padding: 0px 0px 10px 0px;
margin:0px;
font-weight:bold;
}

#ctl00_mainarea_content2.copy p.blogComment {
padding: 0px 0px 10px 0px;
margin:0px;
}

#ctl00_mainarea_content2.copy p.dateTopic {
padding:0px;
margin:0px;
color:#7d7d7d;
font-size:0.9em;
}

/* ############################################# PRICE LIST STYLING ###################################*/

/* Style the group Name i.e 1 - Connectivity */
#ctl00_mainarea_content2.copy h2.price {
color: #424242;
padding: 0px 0px 0px 0px;
margin: 10px 0px 15px 0px;
font-size: 1.1em;
font-weight: normal;
width:680px;
text-align: left;
}

/* Style the Sub group i.e 1.1 DSL - ADSL */
#ctl00_mainarea_content2.copy h3.price {
color: #fff;
display: block;
height:27px;
background: url(../images/h2_price.png) repeat-x top left;
padding: 4px 0px 0px 10px;
margin: 0px 0px 0px 0px;
font-size: 1.2em;
font-weight: normal;
text-align: left;
border-right: solid 1px #fff;
}

/*table that contains the price list data*/
table.priceListTable {
float: left;
}

/* Style the text container below the sub group */
#ctl00_mainarea_content2.copy div.pricetext {
background: #f0f0f0;
padding: 10px;
text-align: left;
border-right: solid 1px #fff;
}

    /* Style the text below the sub group */
    #ctl00_mainarea_content2.copy div.pricetext p {
    color: #424242;
    }

/* Style the table that contains the price list data */
#ctl00_mainarea_content2.copy table.table {
width:680px;
font-size: 0.85em;
}

/* Center the text on all table cells */
#ctl00_mainarea_content2.copy table.table td {
text-align: center;
}

/* Style the individual price cells */
#ctl00_mainarea_content2.copy table td.priceRow {
background: #c3c3c3;
color: #3d3d3d;
padding: 2px 10px 2px 10px;
border-right: solid 1px #fff;
border-bottom: solid 1px #fff;
line-height:1.6em;

}

/* Style the description cells */
#ctl00_mainarea_content2.copy table td.descriptionRow {
background: #c3c3c3;
color: #3d3d3d;
padding: 2px 10px 2px 10px;
border-right: solid 1px #fff;
border-bottom: solid 1px #fff;text-align: left;
line-height:1.6em;
}

/* Style the Description name to bold  */
#ctl00_mainarea_content2.copy table td.descriptionRow span {
font-weight:bold;
line-height:1.6em;
}

#ctl00_mainarea_content2.copy ul.ulclass1,
#ctl00_mainarea_content2.copy ul.ulclass2,
#ctl00_mainarea_content2.copy ul.ulclass3,
#ctl00_mainarea_content2.copy ul.ulclass4 {
list-style: none none;
background:none;
padding: 0px;
margin:0px 0px 0px 0px;
width:230px;
float: left;
}

#ctl00_mainarea_content2.copy ul.ulclass1 li,
#ctl00_mainarea_content2.copy ul.ulclass2 li,
#ctl00_mainarea_content2.copy ul.ulclass3 li,
#ctl00_mainarea_content2.copy ul.ulclass4 li {
list-style: none none;
background:none;
padding: 0px;
margin:0px;
font-size:0.9em;
}

#ctl00_mainarea_content2.copy ul.ulclass1 li a.group,
#ctl00_mainarea_content2.copy ul.ulclass2 li a.group,
#ctl00_mainarea_content2.copy ul.ulclass3 li a.group,
#ctl00_mainarea_content2.copy ul.ulclass4 li a.group  {
font-weight:bold;

}

#ctl00_mainarea_content2.copy ul.ulclass1 li a.subgroup,
#ctl00_mainarea_content2.copy ul.ulclass2 li a.subgroup,
#ctl00_mainarea_content2.copy ul.ulclass3 li a.subgroup,
#ctl00_mainarea_content2.copy ul.ulclass4 li a.subgroup {
padding:0px 0px 0px 5px;
}





/*###################### STYLES FOR FOUR COLUMN TABLES #############################*/

/* Description Cell style, 4 column table */
#ctl00_mainarea_content2.copy table td.four_colf {
width:230px;
text-align: left;
background: #747474;
color: #fff;
padding: 5px 0px 5px 10px;
font-weight: bold;
}

/* Style the individual price cells on the top row, 4 column table */
#ctl00_mainarea_content2.copy table td.four_col {
text-align: center;
background: #747474;
color: #fff;
padding: 5px 0px 5px 0px;
font-weight: bold;
}

/* Style the information cell on the top row, 4 column table */
#ctl00_mainarea_content2.copy table td.four_coll {
width:190px;
background: #747474;
color: #fff;
padding: 5px 0px 5px 0px;
font-weight: bold;
border-right: solid 1px #fff;
}

/*###################### STYLES FOR FIVE COLUMN TABLES #############################*/

/* Description Cell style, 5 column table */
#ctl00_mainarea_content2.copy table td.five_colf {
width:220px;
text-align: left;
background: #747474;
color: #fff;
padding: 5px 0px 5px 10px;
font-weight: bold;
}

/* Style the individual price cells on the top row, 5 column table */
#ctl00_mainarea_content2.copy table td.five_col {
text-align: center;
background: #747474;
color: #fff;
padding: 5px 5px 5px 5px;
font-weight: bold;
}

/* Style the information cell on the top row, 5 column table */
#ctl00_mainarea_content2.copy table td.five_coll {
width:190px;
background: #747474;
color: #fff;
padding: 5px 0px 5px 0px;
font-weight: bold;
border-right: solid 1px #fff;
}

/*###################### STYLES FOR SIX COLUMN TABLES #############################*/

/* Description Cell style, 6 column table */
#ctl00_mainarea_content2.copy table td.six_colf {
text-align: left;
background: #747474;
color: #fff;
padding: 5px 0px 5px 10px;
font-weight: bold;
}

/* Style the individual price cells on the top row, 6 column table */
#ctl00_mainarea_content2.copy table td.six_col {
text-align: center;
background: #747474;
color: #fff;
padding: 5px 5px 5px 5px;
font-weight: bold;
}

/* Style the information cell on the top row, 6 column table */
#ctl00_mainarea_content2.copy table td.six_coll {
background: #747474;
color: #fff;
padding: 5px 0px 5px 0px;
font-weight: bold;
width:190px;
border-right: solid 1px #fff;
}


/* ############################################# QUOTE BOXES ###################################*/

/*styling for the quoteboxes and contents if that looks different to the base styling of swirl output*/
/*for example lists maybe different in the quote boxes than the main document*/
.quotes {
 color: #424242;
 font-size: 0.9em;
 line-height: 1.4em
}

.quotestop {
 color: #fff
}

.quotes p {
 margin: 0px 0px 10px 0px
}

#ctl00_maincontainer .quotes h4 {
 color: #7b7b7b;
 font-size: 0.9em;
 font-weight: normal;
 margin: 0px 0px 10px 0px
}

#copyarea .quotesmiddle ul {
padding: 0 0 10px 0;
margin:0px;
}

#copyarea .quotesmiddle ul li {
padding: 0px 0px 3px 20px;
margin:0px;
background: url(../images/bullet.gif) no-repeat left center;
list-style: none none;
color:#424242;
}

#copyarea .quotesmiddle ul li a {
color:#a31b35;
}

/*############################################## .NET PAGER STYLING ###############################*/

/*used for gridviews if used*/
#ctl00_maincontainer tr.pager a {
 color: #696969;
 height: 35px;
 padding: 0px 0px 0px 3px;
 text-decoration: underline;
 width: 11px
}

#ctl00_maincontainer tr.pager span {
 color: #005983
}
/* ################################### BREADCRUMB STYLES  #################################*/

#ctl00_mainarea_breadcrumb {
 color: #424242;
 font-size: 0.85em
}

#ctl00_mainarea_breadcrumb a {
 color: #424242;
 text-decoration: none;
 font-weight: normal;
}

#ctl00_mainarea_breadcrumb a:hover {
 text-decoration: underline
}


/*########################### NEWS PAGE ##################################*/

#copyarea #ctl00_mainarea_content2.copy span.newsoverview a.newsTitle:hover {
color: #020202;}


/*######################################FOOTER STYLES###############################*/

/* base footer styles, different footer elements maybe require extra declaration if different*/
#footer {
 color: #aebaca;
 font-size: 1.1em;
 line-height: 1.4em;
 text-align: right
}

#footer a {
 color: #aebaca;
 text-decoration: none
}

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

#footer ul.footerList li a{
color: #ababab;
padding:0px;
margin:0px;
}

#footer ul.footerList li a:hover{
color: #fff;
text-decoration: none;
}

ul.footerList li span.uppercase {
 text-transform: uppercase;
 font-weight: bold;
 color: #fff;
}

#footer ul.footerAddress li a {
color:#b31e3b;
text-decoration:none;
}

#footer ul.footerAddress li a:hover {
color:#b31e3b;
text-decoration:underline;
}

#footerLinks p,
#footerLinks p a,
#designBy p,
#designBy p a {
color: #3f3f3f;
text-decoration: none;
padding: 0px;
margin:0px;
}


#footerLinks p a:hover,
#designBy p a:hover {
color: #ccc;
text-decoration: none;

}

#clientLogos a img {
padding-right:32px;
padding-top:10px;
}

/*######################################## HOMEPAGE BOXES ##############################*/


.homeBox_Head p {
color: #fff;
padding: 0px;
font-size:1.2em;
}

#ctl00_mainarea_content1 .homeBox_Head p a {
color: #fff;
text-decoration: none;
}

#ctl00_mainarea_content1 .homeBox_Footer p {
color:#444242;
font-size:0.85em;
text-align: right;
padding: 0px;
}

/*################################################################################################
########################### FORM ELEMENTS STYLING ###############################################*/

#ctl00_maincontainer p.title_form_element {
 margin: 0;
 padding: 0px 15px 0px 0px;
 width: 70px;
 float: left;
 height: 40px;
 }
 
#ctl00_maincontainer p.name_form_element {
margin: 0;
padding: 0px 0px 0px 0px;
width: 230px;
float: right;
height: 40px;
}



/*creat a paragrapgh to conatin the label and textbox*/
#ctl00_maincontainer p.form_element {
 clear: left;
 margin: 0;
 padding: 0px 0px 0px 0px;
 width: 318px;
 height: 40px;
}
 
.drop {
font-size: 11px;
color: #424242;
background-color: #e5e5e5;
border: solid 1px #b4b3b3;
width: 70px;
height: 21px;
padding-top: 2px;
}

 
/*float a label of a certain width with the text aligned right to align the textbox perfectly next to 
the label, this will create a column effect*/
.form_element label,
.name_form_element label,
.title_form_element label,
.newsletterCont label {
 color: #646a6f;
 float: left;
 font-size: 11px;
 font-weight: normal;
 line-height: 15px;
 margin: 0px;
 margin-left: 0px;/*width of left column*/
 padding: 0px 0px 2px 0px;
 text-align: left;
 width: 230px/*width of labels. Should be smaller than left column (155px) to create some right margin*/
}

.form_element span label
{
 float: none;
 font-weight: normal;
}

/*textboxes are styled by using a class as ie 6 will not style them any other way.*/
.textboxes,
.nameTextbox,
.year {
 background-color: #e5e5e5;
 border: solid 1px #b4b3b3;
 color: #5e5e5e;
 font-size: 0.9em;
 height: 18px;
 margin: 0px 0px 0px 0px;
 padding: 0px 0px 0px 0px;
 vertical-align: top;
 width: 318px
}

.nameTextbox {
 width: 228px
}

/*Required field asterix*/
.asterix {
 color: #FF0000
}
/*used on a label if you need to display an error with a form, login for example*/
.error {
 color: #FF0000;
 font-weight: bold
}

textarea{
font-size:1.1em;
font-family: Tahoma;
}

.formColumn {
width: 320px;
height: auto;
float: left;
}

#topRow {
width: 320px;
float: left;
height: 40px;
}

.newsletterCont{
width: 220px;
float: left;
height: 25px;
margin-top:5px;
}

.newsletterCont label {
padding-top:10px;
width: 175px;
}

span.checkBox input#ctl00_mainarea_ctl18_chkPrivacy {
margin: 10px 0px 0px 0px;
padding: 0px 0px 0px 0px;
display: inline;
}

#formErrors{
width: 100%;
float: left;
text-align: left;
color: Green;
} 

.validationerror {
font-weight: bold;
background: url('../images/error_cross.gif') no-repeat;
background-position: left center;
padding:0px 0px 0px 20px;
margin:0px;
float: left;
}

/* ############################################### REGISTER ENQUIRIES FORM ###############################*/

.dateRow {
width: 320px;
height:30px;
padding: 0px;
float: left;
}

.dateCell {
width: 106px;
height: 25px;
float: left;
padding: 0px;
}

.checkCell {
width: 145px;
height: 25px;
float: left;
padding: 0 15px 0 0;
}

.dateRow label {
display: block;
float: left;
padding-right: 6px;
color: #646a6f;
font-size: 11px;
font-weight: normal;
line-height: 15px;
text-align: left;
}

.dateboxes {
 background-color: #e5e5e5;
 border: solid 1px #b4b3b3;
 color: #5e5e5e;
 font-size: 0.9em;
 height: 18px;
 margin: 0px 0px 0px 0px;
 padding: 0px 0px 0px 0px;
 vertical-align: top;
 width: 70px
}

span.checkBox input#ctl00_mainarea_ctl04_chkInvoice,
span.checkBox input#ctl00_mainarea_ctl04_chkStatement {
margin: 2px 0px 0px 0px;
padding: 0px 0px 0px 0px;
display: inline;
}

span.checkBox input#ctl00_mainarea_ctl04_chkStatic,
span.checkBox input#ctl00_mainarea_ctl04_chkPop,
span.checkBox input#ctl00_mainarea_ctl04_chkFtp,
span.checkBox input#ctl00_mainarea_ctl04_chkSpace,
span.checkBox input#ctl00_mainarea_ctl04_chkRouter,
span.checkBox input#ctl00_mainarea_ctl04_chkSmtp {
margin: 2px 0px 0px 0px;
padding: 0px 0px 0px 0px;
display: inline;
float: right;
}



/* ############################################### DSL ORDER FORM ###############################*/

 .dslDrop {
 font-size: 11px;
 color: #424242;
 border: solid 1px #b4b3b3;
 background: #e5e5e5;
 height: 21px;
 padding-top: 2px;
 width: 250px;
 }
 
#ctl00_mainarea_content2.copy p.formSection {
 color: #424242;
 border-bottom: solid 1px #b4b3b3;
 font-weight: bold;
 margin: 10px 0 10px 0;
 float: left;
 width: 100%;
 }
 
/* ############################################### IP JUSTIFICATION FORM ###############################*/
 
#ctl00_maincontainer table#ctl00_mainarea_ctl04_radio1,
#ctl00_maincontainer table#ctl00_mainarea_ctl04_radio2,
#ctl00_maincontainer table#ctl00_mainarea_ctl04_radio3
{
padding: 0px;
margin: 0px;
font-size: 11px;
}

#ctl00_maincontainer p.height{
height: 20px;
}

.year {
width: 128px;
}

.IProw {
height: 40px;
}

.IPcell {
float: left;
width: 140px;
}

.IPcell p {
color: #646a6f;
font-size: 11px;
font-weight: normal;
text-align: left;
padding: 15px 0 0 0;
display: block;
height: 5px;
margin: 0px;
}


/* ############################################### EXPANDABLE BOXES ###############################*/

/*Styling for the things you click on*/
#ctl00_maincontainer a.MenuTop {
 background: url('../images/expand.jpg') no-repeat;
 border-bottom: none;
 cursor: pointer;
 display: block;
 font-weight: bold;
 padding: 3px 0px 3px 30px;
 width: 670px
}
/*by default a link underlines on hover, turn it off!*/
#ctl00_maincontainer a.MenuTop:hover {
 text-decoration: none
}
/*class to change too when clicked*/
#ctl00_maincontainer a.MenuTopon {
 background: url('../images/collapse.jpg') no-repeat;
}
/*container for the expandable content*/
.expandable_box {
 border: solid 0px #000;
 padding: 10px;
 width: 660px
}


/*##################################################################################################*/
/* Login Boxes */
/*##################################################################################################*/               

#login_box ul
{
padding: 0px;
margin: 0px;
}

#login_box ul li
{
margin:0px 0px 0px 0px;
padding:0px;
list-style-image:none;
background: none;
}

#login_box ul li a
{
background:none;
padding: 0px;
}

#login_box ul li a:hover
{
background:none;
padding: 0px;
}

.login_boxes {
height:18px;
width:160px;
border:solid 1px #b5b5b5;
}

hr {
padding:0px;
margin:0px;
}





#copyarea p.centre {
 text-align: center;
}