/* General */
* { padding: 0; margin: 0; }
body { font-family: 'Lucida Grande', 'Lucida Sans Unicode', Verdana, sans-serif; font-size: 0.7em; color: #000000;}
a:link { text-decoration: none; color: #000000; }
a:visited { color: #000000; text-decoration: none; }
a:hover { color: #666666; text-decoration: none; }
a:active { color: #333333; }
p { margin-bottom: 2em; line-height: 1.8em; color: #444444; }
h1 { font-size: 1.5em; margin-bottom: 1em; color: #444444; }
h2 { font-size: 1.2em; margin-bottom: 1em; color: #119DDC; }
h3 { font-size: 1.2em; margin-bottom: 0.5em; }
h2 a:link { color: #0E88BF; text-decoration:none !important; }
h2 a:hover { color: #0E88BF; text-decoration:none !important; }
h2 a:visited { color: #0E88BF; text-decoration:none !important; }
h3 a:link { color: #bbb; text-decoration:none; }
h3 a:hover { color: #bbb; text-decoration:none; }
h3 a:visited { color: #bbb; text-decoration:none; }
img { border:none; }
.frontText { color:#000000; font-size: 1.2em; margin-bottom: 1em; }
hr { color:#CCCCCC }
input, textarea { background-image: url(../images/planner/form-bg.png); background-repeat:repeat-x; padding: 10px 5px 10px 5px; color: #000;  border: solid 1px #B2B2B2; }

/* General Layout */
#globalContainer { overflow:hidden;  background-repeat: repeat-x; background-image: url(../images/core/generalBg.png); }
.contentContainer{ margin: 0px auto 0px auto; width:944px; clear: both; }
.imageSmallBorder { border: 3px solid #D2D2D2 !important; width: 199px; margin: 0px 0px 14px 0px; }
.imageSmallBorderWork { border: 3px solid #D2D2D2 !important; width: 205px; margin: 0px 0px 14px 0px;  }
.lineGrey { width:100%; height: 1px; border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: #CCCCCC; }
.contentBlockWide p a:link, .introHeader a:visited, .introHeader a:hover { border-bottom: dotted 1px !important; text-decoration:none !important; }
.body-link { border-bottom: dotted 1px !important; text-decoration:none !important; }
#gallery a:link, .introHeader a:visited, .introHeader a:hover { border-bottom: 0px !important; text-decoration:none !important; }

/* Header */
#header { width:100%; padding: 9px 0px 0px 0px; }
.header-m { width:100%; margin:0 auto; width:960px;}

#logoHolder { width: 218px; float: left; height: 97px; padding: 0 0 25px 0; display:inline;}
#logoHolder h1 a { background:url(../images/core/logoScreen.png) no-repeat; float:left; width:215px; height:101px; text-indent:-25000px;}
#header_btnClient { text-align:right; border:solid 0 red; width:960px; margin:0 auto;}
#header_btnClient .text{text-align:left; background-color:#444444; color:#FFF; cursor:pointer;                        
                        float:right; height:17px; line-height:17px; 
                        padding:5px 10px 5px 10px; width:93px;
                        display:inline;}
#header_btnClient .text img{float:left;display:inline;}
#header_btnClient .text div{float:left;padding-right:5px;display:inline;}

.loginInit {display:none;}
.clientLoginLogo {width:182px; height:26px; background:url(../images/core/topLoginClients.png); float:left;}
.sp-cl {float:left; padding-right:5px;}

/* Main Content */
.clearbelow{ margin-bottom:10px !important; }
#mainContent { padding:0px 0px 30px 0px; width: 100%; float: left; }
.mainContentLeft { width:690px; float: left; margin: 0px 0px 0px 0px; }
.mainContentLeft2 { width:940px; float: left; margin: 0px 0px 10px 0px; }
.mainContentLeftPortfolio { width:709px; float: left; margin: 0px 0px 10px 0px; }
.mainContentLeftLarge { width:940px; float: left; margin: 0px 0px 10px 0px; }
.mainContentRight { width:205px; float: right; }
.contentBlock { width:205px; float:left; margin: 0px 37px 0px 0px; }
.contentBlockTall { width:205px; float:left; margin: 0px 37px 0px 0px; height: 400px; }
.contentBlockServices { padding-top:11px; }
.contentBlockRight { width:205px; float:left; }
.contentBlockWide { width:448px; float:left; }
.contentBlockExtraWide { width:648px; float:left; }
.contentBlockWide ul, #contentBlockPorfolioBullets ul, .contentBlockServices ul  { margin-left:1.8em; line-height:1.8em; color: #444444; margin-bottom: 1.8em; }
.contentBlockWide li, #contentBlockPorfolioBullets li, .contentBlockServices li  { list-style: square; }
.portfolio-group { width:709px; float:left;  margin:0px 0px 30px 0px; border-bottom:solid 1px #CCCCCC; }

#rightPanel { border: 1px solid #CCCCCC; padding: 20px 15px 10px 15px; width: 175px; margin: 0px 0px 25px 0px; }
#rightPanel ul { margin:0px 0px 15px 15px; list-style-type:square; color: #444444; }
#rightPanel li { margin:0px 0px 6px 0px;  }
#rightPanel p { margin: 10px 0px 10px 0px !important; }


#headerbg { width:709px; height:77px; float:left; margin-top:10px; padding:108px 0px 0px 0px; }
.headerbg-west { background-image: url(../images/portfolio/headerbg-west.jpg); }
.headerbg-mvc { background-image: url(../images/portfolio/headerbg-MVC.jpg); }
.headerbg-cglloyds { background-image: url(../images/portfolio/headerbg-cglloyds.jpg); }
.headerbg-homefleet { background-image: url(../images/portfolio/headerbg-homefleet.jpg); }
.headerbg-gemini { background-image: url(../images/portfolio/headerbg-gemini.jpg); }
.headerbg-lml { background-image: url(../images/portfolio/headerbg-lml.jpg); }
.headerbg-mill { background-image: url(../images/portfolio/headerbg-mill.jpg); }
.headerbg-soph { background-image: url(../images/portfolio/headerbg-soph.jpg); }
.headerbg-ig { background-image: url(../images/portfolio/headerbg-ig.jpg); }
.headerbg-mtools { background-image: url(../images/portfolio/headerbg-mtools.jpg); }
.headerbg-about { background-image: url(../images/core/headerbg-about.jpg); }
.headerbg-designbuild { background-image: url(../images/core/headerbg-designbuild.jpg); }
.headerbg-hosting { background-image: url(../images/core/headerbg-hosting.jpg); }
.headerbg-marketing { background-image: url(../images/core/headerbg-marketing.jpg); }
.headerbg-tradex { background-image: url(../images/portfolio/headerbg-Tradex.jpg); }
.headerbg-dgc { background-image: url(../images/portfolio/headerbg-dgc.jpg); }

#introtext { width:709px; float:left; height:77px; padding:15px 0px 5px 0px; } 


.contactsHolder { width:170px; clear:both; }
.contactsLeft { width:40px; float:left; }
.contactsRight { width:130px; float:right; }
.contactsText { width:170px; float:right; }
.bioInfoHolder { width:410px; clear:both; height: 90px; }
.bioInfoLeft { width:90px; float:left; margin: 0px 0px 0.8em 0px; }
.bioInfoRight { width:320px; float:right; margin: 0px 0px 0.8em 0px; }
.subpageMenuBlock { width: 205px; margin: 0px 0px 1.8em 0px; }
.subpageMenuBlock ul { margin:10px 0px 0px 0px; border-top-width: 1px; border-top-style: dotted; border-top-color: #CCCCCC; }
.subpageMenuBlock li { list-style: none; border-bottom-width: 1px; border-bottom-style: dotted; border-bottom-color: #CCCCCC; }
.subpageMenuBlock li a:hover { color:#000000; }
.subpageMenuBlock li:hover { background-color:#F3F3F3; }
.subpageMenuBlock h1 { font-size: 1.5em; color: #000000; padding: 5px 0px 0px 8px; }
.subpageMenuBlock ul li a { display:block; padding:10px; }
.subpageMenuCurrent { display:block; padding:10px;  background-image: url(../images/core/greylines.png); }
.image-Office { margin-bottom:1.5em; }

/* Footer */
#footer { width:100%; background-color:#444444; color: #bbb; clear: both; padding: 25px 0px 0px 0px; float: left; text-shadow: 0 1px 0 #17181A; }
#footer p { color:#fff;  }
#footer a:link { color:#bbb; text-decoration:none;  }
#footer ul { color:#A8A8A8; list-style: none; line-height: 1.9em; }
#footer li a:hover { background-color: #666666; }
#footer li a:link { color:#A8A8A8; text-decoration:none; -webkit-transition:background-color 0.5s ease-in; -moz-transition:background-color 0.5s ease-in; transition:background-color 0.5s ease-in;}
#footer li a:visited { color:#A8A8A8; text-decoration:none; }
#footerRightPanel { float:right; width: 205px; }
#footerLargestList { padding:0px 0px 20px 0px; }
.footerBlog { width:458px; float:left; }
.footerBlog ul { margin-left:15px; }
.footerBlog li { list-style: square; margin-bottom:10px; }
.footerBlog h3 { display:block; width:458px; border-bottom:solid 1px #666; padding:0px 0px 10px 0px; }
.footerLeft h3 { display:block; width:205px; border-bottom:solid 1px #666; padding:0px 0px 10px 0px; color:White !important; }
.footerLeft h3 a, .footerBlog h3 a  { color:#fff !important; }
.h3-spacer { padding:15px 0px 10px 0px !important; }
#footerCopyright { width:944px; border-top:solid 1px #666; float:left; color:White !important; padding:10px 0px 0px 0px; margin:20px 0px 0px 0px; }
#footerCopyright p { color:#858585; float:left; width:850px; }
#footerCopyright  a:hover { background-color: #666666; }
#footerCopyright  a:link { color:#858585; text-decoration:none; -webkit-transition:background-color 0.5s ease-in; }
#footerCopyright a:visited { color:#858585; text-decoration:none; }
.footer-indent { margin-left:9px; }

.twitter { float:left; width:44px; }


/* Navigation */
#nav-holder { width: 640px; float: right; padding: 20px 0px; font-weight: bold;  
              font-family: 'Lucida Grande', 'Lucida Sans Unicode', Verdana, sans-serif; 
              font-size: 10px !important; z-index:3000 !important; }
#nav-holder span { display:none; }
#nav, #nav ul { float:left; list-style:none; line-height:40px; padding:0; margin:0; display:inline; }
#nav a { display:block; padding: 0px; text-decoration: none; text-align: center; margin: 0px 1px 0px 0px; color: #000000; font-size:13px; z-index:3000 !important; }
#nav li { position: relative; float: left; list-style: none; line-height: 37px; font-size: 14px; font-weight:bold; !important;background-color:none !important; 
          display: block; padding: 0px; text-decoration: none; text-align: left; margin: 0px 0px 0px 0px; 
          background-image: url(../images/nav/li-SmallArrow.png); background-repeat:no-repeat; background-position:right 9px;  padding-right: 20px;  
          z-index:3000 !important;}
#nav ul { position:absolute; left:-999em; height:auto; font-weight:normal; margin:0; line-height:1; border:0; border-top:1px solid #666666; z-index:3000 !important; }

#nav li li { width:200px; font-weight:normal; font-family: Geneva, Arial, Helvetica, sans-serif; font-size:10px; background-image:none; }
#nav li li a { width:200px !important; font-size:12px; color:#dddddd; text-align:left; padding:0px 0px 0px 20px !important; margin:0px 0px 0px 0px !important; background-color:#444444; }
#nav li ul ul { margin:-21px 0 0 150px; }
#nav li li:hover { color: #FFFFFF !important; background-image:none; }
#nav li ul li a:hover { color: #FFFFFF !important; background-color: #666666; }
#nav li ul li:hover a, #nav li ul li li:hover a, #nav li ul li li li:hover a, #nav li ul li li li:hover a { color: White; }
#nav li:hover li a, #nav li li:hover li a, #nav li li li:hover li a, #nav li li li li:hover li a { color:white !important; }
#nav li:hover ul ul, #nav li:hover ul ul ul, #nav li:hover ul ul ul ul, #nav li.sfhover ul ul, #nav li.sfhover ul ul ul, #nav li.sfhover ul ul ul ul { left:-999em; }
#nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul, #nav li li li li.sfhover ul { left:auto;  }
#nav li:hover { background-color:#444444; color:White !important; background-image: url(../images/nav/li-SmallArrow-White.png); background-repeat:no-repeat; background-position:right 9px; }
#nav #home a, #nav #homestatic a { width: 90px; }
#nav #ourwork, #nav #ourworkstatic a { width: 100px; margin-left:17px; }
#nav #ourservices, #nav #ourservicesstatic  a { width: 120px; margin-left:17px; }
#nav #about, #nav #aboutstatic  a { width: 90px; margin-left:17px; }
#nav #contact, #nav #contactstatic a { width: 90px; margin-left:17px; }
    /* sets colour of drop-down title to white when rolled over */
#nav li:hover a { color:#FFFFFF !important; }
    /* menu items with no drop-down */
#home { background-image:none !important; border:1px; padding:0px !important; }
#home:hover { background-color:#444 !important; color:#FFFFFF; }
#contact { background-image:none !important; border:1px; padding:0px !important; }
#contact:hover { background-color:#444 !important; color:#FFFFFF; }
.in-section { background-color:#FFFFFF !important; }
.in-section-dropdown { background-color:#FFFFFF !important; }
.in-section-dropdown:hover { background-color:#444444 !important; background-image: url(../images/navigation/li-SmallArrow.png); background-repeat:no-repeat; background-position:right 9px; padding-right: 20px; }
.drp-top { background-image: url(../images/nav/bg-DropDown-Top.png) !important; }

/* Accessible headers */

.h1-global{ padding: 65px 0px 0px 0px; overflow: hidden; background-repeat: no-repeat; height: 0px !important; height /**/:50px }
h1#intro {background-image: url("../images/core/h1HomePage.png")}
.h2-global{ padding: 50px 0px 0px 0px; overflow: hidden; background-repeat: no-repeat; height: 0px !important; height /**/:50px }
h2#bioMark {background-image: url("../images/core/h1BioMark.png")}
h2#bioNeslee {background-image: url("../images/core/h1BioNeslee.png")}
h2#bioRobert {background-image: url("../images/core/h1BioRobert.png")}

/* All form elements are within the definition list for this example */
dl { font:normal 12px/15px Arial; position: relative; width: 440px; }
dt { clear: both; float:left; width: 200px; padding: 4px 0 2px 0; text-align: left; }
dd { float: left; width: 200px; margin: 0 0 8px 0; padding-left: 6px; }
/* The hint to Hide and Show */
.hint { color: white; display: none; position: absolute; right: -200px; width: 200px; margin-top: -4px; border: #444444; padding: 10px 12px; /* to fix IE6, I can't just declare a background-color,
    I must do a bg image, too!  So I'm duplicating the pointer.gif
    image, and positioning it so that it doesn't show up
    within the box */
    background: #444444 }
/* The pointer image is hadded by using another span */

.hint .hint-pointer { position: absolute; left: -10px; top: 5px; width: 10px; height: 19px; background: url(../images/core/form-pointer.png) left top no-repeat; }
.form-Validation-Results { float:left; width:687px;  }
.form-Validation-Results-Content { background-color: #D83E3C; padding:22px 27px 27px 27px; font-size: 18px; margin:0px 0px 10px 0px; }
.form-Validation-Results-Content ul { list-style:numbers; color: White; font-size: 14px; padding:12px 0px 0px 20px; }
.form-Validation-Results-Content li { padding:0px 0px 5px 0px; }
fieldset { margin:0px 0px 10px 0px; padding:0px 15px 15px 30px; border: solid 1px #CDCDCD;  width:640px; clear:both; }
legend { padding: 10px; font-weight: bold; font-size:1.3em; margin:0px 0px 5px 0px; color:black; }

.recruitment-consultants { color:Red; font-size:15px; font-weight:bold; }
.btn-subscribe { padding:2px; margin:9px 0px 14px 0px; }

input.grey { color:#666666 }

/* Misc */

.caption-top, .caption-bottom { color: black; padding: 10px 10px 10px 10px; font-weight: normal; font-size: 13px; cursor: default; border: 0px solid #444444; background: #D2D2D2; }
.caption-top { border-width: 0px 0px 8px 0px; height:100px; }
#topLogin { background-color:#444444; color:#fff; 
            padding:25px 0px 30px 0px; }
#topLogin p { color:#fff; }
#topLogin label { font-size:12px; padding:0px 0px 15px 0px !important; Width:100px; }
.topLoginBlock { width:205px; float:left; margin: 0px 37px 0px 0px; height:100px; }
.topLoginBlockRight { margin: 0px 0px 0px 0px !important; }
.login-element { width:205px; float:left; height:48px; }
.topLoginBlock ul { margin:0px 0px 0px 25px; }
.topLoginBlock li { list-style: square; margin-bottom:2px; }
.h1-ourservices { padding-top:15px; }

/* Porfolio Buttons */
#PorfolioButtons{ padding:15px 0px 0px 0px; }
ul#PorfolioButtons{ list-style: none; width: 227px; }
ul#PorfolioButtons li { display: inline; }
ul#PorfolioButtons li a { background-image: url(../images/core/SmallButtons-Sprite.png); display: block; height:38px; text-indent: -9999px; float: right; background-repeat: no-repeat; margin: 0px 0px 6px 0px; }
#PorfolioButtons a { float: left; display: block; text-decoration: none; height: 38px; overflow: hidden; }

ul#PorfolioButtons li a.screenshots { width: 227px; background-position: 0 0;}
ul#PorfolioButtons li a.screenshots:hover { background-position: -227px 0; }
ul#PorfolioButtons li a.screenshots:active { background-position: -454px 0; }

ul#PorfolioButtons li a.website{ width: 227px; background-position: 0 -38px;}
ul#PorfolioButtons li a.website:hover { background-position: -227px -38px; }
ul#PorfolioButtons li a.website:active { background-position: -454px -38px; }

ul#PorfolioButtons li a.contact { width: 227px; background-position: 0 -76px;}
ul#PorfolioButtons li a.contact:hover { background-position: -227px -76px; }
ul#PorfolioButtons li a.contact:active { background-position: -454px -76px; }

ul#PorfolioButtons li a.company{ width: 227px; background-position: 0 -114px;}
ul#PorfolioButtons li a.company:hover { background-position: -227px -114px; }
ul#PorfolioButtons li a.company:active { background-position: -454px -114px; }

ul#PorfolioButtons li a.latest{ width: 227px; background-position: 0 -152px;}
ul#PorfolioButtons li a.latest:hover { background-position: -227px -152px; }
ul#PorfolioButtons li a.latest:active { background-position: -454px -152px; }

ul#PorfolioButtons li a.jobs{ width: 227px; background-position: 0 -190px;}
ul#PorfolioButtons li a.jobs:hover { background-position: -227px -190px; }
ul#PorfolioButtons li a.jobs:active { background-position: -454px -190px; }

ul#PorfolioButtons li a.project { width:227px; background-position: 0 -228px; }
ul#PorfolioButtons li a.project:hover { background-position: -227px -228px; }
ul#PorfolioButtons li a.project:active { background-position: -454px -228px; }


div.buttonholder { width:185px; clear:both; }
div.buttonholder a { background-image: url(../images/core/GeneralButtons-Sprite.png); display: block; height: 50px; 
                       text-indent: -9999px; float: right; background-repeat: no-repeat; margin: 0px 0px 10px 0px; }
                       
.buttonholder a { float: left; display: block; text-decoration: none; height: 53px; overflow: hidden;  }

div.buttonholder a.view-case { width: 185px; background-position: 0 0;}
div.buttonholder a.view-case:hover { background-position: -186px 0; }
div.buttonholder a.view-case:active { background-position: -372px 0; }

ul.buttonholder2 { list-style: none; width:177px; clear:both; margin-left:0px !important; }
ul.buttonholder2 li { display: inline; }
ul.buttonholder2 li a { background-image: url(../images/core/GeneralButtons-Sprite.png); display: block; height: 40px; text-indent: -9999px; float: right; background-repeat: no-repeat; margin: 0px 0px 10px 0px; }
.buttonholder2 a { float: left; display: block; text-decoration: none; height: 43px; overflow: hidden;  }
ul.buttonholder2 li a.subscribe { width: 177px; background-position: 0 -50px;}
ul.buttonholder2 li a.subscribe:hover { background-position: -177px -50px; }
ul.buttonholder2 li a.subscribe:active { background-position: -354px -50px; }
ul.buttonholder2 li a.unsubscribe { width:177px; background-position: 0 -100px; }
ul.buttonholder2 li a.unsubscribe:hover { background-position: -177px -100px; }
ul.buttonholder2 li a.unsubscribe:active { background-position: -354px -100px; }

.clear { clear: both; }
.clientlogin { width: 406px; margin: 20px auto 0;  }
.clientlogin legend { display: none; }
.clientlogin fieldset { border: 0; }
.clientlogin label { width: 115px; text-align: right; float: left; margin: 0 10px 0 0; padding: 9px 0 0 0; font-size: 16px; }
.clientlogin input { width: 220px; display: block; padding: 4px; margin: 0 0 10px 0; font-size: 18px; color: #3a3a3a; font-family: Georgia, serif; }
.clientlogin input[type=checkbox] { width: 20px; margin: 0; display: inline-block; }

.watermark {
   color: #666;
}


.form-Validation-Results-Content { background-color: #D83E3C; padding:22px 27px 27px 27px; font-size: 18px; margin:0px 0px 10px 0px; }
.form-Validation-Results-Content ul { list-style:numbers; color: White; font-size: 14px; padding:12px 0px 0px 20px; }
.form-Validation-Results-Content li { padding:0px 0px 5px 0px; }