/* ---------------------------------------------------------------- project-ability.co.uk - Site Specific Styles darrell.wilson@bigredcreative.com - 01/06/2009 -------------------------------------------------------------------*/ /* ------------------------------------ Search -> Results ------------------------------------*/ #search-results #content-main a {margin:0; padding: 0;} .marker { background-color: #FBC8B3; } #content-main li.search_results {margin-bottom: .8em;} /* ------------------- Colors -----------------*/ a:link, a:active, a:visited {color: #585C5F;} /* ------------------- Main Structural and Common Page Elements -----------------*/ #site {background: #fff;} #body {margin: 10px auto 20px auto; width: 940px; position: relative; text-align: left;} #masthead {float: left; width: 940px; margin-bottom: 20px;} #masthead div#about-nav {margin: 0; padding: 0; float: right; width: 500px;} #masthead div#about-nav ul {list-style-type: none; margin: 0; padding: 0; float: right;} #masthead div#about-nav ul li {float: left;} #masthead div#about-nav ul li a {font-size: 1.1em; color: #636466; padding: 8px 5px;} #masthead div#about-nav ul li a.active {font-weight: bold;} #masthead img#logo {float: left; padding-bottom: 15px;} #masthead div#title-holder {float: right; width: 420px;} #masthead img#title {float: right; margin-top: 30px;} #masthead div#search-nav {border-top: 1px solid #000; border-bottom: 1px dotted #aeb0b2; float: left; clear: both; width: 940px;} #masthead div#search {float: left; width: 250px;} #masthead div#search fieldset {border: 0; margin: 0; padding: 17px 12px 17px 0;} #masthead div#search fieldset label {display: none;} #masthead div#search input#keywords {width: 150px;} #masthead div#search input#submit {width: 60px;} #masthead div#main-nav {float: right;} #masthead div#main-nav ul {list-style-type: none; margin: 1.2em 0; padding: 0; float: right;} #masthead div#main-nav ul li {float: left;} #masthead div#main-nav ul li a {font-size: 1.4em; color: #231f20; padding: 8px 5px;} #masthead div#main-nav a.active {font-weight: bold; text-decoration: none;} div#content {width: 940px; float: left; margin-bottom: 15px;} div#footer {border-top: 1px dotted #666666; padding-top: 5px; color: #636466;} div#footer ul#feeds {list-style-type: none; margin: 0; padding: 0; float: left;} div#footer ul#feeds li {float: left;} div#footer ul#feeds li a {color: #636466; padding: 8px; background-image: none; padding: 3px 2px;} div#footer ul#feeds img {margin-right: 10px;} div#foot-info {float: right; margin-top: 9px; font-size: .95em;} /* ------------------- Left Column - Common Styles -----------------*/ .two-col #col-left {width: 620px; float: left; margin-right: 10px;} div#col-left h2 {margin-top: 10px; color: #CC262B;} div#col-left h3 {color: #CC262B;} div#col-left a:link, div#col-left a:visited, div#col-left a:active {color: #2D7497;} /* ------------------- Right Column - Common Styles -----------------*/ .two-col #col-right {width: 300px; float: left; margin-left: 10px;} div#col-right h3 {padding: 0 7px 10px 7px; color: #CC262B; border-bottom: 1px solid #ccc; margin-bottom: 0; font-size: 1.5em; margin-top: 0;} div#col-right h4 {border-bottom:1px dotted #aeb0b2; font-size: 1.1em; font-weight: normal; text-transform: uppercase; padding: 8px 0 10px 7px; margin-bottom: 0; display: block; background-color: #fff; color: #000;} div#col-right p {padding: 0 5px 0 7px;} div#col-right ul {margin: 0 0 10px 0; padding: 0; list-style-type: none;} div#col-right ul li {display: block; margin: 0; padding: 0;} div#col-right ul li a {border-bottom: 1px solid #F5D4D5; display: block; padding: 4px 9px; text-decoration: none;} div#col-right ul li a:hover {background-color: #878787; color: #fff;} div#col-right a.active {background-color: #585C5F; color: #fff;} /* ------------------- Calendar Layout -----------------*/ .calendarBG {background-color: #000; width: 300px;} .calendarBG th, .calendarBG td {padding: 8px;} .calendarBlank {background-color: #B7B7B7;} .calendarHeader {font-weight: bold; color: #fff; text-align: center; background-color: #000;} .calendarMonthLinks { font-family: Arial, Trebuchet MS, Tahoma, Verdana, Sans-serif; font-size: 11px; font-weight: bold; letter-spacing: .1em; text-decoration: none; color: #fff; background-color: transparent; margin: 0; padding: 0;} .calendarMonthLinks a {color: #fff; text-decoration: none; background-color: transparent; padding: 5px;} .calendarMonthLinks a:visited {color: #fff; text-decoration: none; background-color: transparent;} .calendarMonthLinks a:hover {color: #ccc; text-decoration: underline; background-color: transparent;} .calendarDayHeading {font-weight: bold; font-size: 11px; color: #fff; background-color: #535353; text-align: center; vertical-align: middle;} .calendarToday {font-family: Arial, Trebuchet MS, Tahoma, Verdana, Sans-serif; font-size: 12px; font-weight: bold; letter-spacing: .1em; text-decoration: none; text-align: center; vertical-align: middle; color: #000; background-color: #FBC8B3;} td.calendarToday a:link {margin: 0; padding: 0;} .calendarCell {font-family: Arial, Trebuchet MS, Tahoma, Verdana, Sans-serif; font-size: 12px; font-weight: bold; letter-spacing: .1em; text-decoration: none; text-align: center; vertical-align: middle; color: #666; background-color: #fff;} table.calendarBG td.calendarCell a:link {color: #000; text-decoration: underline; background-color: transparent; margin: 0; padding: 0;} table.calendarBG td.calendarCell a:visited {color: #000; text-decoration: underline; background-color: transparent; margin: 0; padding: 0;} table.calendarBG td.calendarCell a:hover {color: #9F1315; text-decoration: none; background-color: transparent; margin: 0; padding: 0;} div.calendarNextMonth {text-align: right;} .calendarHeader a:link, .calendarHeader a:active, .calendarHeader a:visited {color: #9F1315;} /* ------------------------------------ Home ------------------------------------*/ #home div#col-left {width: 540px; float: left; margin-right: 20px;} #home div#col-right {width: 360px; float: left; margin-left: 20px;} .feature {float: left; width: 170px; margin-top: 23px;} #middle {margin-left: 15px; margin-right: 15px;} #home div#col-right {min-height: 410px; margin-bottom: 6px;} #home div#col-right h3 {font-size: 19px; font-weight: normal; margin: 0; padding: 6px 7px 8px 7px; background-color: #000; color: #fff; display: block; border-bottom: none; } #home div#col-right h4 {font-size: 14px; color: #ED1C24; font-weight: bold; text-transform: none; padding: 12px 0 4px 7px; margin-bottom: 0; display: block;} #home div#col-right h4 {background-color: #fff; border-bottom: none;} #home div#col-right h4#exhibitions {color: #171717; } #home div#col-right p {padding: 0 5px 0 7px; margin-top: 0; line-height: 1.3;} #home div#col-right ul {margin: 0 0 10px 0; padding: 0; list-style-type: none;} #home div#col-right ul li {border-top: 1px dotted #aeb0b2; padding: 4px 7px;} #home div#col-right ul li a {color: #ed1c24; font-weight: bold; border-bottom: none; display: inline; padding: 0; font-size: 14px; } #home div#col-right ul li a:hover {color: #ed1c24; text-decoration: underline; background-color: #fff;} #home div#col-right div#pa-news ul {background-color: #fff; border-bottom: none;} #home div#col-right div#pa-news ul li { padding-top: 8px; padding-bottom: 10px; border-top: none; border-bottom: 1px dotted #AEB0B2; } #home div#col-right ul#feeds {list-style-type: none; margin: 0; padding: 0; float: left; width: 355px; padding-top: 13px; } #home div#col-right ul#feeds li {float: left; border-top: none; padding: 0 3px; } #home div#col-right ul#feeds li a {color: #636466; padding: 8px; background-image: none; padding: 3px 2px;} #home div#col-right ul#feeds img {margin-right: 0;} /* slideshow */ .hidden {display: none;} #prevNext {margin-top: -38px; text-align: right; padding-right: 10px; width: 540px;} #prevNext img {position: relative; z-index: 2; cursor: pointer; margin-right: 6px;} #home div#col-left #slides p {color: #fff; margin: 0; padding: 8px 1em; font-size: 1.3em; position: relative; top: -90px; height: 80px; background: black; opacity: .7; filter:alpha(opacity=70);} #home div#col-left #slides p a {color: #fff; text-decoration: none;} /* ------------------------------------ Whats On ------------------------------------ */ #whats-on div.panes {padding: 20px 10px 10px 0;} #whats-on ul.tabs li h2 {width: 190px; color: #ee1c25; margin-bottom: 10px; margin-right: 48px;} #whats-on div.entry {float: left; margin-bottom: 15px; border-bottom: 1px solid #DDDDDD; width: 618px;} #whats-on div.entry img {float: left; margin-right: 0;} #whats-on div.entry div.entry-text {width: 380px; float: right;} #whats-on div.entry div.entry-text h3 {margin-top: 0;} #whats-on div#col-left a:link, #whats-on div#col-left a:visited, #whats-on div#col-left a:active {color: #000000;} #whats-on div.entry-text a {color: #EE1C25;} /* ------------------------------------ Exhibitions ------------------------------------ */ #exhibitions #col-left h3 {margin-top: 0; padding: 0 0 3px 0; color: #CC262B; font-size: 1.75em; margin-bottom: 5px;} #exhibitions #col-left h3 a {color: #CC262B;} #exhibitions .exhib-entry {margin-bottom: 30px; width: 480px; margin-left: 60px;} #exhibitions .exhib-entry p {margin-top: 12px;} #exhibitions .exhib-entry p.exhib-info {background-color:#EFEFEF; border:1px solid #ccc; color:#111111; font-size:12px; font-weight:normal; margin:0 0 10px; padding:7px 61px 7px 7px;} #exhibitions .exhib-entry p span {font-weight: bold;} #exhibitions #col-left .exhib-entry img {margin:3px 8px; padding: 5px; border: 1px solid #ccc;} #exhibitions #col-right p {margin-left: 3px;} #toggle { cursor: pointer; } /* ------------------------------------ Programmes ------------------------------------ */ #programmes .feature {margin-top: 0; width: 300px; } #programmes div#middle {margin-top: 0; margin-left: 20px; margin-right: 20px; } #programmes .feature h2 {color: #CC262B; font-size: 1.5em; margin-top: 12px; padding-bottom: 8px; border-bottom: 1px solid #ccc; margin-bottom: 0;} span.prog-title {color: #41a6da; text-transform: uppercase;} #programmes .feature a {border-bottom: 1px solid #fbcbbd; display: block; padding: 8px 0; color: #636365;} #programmes .feature a.piclink {border: none; padding: 0;} #programmes .detail div#col-left img {margin-bottom: 8px;} #programmes .detail div#col-left.aspire h2, #programmes .detail div#col-left.aspire h3 {color: #DED232;} #programmes .detail div#col-left.create h2, #programmes .detail div#col-left.create h3 {color: #CA0D89;} #programmes .detail div#col-left.connect h2, #programmes .detail div#col-left.connect h3 {color: #0096A7;} .aspire div#col-right h4 { color: #DED232; } .create div#col-right h4 { color: #CA0D89; } .connect div#col-right h4 { color: #0096A7; } #toggle-events, #toggle-residency { cursor: pointer; } /* ------------------------------------ About ------------------------------------ */ /* ------------------------------------ Support ------------------------------------ */ #support .feature {width: 619px; margin-top: 0; margin-bottom: 20px;} #support .feature img {float: left} #support .feature h3 {color: #CC262B; font-size: 1.6em; margin-top: 0; padding: 10px 20px .5em 0; margin-left: 240px; margin-bottom: 0; border-top: 1px solid #F5D4D5;} #support .feature p {margin-left: 240px; padding: 0 20px 1em 20px;} #support .feature ul {margin-left: 240px; padding-left: 20px;} #support div#col-left a:link, #support div#col-left a:visited, #support div#col-left a:active {color: #CC262B;} #support div.entry {float: left; margin-bottom: 15px; border-bottom: none; width: 618px;} #support div.entry img {float: left; margin-right: 0;} #support div.entry div.entry-text {width: 380px; float: right;} #support div.entry div.entry-text h3 {margin-top: 0;} #support div#col-left a:link, #whats-on div#col-left a:visited, #whats-on div#col-left a:active {color: #000000;} #support div#col-left div.entry-text a {color: #EE1C25;} /* ------------------------------------ Contact ------------------------------------ */ #contact #contactForm {width: 468px; height: auto; background-color: #efefef; padding: 10px 50px 10px 50px; border: 1px solid #dedede; position: relative; overflow: auto;} #contact #contactForm #freeform { margin: 0; padding: 0; } #contact #contactForm #freeform fieldset {border:medium none; margin:0; padding:0; width: 460px; float: left; } #contact #contactForm #freeform fieldset ol {list-style-type:none; margin:0; padding:0; } #contact #contactForm #freeform fieldset li {padding:0; } #contact #contactForm #freeform fieldset.submit, #contact #contactForm #freeform input.submit {clear: both; background-color:#CC262B; font-size: 1.1em; border-style:none; color:#FFFFFF; float:left; margin: 0; padding: 3px; width:auto; font-family:Arial,Helvetica,sans-serif;} #contact #contactForm #freeform label {display:block; font-family:Arial,Helvetica,sans-serif; font-size:0.9em; font-weight: normal; padding: 0.5em 0 0; text-transform:uppercase; font-weight: bold; } #contact #contactForm #freeform textarea { height:60px; padding:0; } #contact #contactForm #freeform input, #contact #contactForm #freeform textarea { background-color:#FFFFFF; border:1px solid #AAAAAA; color:#000000; cursor:pointer; font-size:0.9em; margin:0 0 10px; padding:3px; width:460px; font-family:Arial,Helvetica,sans-serif;} #contact #contactForm #freeform textarea { height:245px; } #contact #contactForm #freeform fieldset label.error {color: #CF3333; font-style: italic; padding: 10px;} #col-right p {margin-top: 10px;} div #map_canvas {width: 280px; height: 255px; margin: 0 7px; border: 1px solid #ccc;} /* ------------------------------------ Blog ------------------------------------ */ #blog #col-left h3 {margin-top: 0; padding: 0 0 3px 0; color: #CC262B; font-size: 1.75em;} #blog #col-left h3 a {color: #CC262B;} #blog .blog-entry {margin-bottom: 30px; width: 480px; margin-left: 60px;} #blog .blog-entry img {border: 1px solid #ccc;} #blog .blog-entry p {margin-top: 12px;} #blog .blog-entry p.post-info {background-color:#EFEFEF; border:1px solid #ccc; color:#111111; font-size:12px; font-weight:normal; margin:0 0 20px; padding:7px 10px 7px 7px;} #toggle-archive { cursor: pointer; }