/*******************************************/
/*                  Common                 */
/*******************************************/

html, body { margin:0; padding:0; height:100%; }
body { background:#0c0c0c; }
body, table, input, textarea, select { font:11px Arial, Verdana, sans-serif; }
body, table { color:#76787b; line-height:16px; }
form { margin:0; padding:0; }
h1, .h1 { font-size:22px; margin:10px 0 15px;  color:#000; }
h2, .h2 { color:#000; font-size:14px; font-weight:bold; }
h3, .h3 { margin:0 0 15px 0; padding:5px; color:#3f3f3f; font-weight:bold; font-size:12px; background:#eeedea; border-bottom:1px solid #d9d8d7; }
a { color:#000; text-decoration:none; }
a:hover { color:#5d5d5d; }
a.Reverse { color:#bbb3ac; text-decoration:none; }
a.Reverse:hover { color:#FFF; }
a img { border:none; }
p { margin:0 0 18px; }
hr { clear:both; margin:30px 0; width:100%; height:1px; color:#CCC; background:#CCC; border:0; }

.Hidden { display:none; }
.Clear { clear:both; }
.Req { color:#CA0000; }
.Important { color:#CA0000; }
.MoreInfo { display:block; padding:6px; width:65px; font-weight:bold; font-size:9px; text-align:center; text-transform:uppercase; cursor:pointer; }
.Button { display:block; margin:8px 0; text-transform:uppercase; font-size:12px; }
.Error { margin:15px 0 0 0; display:block; padding:6px; color:#CC0000; font-weight:bold; font-size:12px; border-top:1px solid #d9d8d7; }
.Date { font-size:10px; color:#999; }
.Col { display:inline; float:left; margin-right:30px; width:300px; }
.Blockquote { display:block; margin:10px 0 15px; font-size:12px; color:#000; line-height:18px; }
.Quotes { display:block; margin:10px 0; padding:5px 40px 10px 40px; font-weight:normal; font-size:12px; line-height:18px; color:#76787b; background:url(../images/quote.png) no-repeat; }
.Centre { margin:0 auto; width:960px; }

.Divider { background-image:url(../images/divider-tusk.gif); background-position: 50% 0%; background-repeat: no-repeat; height: 36px; margin: 18px 0px 27px; width: 100%; }

/*******************************************/
/*               PageNotFound              */
/*******************************************/

#PageNotFound { margin:0 auto; width:860px; }
#PageNotFound .Code { float:left; width:500px; }
#PageNotFound .Code h1 { font-size:250px; line-height:280px; color:#CCC; }
#PageNotFound .Message { float:left; padding-top:80px; width:360px; }

/*******************************************/
/*                  Forms			       */
/*******************************************/

.FormField { color:#333; padding:2px 4px; background:#efefef; border:0; width:140px; }

.Buttons { margin-top:15px; }
.Buttons a { float:left; }
.Buttons .FormButton { float:left; margin-left:0; }

.Form div { display:block; margin-bottom:3px; }
.Form div label { display:block; float:left; margin:1px 4px 0 0; width:80px; }
.Form div span.data { width:auto; float:left; padding:3px 0; }
.Form div select, form div option { width:auto; } 
.Form div.Divider { margin:0; padding:5px 4px 2px; background:url(../images/submenu-divider.gif) no-repeat top center; }
.Form .FormButton { margin:10px 0 0 84px; }

.Form .Captcha { clear:both; display:block; padding-left:84px; margin-bottom:10px; }
.Form .Captcha .CaptchaField { clear:none; float:left; width:120px; }
.Form .Captcha .CaptchaImage { clear:none; float:left; width:100px; height:23px; background:#FFF; border:1px solid #CCC; }

/*******************************************/
/*              Pretty Search              */
/*******************************************/

.SearchWrapper { display:block; height:20px; }
.SearchWrapper .PrettySearch { float:left; padding:3px 0 0 0; height:17px; background:url(../images/bg_prettysearch.png) repeat-x; border:0; opacity:1; }
.SearchWrapper .Blurred { color:#7E7E7E; }
.SearchWrapper .Left { float:left; width:20px; height:20px; background:url(../images/bg_prettysearch_left.png) left top no-repeat; }
.SearchWrapper .Right { float:left; width:10px; height:20px; background:url(../images/bg_prettysearch_right.png) right top no-repeat; }

/*******************************************/
/*                  Layout                 */
/*******************************************/

#Wrapper { min-height:100%; z-index:100; }
#Header { width:960px; padding:24px 0 0; height:60px; }
#Header .Logo { float:left; }
#Header .Logo:hover { opacity:.8; }

#LoginContainer { width:960px; }
#LoginContainer #Login { padding:30px 40px; width:880px; background:#EFEFEF; z-index:1; opacity:.97; }
#LoginContainer #Login h2 { margin-top:5px; }
#LoginContainer #Login .ClientAdmin { margin-right:60px; }
#LoginContainer #Login .ClientAdmin, #LoginContainer #Login .TeamworkPM { float:left; width:370px; }
#LoginContainer #Login .Info { float:left; margin-right:20px; width:170px; }
#LoginContainer #Login .Form { float:left; width:170px; }
#LoginContainer #Login .Form label { float:none; }
#LoginContainer #Login .Form .FormField { background:#FFF; }

#Header #Locations { float:right; width:200px; margin:0; padding:0; list-style:none; }
#Header #Locations li { float:left; padding:5px 10px 5px; margin-top:15px; border-left:1px solid #505050; color:#FFF; font-size:12px; text-transform:uppercase; }
#Header #Locations li.First { border-left:0; }

#Header #LoginButton { float:right; margin-top:20px; width:65px; height:22px; cursor:pointer; }
#Header .LoginButton { background:url(../images/btn_logindown.png); }
#Header .LoginButtonOn { background:url(../images/btn_loginup.png); }

#OuterContainer { min-height:380px; background:#FFF; width:100%; }
#InnerContainer { padding:40px 0; }
#InnerContainer #ColLeft { float:left; width:210px; color:#757677; }
#InnerContainer #ColLeft h1 { margin-top:0; }
#InnerContainer #ColLeft h2, #InnerContainer #ColLeft .h2 { font-size:12px; }
#InnerContainer #ColRight { float:left; width:750px; overflow:hidden; }
#InnerContainer #Content { }

#Footer { padding-bottom:10px; width:100%; }
#Footer #Updates { height:180px; padding:0 0 30px 0; }
#Footer #Updates h2 { margin:0; }
#Footer #Updates h2 a { display:block; margin:0; color:#FFF; padding:10px 3px 3px 3px; font-weight:normal; font-size:12px; border-bottom:1px solid #262626; }
#Footer #Updates .More { display:block; margin-top:5px; text-transform:uppercase; color:#FFF; }

#Footer #Updates .AboutUs, #Footer #Updates #BlogWidget, #Footer #Updates #TwitterWidget { float:left; min-height:135px; }
#Footer #Updates .AboutUs { margin:20px 90px 0 0; width:370px; font-size:24px; color:#FFF; line-height:24px; }

#Footer #Updates #BlogWidget ul,  #Footer #Updates #TwitterWidget ul { margin:0; padding:0; }
#Footer #Updates #BlogWidget, #Footer #Updates #TwitterWidget { margin:15px 0 0 50px; width:200px; font-size:11px; color:#FFF; overflow:hidden; }
#Footer #Updates #BlogWidget .Entry, #Footer #Updates #TwitterWidget .Entry { display:block; padding:3px; line-height:16px; border-top:1px solid #262626; } 
#Footer #Updates #BlogWidget .First, #Footer #Updates #TwitterWidget .First { border:0; }
#Footer #Updates #BlogWidget .Entry a .By, #Footer #Updates #TwitterWidget .Entry .Date { color:#CCC; }

#Footer #Updates #BlogWidget h2 a { background:url(../images/icons/rss.png) no-repeat center right; }
#Footer #Updates #BlogWidget .Entry a { color:#FFF; }
#Footer #Updates #BlogWidget .Entry a .Date { font-weight:bold; color:#e16b1c; text-transform:uppercase; }
#Footer #Updates #TwitterWidget h2 a { background:url(../images/icons/twitter.png) no-repeat center right; }
#Footer #Updates #TwitterWidget .Entry a { color:#72bcc0; }
#Footer #Updates #TwitterWidget .Entry a:hover { text-decoration:underline; }

#Footer .BottomContainer { margin-top:10px; border-top:1px solid #1d1d1d; }
#Footer .BottomContainer .Bottom { margin:0 auto 40px; padding:10px 0; width:960px; }
#Footer .BottomContainer .Bottom .Copyright { float:left; padding-top:3px; width:300px; }
#Footer .BottomContainer .Bottom .Copyright img { float:left; }
#Footer .BottomContainer .Bottom .Copyright span { float:left; display:block; width:200px; padding:1px 0 0 10px; color:#FFF; }

#Footer .BottomContainer .Bottom .Subscribe fieldset { border:none; margin:0; padding:0; }
#Footer .BottomContainer .Bottom .Subscribe { width:445px; float:right; }
#Footer .BottomContainer .Bottom .Subscribe label { float:left; padding-top:3px; margin-right:10px; color:#FFF; }
#Footer .BottomContainer .Bottom .Subscribe .FormField { float:left; margin-right:10px; width:130px; color:#a5a5a5; background:#0c0c0c; border:1px solid #1f1f1f; }

/*******************************************/
/*                   Menu                  */
/*******************************************/

#Menu { float:left; margin:13px 0 0 112px; width:500px; }
#Menu ul { margin:8px 0; padding:0; float:left; list-style:none; }
#Menu ul li { float:left; padding-right:20px }
#Menu ul li a { text-transform:uppercase; font-size:12px; color:#7d7d7d; }
#Menu ul li a:hover, #Menu ul li.Selected a { color:#FFF; }

/*******************************************/
/*                 Sub Menu                */
/*******************************************/

.SubMenu ul { margin:0 0 20px; padding:0; list-style:none; }
.SubMenu ul li { display:block; margin:0; padding:0; }
.SubMenu ul li a, .SubMenu ul li span  { display:block; padding:0 0 0 0; color:#76787b; font-weight:normal; font-size:12px; text-transform:uppercase; }
.SubMenu ul li li span { display:inline; padding:2px 0; font-weight:normal; font-size:10px; background:none; text-transform:none; }
.SubMenu ul li li { background:none; line-height:14px; }
.SubMenu ul li li a { font-weight:normal; font-size:10px; border:0; text-transform:none; padding:0 0 0 0; display:inline; }
.SubMenu ul ul { margin-bottom:10px; padding:0; }
.SubMenu ul li.Selected a { color:#000; font-weight:bold; }
.SubMenu ul li.Selected span { color:#000; font-weight:bold; }
.SubMenu ul li.Selected li a, .SubMenu ul li.Selected li a span { color:#76787b; font-weight:normal; }
.SubMenu ul li li.Selected a { color:#000; font-weight:bold; }
.SubMenu ul li a:hover, .SubMenu ul li.Selected a:hover, .SubMenu ul li.Selected li a:hover span { color:#000; }

.ExpanderMenu ul li span { cursor:pointer; }

#ProjectMenu { padding-top:10px; }

.Link { display:block; margin-bottom:20px; color:#000; font-weight:bold; font-size:12px; }

.Features ul { margin:0; padding:0; list-style:none; }
.Features ul li { margin:0; padding:0 0 3px; text-transform:uppercase; }

/*******************************************/
/*                 Widgets                 */
/*******************************************/

.Widgets h2 a { margin-top:10px; display:block; color:#76787b; font-weight:normal; font-size:12px; text-transform:uppercase; line-height:12px; }
.Widgets h2 a span { display:block; color:#000; }

.FacebookWidget { width:165px; }
.FacebookWidget h2 a { background:url(../images/icons/facebook.png) no-repeat top right; letter-spacing:0; }

.TwitterWidget { width:165px; overflow:hidden; }
.TwitterWidget h2 a { background:url(../images/icons/twitter.png) no-repeat top right; letter-spacing:0; }
.TwitterWidget ul { list-style:none; margin:0; padding:0; }
.TwitterWidget ul li { margin-bottom:10px; }
.TwitterWidget ul li a { color:#42a6c3; }
.TwitterWidget ul li a:hover { text-decoration:underline; }

.FlickrWidget { width:165px; }
.FlickrWidget h2 a { background:url(../images/icons/flickr.png) no-repeat top right; letter-spacing:0; }
.FlickrWidget #flickr_badge_wrapper { padding:10px 0 10px 0; }
.FlickrWidget .flickr_badge_image { float:left; margin-right:5px; margin-bottom:5px; width:75px; height:75px; }
.FlickrWidget #flickr_badge_source {text-align:left; margin:0 10px 0 10px;}
.FlickrWidget #flickr_badge_icon { float:left; margin-right:5px; }

.YouTubeWidget { width:165px; }
.YouTubeWidget h2 a { background:url(../images/icons/youtube.png) no-repeat top right; letter-spacing:0; }

.DeliciousWidget { width:165px; }
.DeliciousWidget h2 a { background:url(../images/icons/delicious.png) no-repeat top right; letter-spacing:0; }

/*******************************************/
/*                Homepage                 */
/*******************************************/

#Homepage #Hero { float:left; height:400px;  }
#Homepage.Centre { width:100%; height:400px; overflow:hidden; background:url(../images/bg_homepage.png) center top; }
#HeroContainer { margin:0 auto; width:960px; }


/*******************************************/
/*                 Contact                 */
/*******************************************/

#Contact .Enquiry .Form .Details { width:220px; } 
#Contact .Enquiry .Form .Details input { width:120px; }
#Contact .Enquiry .Form .Message { width:300px; }
#Contact .Enquiry .Form .Message textarea { width:200px; height:60px; } 
#Contact .Enquiry .Form .Submit { width:100px; }
#Contact .Enquiry .Form .Submit .FormButton { margin-top:45px; }

/*******************************************/
/*                   Blog                  */
/*******************************************/

#Blog .ColLeft { line-height:18px; font-size:12px; }
#Blog .ColLeft ul { margin-bottom:15px; }
#Blog .ColLeft ul li { margin:0 0 7px; }

#Blog .ColLeft { float:left; margin-right:55px; width:725px; color:#000; }
#Blog .ColLeft a { color:#5d5d5d; text-decoration:underline; }
#Blog .ColRight { float:left; width:165px; }
#Blog .Date { display:block; margin:0 0 10px; }
#Blog #frmSearch label,#Blog #frmSearch #Search { display:none; }

#Blog .ColLeft h1 { margin:0 0 7px; }
#Blog .ColLeft h1 a { color:#000; text-decoration:none; }

#Blog .ColLeft .Extras { display:block; margin:0; padding:5px 0; height:30px; list-style:none; }
#Blog .ColLeft .Extras li { float:left; margin:0 15px 0 0; padding:0; font-size:11px; color:#76787b; }
#Blog .ColLeft .Extras li a { padding:3px 0; color:#76787b; text-decoration:none; }
#Blog .ColLeft .Extras li a:hover { color:#000; }

#Blog .ColLeft .Extras li.Permalink a { padding-left:20px; background:url(../images/icons/permalink.png) no-repeat top left; }
#Blog .ColLeft .Extras li.Comments a { padding-left:20px; background:url(../images/icons/comments.png) no-repeat top left; }
#Blog .ColLeft .Extras li.ShareThis a { padding-left:20px; background:url(../images/icons/sharethis.png) no-repeat top left; }

#Blog .Buttons a.Older { float:left; }
#Blog .Buttons a.Newer { float:right; }

#CommentItem { margin:10px 0; padding:10px; display:block; border:1px solid #d9d8d7; }
#CommentItem .Comment { padding-bottom:10px; }

/*******************************************/
/*                   News                  */
/*******************************************/

#News h1 { margin-top:0; }
#News h2 { margin-top:0; font-size:14px; }
#News .Date { display:block; margin:0 0 10px; }

#News #List .Featured { float:left; width:340px; }
#News #List .Featured .Image { margin:10px 10px 0 0; }

#News #List .Items { display:inline; float:left; width:335px; list-style:none; margin:0 0 0 60px; padding:30px 0 0 0; }
#News #List .Items li .Summary { float:left; width:225px; }
#News #List .Items li .Summary h2 { margin:0 0 2px; padding:0; font-size:12px; }
#News #List .Items li a .Thumbnail { float:left; margin:0 20px 10px 0; width:80px; }

#News #List .Archive { margin:0; padding:0; width:725px; }
#News #List .Archive li { margin-bottom:20px; }
#News #List .Archive li .Summary { width:625px; }

#News #Details .Image { margin:0 0 20px 15px; float:right;}

#News .Extras { display:block; margin:0; padding:5px 0; height:25px; list-style:none; }
#News .Extras li { float:left; margin:0 15px 0 0; padding:0; font-size:11px; color:#76787b; }
#News .Extras li a { padding:3px 0; color:#76787b; }
#News .Extras li a:hover { color:#000; }
#News .Extras li.ShareThis a { padding-left:20px; background:url(../images/icons/sharethis.png) no-repeat top left; }

#News #Viewer img { float:left; margin-right:20px; }

/*******************************************/
/*                 Our Work                */
/*******************************************/

#OurWork .Thumbnails div { float:left; margin-left:8px; padding:0; height:130px; }
#OurWork .Thumbnails div a img { display:block; margin-bottom:2px; width:249px; }
#OurWork .Thumbnails .First { margin:0; }
#OurWork .Thumbnails h2 { margin-top:0; text-transform:uppercase; font-size:10px; }

#OurWork .Details { float:left; margin:0 0 0 3px; min-height:150px; width:490px; display:inline; }
#OurWork .Details .Button { margin-top:20px; width:100px; }

/*******************************************/
/*                 Careers                 */
/*******************************************/

#Careers h2 { margin-top:0; }
#Careers .Details { float:left; margin:0 60px 5px 0; width:430px; }
#Careers .Extras { float:left; padding-top:30px; width:230px; }

#Careers .Contact { margin-top:30px; }
#Careers .Contact .Link { margin-top:5px; }

/*******************************************/
/*                Workshop                 */
/*******************************************/

#Workshop h2 { margin-top:0; }
#Workshop h2 .IsFull { margin-left:10px; color:#CC0000; }
#Workshop .Details { float:left; margin:0 60px 5px 0; width:670px; }
#Workshop .Extras { float:left; padding-top:30px; }
#Workshop .Extras .Info { padding:10px; width:200px; color:#000; background:#efefef; }
#Workshop .Extras .Info div { display:block; }
#Workshop .Extras .Info div .Label { float:left; display:block; width:50px; font-weight:bold; text-transform:uppercase; }
#Workshop .Extras .Info div .Data { float:left; display:block; width:150px; }

#Workshop .Booking { float:left; margin-top:20px; width:230px; }
#Workshop .Booking .Form label { float:none; }
#Workshop .Booking .Form .FormField { width:150px; }

#RegisterInterest .Details { display:inline; float:left; margin:10px 20px 0 0; width:300px; }
#RegisterInterest .Enquiry { display:inline; float:left; width:230px; }