/* ----------------------------------------------------------------
   spring-fling.co.uk- Site Specific Styles
   hello@darrellwilson.co.uk - 01/09/2010
-------------------------------------------------------------------*/

@import url(reset.css); /* RESET CSS */

/* BODY ------------------------------------------------------------------ */

html {
background-color : rgb(255,255,255); }

body {  font : 100%/1.5 cambria, georgia, serif; margin: 0; color: #8B8D90 ;}

/* HEADINGS -------------------------------------------------------------- */

h1, h2 {
margin-bottom : .5em; 
font-size : 2em; /* 32 / 16 = 2 */ 
line-height : 1.1;  color: #76C387; }

h3, h4 {
margin-bottom : .75em; 
font-size : 1.3em; /* 26 / 16 = 1.62 */ 
line-height : 1.2; color: #9ED2A5; font-weight: normal; color: #73BF81;}

h4 {
margin-bottom : .75em; 
font-size : 1.1em;  
line-height : 1.2; color: #9ED2A5; }

/* TYPOGRAPHY ----------------------------------------------------------- */

p, ul, ol, dl, table, div.vcard, time {
font-size : .93em; /* 15 / 16 = .93 */ }

ul p, ol p,
ul time, ol time, p time, td time {
font-size : 1em;}

p { 
margin-bottom : 1em; }


blockquote {
margin-left : -25px;
padding-left : 25px;
border-left : 1px solid rgb(133,82,122); 
font-style : normal; }

aside blockquote {
margin-left : 0;
padding-left : 0;
border-left-width : 0; }

.vcard li:first-child {
margin-left : -17px; }

li ul, li ol {
margin-bottom : 1.5em; }

ul, ol {
margin-bottom : 1.5em; }

ul { 
list-style-type : disc; }

ol { 
list-style-type : decimal; }

strong {
font-weight : bold; }

em {
font-style : italic; }

abbr, acronym {
border-bottom-width : 0; }

address {
font-style : normal; }

sup {
position : relative;
top : -5px;
font-size : .72em; }

/* LINKS ------------------------------------------------------------------ */

a, a:visited {
outline : none;
color :  #8B8D90;
text-decoration : none; }
 
a:hover { 
color : rgb(0,0,0); 
 }
 
a:active, a:focus { 
color : rgb(0,0,0); }

header a:hover {
text-decoration : none; }

/* IMAGES AND VIDEOS ----------------------------------------------------- */

.img img,
.img object,
.img embed {
width : 100%;
max-width : 100%; }


/* Forms -------------------------------------------------------------- */

form,
fieldset { 
margin-bottom : .8em; }

label { 
font-weight : normal; }

input { display: block; }

input[type="text"], 
input[type="email"], 
input[type="tel"], 
input[type="url"],
input[type="file"],
textarea { 
outline : none;
margin : .5em 0; 
padding : 5px; 
width : 100%;
background-color : transparent;
border : 1px solid rgb(c,c,c);
font-family : "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size : inherit;
color : rgb(10,10,10); }

p.captcha {
overflow : hidden; }

p.captcha label {
clear : both; 
width : 100%; }

p.captcha input {
float : left; 
width : 50%; }

p.captcha img {
position : relative;
top : 8px;
float : right; }

textarea {  
width : 100%;
height : 120px; }

button {
float : right;
background-color : transparent;
border : none;
outline : none; 
cursor : pointer; }

form ul {
list-style-type : none; 
float : left; }

/* Tables -------------------------------------------------------------- */

table {
clear : left;
margin-bottom : 1.4em;
width : 100%; 
font-size : .81em; }

th, td { 
padding : 4px 10px 4px 0;
vertical-align : middle; }

th { 
font-weight : bold; }

th,
td {
border-bottom : 1px solid rgb(133,82,122); }

tr:last-child th,
tr:last-child td {
border-bottom-width : 0; }


/* LAYOUT -------------------------------------------------------------- */
div#wrapper { width: 1020px; margin: 0 auto; position: relative; background-color: #fff; padding-bottom: 30px; }
section#nav-col { float: left; width: 145px; padding-top: 10px; margin-left: 30px; }
section#main-col { float: left; width: 477px; padding-top: 10px; margin-left: 30px; }
section#main-col, section#main-col p, section#main-col ul li {color: #444647;}
section#main-col p {line-height: 1.4;}
section#main-col a {color: #6AAF78;}
section#main-col a:hover {text-decoration: underline;}
section#support-col { float: left; width: 278px; margin-left: 30px; }
footer { clear: both; }


/* BANNER -------------------------------------------------------------- */
header#banner { width: 960px; margin: 0 auto; height: 129px; background: #fff url(/filemanager/images/interface/coo.gif) no-repeat right 59px; border-bottom: 1px solid #9ED2A5; }
header#banner h1 a { display: block; width: 319px; height: 112px; margin-top: 0; background: #fff url(/filemanager/images/interface/logo.gif) no-repeat bottom left; text-indent: -9999px; padding-top: 10px; }


/* NAVIGATION -------------------------------------------------------------- */
nav ul { padding: 0; list-style-type: none; margin: 0 0 6px 0; font-size: 15px; border-bottom: 1px solid #E6E7E8; padding-bottom: 12px; }
nav ul li { padding: 0;}
nav ul li a { display: block; line-height: 1; padding: 3px 0; }
nav ul li a:link, nav ul li a:visited { color: #8B8D90; text-decoration: none; }
nav ul li a.active, nav ul li a:hover { color: #231F20; text-decoration: none; }


/* ARTICLE ------------------------------------------------------- */
article#download-brochure { width: 100%; background-color: #E6E7E8; }
article#download-brochure img { padding: 10px 6px 3px 10px; }
article#download-brochure h3 { font-size: 14px; font-weight: normal; margin: -2px 3px 8px 8px; line-height: 1; padding: 0 0 7px 0; }


#support-col article { height: 120px; margin-top: -3px; }
#support-col article h2 { margin-top: 13px; font-style: italic; font-size: 15px; margin-left: 12px; width: 130px; letter-spacing: .03em; width: 55%;}
#support-col article p { width: 150px; font-size: 14px; line-height: 1.2; margin: 8px 0; margin-left: 12px; }
article#applications-article { background: #fff url(/filemanager/images/interface/notepad.jpg) no-repeat left -8px; }
article#wigtown-article { background: #fff url(/filemanager/images/interface/polaroid.jpg) no-repeat left -8px; }
article#gallery-article { background: #fff url(/filemanager/images/interface/frame.jpg) no-repeat left -7px; }


#support-col article#news-article { height: auto; position: relative; margin-top: 5px; }
#support-col article#news-article header { background: rgba(25,25,25,.8); position: absolute; top: 135px; height: 65px; width: 100%; color: #E8E8E7; }
#support-col article#news-article header a { color: #E8E8E7; }
#support-col article#news-article hgroup h2, #support-col article#news-article hgroup h3 { color: #E8E8E7; margin-left: 12px; font-weight: normal; }
#support-col article#news-article hgroup h2 { margin-top: 8px; margin-bottom: 2px; width: 255px; }
#support-col article#news-article hgroup h3 { font-size: 12px; font-weight: normal; margin-top: 0; width: 255px; }


#support-col article#blog-article { height: auto; position: relative; margin-top: 5px; }
#support-col article#blog-article header { background: rgba(25,25,25,.8); position: absolute; top: 135px; height: 65px; width: 100%; color: #E8E8E7; }
#support-col article#blog-article header a { color: #E8E8E7; }
#support-col article#blog-article hgroup h2, #support-col article#blog-article hgroup h3 { color: #E8E8E7; margin-left: 12px; font-weight: normal; }
#support-col article#blog-article hgroup h2 { margin-top: 8px; margin-bottom: 2px; width: 255px; }
#support-col article#blog-article hgroup h3 { font-size: 12px; font-weight: normal; margin-top: 0; width: 255px; }


#support-col article#events-article { height: auto; position: relative; margin-top: 5px; }
#support-col article#events-article header { background: rgba(25,25,25,.8); position: absolute; top: 135px; height: 65px; width: 100%; color: #E8E8E7; }
#support-col article#events-article header a { color: #E8E8E7; }
#support-col article#events-article hgroup h2, #support-col article#events-article hgroup h3 { color: #E8E8E7; margin-left: 12px; font-weight: normal; }
#support-col article#events-article hgroup h2 { margin-top: 8px; margin-bottom: 2px; width: 255px; }
#support-col article#events-article hgroup h3 { font-size: 12px; font-weight: normal; margin-top: 0; width: 255px; }

#main-col article h1 { font-size: 35px; font-style: italic; font-weight: normal; letter-spacing: 1px; margin-top: 15px; }
#main-col article h2 { font-size: 28px; font-style: italic; font-weight: normal; margin-top: 15px; }
#main-col article ul { margin-left: 30px; }

/* GLOBAL ELEMENTS --------------------------------------------------- */

ul#social-media { list-style-type: none; width: 145px; overflow: auto; margin: 0; padding: 8px 0; border-top: 1px solid #E6E7E8; border-bottom: 1px solid #E6E7E8; }
ul#social-media li { float: left; }
ul#social-media li a { display: block; width: 30px; height: 30px;  text-indent: -9999px; margin-right: 8px; }
ul#social-media li a#facebook { background: #fff url(/filemanager/images/interface/facebook.png) no-repeat center center; }
ul#social-media li a#twitter { background: #fff url(/filemanager/images/interface/twitter.png) no-repeat center center; }
ul#social-media li a#vimeo { background: #fff url(/filemanager/images/interface/vimeo.png) no-repeat center center; }
ul#social-media li a#flickr { background: #fff url(/filemanager/images/interface/flickr.png) no-repeat center center; margin-right: 0; }

ul#sponsors { list-style-type: none; width: 145px; overflow: auto; margin: 0; padding: 8px 0; border-bottom: 1px solid #E6E7E8; }
ul#sponsors li { float: left; margin-right: 10px;}
ul#sponsors li#h_t, ul#sponsors li#scot_gov{ margin-right: 0; }


/* APPLICATIONS ----------------------------------------------------- */
ol { list-style-type: none; }



/* HOME ----------------------------------------------------- */
#home ul#slides { list-style-type:none; margin-left:0; margin-right:0; }


/* CONTACT ------------------------------------------------------- */
div#contactForm { width: 75%; position: relative; }
label { color: #76C387; font-style: italic; }
fieldset ol { padding: 0; margin: 0; }
fieldset li { padding: 0; margin: 0; }
label.error { font-size: 10px; color: red; }

div#contactForm ol li input.submit { margin-bottom: 4px; width: 66px; }
div#contactForm label { display: block; margin-top: 8px; }


/* NEWS ------------------------------------------------------- */
#news #support-col article { height: auto; }
#news #support-col article h2 { margin-top: 20px; margin-bottom: 6px; width: 95%; }
#news #support-col article ul { list-style-type: none; margin-left: 20px; margin-bottom: 25px;}
#news #support-col article ul li a:link, #news #support-col article ul li a:visited { color: #8B8D90; text-decoration: none; display: block; }
#news #support-col article ul li a:hover, #news #support-col article ul li a.active { color: #000000; }
#news #main-col h2 { margin-bottom: 2px; }

#news #main-col h3 { margin-bottom: 2px; }

#news #main-col span.date { font-size: 13px; margin-bottom: 15px; display: block; }

/* BLOG ------------------------------------------------------- */
#blog #support-col article { height: auto; }
#blog #support-col article h2 { margin-top: 20px; margin-bottom: 6px; width: 95%; }
#blog #support-col article p { width: 220px; font-size: 13px; line-height: 1.2; margin: 8px 0; margin-left: 12px; }
#blog #support-col article ul { list-style-type: none; margin-left: 20px; margin-bottom: 25px;}
#blog #support-col article ul li a:link, #blog #support-col article ul li a:visited { color: #8B8D90; text-decoration: none; display: block; }
#blog #support-col article ul li a:hover, #blog #support-col article ul li a.active { color: #000000; }
#blog #main-col h2 { margin-bottom: 2px; }
#blog #main-col h3 { margin-bottom: 2px; }
#blog #main-col span.date { font-size: 13px; margin-bottom: 15px; display: block; }

/* EVENTS ------------------------------------------------------- */
#events #support-col article { height: auto; }
#events #support-col article h2 { margin-top: 20px; margin-bottom: 6px; width: 95%; }
#events #support-col article ul { list-style-type: none; margin-left: 20px; margin-bottom: 25px;}
#events #support-col article ul li a:link, #events #support-col article ul li a:visited { color: #8B8D90; text-decoration: none; display: block; }
#events #support-col article ul li a:hover, #events #support-col article ul li a.active { color: #000000; }
#events #main-col h2 { margin-bottom: 2px; }
#events #main-col h3 { margin-bottom: 2px; }
#events #main-col span.date { font-size: 13px; margin-bottom: 15px; display: block; }

/* PRESS & MEDIA ------------------------------------------------------- */
#press #support-col article { height: auto; }
#press #support-col article h2 { margin-top: 20px; margin-bottom: 6px; width: 95%; }
#press #support-col article p { width: 95%; margin-left: 20px; padding-top: 20px; font-weight: bold; }
#press #support-col article ul { list-style-type: none; margin-left: 20px; margin-bottom: 25px;}
#press #support-col article ul li a:link, #press #support-col article ul li a:visited { color: #8B8D90; text-decoration: none; display: block; }#press #support-col article ul li a:hover, #press #support-col article ul li a.active { color: #000000; }
#press #main-col h2 { margin-bottom: 2px; }
#press #main-col span.date { font-size: 13px; margin-bottom: 15px; display: block; }


/* WHAT'S ON ------------------------------------------------------- */
#whats-on #support-col article { height: auto; }
#whats-on #support-col article h2 { margin-top: 20px; margin-bottom: 6px; width: 95%; }
#whats-on #support-col article p { width: 95%; margin-left: 20px; padding-top: 20px; font-weight: bold; }
#whats-on #support-col article ul { list-style-type: none; margin-left: 20px; margin-bottom: 25px; margin-top: 15px; }
#whats-on #support-col article ul li a:link, #whats-on #support-col article ul li a:visited { color: #8B8D90; text-decoration: none; display: block; }#press #support-col article ul li a:hover, #whats-on #support-col article ul li a.active { color: #000000; }


/* Artists List ------------------------------------------------------- */
#artists ul#slides { list-style-type:none; margin-left:0; margin-right:0; }

#artists ul#slides img {max-width: 100%;}

#artists div.map {width: 250px; height: 250px; margin-top: 0; float: left;}
#artists div#contact-details {height: 250px; margin-top: 0; width: 160px; margin-left: 15px; font-size: 12px; float: left;}
#artists #support-col.list article { height: auto; }
#artists #support-col.list article h2 { margin-top: 20px; margin-bottom: 6px; width: 95%; }
#artists #support-col article ul { list-style-type: none; margin-left: 20px; margin-bottom: 25px;}
#artists #support-col article ul li a:link, #artists #support-col article ul li a:visited { color: #8B8D90; text-decoration: none; display: block; }
#artists #support-col article ul li a:hover, #artists #support-col article ul li a.active { color: #000000; }
#artists ul#az li {cursor: pointer;}
#artists ul#az li ul {display: none; margin-bottom: 8px;}
#artists ul#cats li {cursor: pointer;}
#artists ul#cats li ul {display: none; margin-bottom: 8px;}

/* WHILST ------------------------------------------------------- */
#whilst ul#slides { list-style-type:none; margin-left:0; margin-right:0; }

#whilst ul#slides img {max-width: 100%;}

#whilst div.map {width: 250px; height: 250px; margin-top: 0; float: left;}
#whilst div#contact-details {height: 250px; margin-top: 0; width: 160px; margin-left: 15px; font-size: 12px; float: left;}
#whilst #support-col.list article { height: auto; }
#whilst #support-col.list article h2 { margin-top: 20px; margin-bottom: 6px; width: 95%; }
#whilst #support-col article ul { list-style-type: none; margin-left: 20px; margin-bottom: 25px;}
#whilst #support-col article ul li a:link, #whilst #support-col article ul li a:visited { color: #8B8D90; text-decoration: none; display: block; }
#whilst #support-col article ul li a:hover, #whilst #support-col article ul li a.active { color: #000000; }
#whilst ul#az li {cursor: pointer;}
#whilst ul#az li ul {display: none; margin-bottom: 8px;}
#whilst ul#cats li {cursor: pointer;}
#whilst ul#cats li ul {display: none; margin-bottom: 8px;}
