/***** Nevett and Taylor - Yellow and Black CSS (Yellow and Black) *****/

/***** Global Settings *****/
html, body {
border:0;
margin:0;
padding:0;
text-align:center;
background-color:#000;
color: #ffff00;
font-size:12px; /* Use to stop font jump of font changer */
}
 
body {
font:100%/0.9 Arial, Helvetica, sans-serif;
}
 
/***** Headings *****/
 
h1, h2, h3, h4, h5, h6 {
margin:0;
padding:10px 0 10px 0px;
width:auto;
font-weight:normal;
color:#ffff00;
}
 
h1 {
font-size:2.17em;
text-align:left;
}

h1.services{
font-size:1.67em;
text-align:left;
width:136px;
height:auto;
padding:5px;
color:#000;
}

h2 {
font-size:1.67em;
font-style:italic;
text-align:left;
}

h3 {
font-size:1.33em;
text-align:left;
}

h4 {
font-size:1em;
font-weight:bold;
text-align:left;
}

/***** Common Formatting *****/
 
p{
margin:0;
padding:10px 15px 10px 0px;
width:auto;
text-align:justify;
font-weight:normal;
font-size:1em;
line-height:150%;
}

p.copyright{
margin:0;
padding:0;
width:auto;
text-align:left;
font-weight:normal;
font-size:1em;
}

p.service{
margin:0;
padding:0;
width:153px;
text-align:left;
font-weight:normal;
font-size:1em;
}

p.fontchange{
margin:0;
padding:10px;
width:auto;
text-align:left;
font-weight:bold;
font-size:1em;
}

p.noscript{
margin:0px auto;
padding:10px;
width:857px;
text-align:center;
font-weight:bold;
font-size:1em;
color:#ffff00;
background-color:#000;
}

p.designedby{
margin:0;
padding:0;
width:auto;
text-align:right;
font-weight:normal;
font-size:1em;
color:#ffff00;
}

/***** Ordered Lists *****/ 
ul{
padding:0;
margin:0;
line-height:100%;
}

ul li{
list-style:none;
}

/* Unordered lists - Body content */
ul.body{
padding-left:20px;
margin:0;
line-height:100%;
color:#ffff00;
}

ul.body li.body{
padding:5px 0 5px 10px;
list-style:disc;
}

/* Ordered lists - Body content */
ol.body{
padding-left:30px;
margin:0;
line-height:100%;
}

ol.body li.body{
padding:5px 0 5px 10px;
}

/* Main Navigation */
#navi ul.main{
position:relative;
margin:0px auto;
padding:0;
height:auto;
width:auto;
display:inline;
color:#ffff00;
}

#navi li.main{
list-style: none;
display:inline;
height:auto;
width:100%;
padding:0;
margin:1px;
}

#navi ul.main li.main a{
width:100%;
height:auto;
padding:10px 13px 10px 12px;
text-decoration:none;
font-size:12px;
font-weight:bold;
background-color:#ffff00;
color:#000;
}

#navi ul.main li.main a:hover{
width:100%;
height:auto;
padding:10px 13px 10px 12px;
background-color:#000;
color:#ffff00;
}

/* Sub Navigation */
#sub_navi ul.sub{
position:relative;
padding:0;
height:auto;
width:163px;
display:block;
color:#ffff00;
}

#sub_navi li.sub{
list-style: none;
display:block;
height:auto;
width:163px;
padding:10px 0 10px 10px;
border-bottom:1px solid #ffff00;
}

#sub_navi ul.sub li.sub a{
width:130px;
height:auto;
text-decoration:none;
font-size:1em;
font-weight:normal;
color:#ffff00;
padding-left:10px;
}

#sub_navi ul.sub li.sub a:hover{
width:130px;
height:auto;
color:#ffff00;
text-decoration:underline;
padding-left:10px;
}

#sub_active{
width:163px;
height:30px;
font-size:1em;
font-weight:bold;
padding:10px 0 0 10px;
border-bottom:1px solid #ffff00;
background-color:#ffff00;
color:#000;
list-style-type:none;
}

/* Style Sheet Selector */
#style_selector ul.style{
position:relative;
padding:0;
height:auto;
width:163px;
display:block;
color:#ffff00;
}

#style_selector li.style{
list-style: none;
display:block;
height:auto;
width:100%;
padding:10px 0 10px 10px;
border-bottom:1px solid #ffff00;
line-height:150%;
}

#style_selector ul.style li.style a{
width:143px;
height:auto;
text-decoration:none;
font-size:1em;
font-weight:normal;
color:#ffff00;
}

#style_selector ul.style li.style a:hover{
width:143px;
height:auto;
color:#ffff00;
text-decoration:underline;
}

#style_header{
width:163px;
height:30px;
font-size:1em;
font-weight:bold;
padding:10px 0 0 10px;
border-bottom:1px solid #ffff00;
background-color:#ffff00;
list-style-type:none;
color:#000;
}

/* Top Bar Navigation */
#topbar ul#top{
margin:0;
padding:0;
height:auto;
display:inline;
}

#topbar li.top{
margin:0;
padding:0;
list-style: none;
display:inline;
height:auto;
width:100%;
}

#topbar ul#top li.top a{
width:100%;
height:auto;
padding:10px;
margin:0;
font-size:1em;
font-weight:normal;
}

#topbar ul#top li.top a:hover{
width:100%;
height:auto;
padding:10px;
margin:0;
}

/* Side By Side Meet The Team */
#sideleft{
width:300px;
margin:0 15px 0 0;
height:auto;
float:left;
}

#sideright{
width:300px;
margin:0 0 0 15px;
height:auto;
float:left;
}

/* Footer Navigation */
#footer_nav ul.ftr{
position:relative;
margin:0px auto;
padding:0;
height:auto;
width:auto;
display:inline;
}

#footer_nav li.ftr{
list-style: none;
display:inline;
height:auto;
width:100%;
padding:0;
}

#footer_nav ul.ftr li.ftr a{
width:100%;
height:auto;
padding:2px;
font-size:1em;
font-weight:normal;
}

#footer_nav ul.ftr li.ftr a:hover{
width:100%;
height:auto;
padding:2px;
}

/**** Image / Thumbnails *****/ 
img {
border:0;
margin:0;
padding:0;
}

img.cntr{
display:block;
margin:auto;
}

/***** Spans ****/
span.bold{
font-weight:bold;
}

span.accesskey{
text-decoration:underline;
font-weight:bold;
}

/***** Links *****/

a.ftr:link {text-decoration:underline; color:#ffff00;}
a.ftr:visited {text-decoration:underline; color:#ffff00;}
a.ftr:hover {text-decoration:underline; color:#ffff00;}
a.ftr:active {text-decoration:underline; color:#ffff00;}

a.top:link {text-decoration:underline; color:#ffff00;}
a.top:visited {text-decoration:underline; color:#ffff00;}
a.top:hover {text-decoration:underline; color:#ffff00;}
a.top:active {text-decoration:underline; color:#ffff00;}

a.by:link {text-decoration:underline; color:#ffff00;}
a.by:visited {text-decoration:underline; color:#ffff00;}
a.by:hover {text-decoration:underline; color:#ffff00;}
a.by:active {text-decoration:underline; color:#ffff00;}

a.services:link {text-decoration:underline; color:#ffff00;}
a.services:visited {text-decoration:underline; color:#ffff00;}
a.services:hover {text-decoration:underline; color:#ffff00;}
a.services:active {text-decoration:underline; color:#ffff00;}

a:link {text-decoration:underline; color:#ffff00;}
a:visited {text-decoration:underline; color:#ffff00;}
a:hover {text-decoration:underline; color:#ffff00;}
a:active {text-decoration:underline; color:#ffff00;}

a.nav:link {color:#ffff00;}
a.nav:visited {color:#ffff00;}
a.nav:hover {color:#ffff00;}
a.nav:active {color:#ffff00;}

/***** Forms *****/
form {
margin:0;
padding:0;
display:inline;
padding:10px;
}
 
input, select, textarea {
font-family: Arial, Helvetica, sans-serif;
display:inline;
margin-bottom:10px;
float:left;
}
 
textarea {
line-height:1.25;
font-size:1em;
display:inline;
margin-bottom:10px;
width:200px;
float:left;
}
 
label {
cursor:default;
font-size:1.33em;
color:#ffff00;
padding:0 50px 10px 0;
width:230px;
float:left;
}

.button {
background:#ffff00;
padding:5px;
color:#000;
border:none;
font-size:1.33em;
}

fieldset{
padding:10px 0 10px 0;
border:none;
}

legend{
font-size:1.67em;
font-style:italic;
color:#ffff00;
margin-bottom:10px;
}
 
/***** Global Classes *****/
 
.clear         { clear:both; }
.float-left    { float:left; }
.float-right   { float:right; }
 
.text-left     { text-align:left; }
.text-right    { text-align:right; }
.text-center   { text-align:center; }
.text-justify  { text-align:justify; }
 
.bold          { font-weight:bold; }
.italic        { font-style:italic; }
.underline     { border-bottom:1px solid; }
.highlight     { background:#ffc; }
 
.img-left      { float:left;}
.img-right     { float:right;}
 
.nopadding     { padding:0; }
.noindent      { margin-left:0;padding-left:0; }
.nobullet      { list-style:none;list-style-image:none; }


/* Main Website Layout */

/* Container - holds all web content */

#container{
position:relative;
width:877px;
min-height:100%;
height:auto;
margin:0px auto;
text-align:left;
background-color:#000;
}

/* Header */
#header{
width:877px;
height:265px;
background:url(../images/header/header.jpg) no-repeat;
}

#topbar{
position:relative;
width:877px;
height:30px;
margin:0px auto;
padding-top:10px;
text-align:right;
background-color:#000;
color:#ffff00;
}

/* Nevett Taylor Logo */
#logo{
position:relative;
top:23px;
width:150px;
height:126px;
background-repeat:no-repeat;
}

/* Main Navigation*/
#navi{
position:absolute;
width:auto;
height:auto;
left: 18px;
top: 282px;
}

/* Left Hand Side Container - hold Side Button */
#lhs{
float:left;
width:173px;
height:auto;
background-color:transparent;
margin:10px 10px 5px 10px;
}

/* Sub LHS Navigation */
#sub_navi{
width:153px;
height:auto;
margin-bottom:10px;
}

/* Stylesheet selector */
#style_selector{
width:153px;
height:auto;
margin: 20px 0 0 0;
}

/* Accessibility Conformance */
#conformance{
width:153px;
height:auto;
margin: 20px 0 20px 0;
}

/* Body Content */
#body_content{
position:relative;
top:3px;
width:840px;
height:auto;
margin:0px auto;
text-align:left;
background-color:#000;
}

/* RHS Body Content */
#rhs_body_content{
width:635px;
height:auto;
float:right;
margin:10px 0px 10px 0px;
}

/* Services Selectors */
.service{
margin:0 5px 0 0;
width:153px;
height:auto;
float:left;
}

#service_computer{
margin:5px 0 0 0;
width:153px;
height:100%;
background-color:#ffff00;
}

#service_sports{
margin:5px 0 0 0;
width:153px;
height:100%;
background-color:#ffff00;
}

#service_business{
margin:5px 0 0 0;
width:153px;
height:100%;
background-color:#ffff00;
}

#service_travel{
margin:5px 0 0 0;
width:153px;
height:100%;
background-color:#ffff00;
}

.service_text{
margin:10px 0 20px 0;
width:153px;
height:100%;
}
 
/* Contact Form layout */
.form_element_label{
width: 200px;
height:auto;
float:left;
left:48px;
padding-bottom:10px;
}

.form_element{
position:relative;
width: auto;
height:auto;
float:left;
left:100px;
padding-bottom:10px;
}

/* Footer */
#footer{
position:relative;
bottom:0;
width:842px;
margin:0px auto;
height:105px;
margin-top:10px;
}

#copyright_text{
float:left;
width:auto;
height:auto;
}

#footer_nav{
float:right;
width:auto;
height:auto;
color:#ffff00;
}

#designedby{
width:auto;
height:auto;
float:right;
color:#ffff00;
margin-top:3px;
}

/* Important Message or links */

.message{
width:155px;
height:auto;
padding:10px;
background-color:#ffff00;
margin:10px 0 10px 0;
}

.message:hover{
background-color:#ffff00;
}

.message a{
width:auto;
color:#000;
font-size:1.6em;
text-decoration:none;
}

.message a:hover{
width:auto;
color:#000;
font-size:1.6em;
text-decoration:none;
}

.message a:active{
width:auto;
color:#000;
font-size:1.6em;
text-decoration:none;
}

.message a:visited{
width:auto;
color:#000;
font-size:1.6em;
text-decoration:none;
}


/******* FONT SIZER CSS *******/

.fontResizer{
display:block;
margin:0 0 10px 10px;
}

.fontResizer a{
display:block;
float:left; 
width:17px; 
height:17px; 
text-align:center; 
border:1px solid #ffff00; 
line-height:15px; 
text-decoration: none; 
}

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

/* 
The following control the way the font-resizer links appear only 
Set the actual size-changes in the function call
*/

.smallFont{
font-size:9px; 
}

.medFont{
font-size:12px;
}

.largeFont{
font-size:16px; 
}

.curFont{
background:#000;
}