﻿*{margin:0;padding:0;}
.left ul, .right ul{list-style-type:none;margin-left:0px;}
body{color:#FFFFFF;font-family:Verdana;font-smooth:always;font-size:12px;background-image:url('http://static.nickjohnston.co.uk/Images/stripe_bg.png');z-index:0;}
.smaller{font-size:smaller;}
.clear{height:1px;overflow:hidden;margin-top:-1px;clear:both;}
h2
{
    border-bottom-color: #EEE;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    border-left-color: #EEE;
    border-left-style: none;
    border-left-width: 0px;
    border-right-color: #EEE;
    border-right-style: none;
    border-right-width: 0px;
    border-top-color: #EEE;
    border-top-style: none;
    border-top-width: 0px;
    color: #FF9900;
    display: block;
    font-size: 14px;
    font-weight: bold;
    height: 21px;
    line-height: 21px;
    margin-bottom: 12px;
    margin-left: 0px;
    margin-right: 0px;
    margin-top: 7px;
    padding-bottom: 0px;
    padding-left: 0px;
    padding-right: 0px;
    padding-top: 0px;
    text-shadow: #CCC 1px 1px 1px;
}
h1
{
    color: #FF9900;
    display: block;
    font-size: 18px;
    font-weight: bold;
    line-height: 21px;
    margin-bottom: 12px;
    margin-left: 0px;
    margin-right: 0px;
    margin-top: 7px;
    padding-bottom: 0px;
    padding-left: 0px;
    padding-right: 0px;
    padding-top: 0px;
    text-shadow: #CCC 1px 1px 1px;
}
h3
{
    color: #FF9900;
    display: block;
    font-size: 12px;
    font-weight: bold;
    height: 12px;
    line-height: 12px;
    margin-bottom: 12px;
    margin-left: 0px;
    margin-right: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
    padding-right: 0px;
    padding-top: 0px;
    text-shadow: #CCC 1px 1px 1px;
}
legend
{
    color: #FF9900;
    display: block;
    font-size: 12px;
    font-weight: bold;
    margin-left: 0px;
    margin-right: 0px;
    margin-top: 7px;
    padding-bottom: 0px;
    padding-left: 0px;
    padding-right: 0px;
    padding-top: 0px;
    text-shadow: #CCC 1px 1px 1px;
}
.orange, .orange:visited
{
    color: #FF9900;
}
.orange:hover, .orange:hover:visited
{
    color: #CC3300;
}
.headerspace{margin:10px 0px 20px 0px;}
.subheaderspace{margin:20px 0px 0px 0px;}
.innerpad{padding:0 15px;}
.container{margin:185px auto 20px auto;border-style:none solid solid solid;border-width:1px;border-color:#FFFFFF;width:900px;background-color:#FFFFFF;color:#333333;padding-top:15px;padding-right:15px;padding-left:15px;}
a, a:visited{color:#333333;text-decoration:underline;}
a:hover, a:visited:hover{color:#666666;}
h1{padding:0px;margin:10px 0px 20px 0px;text-align:center;font-size:20px;}
.flt{float:right;margin-left:10px;margin-bottom:10px;}
.articlehead{background-image:url('http://static.nickjohnston.co.uk/Images/carbon-fibre.png');height:140px;background-position:center;z-index:1;position:absolute;top:45px;right:0px;left:0px;}
.header{text-align:center;z-index:10;vertical-align:top;position:absolute;left:0;right:0;top:10px;}
.stlist{margin-left:25px;margin-top:10px;margin-bottom:10px;}
.stlist li{padding-top:2px;padding-bottom:2px;}
p{margin-top:10px;margin-bottom:10px;}
.transparent{filter:alpha(opacity=50);-moz-opacity:0.5;-khtml-opacity:0.5;opacity:0.5;}
.content{
    margin-right: -350px;
    float: left;
    width: 560px;
    font-size: 14px;
    margin-bottom: 15px;
}
.rightcolumn{float:right;width:330px;text-align:right;}
.footer{clear:both;font-size:10px;}
ul{margin-left:50px;list-style-type:circle;}
ul li{margin-top:5px;margin-bottom:5px;}
.wsub{margin-bottom:5px;}
hr{border-style:dotted none none none;border-width:1px;border-color:#333333;float:none;display:block;color:#FFFFFF;}
abbr{text-decoration:blink;}
.formlabel{display:inline-block;width:100px;text-align:right;padding-right:15px;vertical-align:top;}
.rightcolumn h2, .rightcolumn h3{text-align:right;}
.grey{color:#808080;}
.rightcolumn p{margin:0px;}
.padblock
{
    border: 1px solid #C0C0C0;
    margin-bottom: 10px;
    margin-left: 10px;
    width: 300px;
    padding: 10px;
}
.blox{width:440px;margin-bottom:10px;height:280px;}
.col{width:440px;}
.strikethrough{text-decoration:line-through;}
.hidden{display:none;}
#prevNext{margin-bottom:-2.5em;}
#prevNext img{position:relative;z-index:2;cursor:pointer;}
#slides div p{margin:0;padding:0 1em;position:relative;top:-50px;line-height:50px;height:50px;background:black;color:White;opacity:.7;filter:alpha(opacity=70);}
.left{float:left;}
.right{float:right;text-align:right;}
.galleria{list-style:none;width:200px;}
.galleria li{display:block;width:80px;height:80px;overflow:hidden;float:left;margin:0 10px 10px 0;}
.galleria li a{display:none;}
.galleria li div{position:absolute;display:none;top:0;left:180px;}
.galleria li div img{cursor:pointer;}
.galleria li.active div img, .galleria li.active div{display:block;}
.galleria li img.thumb{cursor:pointer;top:auto;left:auto;display:block;width:auto;height:auto;}
.galleria li .caption{display:block;padding-top:.5em;}
* html .galleria li div span{width:400px;}
.caption{font-style:italic;color:#887;}
.demo{position:relative;margin-top:2em;}
.gallery_demo{width:802px;margin:0 auto;}
.gallery_demo li{width:65px;height:65px;border:3px double #111;margin:0 2px 10px 2px;background:#000;}
.gallery_demo li div{left:240px;}
.gallery_demo li div .caption{font:italic 0.7em/1.4 georgia,serif;}
#main_image{margin:0 auto 50px auto;height:500px;width:800px;background:black;}
#main_image img{margin-bottom:10px;}
.info{text-align:left;width:800px;margin:30px auto;border-top:1px dotted #221;padding-top:30px;}
.info p{margin-top:1.6em;}
#portfolio{list-style-type:none;padding:0px;margin:0px;}
.rightcolumn ol
{
    margin-left: 15px;
    list-style-position: outside;
}
.nopad{}
.topper{margin-right:auto;margin-left:auto;width:900px;text-align:left;}
.coldom{float:left;width:300px;margin-bottom:25px;}
.formbutton{font-family:Arial, Helvetica, sans-serif;font-size:16px;font-style:normal;background-color:#F7F7F7;width:auto;margin:8px 2px 2px 2px;border-top:1px solid #999999;border-right:1px solid #AAB3B3;border-bottom:1px solid #D5DDDD;border-left:1px solid #AAB3B3;}
.formbox{font-family:Arial, Helvetica, sans-serif;font-size:16px;font-style:normal;width:auto;margin:8px 2px 2px 2px;border-top:1px solid #999999;border-right:1px solid #AAB3B3;border-bottom:1px solid #D5DDDD;border-left:1px solid #AAB3B3;}
.lgform{font-size:18px;}
.watermark{color:#999999;font-family:Arial, Helvetica, sans-serif;font-size:18px;font-style:normal;width:auto;margin:8px 2px 2px 2px;border-top:1px solid #999999;border-right:1px solid #AAB3B3;border-bottom:1px solid #D5DDDD;border-left:1px solid #AAB3B3;}
.ui-helper-hidden{display:none;}
.ui-helper-hidden-accessible{position:absolute;left:-99999999px;}
.ui-helper-reset{margin:0;padding:0;border:0;outline:0;line-height:1.3;text-decoration:none;font-size:100%;list-style:none;}
.ui-helper-clearfix:after{content:".";display:block;height:0;clear:both;visibility:hidden;}
.ui-helper-clearfix{display:inline-block;}
* html .ui-helper-clearfix{height:1%;}
.ui-helper-clearfix{display:block;}
.ui-helper-zfix{width:100%;height:100%;top:0;left:0;position:absolute;opacity:0;filter:Alpha(Opacity=0);}
.ui-state-disabled{cursor:default !important;}
.ui-icon{display:block;text-indent:-99999px;overflow:hidden;background-repeat:no-repeat;}
.ui-widget-overlay{position:absolute;top:0;left:0;width:100%;height:100%;}
.ui-tabs{padding:.2em;zoom:1;}
.ui-tabs .ui-tabs-nav{list-style:none;position:relative;padding:.2em .2em 0;}
.ui-tabs .ui-tabs-nav li{position:relative;float:left;border-bottom-width:0 !important;margin:0 .2em -1px 0;padding:0;}
.ui-tabs .ui-tabs-nav li a{float:left;text-decoration:none;padding:.5em 1em;}
.ui-tabs .ui-tabs-nav li.ui-tabs-selected{padding-bottom:1px;border-bottom-width:0;}
.ui-tabs .ui-tabs-nav li.ui-tabs-selected a, .ui-tabs .ui-tabs-nav li.ui-state-disabled a, .ui-tabs .ui-tabs-nav li.ui-state-processing a{cursor:text;}
.ui-tabs .ui-tabs-nav li a, .ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a{cursor:pointer;}
.ui-tabs .ui-tabs-panel{padding:1em 1.4em;display:block;border-width:0;background:none;}
.ui-tabs .ui-tabs-hide{display:none !important;}
.ui-widget{font-family:Verdana,Arial,sans-serif;font-size:1.1em;}
.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button{font-family:Verdana,Arial,sans-serif;font-size:1em;}
.ui-widget-content{border:1px solid #aaaaaa;background:#ffffff;color:#222222;}
.ui-widget-content a{color:#222222;}
.ui-widget-header{border:1px solid #aaaaaa;background:#cccccc;color:#222222;font-weight:bold;}
.ui-widget-header a{color:#222222;}
.ui-state-default, .ui-widget-content .ui-state-default{border:1px solid #d3d3d3;background:#e6e6e6;font-weight:normal;color:#555555;outline:none;}
.ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited{color:#555555;text-decoration:none;outline:none;}
.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus{border:1px solid #999999;background:#dadada;font-weight:normal;color:#212121;outline:none;}
.ui-state-hover a, .ui-state-hover a:hover{color:#212121;text-decoration:none;outline:none;}
.ui-state-active, .ui-widget-content .ui-state-active{border:1px solid #aaaaaa;background:#ffffff;font-weight:normal;color:#212121;outline:none;}
.ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited{color:#212121;outline:none;text-decoration:none;}
.ui-state-highlight, .ui-widget-content .ui-state-highlight{border:1px solid #fcefa1;background:#fbf9ee;color:#363636;}
.ui-state-highlight a, .ui-widget-content .ui-state-highlight a{color:#363636;}
.ui-state-error, .ui-widget-content .ui-state-error{border:1px solid #cd0a0a;background:#fef1ec;color:#cd0a0a;}
.ui-state-error a, .ui-widget-content .ui-state-error a{color:#cd0a0a;}
.ui-state-error-text, .ui-widget-content .ui-state-error-text{color:#cd0a0a;}
.ui-state-disabled, .ui-widget-content .ui-state-disabled{opacity:.35;filter:Alpha(Opacity=35);background-image:none;}
.ui-priority-primary, .ui-widget-content .ui-priority-primary{font-weight:bold;}
.ui-priority-secondary, .ui-widget-content .ui-priority-secondary{opacity:.7;filter:Alpha(Opacity=70);font-weight:normal;}
.ui-corner-tl{-moz-border-radius-topleft:4px;-webkit-border-top-left-radius:4px;}
.ui-corner-tr{-moz-border-radius-topright:4px;-webkit-border-top-right-radius:4px;}
.ui-corner-bl{-moz-border-radius-bottomleft:4px;-webkit-border-bottom-left-radius:4px;}
.ui-corner-br{-moz-border-radius-bottomright:4px;-webkit-border-bottom-right-radius:4px;}
.ui-corner-top{-moz-border-radius-topleft:4px;-webkit-border-top-left-radius:4px;-moz-border-radius-topright:4px;-webkit-border-top-right-radius:4px;}
.ui-corner-bottom{-moz-border-radius-bottomleft:4px;-webkit-border-bottom-left-radius:4px;-moz-border-radius-bottomright:4px;-webkit-border-bottom-right-radius:4px;}
.ui-corner-right{-moz-border-radius-topright:4px;-webkit-border-top-right-radius:4px;-moz-border-radius-bottomright:4px;-webkit-border-bottom-right-radius:4px;}
.ui-corner-left{-moz-border-radius-topleft:4px;-webkit-border-top-left-radius:4px;-moz-border-radius-bottomleft:4px;-webkit-border-bottom-left-radius:4px;}
.ui-corner-all{-moz-border-radius:4px;-webkit-border-radius:4px;}
.padding{padding:10px;}
.leftalign
{
    text-align: left;
}
.large
{
    font-size: large;
}
.vertcentre
{
    vertical-align: middle;
    margin-bottom: 0.2em;
}
.frontslide
{
    background-image: url('http://static.nickjohnston.co.uk/Images/front-detail-slide.png');
    width: 565px;
    height: 358px;
    position: relative;
}
.frontlinks
{
    position: absolute;
    top: 39px;
    left: 15px;
    width: 300px;
}
.frontlink
{
    height: 26px;
    width: 300px;
    float: left;
}
.frontlink:hover
{
    background-image: url('../Images/NJLogo_Tiny.png');
    background-position: -0px center;
    background-repeat: no-repeat;
}
.frontlargelinks
{
    position: absolute;
    top: 195px;
    left: 15px;
    width: 430px;
}
.frontlargelink
{
    height: 50px;
    width: 430px;
    float: left;
}
.nolist
{
    list-style-type: none;
}
.subtitlespace
{
margin-bottom: 15px;
}
.centre
{
    text-align: center;
}
a img
{
border: none;
border-width: 0px;
}

#pad {height:140px;}
#menu {
	padding: 0;
	margin: 0 auto;
	list-style: none;
	height: 22px;
	position: relative;
	z-index: 500;
	font-family: arial, verdana, sans-serif;
	width: 930px;
}
#menu li {float:left; margin-right:0px;}
#menu li a
{
margin: 0;
    display: block;
    text-decoration: bold;
    float: left;
    height: 22px;
    line-height: 22px;
    background: rgba(33, 22, 7, 0.8);
    color: #fff;
    text-decoration: none;
    font-size: 13px;
    font-weight: bold;
    padding: 0 10px;
    -webkit-transition: background 0.3s linear;
    border-radius: 3px;
}

#menu table {border-collapse:collapse; width:0; height:0; position:absolute; top:0; left:0;}

#menu li a:hover {
	z-index: 200;
	position: relative;
	color: #fff;
	background-color: #ff9900;
}
#menu li:hover {position:relative; z-index:200;}

#menu li:hover > a {
	color: #fff;
	background: #ff9900;
}
#menu li:hover > a.sub {
	color: #fff;
	background-color: #ff9900;
}

#menu li.current a {color:#fff; background:#840;}

#menu li a.sub {
    background: rgba(33, 22, 7, 0.5);
}
#menu li.current a.sub
{
	color: #fff;
	background: #333333;
}

#menu :hover ul {left:0; top:20px; width:120px; background:#444;}

/* keep the 'next' level invisible by placing it off screen. */
#menu ul, 
#menu :hover ul ul {position:absolute; left:-9999px; top:-9999px; width:0; height:0; margin:0; padding:0; list-style:none;}

#menu :hover ul :hover ul
{
    left: 120px;
    top: -1px;
    background: rgba(33, 22, 7, 0.5);
    white-space: nowrap;
    width: 100px;
    z-index: 200;
    height: auto;
    -webkit-transition: background 0.5s linear;
}

#menu :hover ul li {
	margin: 0px;
	padding-top: 2px;
	/*border-top: 1px solid #666;
	border-top-color: #333333;*/
    border-radius: 3px;
}
#menu :hover ul li a {
    width: 195px;
    padding: 0;
    text-indent: 10px;
    background: rgba(33, 22, 7, 0.398438);
    color: #FFFFFF;
    height: 22px;
    line-height: 22px;
    text-align: left;
}
#menu :hover ul li a.fly {
    background: rgba(33, 22, 7, 0.398438);
}

#menu :hover ul :hover {
	background-color: #ff9900;
	color: #fff;
}
#menu :hover ul :hover a.fly {
	background-color: #ff9900;
	color: #fff;
}

#menu :hover ul li.currentsub a {background:#840; color:#fff;}
#menu :hover ul li.currentsub a.fly
{
	background: #ff9900;
	color: #fff;
}

#menu :hover ul :hover ul li a
{
    width: 100px;
    padding: 0;
    text-indent: 10px;
    background: rgba(33, 22, 7, 0.398438);
    color: #FFFFFF;
}
#menu :hover ul :hover ul :hover {
	background-color: #ff9900;
	color: #fff;
}

#menu :hover ul :hover ul li.currentfly a,
#menu :hover ul :hover ul li.currentfly a:hover {background:#840; color:#fff;}
.italic
{
    font-style: italic;
}