/*
-----------------------------------------------------
New Islington Tutti Frutti (www.newislington.co.uk/tutti-frutti/) SCREEN Style Sheet
author:   mN -> hello@magneticn.co.uk
version:  2007.05
----------------------------------------------------- */

/* Import YUI font and element normalisation */
@import "../yui/reset/reset.css";
@import "../yui/fonts/fonts.css";

body{ font-family:Arial, Helvetica, sans-serif; font-size:11px; color:#666; text-align:center; } /* So great IE browsers centre properly... */
a{ color:#000; text-decoration:none; outline:none; }
a:hover{ text-decoration:underline; }
ul{ list-style:none; }
.clear{ position:relative; width:auto; height:0px; overflow:hidden; clear:both; }
.inline{ display:inline; }
.floatLeft{ float:left; }
.floatRight{ float:right; }

#accessiblity{ display:none; }
#container{ position:relative; width:790px; margin:5px auto; text-align:left; background:url(../../images/container-bg.jpg); }
#header{ background:url(../../images/header.jpg) no-repeat; }

/* ----- Ice creams in top right ----- */
#ic1{ background:url(../../images/ic1.jpg) no-repeat 456px 0; overflow:visible; width:100%; height:100%;}
#ic2{ background:url(../../images/ic2.jpg) no-repeat 456px 0; overflow:visible; width:100%; height:100%;}

/* Logo and tagline */
#logo{ width:297px; height:108px; position:absolute; top:12px; left:12px; }
#logo a{ display:block; width:100%; height:100%; text-indent:-9999px; }

/* Content pane */
#content{ width:493px; padding:10px; margin:144px 10px 0 0; float:right; background:url(../../images/content-gradient.jpg) repeat-y; display:inline; }
#content-disp{ background:#FFF; padding:10px; }
#content p{ margin-bottom:10px; line-height:150%; }

/* Sub-content pane  */
#content-sub{ width:267px; display:inline; margin:168px 0 273px 0; float:left; }
#site-info{ position:relative; clear:both; background-color:#FFFFFF; }
#trolley-top{ width:256px; height:242px; background:url(../../images/trolley-top.jpg) no-repeat; position:absolute; top:-242px; left:0; }

/* Legals links */
#legals li{ display:inline; color:#666; font-size:1em; margin-right:5px; }
#legals li a{ color:#666; }

/* Partners logos */
#partners{ padding-left:110px; width:790px; height:43px; padding-bottom:10px; margin:0 auto; }
#partners li{ float:left; margin-right:30px; }
#partners li a{ display:block; width:100%; height:43px; text-indent:-9999px; width:100%; }
#us{ background-image:url(../../images/urban_splash.gif); width:127px; }
/*#ep{ background-image:url(../../images/english_partnerships.gif); width:105px; }*/
#hca{ background-image:url(../../images/hca.gif); width:86px; }
#mcc{ background-image:url(../../images/mcc.gif); width:99px; }
#nem{ background-image:url(../../images/nem.gif); width:133px; }
#riba{ background-image:url(../../images/riba.gif); width:90px; }

/* Navigation */
#main-nav{ margin-left:0; padding-left:10px; }
#main-nav li{ margin-bottom:3px; }
#main-nav li.current a{ background-position:right top; }
#main-nav li.current ul li a{ background-position:left top; }
#main-nav li a{ display:block; padding-top:20px; height:0 !important; height /**/:20px; overflow:hidden; background-position:left top;}
#main-nav li a:hover{ background-position:right top;}
#home{ background:url(../../images/nav/home.gif) no-repeat left top; width:52px; }
#win {background:url(../../images/nav/win.gif) no-repeat left top; width:97px; }
#what{ background:url(../../images/nav/what-is.gif) no-repeat left top; width:126px; }
#why{ background:url(../../images/nav/why.gif) no-repeat left top; width:109px;  }
#gone-green{ background:url(../../images/nav/everything.gif) no-repeat left top; width:161px; }
#new-idea{ background:url(../../images/nav/no-such-thing.gif) no-repeat left top; width:234px; }
#alfie{ background:url(../../images/nav/alfie.gif) no-repeat left top; width:208px; }
#how{ background:url(../../images/nav/how.gif) no-repeat left top; width:116px; }
#where{ background:url(../../images/nav/where.gif) no-repeat left top; width:91px; }
#faq{ background:url(../../images/nav/faqs.gif) no-repeat left top; width:49px; }
#judgement{ background:url(../../images/nav/judges.gif) no-repeat left top; width:113px; }
#links{ background:url(../../images/nav/links.gif) no-repeat left top; width:84px; }
#signup{ background:url(../../images/nav/sign-up-here.gif) no-repeat left top; width:91px; }

.sub-div li{ margin-top:3px;}
#container .sub-div li a{ display:block; padding-top:20px; height:0 !important; height /**/:20px; overflow:hidden; background-position:left top;}
#container .sub-div li a:hover{ background-position:right top;}
#terms{ background:url(../../images/nav/sub/terms.gif) no-repeat left top; width:165px; }
#additional{ background:url(../../images/nav/sub/additional.gif) no-repeat left top; width:123px; }
#step{ background:url(../../images/nav/sub/step.gif) no-repeat left top; width:123px; }
#timescales{ background:url(../../images/nav/sub/timescales.gif) no-repeat left top; width:123px; }
#nitty{ background:url(../../images/nav/sub/nitty-gritty.gif) no-repeat left top; width:123px; }
#submit{ background:url(../../images/nav/sub/submit.gif) no-repeat left top; width:137px; }

/* Homepage content styles */
#homeContent h2 {background: url(../../images/title-graphics/home-title.gif) no-repeat; width:361px; padding-top:24px; height:0 !important; height /**/:24px; overflow:hidden; margin:0 0 10px 4px;}
#homeContent h3{color:#8ead2c;}
#tryout-wrap{ position:relative; width:auto; margin:10px auto;}
#allsop{ width:202px; float:left; float:left; display:inline; margin-right:4px; }
#allsop h4{ background:url(../../images/wc-architect.gif) no-repeat; width:202px; height:19px; text-indent:-9999px; margin-top:0;}
#allsop h5{ background:url(../../images/will-alsop.gif) no-repeat; width:87px; height:14px; text-indent:-9999px; margin:0 auto; }
#you{ display:inline; margin-left:10px; width:200px; float:left; float:left; }
#you h4{ width:174px; margin-left:64px !important; margin-left:40px; height:19px; background:url(../../images/you-30secs.gif) no-repeat; text-indent:-9999px; }
#you h5{ width:157px; margin:0 auto; }
#you h5 a{ display:block; width:157px; height:18px; background:url(../../images/gallery-link.gif) no-repeat; text-indent:-9999px; margin-left:53px !important; margin-left:40px; } 
#taglineYour{color:#eb3332; font-size:16px;}
#taglineHome{color:#eb3332; font-size:16px; font-weight:bold;}

/* Gallery styles */
.galleryImg { margin-right:10px; }
#gallery { text-align:center; padding-top:15px; }
#gallery .galleryImg { margin:1px 20px; }
#gallery #displayButts{ display:inline; }
#pagination { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 13px; margin-top:15px; }
#pagination a { text-decoration: underline; color: #66609C; }
#pagination .current { color: #D6191D; font-weight: bold; }

/* What is Tutti content styles */
#whatIsContent {margin-left:0;}
#whatIsContent img{margin-right: 5px; margin-left:0; margin-top:4px;}
#whatIsContent h2{background: url(../../images/title-graphics/what-is-tf-title.gif) no-repeat; width:361px; padding-top:24px; height:0 !important; height /**/:24px; overflow:hidden; margin:0 0 5px 0; }
#whatIsIntro{ position:relative; width:auto; height:189px; background-image:url(../../images/what-is-tutti-pic.jpg); background-position:left top; background-repeat:no-repeat; margin-bottom:10px;}
#whatIsIntroInfo{background: url(../../images/what-is-intro.gif) no-repeat; width:227px; padding-top:98px; height:0 !important; height /**/:98px; overflow:hidden; margin-top:72px 0 10px 0; position:absolute; top:88px;}
#skillTypesWrapper{ width:auto; margin-top:0;}
#develSummary h4{color:#eb3332;}
#investSummary h4{color:#ff8200;}
#archSummary h4{color:#FFC900;}
#johnSummary h4{color:#97C700;}
#develSummary{ float:left; width:113px; height:133px; padding:3px; }
#investSummary{ float:left; width:113px; height:133px; padding:3px; }
#archSummary{ float:left; width:113px; height:133px; padding:3px; }
#johnSummary{ float:left; width:110px; height:133px; padding:3px; }
#develSummary p{ height:98px; border-right: 1px solid #A5A497; line-height:normal; padding-right:2px; }
#investSummary p{ height:98px; border-right: 1px solid #A5A497; line-height:normal; padding-right:2px; }
#archSummary p{ height:98px; border-right: 1px solid #A5A497; line-height:normal; padding-right:2px; }
#johnSummary p{  height:98px; border-right: none; line-height:normal; padding-right:2px; }


/* Why Tutti content styles */
#whyInfo{ width:auto; margin-top:-10px;}
#whyInfo img{ margin-top:15px; }
#why-content h2{background: url(../../images/title-graphics/why-tf-title.gif) no-repeat; width:361px; padding-top:24px; height:0 !important; height /**/:24px; overflow:hidden; margin:0; }

/* Going green content styles */
#goingGreenContWrapper{ position:relative; margin-top:10px; background-image:url(../../images/going-green-pic1.jpg); background-position:left top; background-repeat:no-repeat; }
#goingGreenContWrapper img{ margin-top:172px; }
#goneGreenContent{margin-left: 4px;}
#goneGreenContent h2{background: url(../../images/title-graphics/going-green-title.gif) no-repeat; width:361px; padding-top:24px; height:0 !important; height /**/:24px; overflow:hidden; margin-left:-2px;}
#gGCopy1{ position:absolute; width:200px; right:20px; top:0px; }
#gGCopy1 p{margin-top:-4px; }
#gGCopy2 p{padding-right:240px; }

/* No such thing content styles */
#noSuchThingPic1{margin:10px 0px 10px 4px;}
#noSuchThingIntro2{background:url(../../images/no-such-thing-info2.gif) no-repeat 3px center; height:104px;}
#noSuchThingIntro2 p{padding-left:240px; padding-right:5px;}
#noSuchThingPic2{margin:10px 0px 0px 4px;}

/* What's New Islington all about content styles */
#alfieContent p{margin-top:10px; padding:0;}
#alfieContent h2{background: url(../../images/title-graphics/what-is-ni-about-title.gif) no-repeat; width:361px; padding-top:24px; height:0 !important; height /**/:24px; overflow:hidden; margin:0;}
.alfiePic1{margin-left:10px;}
.alfiePic2{margin-top:-30px; margin-left:-9px; float:left;}


/* How will it work content styles */
#howContent p{width:465px; margin-top:10px; padding-left:4px;}
#howInfo1{background: url(../../images/how-info1.gif) no-repeat; width:420px; padding-top:31px; height:0 !important; height /**/:31px; overflow:hidden; margin:0 0 10px 4px;}
#howInfo2{background: url(../../images/how-info2.gif) no-repeat; width:438px; padding-top:49px; height:0 !important; height /**/:49px; overflow:hidden; margin:0 0 10px 4px;}
#howContent img{margin-left:4px;}

/* FAQs content styles */
#faqsContent p{ padding-left:6px; }
#faqsContent h2{background: url(../../images/title-graphics/faqs-title.gif) no-repeat; width:361px; padding-top:24px; height:0 !important; height /**/:24px; overflow:hidden; margin-left:3px;}
#faq1{background: url(../../images/faq1.gif) no-repeat; width:428px; padding-top:31px; height:0 !important; height /**/:31px; overflow:hidden; margin:10px 0 8px 4px;}
#faq2{background: url(../../images/faq2.gif) no-repeat; width:418px; padding-top:31px; height:0 !important; height /**/:31px; overflow:hidden; margin:20px 0 8px 4px;}
#faq3{background: url(../../images/faq3.gif) no-repeat; width:441px; padding-top:31px; height:0 !important; height /**/:31px; overflow:hidden; margin:20px 0 8px 4px;}
#faq4{background: url(../../images/faq4.gif) no-repeat; width:441px; padding-top:32px; height:0 !important; height /**/:32px; overflow:hidden; margin:20px 0 8px 4px;}
#faq5{background: url(../../images/faq5.gif) no-repeat; width:446px; padding-top:31px; height:0 !important; height /**/:31px; overflow:hidden; margin:20px 0 8px 4px;}
#faq6{background: url(../../images/faq6.gif) no-repeat; width:197px; padding-top:14px; height:0 !important; height /**/:14px; overflow:hidden; margin:20px 0 8px 4px;}
#faq7{background: url(../../images/faq7.gif) no-repeat; width:367px; padding-top:14px; height:0 !important; height /**/:14px; overflow:hidden; margin:20px 0 8px 4px;}
#faq8{background: url(../../images/faq8.gif) no-repeat; width:259px; padding-top:14px; height:0 !important; height /**/:14px; overflow:hidden; margin:20px 0 8px 4px;}
#faq9{background: url(../../images/faq9.gif) no-repeat; width:452px; padding-top:31px; height:0 !important; height /**/:31px; overflow:hidden; margin:20px 0 8px 4px;}

/* FAQs submit page styles */
#faqsFormContent h2{ background: url(../../images/submit-faq-title.gif) no-repeat; width:157px; padding-top:17px; height:0 !important; height /**/:17px; overflow:hidden; margin:0 0 8px 4px;}
#faqsFormContent p{ padding-left:5px;}
#faqsFormContent label{display:block;}
#faqsFormContent input{width:200px; border:1px solid #ccc;}
#faqsFormContent textarea{float:left; border:1px solid #ccc; width:200px; margin-bottom:10px;}
#faqsFormContent fieldset {margin:0 !important; margin-bottom:10px; padding-top:1em; border:none;}
#faqsFormContent legend { font-size:12px; font-weight:bold;}
#faqsFormContent h4{background: url(../../images/send-us-q-title.gif) no-repeat; width:190px; padding-top:17px; height:0 !important; height /**/:17px; overflow:hidden; margin:-10px 0 6px 6px; }
#faqsFormContent a{display:block; width:60px; height:20px; line-height:20px; background:url(../../images/form-submit-button.gif) no-repeat left top; text-indent:-4999px; margin-left:5px;}
#faqsFormContent a:hover{background-position:right top;}

/* Sign up page styles */
#container #signupFormContent h2#title { background: url(../../images/title-graphics/enter-the-comp-title.gif) no-repeat; width:361px; padding-top:24px; height:0px !important; height /**/:24px; overflow:hidden; margin:0px; }
#container #signupFormContent h2#thank-you { background: url(../../images/thank-you.gif) no-repeat; width:84px; padding-top:17px; height:0px !important; height /**/:17px; overflow:hidden; margin:5px 4px 10px 0; }

#signupFormContent label{display:block;}
#signupFormContent input{width:200px; padding:2px; border:1px solid #ccc;}
#signupFormContent textarea{float:left; border:1px solid #ccc; width:203px; margin-bottom:10px;}
#signupFormContent fieldset {margin:0; padding-top:1em; border:none;}
#container #signupFormContent h4 { margin:-10px 0 0 4px; background: url(../../images/sign-up-here-title.gif) no-repeat; width:190px; padding-top:17px; height:0px !important; height /**/:17px; overflow:hidden; margin-bottom:10px; }
#signupFormContent .tickbox{margin:0; border:0; padding:0; width:20px; }
#signupFormContent .tickboxDesc{display:inline;}
#signupFormContent #optinDesc p{width:200px; float:left;}
#signupFormContent #optinTicks{float:left; vertical-align: middle;}
#signupFormContent #submitButtonSignup{display:block; width:60px; height:20px; line-height:20px; background:url(../../images/form-submit-button.gif) no-repeat left top; text-indent:-4999px; margin-left:5px;}
.hideElement { display:none; }
#errorMSG, #termsErrorMSG, .errorLabel { color: #D6191D; }
#signupFormContent .signupButtonRoll{display:block; width:60px; height:20px; line-height:20px; background:url(../../images/form-submit-button.gif) no-repeat left top; text-indent:-4999px;}
#signupFormContent .signupButtonRoll:hover{background-position:right top;}

/* Judgement day page styles */
#judgementContent h2{background: url(../../images/title-graphics/judgement-day-title.gif) no-repeat; width:361px; padding-top:24px; height:0 !important; height /**/:24px; overflow:hidden; margin:0;}

#judgementContent div{margin-bottom:10px;}
#judgementCo