﻿/* COCKPIT ARTS - ID MEDIA UK - MEERA TANK */

/* RESET *******************************************************/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, sub, sup, tt, var,
dl, dt, dd, ol, ul, li, fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td 
{ margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; list-style: none; }
a {outline: none; }
a img,:link img,:visited img { border:none }
:link,:visited { text-decoration:none }
:focus { outline: 0; }
blockquote, q {quotes: "" "";}
q:before, q:after {content: '';}
abbr, acronym { border: 0;}
section, article, aside, header, footer, nav, dialog, figure {display:block; padding: 0; margin: 0;}
time {display: inline; }
/************************************************* END RESET */

/* MEERA'S CUSTOM STYLES *************************************/
.hidden { display: none;}
.b {font-weight: bold;}
.fl {float: left;}
.fr {float: right}
a:hover { text-decoration: underline;}
p { font-size: 12px; color: #353535; line-height: 18px; margin: 0 0 10px 0;}
address {font-style: normal;}
.blue { color: #18b0c7;}
.coral { color: #d95665;}
.grey { color: #353535;}

/********************************* END MEERA'S CUSTOM STYLES */

/* BROWSER HACKS *********************************************/
/* Firefox 3 Only */
# or ., x:-moz-any-link, x:default { }
/* IE6 Only */
* html {}
/***************************************** END BROWSER HACKS */

/* STRUCTURE CSS */
body {background: url('../images/header.jpg') no-repeat; background-position: center top; width: 100%; font-family: Arial, Verdana; font-size: 12px; line-height: 14px; color: #353535;}
#uber_container { margin: 0 auto; width: 966px;}

/* HEADER SECTION */
header {float: left; width: 966px; height: 235px;}
header h1 {float: right; text-align: right; position: relative; margin: 30px 0 0 0; right: 0; width: 966px; }
/* Top Navigation */
ul#topnav {float: left; width: 966px; position: relative; height: 115px; padding-top: 20px; }
ul#topnav li.main_nav {float: right; width: 446px; height: 42px; background: url('../images/topnav_main.gif') no-repeat; position: relative; top: 22px; right: 176px;}
ul#topnav li.main_nav ul {float: left; width: 423px; padding: 15px 0 0 23px;}
ul#topnav li.main_nav ul li {float: left; padding: 0 14px 0 0; }
ul#topnav li.main_nav ul li.pipe {background: url('../images/pipe.gif') no-repeat; position: relative; top: -1px;}
ul#topnav li.main_nav ul li a {color: #fff; font-weight: bold;}
ul#topnav li.join_in {position: absolute; right: 20px; background: url('../images/topnav_rosette_join_in.gif') no-repeat; width:141px; height: 131px; }
ul#topnav li.join_in a.join_link {color: #fff; font-weight: bold; position: relative; top: 37px; left: 14px;}
ul#topnav li.join_in span {color:#fff; position: absolute; top: 25px; left: 70px; display:block; width: 60px; height: 50px; text-align: center; font-size: 10px; line-height: 10px;}
ul#topnav li.join_in span em {font-weight: bold; font-style: normal; font-size: 18px; line-height: 18px;}
/* End Top Navigation */
/* Breadcrum Section*/
ul.bread {float: left; width: 780px; position: relative; left: 185px;  }
ul.bread li {float: left; font-size: 10px; color: #18b0c7; padding: 0 3px 0 0; }
ul.bread li a { color: #18b0c7;}
ul.bread li a.selected { text-decoration: underline;}

/* Left Navigation */
nav {float: left; width: 160px; padding: 0 0 0 10px;}
ul#left_nav {float: left; width: 160px;}
ul#left_nav li {float: left; width: 160px;}
ul#left_nav li.title_manifesto {float: left; background: url('../images/nav_themanifesto.gif') no-repeat; width: 160px; height: 42px;}
ul#left_nav li.title_manifesto h2 { position: relative; top:15px; left: 22px; color: #fff; font-size: 14px; text-transform: uppercase; font-weight: bold;}
ul#left_nav li h3 {color: #fff; font-weight: bold; font-size: 14px;}
ul#left_nav li a {position: relative; left: 11px; color: #fff;}
ul#left_nav li h3 a.lifestyle {float: left; background: url('../images/nav_lifestyle.gif') no-repeat; width: 126px; height: 25px;   padding: 11px 0 0 11px;}
ul#left_nav li h3 a.lifeselected {float: left; background: url('../images/nav_lifestyle_over.gif') no-repeat; width: 126px; height: 25px; padding: 11px 0 0 11px;}
ul#left_nav li a.reg {float: left; width: 126px; height: 25px; padding: 11px 0 0 11px; background: #18b0c7; font-weight: bold; margin: 2px 0 0 0;  }
ul#left_nav li a.reg_sel {float: left; width: 126px; height: 25px; padding: 11px 0 0 11px; background: #d95665; font-weight: bold; margin: 2px 0 0 0;  }
ul.second_nav {float: left; width: 126px; padding: 0 11px 10px 0px; background: #d95665; position: relative; left: 11px;}
ul.second_nav li {float: left; width: 115px!important; padding: 6px 0;}
ul.second_nav li a {left: 0; font-weight: normal;}

/* Main Content Area */
article {float: right; width: 770px; min-height: 500px; padding: 0 10px 70px 0; #padding-bottom: 170px; margin: 0 0 50px 0; background: url('../images/flag_banner.jpg') no-repeat bottom left;}
*html article {height: 600px;}
article h1 { font-size: 48px; padding: 0 0 18px 0; margin: 0; text-transform: uppercase; color: #d95665; line-height: 38px; overflow: hidden; position: relative; left: -3px; top: -2px; }
article h2 { font-size: 20px; padding: 0 0 15px 0; margin: 0; color: #18b0c7; overflow: hidden; line-height: 18px; position: relative;  top: -2px; text-transform: uppercase; font-weight: bold;}

/* FOOTER */
footer {float:left; background: url('../images/footer.jpg') no-repeat; background-position: center bottom; width: 100%; height: 279px; display: block; }
.footer_content {margin: 0 auto; width: 966px; position: relative; }
.footer_content ul {float: left; margin: 80px 0 0 0; color: #18b0c7; font-size: 10px;}
.footer_content ul li {float: left; padding: 0 10px 0 0; }
.footer_content ul li a {color: #18b0c7;}
span.footer_joinin {position: absolute; top: 179px; right: 85px; }
/* END STRICTURE CSS */

/* BUTTONS CSS */
a.join {float: left; background: url('../images/buttons.png') no-repeat; width: 160px; height: 46px; }
a:hover.join {width: 160px; height: 46px; background-position: -161px 0; }
a.events_holborn {float: left; background: url('../images/buttons.png') no-repeat; width: 176px; height: 46px; background-position: 0 -46px; }
a:hover.events_holborn {width: 176px; height: 46px; background-position: -177px -46px; }
a.events_deptford {float: left; background: url('../images/buttons.png') no-repeat; width: 176px; height: 46px; background-position: 0 -93px; margin: 0 0 0 6px; }
a:hover.events_deptford {width: 176px; height: 46px; background-position: -177px -93px; }
a.get_involved {float: left; background: url('../images/buttons.png') no-repeat; width: 194px; height: 46px; background-position: 0 -140px;}
a:hover.get_involved {width: 194px; height: 46px; background-position: -195px -140px;}
/* END BUTTONS CSS */

/* IE6 BUTTONS */
a.join {float: left; background: url('../images/buttons.gif') no-repeat; width: 160px; height: 46px; }
a:hover.join {width: 160px; height: 46px; background-position: -161px 0; }
a.events_holborn {float: left; background: url('../images/buttons.gif') no-repeat; width: 176px; height: 46px; background-position: 0 -46px;  }
a:hover.events_holborn {width: 176px; height: 46px; background-position: -177px -46px; }
a.events_deptford {float: left; background: url('../images/buttons.gif') no-repeat; width: 176px; height: 46px; background-position: 0 -93px; margin: 0 0 0 6px;}
a:hover.events_deptford {width: 176px; height: 46px; background-position: -177px -93px; }
a.get_involved {float: left; background: url('../images/buttons.gif') no-repeat; width: 194px; height: 46px; background-position: 0 -140px;}
a:hover.get_involved {width: 194px; height: 46px; background-position: -195px -140px;}


